/* Responsive overrides for the in-game HUD scaling unit (--u, defined in game.css).
   Base value is 1vw, so on a portrait phone the chrome scales with screen width
   exactly as originally designed. We only CAP it where full-width scaling looks
   oversized: wide desktop monitors and phones held in landscape. The game canvas
   always fills the whole window — only the UI scale is adjusted. */

/* Desktop / large screens: stop the UI growing without bound (canvas stays full). */
@media (min-width: 900px) {
  :root { --u-base: min(1vw, 5px); }
}

/* Landscape phones: the screen is short, so scale the chrome off the SHORT side
   (1vmin = the height here) and keep it compact. Declared AFTER the desktop rule
   so it wins for wide-but-short landscape phones. */
@media (orientation: landscape) and (max-height: 480px) {
  :root { --u-base: min(1vmin, 4.6px); }
  #status-bar { padding-top: calc(env(safe-area-inset-top, 0px) + 4px); }
  .status-line { margin-bottom: 2px; font-size: 12px; }
  .nav-btn { padding: 5px 0 4px; }
  .nav-btn span { display: none; }
  #map-controls { bottom: calc(72px + var(--safe-pad)); }
}