.js .fallback-nav { display: none; }
.js .menu-open { display: block; }
.js .opening-media { inset: 0; }
.site-header { position: fixed; inset: 16px 16px auto auto; width: auto; height: auto; padding: 0; gap: 8px; border: 0; background: transparent; box-shadow: none; }
.site-header .brand { display: none; }
.menu-open, .site-header .motion-toggle { background: #fff; color: #404848; border: 2px solid #606878; box-shadow: inset 0 0 0 2px #b0d8d8; min-height: 44px; }
.menu-open { padding: 4px 16px; font: 24px/1 var(--pixel); }
.game-menu { position: fixed; inset: 74px 16px auto auto; margin: 0; width: 288px; max-width: calc(100vw - 32px); max-height: calc(100dvh - 90px); padding: 24px; border: 0; background: #fff; color: #404848; overflow-y: auto; overscroll-behavior: contain; }
.game-menu::backdrop { background: #10202038; }
@media (prefers-reduced-motion: no-preference) {
  html:not(.motion-paused) .game-menu[open] { animation: menu-reveal 140ms steps(5, end); }
}
@keyframes menu-reveal {
  from { clip-path: inset(0 0 100% 0); }
  to { clip-path: inset(0); }
}
.game-menu .menu-frame { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; image-rendering: pixelated; }
.game-menu nav { position: relative; display: grid; }
.game-menu [data-menu-film] svg { margin-left: auto; width: 18px; height: 18px; }
.game-menu a, .game-menu button { position: relative; display: flex; align-items: center; width: 100%; min-height: 48px; border: 0; background: transparent; padding: 4px 4px 4px 32px; color: #404848; font: 28px/1.2 var(--pixel); text-decoration: none; text-align: left; }
.game-menu a::before, .game-menu button::before { content: ""; position: absolute; left: 4px; top: 50%; width: 20px; height: 24px; transform: translateY(-50%); background: url('/assets/journey/menu-arrow.png') center / contain no-repeat; image-rendering: pixelated; visibility: hidden; }
.game-menu :is(a,button):is(:focus-visible,:hover)::before { visibility: visible; }
.game-menu :is(a,button):focus-visible { outline: 2px solid #606878; outline-offset: -2px; }
body:has(.game-menu[open]) { overflow: hidden; }
@media (max-width: 500px) { .game-menu { width: 256px; } .game-menu a, .game-menu button { font-size: 24px; } }
