#header{position:fixed;z-index:1000;left:50%;transform:translateX(-50%);top:calc(20px + env(safe-area-inset-top));width:auto;max-width:calc(100% - max(20px, env(safe-area-inset-left)) - max(20px, env(safe-area-inset-right)));display:flex;justify-content:center}.glass-nav{background:color-mix(in srgb,var(--card-bg),transparent 55%);backdrop-filter:blur(48px) saturate(160%) brightness(108%);-webkit-backdrop-filter:blur(48px) saturate(160%) brightness(108%);border:1px solid color-mix(in srgb,var(--text-color),transparent 88%);border-radius:100px;padding:0 10px;height:60px;display:flex;align-items:center;position:relative;box-shadow:0 1px 0 color-mix(in srgb,#fff,transparent 65%) inset,0 -1px 0 color-mix(in srgb,#fff,transparent 88%) inset,0 8px 32px color-mix(in srgb,var(--shadow-color),transparent 50%),0 2px 8px color-mix(in srgb,var(--shadow-color),transparent 65%);transition:background .3s,box-shadow .3s;overflow:visible}.glass-nav::after,.glass-nav::before{content:"";position:absolute;border-radius:100px;z-index:0;inset:0;pointer-events:none}.glass-nav::before{background:radial-gradient(ellipse 80% 50% at 50% 0,color-mix(in srgb,#fff,transparent 75%) 0,transparent 100%)}.glass-nav::after{background:linear-gradient(180deg,color-mix(in srgb,#fff,transparent 88%) 0,transparent 40%)}body.light-mode .glass-nav{background:color-mix(in srgb,#fff,transparent 55%);backdrop-filter:blur(48px) saturate(200%) brightness(100%);-webkit-backdrop-filter:blur(48px) saturate(200%) brightness(100%);border-color:color-mix(in srgb,#000,transparent 94%);box-shadow:0 1px 1px color-mix(in srgb,#fff,transparent 10%) inset,0 -1px 1px color-mix(in srgb,#000,transparent 96%) inset,0 8px 32px color-mix(in srgb,#000,transparent 92%),0 2px 8px color-mix(in srgb,#000,transparent 95%)}body.light-mode .glass-nav::before{background:radial-gradient(ellipse 80% 50% at 50% 0,color-mix(in srgb,#fff,transparent 20%) 0,transparent 100%)}.glass-btn,.glass-link,.glass-nav-list,.theme-btn{position:relative;align-items:center;display:flex;z-index:1}.glass-nav-list{gap:4px;list-style:none;margin:0;padding:0;height:100%}.glass-btn,.glass-link,.theme-btn{justify-content:center;text-decoration:none;border:none;background:0 0;transition:background .3s,color .3s,transform .2s;color:var(--text-muted)}.glass-link.active-link,.theme-btn{color:var(--text-color)}.glass-link{width:100px;height:44px;border-radius:100px;overflow:hidden}.theme-btn{width:44px;height:44px;border-radius:50%;font-size:1.2rem}.nav-pill{position:absolute;transition:left .32s cubic-bezier(.22, 1, .36, 1),width .32s cubic-bezier(.22, 1, .36, 1),opacity .3s;pointer-events:none;top:50%;transform:translateY(-50%);transform-origin:center;height:44px;border-radius:100px;background:color-mix(in srgb,var(--accent),transparent 85%);box-shadow:0 1px 0 color-mix(in srgb,#fff,transparent 75%) inset,0 2px 8px color-mix(in srgb,#000,transparent 82%);z-index:0;opacity:0;margin-left:-1px;will-change:left,width,transform}.nav-pill.visible{opacity:1}.nav-pill.morphing{animation:.4s cubic-bezier(.34, 1.56, .64, 1) nav-pill-settle}@keyframes nav-pill-settle{0%{transform:translateY(-50%) scaleX(1)}45%{transform:translateY(-50%) scaleX(1.06)}100%{transform:translateY(-50%) scaleX(1)}}@media (hover:hover){.glass-link:hover,.theme-btn:hover{background:color-mix(in srgb,var(--text-color),transparent 93%);color:var(--accent);transform:scale(1.05)}.theme-btn:hover{transform:rotate(30deg) scale(1.1)}.glass-link:not(.active-link):hover .text{transform:translateY(-35px);opacity:0}.glass-link:not(.active-link):hover .icon{transform:translateY(0);opacity:1}}.glass-link .icon,.glass-link .text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transition:transform .3s cubic-bezier(.2, .8, .2, 1),opacity .3s;font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.5px}.glass-link .text{transform:translateY(0);opacity:1}.glass-link .icon{transform:translateY(35px);opacity:0;font-size:1.2rem;margin:auto;display:block}.glass-link.active-link .text{transform:translateY(-35px);opacity:0}.glass-link.active-link .icon{transform:translateY(0);opacity:1;color:var(--accent)}.nav-separator{width:1px;height:20px;background:color-mix(in srgb,var(--text-color),transparent 85%);margin:0 6px;z-index:1}@media (max-width:1024px){#header{top:calc(15px + env(safe-area-inset-top));width:95%}.glass-nav{height:55px;padding:0 8px}.glass-nav-list{gap:2px}.glass-link,.theme-btn{width:40px!important;height:40px!important;margin:0!important;padding:0!important;display:flex!important;font-size:1.1rem!important}.glass-link .text{display:none!important}.nav-pill{height:40px}.glass-link .icon{position:static;transform:none!important;opacity:1!important;font-size:1.1rem;margin:0}.nav-separator{margin:0 4px}}