.reveal-main, .reveal-side { display: contents; }
/* Phone landscape: game screens (everything except the character/home screens) must fit without page scrolling.
   First compact the chrome here, then landscape-fit.js zooms any remaining overflow down to fit. */
@media (orientation: landscape) and (max-height: 650px) and (max-width: 1400px) {
  body.game-screen { --table-dock: 0px; background: #100d09; }
  body.game-screen.has-player-strip { --table-dock: 56px; }
  body.game-screen .topbar { display: none; }
  body.game-screen .app-shell { width: 100%; max-width: none; margin: 0; padding: 0 0 var(--table-dock); }
  body.game-screen .app-shell > .game-panel:not(.table-stage),
  body.game-screen .app-shell > .friendly-vote-panel,
  body.game-screen .app-shell > .finish-panel {
    margin: 0; min-height: 0; border: 0; border-radius: 0; box-shadow: none;
    padding: 6px max(14px, env(safe-area-inset-right)) 4px max(14px, env(safe-area-inset-left));
  }
  body.table-immersive .app-shell > .game-panel:not(.table-stage),
  body.table-immersive .app-shell > .friendly-vote-panel,
  body.table-immersive .app-shell > .finish-panel { padding-right: 62px; }
  /* Host controls move into the right-hand gutter under the fullscreen button, so they cost no vertical space. */
  body.game-screen .app-shell > .game-panel:not(.table-stage),
  body.game-screen .app-shell > .friendly-vote-panel,
  body.game-screen .app-shell > .finish-panel { padding-right: 64px; }
  body.game-screen .global-pause-control:not(.table-hud .global-pause-control) { position: fixed; z-index: 44; right: max(8px, env(safe-area-inset-right)); top: 56px; width: 48px; margin: 0; padding: 0; display: grid; gap: 6px; border: 0; background: none; box-shadow: none; }
  body.game-screen .global-pause-control:not(.table-hud .global-pause-control) > span { display: none; }
  body.game-screen .global-pause-control:not(.table-hud .global-pause-control).paused > span { display: block; margin: 0; text-align: center; }
  body.game-screen .global-pause-control:not(.table-hud .global-pause-control).paused small { display: none; }
  body.game-screen .global-pause-control:not(.table-hud .global-pause-control).paused b { font-size: 20px; color: var(--amber-2); }
  body.game-screen .global-pause-control:not(.table-hud .global-pause-control) .host-phase-actions { display: grid; gap: 6px; }
  body.game-screen .global-pause-control:not(.table-hud .global-pause-control) .button { width: 48px; min-width: 0; min-height: 44px; padding: 0; font-size: 20px; display: grid; place-items: center; background: #100d09e8; }
  body.game-screen .global-pause-control:not(.table-hud .global-pause-control) .button .lbl { display: none; }
  body.game-screen .global-pause-control:not(.table-hud .global-pause-control) em { display: none; }
  /* Questions */
  body.game-screen .question-panel .answer-status { margin: 2px 0 0; font-size: 12px; }
  body.game-screen .question-panel .mini-players { margin-top: 2px; }
  body.game-screen .sort-board { max-width: none; display: grid; grid-template-columns: 1fr 1fr; column-gap: 12px; align-items: stretch; }
  body.game-screen .sort-head { grid-column: 1 / -1; margin-bottom: 2px; gap: 6px; }
  body.game-screen .sort-head span { padding: 4px 6px; font-size: 11px; }
  body.game-screen .sort-row { min-height: 42px; padding: 2px 4px 2px 8px; gap: 6px; }
  body.game-screen .sort-row strong { font-size: 12px; line-height: 1.2; }
  body.game-screen .sort-choice { width: 40px; height: 40px; }
  body.game-screen .sort-submit { grid-column: 1 / -1; min-height: 40px; margin-top: 4px; }
  /* Reveal: verdict on the left, solution and source on the right. */
  body.game-screen .reveal-panel { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-areas: "eyebrow eyebrow" "main side" "next next"; gap: 4px 22px; align-content: center; align-items: center; }
  body.game-screen .reveal-panel > .eyebrow { grid-area: eyebrow; margin: 0; }
  body.game-screen .reveal-panel > .reveal-main { grid-area: main; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
  body.game-screen .reveal-panel > .reveal-side { grid-area: side; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-width: 0; }
  body.game-screen .reveal-panel > .reveal-next { grid-area: next; margin: 2px 0 0; }
  body.game-screen .reveal-panel .answer-reveal-icon { width: 54px; height: 54px; font-size: 32px; }
  body.game-screen .reveal-panel h1 { margin: 2px 0; font-size: 30px; line-height: 1.05; }
  body.game-screen .reveal-panel .solution-label { margin: 0; }
  body.game-screen .reveal-panel .solution-card { padding: 8px 16px; font-size: 20px; }
  body.game-screen .reveal-panel .closest-details { margin: 0; }
  /* Round results: table on the left, verdict on the right; the cards repeat what the strip shows. */
  body.game-screen .round-results-panel { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); grid-template-areas: "pause pause" "head head" "table verdict"; gap: 2px 14px; align-content: start; }
  body.game-screen .round-results-panel > .global-pause-control { grid-area: pause; }
  body.game-screen .round-results-panel > .results-head { grid-area: head; margin: 0; }
  body.game-screen .round-results-panel > .round-table-results { grid-area: table; }
  body.game-screen .round-results-panel > .result-verdict { grid-area: verdict; align-self: center; }
  body.game-screen .round-results-panel > .round-player-grid { display: none; }
  body.game-screen .results-head h1 { margin: 0; font-size: 24px; }
  body.game-screen .results-head .eyebrow { margin: 0 0 2px; }
  body.game-screen .stat-row { min-height: 34px; padding: 0 8px; font-size: 13px; grid-template-columns: 30px minmax(60px, 1fr) 52px 58px 64px; gap: 6px; }
  body.game-screen .stat-head { min-height: 24px; }

  /* Minigames: shared rules / countdown / results screens. */
  body.game-screen .minigame-panel { min-height: 0; overflow: visible; }
  body.game-screen .minigame-head { margin: 0 0 4px; gap: 10px; align-items: center; }
  body.game-screen .minigame-head h1 { margin: 0; font-size: 22px; }
  body.game-screen .minigame-round { font-size: 10px; padding: 5px 8px; }
  body.game-screen .rules-panel { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); grid-template-areas: "head head" "rules ready"; gap: 4px 18px; align-content: start; align-items: start; }
  body.game-screen .rules-panel > .minigame-head { grid-area: head; }
  body.game-screen .rules-panel > .rules-layout { grid-area: rules; margin: 0; max-width: none; min-width: 0; }
  body.game-screen .rules-panel > .ready-footer { grid-area: ready; margin: 0; padding: 0; border: 0; display: flex; flex-direction: column; align-items: stretch; gap: 6px; }
  body.game-screen .rules-panel .rules-quick { padding: 10px 14px; border-radius: 14px; }
  body.game-screen .rules-panel .rules-quick h2 { margin: 4px 0; font-size: 19px; }
  body.game-screen .rules-panel .rules-quick p { margin: 4px 0; font-size: 12px; line-height: 1.35; }
  body.game-screen .rules-panel .rules-details { margin-top: 4px; }
  body.game-screen .rules-panel .rules-details > summary { min-height: 32px; display: flex; align-items: center; }
  body.game-screen .rules-panel .rules-layout:not(.compact-rules) { grid-template-columns: 1fr; gap: 6px; }
  body.game-screen .rules-panel .minigame-emblem { display: none; }
  body.game-screen .rules-panel .rule-card { padding: 8px 12px; }
  body.game-screen .rules-panel .rule-card p { font-size: 12px; line-height: 1.35; }
  body.game-screen .rules-panel .minigame-description { font-size: 15px; margin: 0 0 2px; }
  body.game-screen .ready-footer > div strong { font-size: 24px; }
  body.game-screen .ready-footer .button.large { min-height: 46px; width: 100%; }
  body.game-screen .ready-footer p { font-size: 11px; }
  body.game-screen .ready-footer > .rules-preference { gap: 2px; }
  body.game-screen .countdown-panel .start-countdown { min-height: 0; flex: 1; }
  body.game-screen .start-countdown > span { font-size: 96px; }
  body.game-screen .start-countdown strong { margin-top: 6px; font-size: 22px; }
  body.game-screen .start-countdown p { margin: 4px 0 0; font-size: 12px; }
  body.game-screen .minigame-results { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); grid-template-areas: "head head" "list verdict" "next next"; gap: 4px 16px; align-content: start; }
  body.game-screen .minigame-results > .minigame-head { grid-area: head; }
  body.game-screen .minigame-results > .minigame-result-list { grid-area: list; margin: 0; max-width: none; gap: 4px; }
  body.game-screen .minigame-results > .result-verdict { grid-area: verdict; align-self: center; }
  body.game-screen .minigame-results > .reveal-next { grid-area: next; margin: 0; }
  body.game-screen .minigame-result-list article { min-height: 40px; padding: 2px 10px; gap: 8px; grid-template-columns: 24px 34px 1fr auto 56px; }
  body.game-screen .minigame-result-list img { width: 30px; height: 34px; }

  /* Message partner: the text to copy on the left, the typing field on the right (the keyboard takes the rest). */
  body.game-screen .message-panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "head head" "target form" "hint form" "progress status"; gap: 4px 14px; align-content: start; align-items: start; }
  body.game-screen .message-panel > .minigame-head { grid-area: head; }
  body.game-screen .message-panel > .target-message { grid-area: target; margin: 0; padding: 8px 12px; border-radius: 12px; max-width: none; }
  body.game-screen .message-panel > .target-message blockquote { margin: 4px 0 0; font-size: 15px; line-height: 1.3; }
  body.game-screen .message-panel > .typing-hint { grid-area: hint; margin: 0; min-height: 0; text-align: left; font-size: 11px; }
  body.game-screen .message-panel > .message-form { grid-area: form; margin: 0; }
  body.game-screen .message-panel .message-form textarea { min-height: 64px; height: 64px; padding: 8px 10px; }
  body.game-screen .message-panel .message-form > div { margin-top: 4px; }
  body.game-screen .message-panel > .typing-progress { grid-area: progress; margin: 0; }
  body.game-screen .message-panel > .minigame-status { grid-area: status; margin: 0; padding: 4px 10px; }
  /* Rock paper scissors: duel/groups on the left, choices and status stacked on the right. */
  body.game-screen .rps-panel { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); grid-auto-rows: min-content; gap: 4px 14px; align-content: start; padding-bottom: 4px; }
  body.game-screen .rps-panel > .minigame-head,
  body.game-screen .rps-panel > .rps-group-intro { grid-column: 1 / -1; }
  body.game-screen .rps-panel > .rps-group-intro { margin: 0; }
  body.game-screen .rps-panel > .rps-focus { grid-column: 1; grid-row: 3 / span 8; min-height: 0; width: auto; margin: 0; padding: 6px 8px 8px; border-radius: 16px; }
  body.game-screen .rps-panel > :is(.rps-action, .rps-secondary-groups, .rps-waiting-strip, .minigame-status) { grid-column: 2; margin: 0; width: auto; }
  body.game-screen .rps-focus > header { margin-bottom: 4px; }
  body.game-screen .rps-showdown.group { grid-template-columns: repeat(auto-fit, minmax(84px, 1fr)); gap: 6px; }
  body.game-screen .rps-showdown.duel { grid-template-columns: minmax(80px, 1fr) 30px minmax(80px, 1fr); gap: 6px; }
  body.game-screen .rps-player { min-height: 0; padding: 5px 4px 6px; border-radius: 14px; grid-template-rows: 54px auto auto auto; gap: 2px; }
  body.game-screen .rps-avatar { width: 54px; height: 54px; }
  body.game-screen .rps-choice-state { min-height: 0; }
  body.game-screen .rps-action h2 { font-size: 15px; }
  body.game-screen .rps-action p { margin: 2px 0 6px; font-size: 11px; }
  body.game-screen .rps-controls { gap: 6px; }
  body.game-screen .rps-controls button { min-height: 64px; padding: 4px; }
  body.game-screen .rps-controls .button-hand { width: 38px; height: 36px; }
  body.game-screen .rps-panel > .minigame-status { padding: 4px 10px; }

  /* Live arm wrestling: the pub / duel picture on the left, heading, bartender line, stamina and controls on the right. */
  body.game-screen .arm-live { display: grid !important; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); grid-template-areas: "world head" "world host" "world energy" "world controls" "audience ." "queue ." "help ."; grid-template-rows: auto auto auto 1fr auto auto auto; gap: 4px 14px; align-items: start; padding: 6px 70px 4px 14px; }
  body.game-screen .arm-live > .duel-audience { grid-area: audience; margin: 0; min-height: 0; }
  body.game-screen .arm-live > .aw-queue { grid-area: queue; margin: 0; }
  body.game-screen .arm-live > .aw-help { grid-area: help; margin: 0; }
  body.game-screen .arm-live > .aw-pause { grid-area: auto; position: absolute; }
  body.game-screen .arm-live > .duel-heading { grid-area: head; margin: 0; gap: 8px; }
  body.game-screen .arm-live h1 { font-size: 20px; margin: 0; }
  body.game-screen .arm-live .duel-heading .eyebrow { margin: 0 0 2px; }
  body.game-screen .arm-live > .duel-world { grid-area: world; width: 100% !important; max-width: calc((100dvh - var(--table-dock) - 10px) * 1.78); margin: 0; }
  body.game-screen .arm-live > .duel-host { grid-area: host; padding: 5px 10px; min-height: 0; font-size: 12px; border: 0; border-radius: 10px; }
  body.game-screen .arm-live > .aw-energy-pair { grid-area: energy; margin: 0; padding: 6px 10px; gap: 10px; }
  body.game-screen .arm-live > .aw-controls { grid-area: controls; margin: 0; max-width: none; grid-template-columns: 1fr 1fr; gap: 6px; }
  body.game-screen .arm-live .aw-ready { padding: 0; text-align: left; }
  body.game-screen .arm-live .aw-ready p { margin: 0 0 6px; font-size: 12px; line-height: 1.35; }
  body.game-screen .arm-live .aw-controls .duel-hold { min-height: 56px; }
  body.game-screen .arm-live .aw-controls .duel-hold b { font-size: 14px; }
  body.game-screen .arm-live .aw-controls .duel-hold small, body.game-screen .arm-live .aw-surge small { font-size: 10px; line-height: 1.2; }
  body.game-screen .arm-live .aw-surge { min-height: 56px; padding: 4px 6px; }
  body.game-screen .arm-live .aw-controls > .aw-ready, body.game-screen .arm-live .aw-controls > .aw-combat-cue { grid-column: 1 / -1; }

  /* Friendly vote: the question and buttons on the left, the ELO table on the right. */
  body.game-screen .friendly-vote-panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 16px; align-content: center; align-items: center; max-width: none; text-align: left; }
  body.game-screen .friendly-vote-panel > * { grid-column: 1; margin-top: 3px; margin-bottom: 3px; }
  body.game-screen .friendly-vote-panel > .vote-elo { grid-column: 2; grid-row: 1 / span 6; padding: 8px 12px; margin: 0; }
  body.game-screen .friendly-vote-panel h1 { margin: 2px 0; font-size: 26px; }
  body.game-screen .friendly-vote-panel .vote-elo > strong { font-size: 24px; }
  body.game-screen .friendly-vote-panel .vote-elo p { margin: 2px 0; font-size: 12px; line-height: 1.3; }
  body.game-screen .friendly-vote-panel .vote-elo h2 { margin: 4px 0 2px; font-size: 13px; }
  body.game-screen .friendly-vote-panel .vote-elo th, body.game-screen .friendly-vote-panel .vote-elo td { padding: 2px 6px; font-size: 12px; }
  body.game-screen .friendly-vote-panel > p { font-size: 12px; }
  body.game-screen .friendly-vote-panel .vote-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  body.game-screen .friendly-vote-panel .vote-actions .button { min-height: 44px; padding: 6px 8px; font-size: 13px; }
  /* Final results: winner and buttons on the left, standings table on the right. */
  body.game-screen .finish-panel { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr); column-gap: 18px; align-content: center; align-items: center; justify-items: stretch; text-align: left; width: 100%; max-width: none; }
  body.game-screen .finish-panel > * { grid-column: 1; margin-top: 3px; margin-bottom: 3px; }
  body.game-screen .finish-panel > .final-statistics { grid-column: 2; grid-row: 1 / span 9; margin: 0; }
  body.game-screen .finish-panel .winner-crown { width: 48px; margin: 0; font-size: 22px; }
  body.game-screen .finish-panel h1 { font-size: 26px; margin: 2px 0; }
  body.game-screen .finish-panel > p:not(.eyebrow) { font-size: 13px; }
  body.game-screen .finish-panel .button.large { min-height: 44px; width: 100%; }
  body.game-screen .finish-panel .text-button { margin: 0; min-height: 40px; }
  body.game-screen .final-stat-head, body.game-screen .final-stat-row { min-height: 34px; padding-top: 2px; padding-bottom: 2px; font-size: 12px; }
  body.game-screen .final-stat-row .final-avatar { width: 28px; height: 28px; }
  body.game-screen .final-elo-result, body.game-screen .elo-summary { margin: 2px 0; padding: 6px 10px; }
  body.game-screen .elo-summary > strong { font-size: 20px; }

  /* Number pad for numeric answers: two rows of five digits plus a back key. */
  body.game-screen .closest-form { display: grid; grid-template-columns: 1fr; gap: 6px; align-items: start; }
  body.game-screen .closest-form .number-entry input { min-height: 44px; font-size: 22px; }
  body.game-screen .num-pad { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)) minmax(0, 1.2fr); grid-template-rows: 44px 44px; gap: 6px; }
  body.game-screen .num-pad button { min-height: 44px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.05); color: var(--cream, #f7e8c9); font: 800 20px ui-monospace, monospace; cursor: pointer; touch-action: manipulation; }
  body.game-screen .num-pad button:active { background: rgba(241,168,23,.25); }
  body.game-screen .num-pad .num-back { grid-column: 6; grid-row: 1 / span 2; font-size: 22px; }

  /* Closest-number question: the question on the left, the entry field and number pad on the right. */
  body.game-screen .question-panel:has(.closest-form) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); column-gap: 16px; align-content: start; }
  body.game-screen .question-panel:has(.closest-form) > * { grid-column: 1; }
  body.game-screen .question-panel:has(.closest-form) > .closest-form { grid-column: 2; grid-row: 1 / span 5; align-self: center; max-width: none; margin: 0; padding: 0; border: 0; background: none; }
  body.game-screen .closest-form label { font-size: 11px; }

  body.game-screen .arm-live .aw-spectator p { margin: 0 0 4px; font-size: 11px; }
  body.game-screen .arm-live .aw-spectator small { margin-top: 2px; font-size: 10px; }
  body.game-screen .arm-live .aw-spectator button { min-height: 40px; }
  body.game-screen .arm-live .aw-spectator > div { gap: 6px; }
  body.game-screen .arm-live > .duel-audience { display: flex; gap: 8px; align-items: center; }

  /* Slimmer player strip so the game area keeps more height. */
  body.game-screen .player-strip { padding-top: 3px; padding-bottom: calc(3px + env(safe-area-inset-bottom)); }
  body.game-screen .strip-player { height: 50px; }
  body.game-screen .strip-player .rank-badge { flex-basis: 40px; width: 40px; height: 44px; }
  body.game-screen .strip-player .rank-stars { top: 31px; }

  /* Secondary hints are dropped in landscape so the duel itself stays readable. */
  body.game-screen .arm-live > .aw-help, body.game-screen .arm-live > .aw-queue { display: none; }
  body.game-screen .arm-live > .duel-audience { grid-area: audience; }

  /* Cork shooting: the shelf takes the full height; clock, corks and the scoreboard stand in a column beside it. */
  body.game-screen .cork-panel { grid-template-columns: auto minmax(150px, 1fr); grid-template-rows: auto 1fr; grid-template-areas: "stage head" "stage board"; gap: 4px 12px; align-content: start; }
  body.game-screen .cork-main { display: contents; }
  body.game-screen .cork-panel > .cork-head { grid-area: head; flex-wrap: wrap; gap: 6px 8px; }
  body.game-screen .cork-head > div:first-child { flex-basis: 100%; }
  body.game-screen .cork-head h1 { margin: 0; font-size: 19px; }
  body.game-screen .cork-head .eyebrow { margin: 0; font-size: 10px; }
  body.game-screen .cork-clock { width: 36px; height: 36px; font-size: 16px; margin-left: auto; }
  body.game-screen .cork-sound { width: 34px; height: 34px; }
  body.game-screen .cork-ammo i { width: 12px; height: 17px; }
  body.game-screen .cork-stage { grid-area: stage; width: min(calc(100vw - 200px), calc((100dvh - var(--table-dock) - 10px) * 1.6)); border-radius: 12px; }
  body.game-screen .cork-board { grid-area: board; flex-direction: column; flex-wrap: nowrap; gap: 4px; align-content: start; }
  body.game-screen .cork-chip { padding: 3px 8px 3px 4px; }
  body.game-screen .cork-chip img, body.game-screen .cork-chip span { width: 22px; height: 22px; }
  /* Coaster tower: the tower and Vaidotas at full height on the left; clock, button and the turn order on the right. */
  body.game-screen .tower-panel { grid-template-columns: minmax(0, 1.2fr) minmax(200px, 1fr); grid-template-rows: auto auto 1fr; grid-template-areas: "stage head" "stage controls" "stage players"; gap: 6px 14px; align-content: start; }
  body.game-screen .tower-panel > .tower-pause { position: absolute; }
  body.game-screen .tower-panel > .tower-head { grid-area: head; gap: 8px; }
  body.game-screen .tower-head h1 { margin: 0; font-size: 20px; }
  body.game-screen .tower-head .eyebrow { margin: 0; font-size: 10px; }
  body.game-screen .tower-clock { width: 38px; height: 38px; font-size: 17px; }
  body.game-screen .tower-height b { font-size: 19px; }
  body.game-screen .tower-panel > .tower-stage { grid-area: stage; height: calc(100dvh - var(--table-dock) - 14px); min-height: 200px; border-radius: 12px; }
  body.game-screen .tower-panel > .tower-controls { grid-area: controls; gap: 2px; }
  body.game-screen .tower-button { min-height: 66px; }
  body.game-screen .tower-feedback { min-height: 0; font-size: 11px; }
  body.game-screen .tower-panel > .tower-players { grid-area: players; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 6px; align-content: start; padding-top: 6px; }
  body.game-screen .tower-card { padding: 2px 6px 2px 3px; }
  body.game-screen .tower-card img, body.game-screen .tower-card > span { width: 24px; height: 24px; }
  body.game-screen .tower-bubble p { font-size: 13px; }
  /* Cup shuffle: the host and the mugs take the full height on the left; rounds, players and the hint on the right. */
  body.game-screen .cups-panel { grid-template-columns: minmax(0, 1.6fr) minmax(190px, 1fr); grid-template-rows: auto auto 1fr; grid-template-areas: "stage head" "stage players" "stage feedback"; gap: 6px 14px; align-content: start; }
  body.game-screen .cups-panel > .cups-pause { position: absolute; }
  body.game-screen .cups-panel > .cups-head { grid-area: head; flex-wrap: wrap; gap: 4px 8px; }
  body.game-screen .cups-head h1 { margin: 0; font-size: 20px; }
  body.game-screen .cups-head .eyebrow { margin: 0; font-size: 10px; }
  body.game-screen .cups-track li { width: 20px; height: 20px; font-size: 10px; }
  body.game-screen .cups-panel > .cups-stage { grid-area: stage; height: calc(100dvh - var(--table-dock) - 14px); min-height: 200px; border-radius: 12px; }
  body.game-screen .cups-clock { width: 38px; height: 38px; font-size: 17px; }
  body.game-screen .cups-bubble p { font-size: 13px; }
  body.game-screen .cups-panel > .cups-players { grid-area: players; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; align-content: start; }
  body.game-screen .cups-card { padding: 2px 6px 2px 3px; column-gap: 5px; }
  body.game-screen .cups-card img { width: 24px; height: 24px; }
  body.game-screen .cups-panel > .cups-feedback { grid-area: feedback; min-height: 0; font-size: 11px; }
  /* 21: the table takes the full height on the left; hands, buttons, seats and the hint on the right. */
  body.game-screen .bj-panel { grid-template-columns: minmax(0, 1.5fr) minmax(230px, 1fr); grid-template-rows: auto auto minmax(0, 1fr) auto; grid-template-areas: "stage head" "stage controls" "stage players" "stage feedback"; gap: 6px 14px; align-content: start; }
  body.game-screen .bj-panel > .bj-pause { position: absolute; }
  body.game-screen .bj-panel > .bj-head { grid-area: head; gap: 4px 8px; }
  body.game-screen .bj-head h1 { margin: 0; font-size: 20px; }
  body.game-screen .bj-head .eyebrow { margin: 0; font-size: 10px; }
  body.game-screen .bj-track li { min-width: 22px; height: 22px; font-size: 10px; }
  body.game-screen .bj-panel > .bj-stage { grid-area: stage; height: calc(100dvh - var(--table-dock) - 14px); min-height: 200px; border-radius: 12px; }
  body.game-screen .bj-panel > .bj-controls { grid-area: controls; gap: 6px; }
  body.game-screen .bj-controls button { min-height: 48px; font-size: 16px; border-radius: 12px; }
  body.game-screen .bj-panel > .bj-players { grid-area: players; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; align-content: start; overflow: hidden; }
  body.game-screen .bj-seat { padding: 2px 5px 2px 3px; column-gap: 4px; row-gap: 1px; }
  body.game-screen .bj-seat img { width: 24px; height: 24px; }
  body.game-screen .bj-seat > b { font-size: 11px; }
  body.game-screen .bj-dots li { width: 6px; height: 6px; }
  body.game-screen .bj-panel > .bj-feedback { grid-area: feedback; min-height: 0; font-size: 11px; }
  /* Toasts: Benas at full height on the left; the toast track, the table of players and the button on the right. */
  body.game-screen .toast-panel { grid-template-columns: minmax(0, .8fr) minmax(0, 1.25fr); grid-template-rows: auto 1fr auto; grid-template-areas: "stage head" "stage table" "stage controls"; gap: 6px 14px; align-content: start; }
  body.game-screen .toast-panel > .toast-pause { position: absolute; }
  body.game-screen .toast-panel > .toast-head { grid-area: head; gap: 8px; }
  body.game-screen .toast-head h1 { margin: 0; font-size: 20px; }
  body.game-screen .toast-head .eyebrow { margin: 0; font-size: 10px; }
  body.game-screen .toast-track li { width: 22px; height: 22px; font-size: 11px; }
  body.game-screen .toast-panel > .toast-stage { grid-area: stage; height: calc(100dvh - var(--table-dock) - 14px); min-height: 200px; border-radius: 12px; }
  body.game-screen .toast-benas { left: 50%; transform: translateX(-50%); height: 64%; max-width: 90%; }
  body.game-screen .toast-bubble { left: 6%; right: 6%; top: 4%; padding: 8px 10px; border-radius: 14px; }
  body.game-screen .toast-bubble::before { left: 30%; bottom: -10px; border: 10px solid transparent; border-top-color: #fff6e3; border-bottom: 0; }
  body.game-screen .toast-line { font-size: 16px; min-height: 2.5em; }
  body.game-screen .toast-panel > .toast-table { grid-area: table; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; align-content: start; }
  body.game-screen .toast-card { padding: 3px 6px 3px 3px; column-gap: 6px; border-radius: 10px; }
  body.game-screen .toast-portrait { width: 40px; height: 40px; border-radius: 8px; }
  body.game-screen .toast-card b { font-size: 12px; }
  body.game-screen .toast-status { font-size: 11px; }
  body.game-screen .toast-panel > .toast-controls { grid-area: controls; gap: 2px; }
  body.game-screen .toast-button { min-height: 64px; }
  body.game-screen .toast-feedback { min-height: 0; font-size: 11px; }
  /* Beer pour: the tap and the glass take the full height on the left; clock, glasses, button and friends on the right. */
  body.game-screen .pour-panel { grid-template-columns: minmax(0, 1.1fr) minmax(200px, 1fr); grid-template-rows: auto auto minmax(0, 1fr); grid-template-areas: "stage head" "stage controls" "stage board"; gap: 6px 14px; align-content: start; }
  body.game-screen .pour-panel > .pour-pause { position: absolute; }
  body.game-screen .pour-panel > .pour-head { grid-area: head; gap: 8px; }
  body.game-screen .pour-head h1 { margin: 0; font-size: 20px; }
  body.game-screen .pour-head .eyebrow { margin: 0; font-size: 10px; }
  body.game-screen .pour-clock { width: 38px; height: 38px; font-size: 17px; }
  body.game-screen .pour-track li { width: 22px; height: 22px; font-size: 11px; }
  body.game-screen .pour-panel > .pour-stage { grid-area: stage; height: calc(100dvh - var(--table-dock) - 14px); min-height: 200px; border-radius: 12px; }
  body.game-screen .pour-panel > .pour-controls { grid-area: controls; gap: 4px; }
  body.game-screen .pour-button { min-height: 76px; }
  body.game-screen .pour-feedback { min-height: 0; font-size: 12px; }
  body.game-screen .pour-panel > .pour-board { grid-area: board; flex-direction: column; flex-wrap: nowrap; gap: 3px; align-content: start; overflow: hidden; }
  body.game-screen .pour-chip { padding: 2px 8px 2px 4px; }
  /* Five or more players: the board goes into two columns, so everybody stays on screen. */
  body.game-screen .pour-panel > .pour-board:has(> :nth-child(5)) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.game-screen .pour-board:has(> :nth-child(5)) .pour-chip :is(.pour-mini, .pour-chip-last) { display: none; }
  body.game-screen .pour-board:has(> :nth-child(5)) .pour-chip { gap: 4px; padding: 2px 6px 2px 3px; }
  body.game-screen .pour-chip .pour-mini { width: 13px; height: 22px; }
  body.game-screen .pour-chip img, body.game-screen .pour-chip > span { width: 20px; height: 20px; }
  /* Beer slide: the bar with every lane on the left, the meter and the big throw button on the right. */
  body.game-screen .slide-panel { grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); grid-template-areas: "head head" "bar controls"; gap: 4px 16px; align-content: start; --lane-h: clamp(28px, calc((100dvh - var(--table-dock) - 128px) / var(--lanes)), 46px); }
  body.game-screen .slide-panel > .slide-head { grid-area: head; }
  body.game-screen .slide-panel > .slide-bar { grid-area: bar; padding: 6px 8px 4px; }
  body.game-screen .slide-panel > .slide-controls { grid-area: controls; align-self: center; gap: 10px; }
  body.game-screen .slide-head h1 { margin: 0; font-size: 22px; }
  body.game-screen .slide-head .eyebrow { margin: 0; }
  body.game-screen .slide-clock { width: 40px; height: 40px; font-size: 18px; }
  body.game-screen .slide-throw { min-height: 92px; }
  body.game-screen .slide-feedback { min-height: 0; font-size: 12px; }
}

