/* V162 UI corrections. Loaded last to resolve earlier responsive overrides. */

/* Keep every dialog action reachable on narrow or short viewports. */
.overlay {
  padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right))
    max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
  overflow: auto;
  overscroll-behavior: contain;
}
.overlay > .sheet {
  max-height: calc(100dvh - max(12px, env(safe-area-inset-top)) - max(12px, env(safe-area-inset-bottom)));
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.overlay > .sheet-tall { overflow: hidden; }
.sheet-tall > .sheet-scroll { flex: 1 1 auto; min-height: 0; }
.sheet-tall > .sheet-bar, .sheet-tall > .sheet-foot { flex: 0 0 auto; }
body.has-open-dialog { overflow: hidden; }
.coach-card { max-height: calc(100dvh - 24px); overflow-y: auto; overscroll-behavior: contain; }
@media (max-height: 400px) {
  .overlay > .sheet-tall { display: block; overflow-y: auto; }
  .sheet-tall > .sheet-scroll { overflow: visible; }
}

/* The toolbar owns a row; it must never cover a game's scoreboard or audio. */
html:is(.hand-cricket-route, .hand-cricket-active, .space-blaster-active) body #player:not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
}
html:is(.hand-cricket-route, .hand-cricket-active, .space-blaster-active) body #player:is(.is-hand-cricket, .is-space-blaster) .player-bar {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  flex: 0 0 auto !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 56px !important;
  padding: max(6px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) 6px max(10px, env(safe-area-inset-left)) !important;
  background: #09131e !important;
  pointer-events: auto !important;
}
html:is(.hand-cricket-route, .hand-cricket-active, .space-blaster-active) body #player:is(.is-hand-cricket, .is-space-blaster) .player-bar .icon-btn {
  width: 44px !important; height: 44px !important;
  min-width: 44px !important; min-height: 44px !important;
  flex: 0 0 44px !important;
}
html:is(.hand-cricket-route, .hand-cricket-active, .space-blaster-active) body #player:is(.is-hand-cricket, .is-space-blaster) .stage-wrap {
  position: relative !important;
  inset: auto !important;
  flex: 1 1 0% !important;
  min-height: 0 !important;
  width: 100% !important;
  height: auto !important;
  padding: 0 !important;
}
html:is(.hand-cricket-route, .hand-cricket-active, .space-blaster-active) body #player:is(.is-hand-cricket, .is-space-blaster) .challenge-target {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  flex: 0 0 auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
}
#player .player-bar #btn-fs[hidden] { display: none !important; }
@media (max-width: 699px) {
  #player .player-bar {
    grid-template-columns: 44px minmax(0, 1fr) auto 44px 44px;
  }
  #player.no-fullscreen .player-bar {
    grid-template-columns: 44px minmax(0, 1fr) auto 44px;
  }
  #player .player-bar .icon-btn {
    width: 44px; height: 44px; min-width: 44px; min-height: 44px;
  }
  #player .player-score { max-width: 64px; font-size: .68rem; }
  #player-name { font-size: .78rem; }
}

/* Full titles and metadata remain readable inside the two-column catalogue. */
#hub .game-card-wrap > .card-game { height: 100% !important; padding-bottom: 12px !important; }
#hub .card-title, #hub .card-meta {
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: anywhere;
  text-overflow: clip !important;
  padding-inline: 10px !important;
}
#hub .card-title { min-height: 2.6em; }
#hub .card-meta { min-height: 2.9em; }
#hub .game-card-wrap:focus-within { border-color: #c4fa57 !important; }
#hub .search-clear { flex: 0 0 44px; width: 44px; min-height: 44px; }
.toast { width: max-content; overflow-wrap: anywhere; }
@media (max-width: 640px) {
  body:has(#hub:not([hidden])) .toast { bottom: calc(86px + env(safe-area-inset-bottom)); }
  #hub .pill-cats { scroll-padding-inline: 6px; }
}
@media (hover: none) {
  #hub .game-card-wrap:hover, #hub .game-card-wrap:hover .card-emoji { transform: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  .overlay, .sheet, .sheet-icon, .coach, .coach-hole, .coach-card, .toast {
    animation: none !important; transition: none !important;
  }
}
