body{&:has(#menu.is-open){overflow-y:hidden}}#root-layout{--_bg-color: var(--mono-white);--_color: var(--mono-black);--_logo-max-height: var(--size-5);--_nav-padding-block: var(--size-1);display:grid;color:var(--_color);max-width:var(--root-max-width);margin-inline:auto;>#navbar{position:fixed;top:var(--nav-gutter);left:var(--nav-gutter);right:var(--nav-gutter);max-width:var(--nav-max-width);margin-inline:auto;display:flex;justify-content:space-between;column-gap:var(--size-5);align-items:center;z-index:var(--z-drawer);backdrop-filter:blur(4px);border-radius:var(--rounded-sm);background-color:rgb(from var(--_bg-color) r g b / .7);padding-block:var(--_nav-padding-block);padding-inline:var(--nav-gutter);>a>img{max-height:var(--_logo-max-height);width:auto}>ul{--_display: none;@media(width>1024px){--_display: flex}display:var(--_display);column-gap:var(--size-4);align-items:center;>li{font-size:var(--font-size-2);&:has(a.active),&:has(a:hover){text-decoration:underline;text-underline-offset:5px;&:has(a.active){font-weight:var(--font-semibold)}}}}>svg{display:inline-block;cursor:pointer;@media(width>1024px){display:none}}}>#menu{opacity:0;display:none;transition:opacity var(--anim-duration-base) var(--anim-ease-linear),display var(--anim-duration-base) var(--anim-ease-linear) allow-discrete;&.is-open{opacity:1;display:block;@starting-style{opacity:0}}position:fixed;background-color:var(--mono-white);inset:0;padding-block:var(--_nav-padding-block);padding-inline:var(--nav-gutter);z-index:var(--z-important);>div{padding-block:var(--size-1);padding-inline:var(--nav-gutter);>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--size-4);>a>img{max-height:var(--_logo-max-height);width:auto}>svg{cursor:pointer}}>ul{display:grid;justify-content:end;justify-items:end;padding-inline:var(--size-4);row-gap:var(--size--2);>li>a{--_color: var(--mono-black);&:hover{--_color: var(--mono-black-30)}font-size:var(--font-size-7);font-weight:var(--font-medium);color:var(--_color);transition:color var(--anim-duration-fast) var(--anim-ease-linear)}}}}>footer{display:flex;align-items:center;column-gap:var(--size-6);max-width:var(--content-max-width);margin-top:var(--size-6);margin-inline:auto;border-top:1px solid var(--mono-black);padding-block:var(--size-3);width:100%;>img{--_max-width: 100px;@media(width>1024px){--_max-width: 150px}width:100%;max-width:var(--_max-width)}>div{display:grid;row-gap:.125rem;>a{font-size:var(--font-size--1);font-family:var(--font-semimono);color:var(--mono-black)}}}}