@media screen and (max-width:1080px){:root{--bar-width:36px;--bar-height:4px;--hamburger-gap:6px;--foreground:white;--background:black;--hamburger-margin:8px;--animation-timing:200ms ease-in-out;--hamburger-height:calc(var(--bar-height) * 3 + var(--hamburger-gap) * 2)}.topbar__menu{.hamburger-menu{--x-width:calc(var(--hamburger-height) * 1.41421356237);display:flex;flex-direction:column;gap:var(--hamburger-gap);justify-content:flex-end;width:max-content;z-index:2;cursor:pointer}.hamburger-menu:has(input:checked){--foreground:white;--background:black}.hamburger-menu:has(input:focus-visible)::before, .hamburger-menu:has(input:focus-visible)::after, .hamburger-menu input:focus-visible{border:1px solid var(--background);box-shadow:0 0 0 1px var(--foreground)}.hamburger-menu::before, .hamburger-menu::after, .hamburger-menu input{content:"";width:var(--bar-width);height:var(--bar-height);background-color:var(--foreground);border-radius:9999px;transform-origin:right center;transition:opacity var(--animation-timing),width var(--animation-timing),rotate var(--animation-timing),translate var(--animation-timing),background-color var(--animation-timing)}.hamburger-menu input{appearance:none;padding:0;margin:0;outline:none;pointer-events:none}.hamburger-menu:has(input:checked)::before{rotate:-45deg;width:var(--x-width);translate:0 calc(var(--bar-height)/-2)}.hamburger-menu:has(input:checked)::after{rotate:45deg;width:var(--x-width);translate:0 calc(var(--bar-height)/2)}.hamburger-menu input:checked{opacity:0;width:0}.nav-wrapper{position:fixed;z-index:1;top:0;right:0;width:40vw;height:100vh;transition:translate var(--animation-timing);translate:40vw;padding:.5rem 1rem;padding-top:calc(var(--hamburger-height) + var(--hamburger-margin) + 2rem);background-color:var(--background);color:var(--foreground)}.hamburger-menu:has(input:checked){position:fixed;top:16px;right:13px}.hamburger-menu:has(input:checked) + .nav-wrapper{translate:0;box-shadow:-1px 0 16px #878787}}}