/* Practice results on a phone held sideways: the list in two columns and the buttons always on screen, so your own row,
   who drinks and "Dar kartą" never sit below the fold. Names wrap above the detail instead of running into it. */
@media (orientation: landscape) and (max-height: 500px) {
  :is(.practice-setup, .cups-practice-setup, .toast-practice-setup, .pour-practice-setup, .bj-practice-setup, .tower-practice-setup):has(> ol) { gap: 6px; padding: 10px 14px; }
  :is(.practice-setup, .cups-practice-setup, .toast-practice-setup, .pour-practice-setup, .bj-practice-setup, .tower-practice-setup):has(> ol) h1 { font-size: 20px; }
  :is(.practice-setup, .cups-practice-setup, .toast-practice-setup, .pour-practice-setup, .bj-practice-setup, .tower-practice-setup):has(> ol) .eyebrow { margin: 0; font-size: 10px; }
  :is(.practice-results, .cups-practice-results, .toast-practice-results, .pour-practice-results, .bj-practice-results, .tower-practice-results) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 8px; }
  :is(.practice-results, .cups-practice-results, .toast-practice-results, .pour-practice-results, .bj-practice-results, .tower-practice-results) li { grid-template-columns: 18px 24px minmax(0, 1fr) auto; grid-template-rows: auto auto; gap: 0 6px; padding: 3px 8px; font-size: 12px; }
  :is(.practice-results, .cups-practice-results, .toast-practice-results, .pour-practice-results, .bj-practice-results, .tower-practice-results) li img { width: 24px; height: 24px; grid-row: 1 / span 2; grid-column: 2; }
  :is(.practice-results, .cups-practice-results, .toast-practice-results, .pour-practice-results, .bj-practice-results, .tower-practice-results) li > span { grid-row: 1 / span 2; }
  :is(.practice-results, .cups-practice-results, .toast-practice-results, .pour-practice-results, .bj-practice-results, .tower-practice-results) li strong { grid-column: 3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  :is(.practice-results, .cups-practice-results, .toast-practice-results, .pour-practice-results, .bj-practice-results, .tower-practice-results) li b { grid-column: 3; grid-row: 2; font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  :is(.practice-results, .cups-practice-results, .toast-practice-results, .pour-practice-results, .bj-practice-results, .tower-practice-results) li em { grid-column: 4; grid-row: 1 / span 2; font-size: 11px; }
  :is(.practice-actions, .cups-practice-actions, .toast-practice-actions, .pour-practice-actions, .bj-practice-actions, .tower-practice-actions) { position: sticky; bottom: 0; padding: 6px 0 2px; background: linear-gradient(transparent, #1b110a 30%); }
  :is(.practice-actions, .cups-practice-actions, .toast-practice-actions, .pour-practice-actions, .bj-practice-actions, .tower-practice-actions) .button { min-height: 40px; padding: 6px 14px; font-size: 14px; }
}

@media (orientation: landscape) and (max-height: 650px) and (max-width: 1400px) {
  /* The bot practice pages keep the same right-hand gutter as a real room: the pause and full screen buttons live there. */
  body.game-screen :is(.bj-practice, .cups-practice, .toast-practice, .pour-practice, .tower-practice).is-playing .game-panel { padding-right: 64px; }
  /* Laikas vandenėliui sets its own tight padding: keep the gutter and a full-size pause button. */
  body.game-screen .water-panel { padding: 8px 64px 8px 10px !important; }
  body.game-screen .water-panel .global-pause-control .button { width: 48px !important; min-height: 44px !important; padding: 0 !important; font-size: 20px !important; }
  body.game-screen .water-sound { width: 40px !important; height: 40px !important; }
}

@media (orientation: landscape) and (max-height: 650px) and (max-width: 760px) {
  /* Į sveikatą! on a small phone: two columns, so names and points stay readable. */
  body.game-screen .toast-panel > .toast-table { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.game-screen .toast-portrait { width: 34px; height: 34px; }
}
@media (orientation: landscape) and (max-height: 500px) {
  /* Practice results and setup start at the top of the screen: no page scroll on a small phone. */
  body.practice-page .app-shell { padding-top: 4px; padding-bottom: 4px; }
  body.practice-page .practice-page-panel { margin-top: 0; margin-bottom: 0; }
}
@media (orientation: landscape) and (max-height: 650px) and (max-width: 1400px) {
  /* Akmuo, popierius, žirklės: the other group's summary and the status line readable on a phone. */
  body.game-screen .rps-secondary-groups article { font-size: 11px; line-height: 1.3; }
  body.game-screen .rps-secondary-groups article :is(b, span, em) { font-size: 11px; }
  body.game-screen .rps-panel > .minigame-status span { font-size: 11px; line-height: 1.2; }
}
@media (orientation: landscape) and (max-height: 650px) and (max-width: 1400px) {
  /* Po kuriuo bokalu?: the title on one line above the round dots. */
  body.game-screen .cups-head > div:first-child { flex: 1 0 100%; }
  body.game-screen .cups-head h1, body.game-screen .cups-head .eyebrow { white-space: nowrap; }
}
.cups-track li[hidden] { display: none !important; }
@media (orientation: landscape) and (max-height: 500px) {
  /* Results in full screen leave the top-right corner to the screen-mode button. */
  body.table-immersive :is(.practice-setup, .cups-practice-setup, .toast-practice-setup, .pour-practice-setup, .bj-practice-setup, .tower-practice-setup):has(> ol) { margin-right: 56px; }
}
@media (orientation: landscape) and (max-height: 650px) and (max-width: 760px) {
  /* 21 prieš Vaidotą on a small phone: one player a line, so names are not cut to a letter. */
  body.game-screen .bj-panel > .bj-players { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  body.game-screen .bj-seat { grid-template-columns: 20px minmax(0, 1fr) auto auto auto; grid-template-areas: "pic name total dots pts"; padding: 1px 6px 1px 3px; }
  body.game-screen .bj-seat img { width: 20px; height: 20px; }
  body.game-screen .bj-head h1 { font-size: 18px; white-space: nowrap; }
  body.game-screen .bj-head > div:first-child { flex: 1 0 100%; }
}

@media (orientation: landscape) and (max-height: 650px) and (max-width: 1400px) {
  /* Quiz on a phone held sideways: the question (with its clock) on the left, the answers one under another on the right,
     full width, so even long answers are read whole. Five or more options (a vote between players) keep two columns. */
  body.game-screen .question-panel:has(> .answers) { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); column-gap: 14px; align-content: center; min-height: calc(100dvh - var(--table-dock) - 4px); }
  body.game-screen .question-panel > .round-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; }
  body.game-screen .question-panel > .round-head .eyebrow { margin: 0; font-size: 10px; line-height: 1.3; }
  body.game-screen .question-panel > .round-head .alive-count { font-size: 11px; }
  body.game-screen .question-panel .question-copy h1 { font-size: clamp(19px, 6vh, 28px); line-height: 1.2; overflow-wrap: anywhere; }
  body.game-screen .question-panel > .answers { grid-template-columns: minmax(0, 1fr); gap: 6px; align-self: center; }
  body.game-screen .question-panel > .answers:has(> :nth-child(5)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.game-screen .question-panel .answer { min-height: clamp(46px, calc((100dvh - var(--table-dock) - 48px) / 4 - 6px), 72px); padding: 6px 12px 6px 8px; gap: 10px; font-size: 15px; line-height: 1.2; text-align: left; overflow-wrap: anywhere; hyphens: auto; }
  body.game-screen .question-panel .answer > span { flex: 0 0 auto; width: 30px; height: 30px; }
  body.game-screen .question-panel > .answer-status { grid-column: 1; }
  body.game-screen .question-panel .timer { width: 52px; height: 52px; min-width: 52px; box-shadow: inset 0 0 0 5px #1c140d; }
  body.game-screen .question-panel .timer strong { font-size: 14px; }
  body.game-screen .question-panel .timer span { font-size: 8px; }
}

@media (orientation: landscape) and (max-height: 650px) and (max-width: 1400px) {
  /* Round results on a phone: every row on screen, the header lined up, and the table-message box out of the way in
     the right-hand column under the verdict. */
  body.game-screen .round-results-panel .stat-row { min-height: 26px; font-size: 12px; grid-template-columns: 26px minmax(60px, 1fr) 46px 54px 62px; }
  body.game-screen .round-results-panel .stat-row > :nth-child(2) { justify-self: start; text-align: left; }
  body.game-screen .round-results-panel .stat-row > :nth-child(n+3) { justify-self: end; text-align: right; white-space: nowrap; }
  body.game-screen .round-results-panel .stat-head { min-height: 20px; font-size: 9px; }
  body.game-screen .round-results-panel > .result-verdict { align-self: start; margin-top: 8px; padding: 10px 14px; }
  body.game-screen .round-results-panel .result-verdict strong { font-size: 24px; }
  body.game-screen .table-composer { left: auto; right: max(70px, env(safe-area-inset-right)); transform: none; width: min(300px, 40vw); }
  body.game-screen .question-marks { gap: 2px; margin-left: 6px; }
  body.game-screen .question-marks i { width: 14px; height: 14px; font-size: 9px; }
  body.game-screen .table-composer .chat-status { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body.game-screen .table-composer .chat-toggle { flex: 0 0 auto; white-space: nowrap; }
}