.nav{--fg:var(--cloth);--bg:var(--sea);z-index:50;height:72px;padding:0 var(--gutter);color:var(--fg);transition:color .4s var(--ease-out), background-color .4s var(--ease-out), transform .5s var(--ease-out);pointer-events:none;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;display:grid;position:fixed;inset:0 0 auto}.nav[data-solid="1"],.nav[data-open="1"]{background:var(--bg)}.nav[data-hidden="1"]{transform:translateY(-100%)}.nav>*{pointer-events:auto}.nav[data-theme=cloth]{--fg:var(--ink);--bg:var(--cloth)}.nav[data-theme=ink]{--fg:var(--cloth);--bg:var(--ink)}.nav__brand{justify-self:start;padding:6px 0;display:inline-flex}.nav__logo{width:auto;height:25px;display:block;overflow:visible}.nav__logo path:nth-child(2){transform-box:fill-box;transform-origin:0;transition:fill .4s}.nav__brand:hover .nav__logo path:nth-child(2){animation:.8s ease-in-out nav-flutter}@keyframes nav-flutter{30%{transform:skewY(-9deg)scaleX(.9)}65%{transform:skewY(5deg)scaleX(1.04)}}.nav__links{border:1px solid color-mix(in srgb, var(--fg) 26%, transparent);border-radius:999px;gap:2px;padding:4px;transition:border-color .4s;display:flex}.nav__links a{white-space:nowrap;border-radius:999px;padding:7px 14px;font-size:14px;line-height:1.2;text-decoration:none;transition:background-color .25s,color .25s}.nav__links a:hover{background:color-mix(in srgb, var(--fg) 14%, transparent)}.nav__links a[aria-current]{background:var(--fg);color:var(--bg)}.nav__end{justify-self:end;align-items:center;gap:8px;display:flex}.nav__docs{transition:background-size .35s var(--ease-out);background:linear-gradient(currentColor,currentColor) 50% calc(100% - 6px)/0 1px no-repeat;padding:9px 14px;font-size:14px;text-decoration:none}.nav__docs:hover{background-size:calc(100% - 28px) 1px}.nav__app{background:var(--fg);height:40px;color:var(--bg);white-space:nowrap;border-radius:999px;align-items:center;gap:8px;padding:0 16px 0 18px;font-size:14px;font-weight:600;text-decoration:none;transition:background-color .4s,color .4s;display:inline-flex}.nav__arrow{width:15px;height:15px;transition:transform .35s var(--ease-out)}.nav__app:hover .nav__arrow{transform:translate(3px)}.nav__menu{appearance:none;border:1px solid color-mix(in srgb, var(--fg) 40%, transparent);cursor:pointer;background:0 0;border-radius:999px;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:40px;height:40px;display:none}.nav__menu span{width:16px;height:1.5px;transition:transform .3s var(--ease-out);background:currentColor;display:block}.nav__menu[aria-expanded=true] span:first-child{transform:translateY(3.25px)rotate(45deg)}.nav__menu[aria-expanded=true] span:last-child{transform:translateY(-3.25px)rotate(-45deg)}.nav__sheet{padding:8px var(--gutter) 24px;background:var(--bg);border-bottom:1px solid color-mix(in srgb, var(--fg) 18%, transparent);flex-direction:column;display:flex;position:absolute;top:100%;left:0;right:0}.nav__sheet[hidden]{display:none}.nav__sheet a{font-family:var(--display);font-variation-settings:"wdth" 118;border-top:1px solid color-mix(in srgb, var(--fg) 14%, transparent);padding:14px 0;font-size:22px;font-weight:700;text-decoration:none}@media (max-width:1000px){.nav{grid-template-columns:auto 1fr}.nav__links,.nav__docs{display:none}.nav__menu{display:inline-flex}}@media (max-width:420px){.nav__app{padding:0 14px}.nav__arrow{display:none}}