/* MoonCat Odyssey fullscreen HUD drawer — game owns the viewport, menus open
   on demand from a fixed icon rail. Same moonbase-terminal pixel language. */

body.fullscreenGame .shell { grid-template-columns: 1fr; }
body.fullscreenGame .hud--details {
  position: fixed; top: 0; left: 64px; bottom: 0; z-index: 8; margin: 0;
  width: min(400px, calc(100vw - 84px)); max-height: none;
  transform: translateX(calc(-100% - 96px));
  transition: transform .16s steps(4);
}
body.fullscreenGame.hudDrawerOpen .hud--details { transform: translateX(0); }

body.fullscreenGame .sideMenuTabs {
  position: fixed; top: 14px; left: 10px; z-index: 9;
  flex-direction: column; gap: 6px; margin: 0;
}
body.fullscreenGame .sideMenuTabs button { width: 48px; min-height: 42px; padding: 6px 2px; font-size: 9px; letter-spacing: .02em; }

body.fullscreenGame .topStatusBar {
  position: fixed; top: 14px; right: 34px; z-index: 7; margin: 0;
  grid-template-columns: repeat(3, auto); gap: 1rem; padding: .45rem .8rem;
}

body.fullscreenGame .onboardingPanel {
  position: fixed; right: 34px; bottom: 76px; z-index: 7; margin: 0;
  width: min(430px, calc(100vw - 120px)); grid-template-columns: 1fr;
  max-height: 60vh; overflow: auto;
}

/* Action buttons hug the bottom-left edge under the icon rail — vertical stack,
   compact, out of the playfield's way. */
body.fullscreenGame .bottomActionBar {
  position: fixed; left: 10px; bottom: 14px; transform: none; z-index: 7;
  flex-direction: column; align-items: stretch; gap: 5px;
  width: 118px; max-width: none; padding: .45rem; border-radius: 0;
}
body.fullscreenGame .bottomActionBar button { padding: .42rem .5rem; font-size: 10px; }

.hudDrawerClose { width: 100%; margin-bottom: 12px; border: 1px solid rgba(255,95,121,.45); border-radius: 0; background: #1a0b12; color: #ffd0d0; padding: 9px; font: inherit; font-size: 11px; font-weight: 700; cursor: pointer; box-shadow: 0 3px 0 #050713; }
.hudDrawerClose:active { transform: translateY(2px); box-shadow: 0 1px 0 #050713; }

.readoutsDiagnostics { border: 1px solid rgba(154,165,199,.25); background: #070b1c; padding: 8px 10px; margin: -10px 0 16px; }
.readoutsDiagnostics summary { cursor: pointer; color: #93a5c2; font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }
.readoutsDiagnostics .readouts { margin: 10px 0 2px; }

@media (max-width: 960px) {
  body.fullscreenGame .topStatusBar { display: none; }
  body.fullscreenGame .onboardingPanel { right: 12px; bottom: 120px; }
}