.hud{position:fixed;top:0;left:0;right:0;height:calc(var(--nav-h) + var(--safe-top));padding:var(--safe-top) 1.6rem 0;display:flex;align-items:center;justify-content:flex-end;z-index:1200;transition:background .4s ease,border-color .4s ease,opacity .3s ease;border-bottom:1px solid transparent;transform:translateZ(0)}.hud.scrolled:not(.open){background:var(--glass);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);border-bottom-color:var(--border-color)}@supports (animation-timeline: scroll()){.hud:not(.open){animation:hud-glass linear both;animation-timeline:scroll(root);animation-range:0 120px}}@keyframes hud-glass{0%{background:transparent;border-bottom-color:transparent}to{background:var(--glass);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);border-bottom-color:var(--border-color)}}.hud-menu{display:flex;align-items:center;gap:.8rem;background:none;border:none;cursor:pointer;color:var(--text-primary);padding:.6rem 0}.hud-menu-label{font-family:Space Grotesk,sans-serif;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.35em}.hud-menu-icon{display:flex;flex-direction:column;gap:6px}.hud-menu-icon i{display:block;width:26px;height:2px;border-radius:2px;background:var(--grad-brand);transition:transform .35s cubic-bezier(.65,0,.35,1)}.hud.open .hud-menu-icon i:nth-child(1){transform:translateY(4px) rotate(45deg)}.hud.open .hud-menu-icon i:nth-child(2){transform:translateY(-4px) rotate(-45deg)}.nav-progress{position:absolute;bottom:-1px;left:0;width:100%;height:2px;background:var(--grad-brand);transform:scaleX(0);transform-origin:0 50%;pointer-events:none}@supports (animation-timeline: scroll()){.nav-progress{animation:nav-progress-grow linear both;animation-timeline:scroll(root)}}@keyframes nav-progress-grow{0%{transform:scaleX(0)}to{transform:scaleX(1)}}body.menu-open{overflow:hidden}.menu-overlay{position:fixed;inset:0;z-index:1100;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--nav-h) + var(--safe-top)) clamp(1.5rem,8vw,7rem) 3rem;background:color-mix(in srgb,var(--primary-bg) 78%,transparent);-webkit-backdrop-filter:blur(28px) saturate(1.4);backdrop-filter:blur(28px) saturate(1.4);opacity:0;visibility:hidden;clip-path:inset(0 0 100% 0);transition:clip-path .55s cubic-bezier(.65,0,.35,1),opacity .4s ease,visibility .55s}.menu-overlay.open{opacity:1;visibility:visible;clip-path:inset(0 0 0% 0)}.menu-nav{display:flex;flex-direction:column;gap:.4rem}.menu-link{display:flex;align-items:baseline;gap:1.4rem;background:none;border:none;cursor:pointer;text-align:left;padding:.35rem 0;opacity:0;transform:translateY(24px);transition:opacity .45s ease calc(var(--i) * 70ms + .15s),transform .45s cubic-bezier(.22,1,.36,1) calc(var(--i) * 70ms + .15s)}.menu-overlay.open .menu-link{opacity:1;transform:translateY(0)}.menu-index{font-family:Space Grotesk,sans-serif;font-size:.8rem;letter-spacing:.2em;color:var(--accent-2)}.menu-label{font-size:clamp(2.2rem,7vw,4.6rem);line-height:1.12;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.55);transition:color .3s ease,-webkit-text-stroke-color .3s ease}.menu-link:hover .menu-label,.menu-link.active .menu-label{color:var(--text-primary);-webkit-text-stroke-color:transparent}.menu-meta{margin-top:3rem;display:flex;flex-wrap:wrap;gap:.4rem 2.5rem;align-items:baseline}.menu-meta a{color:var(--text-primary);text-decoration:none;font-size:.95rem;border-bottom:1px solid color-mix(in srgb,var(--accent-2) 60%,transparent)}.menu-meta p{color:var(--text-secondary);font-size:.8rem;text-transform:uppercase;letter-spacing:.2em}.menu-lang{display:flex;align-items:center;gap:.5rem;color:var(--text-secondary)}.menu-lang button{background:none;border:none;cursor:pointer;font-family:Space Grotesk,Noto Sans JP,sans-serif;font-size:.8rem;font-weight:600;letter-spacing:.12em;color:var(--text-secondary);padding:.3rem .2rem;transition:color .25s ease}.menu-lang button:hover{color:var(--text-primary)}.menu-lang button.active{color:transparent;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.menu-link-demo{display:none;text-decoration:none}@media(max-width:768px){.menu-link-demo{display:flex}}.menu-tag{align-self:center;font-family:Space Grotesk,sans-serif;font-size:.58rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-2);border:1px solid color-mix(in srgb,var(--accent-2) 40%,transparent);border-radius:999px;padding:.2rem .5rem}