/* Floating navigation; opaque fallback remains usable without the effect engine. */
#nav{--nav-ink:#151820;position:fixed;top:max(20px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:min(880px,calc(100% - 48px));height:64px;line-height:normal;border-radius:34px;background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.65);box-shadow:0 8px 28px rgba(15,23,42,.12),inset 0 1px 0 rgba(255,255,255,.8);backdrop-filter:blur(18px) saturate(125%);-webkit-backdrop-filter:blur(18px) saturate(125%);transition:background-color .25s ease,color .25s ease}
#nav.glass-ready{background:rgba(255,255,255,.1);backdrop-filter:none;-webkit-backdrop-filter:none}
#nav-glass{position:absolute;inset:0;pointer-events:none;border-radius:inherit;overflow:hidden}
#nav .wrapper{position:relative;display:flex;align-items:center;justify-content:space-between;height:62px;padding:0 20px;gap:16px;isolation:isolate}
#nav .wrapper>*{position:relative;z-index:1;line-height:normal;max-height:none;color:var(--nav-ink)!important}
#nav .wrapper a{font-size:15px;line-height:22px;padding:12px 22px;text-decoration:none;white-space:nowrap}
#nav .wrapper .logo{padding:8px 14px}
#nav .logo img{height:30px!important;width:30px;margin:0;visibility:visible}
#nav .wrapper .nav-selection{position:absolute;z-index:0;top:9px;left:0;height:44px;max-height:none;border-radius:24px;background:rgba(255,255,255,.52);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 3px 10px rgba(15,23,42,.07);pointer-events:none;opacity:0}
#nav .wrapper a[aria-current]{font-weight:600}
#nav .wrapper a:hover{background:rgba(255,255,255,.25);border-radius:24px}
#nav .hambugerButton{display:none;background:none;border:0;padding:0;width:44px;height:44px;cursor:pointer}
#nav .menu{display:none}
#nav.dark{--nav-ink:#f8faff;background:rgba(23,34,50,.9);border-color:rgba(255,255,255,.22)}
#nav.dark.glass-ready{background:rgba(12,22,38,.62)}
#nav.dark #nav-glass{filter:brightness(.55)}
#nav .hambugerButton .icon>span{width:18px;height:1.5px;background:var(--nav-ink);margin:3px 0}
#nav.dark .wrapper .nav-selection{background:rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 3px 10px rgba(0,0,0,.1)}
#nav :focus-visible{outline:3px solid #2266ff;outline-offset:2px;border-radius:24px}
#nav.dark :focus-visible{outline-color:#9dc8ff}
@media(prefers-reduced-motion:no-preference){#nav .nav-selection{transition:width .35s cubic-bezier(.22,1,.36,1),transform .35s cubic-bezier(.22,1,.36,1),opacity .2s}#nav .wrapper a:active{transform:scale(.97)}}
@media(max-width:649px){#nav{top:max(12px,env(safe-area-inset-top));width:calc(100% - 32px);height:58px;border-radius:30px}#nav .wrapper{height:56px;padding:0 12px}#nav .wrapper .logo{padding:8px 10px}#nav .wrapper .hambugerButton{display:block;margin-left:auto}#nav .hambugerButton .icon{height:44px;display:flex;flex-direction:column;justify-content:center;align-items:center}#nav .hambugerButton span span{display:block;width:18px;height:1.5px;background:var(--nav-ink);margin:3px 0}#nav .wrapper a:nth-child(n+3),#nav .nav-selection{display:none}#nav.active{height:58px;background:rgba(255,255,255,.95);transition:none}#nav.active .logo img{visibility:visible}#nav.active .menu{position:absolute;top:70px;left:0;right:0;display:flex;height:auto;max-height:calc(100svh - 110px);overflow-y:auto;padding:16px 12px;border-radius:26px;background:rgba(255,255,255,.96);box-shadow:0 12px 32px rgba(15,23,42,.16);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}#nav .menu a{font-size:22px;line-height:1.4;margin:0;padding:14px 20px;color:#151820!important;text-decoration:none}#nav .menu a[aria-current]{background:#edf1f7;border-radius:18px}#nav.dark.active{background:rgba(23,34,50,.95)}#nav.dark.active .menu{background:rgba(23,34,50,.97)}#nav.dark .menu a{color:#f8faff!important}#nav.dark .menu a[aria-current]{background:#354154}}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){#nav,#nav.glass-ready{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}#nav.dark,#nav.dark.glass-ready{background:#172232}#nav-glass{display:none}}
/* Keep the panel mounted so both opening and closing can animate. */
@media(max-width:649px){
  #nav .menu,#nav.active .menu{position:absolute;top:70px;left:0;right:0;display:flex;height:auto;max-height:calc(100svh - 110px);overflow-y:auto;padding:16px 12px;border-radius:26px;background:rgba(255,255,255,.96);box-shadow:0 12px 32px rgba(15,23,42,.16);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);transform-origin:top right}
  #nav .menu{visibility:hidden;opacity:0;pointer-events:none;clip-path:inset(0 0 100% 0 round 26px);transform:translateY(-8px) scale(.98);transition:clip-path .3s cubic-bezier(.22,1,.36,1),transform .3s cubic-bezier(.22,1,.36,1),opacity .2s ease,visibility 0s linear .3s}
  #nav.active .menu{visibility:visible;opacity:1;pointer-events:auto;clip-path:inset(0 round 26px);transform:none;transition:clip-path .42s cubic-bezier(.22,1,.36,1),transform .42s cubic-bezier(.22,1,.36,1),opacity .22s ease,visibility 0s}
  #nav.dark .menu,#nav.dark.active .menu{background:rgba(23,34,50,.97)}
  #nav .hambugerButton .icon>span{animation:none;transition:transform .3s cubic-bezier(.22,1,.36,1)}
  #nav.active .hambugerButton .icon>span:first-child{transform:translateY(3.75px) rotate(45deg)}
  #nav.active .hambugerButton .icon>span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
}
@media(max-width:649px) and (prefers-reduced-motion:reduce){#nav .menu,#nav.active .menu{transition:none;transform:none}#nav .hambugerButton .icon>span{transition:none}}