How do i reduce the gap between the top of the waybar and the bottom of the open window?

[ayakashi-perhaps]

i wanted to reduce this gap right here and i tried editing style.css in my waybar config but that didn't seem to work.
I'm using a pretty much a stock install of hyprdots minus a different wallpaper and the clear waybar

@import "theme.css";

window#waybar {
    background: @bar-bg;
    padding: 0;
    margin: 0;
    height: 16px;
}

tooltip {
    background: @main-bg;
    color: @main-fg;
    border-radius: ${t_radius}px;
    border-width: 0px;
    padding: 0;
    margin 0;
    height: 16px;
}

this is what the waybar part of my style.css looks like

[kRHYME7]

check the gaps in and gaps out of hyprland. Gaps are controlled by the compositor

[ayakashi-perhaps]

the gaps in is 2 and gaps out is 4 but the spacing between the waybar and window remains same

for example this is my bottom left corner with gaps out = 4

and this is with gaps out = 2