html, body { width: 100%; height: 100%; overflow: hidden; }
#game-wrap { position: fixed; margin: 0; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(var(--game-scale, 1)); }
canvas { touch-action: none; }
.menu { box-sizing: border-box; position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(960px, 100vw); height: min(600px, calc(100% - 76px)); padding: 24px; overflow: auto; overscroll-behavior: contain; }
#gamehub-toolbar { position: fixed; top: 0; left: 0; right: 0; min-height: 36px; display: flex; align-items: center; justify-content: center; gap: 16px; font: 12px sans-serif; z-index: 4; background: #080808; }
#gamehub-toolbar button { color: #ddd; background: #222; border: 1px solid #555; padding: 8px; cursor: pointer; }
#gamehub-credit { position: fixed; bottom: 0; left: 0; right: 0; padding: 6px 0; background: #080808; font: 11px sans-serif; z-index: 4; }
.up-list { display: flex; flex-wrap: wrap; gap: 12px; }
.up-list .upgrade-group { float: none; margin: 0; }
.level-list { display: flex; flex-wrap: wrap; gap: 8px; }
.level { float: none; margin: 0; }
@media (max-width: 700px) {
  .menu { padding: 16px; }
  #guide .left { float: none; width: auto; }
  #guide ul, .button span, .up-list .button i { font-size: 13px; }
  #map { float: none; margin: 0 auto 20px; max-width: calc(100% - 4px); }
  .button, #level-stats .divider, #overall-stats .divider { max-width: 100%; }
  .up-list .upgrade-group { width: calc(50% - 6px); }
  .up-list .button { box-sizing: border-box; width: 100%; }
  .up-list .button span { padding: 8px 4px; }
  #funds, #level-status { float: none; margin-bottom: 12px; }
}
