/* mine-field · fullscreen — paired with fullscreen-fit.js, which sets --fs-side (the board unit's width),
   --fs-rows and toggles .fs-wide. Only applies while the game-shell's Full screen is on
   (html.pip-immersive); normal play is untouched. */
html.pip-immersive .pip-stage .fs-unit { width: var(--fs-side, 100%); max-width: none; margin-left: auto; margin-right: auto; box-sizing: border-box; }
html.pip-immersive .pip-stage.fs-wide {
  display: grid;
  grid-template-columns: var(--fs-side) var(--fs-side-col, 320px);
  grid-template-rows: repeat(var(--fs-rows, 6), auto) 1fr;
  column-gap: 20px;
  justify-content: center;
  align-content: start;
}
html.pip-immersive .pip-stage.fs-wide > * { grid-column: 2; min-width: 0; }
html.pip-immersive .pip-stage.fs-wide > .fs-unit { grid-column: 1; grid-row: 1 / -1; margin: 0; align-self: start; }

/* mine-field: tabs, counters, mode switch and the board first; how-to, clue desk, article below the fold. */
html.pip-immersive .pip-stage .game-header,
html.pip-immersive .pip-stage .how-line { display: none; }
html.pip-immersive .pip-stage #mf-board-scroll { margin: 0; overflow: visible; }
html.pip-immersive .pip-stage #mf-board-scroll .board-wrap { width: 100%; max-width: none; }
html.pip-immersive .pip-stage.fs-wide > #mf-board-scroll.fs-unit { position: sticky; top: 0; margin: 0; }
html.pip-immersive .pip-stage:not(.fs-wide) { display: flex; flex-direction: column; }
html.pip-immersive .pip-stage:not(.fs-wide) > .fs-unit { order: 5; flex: none; }
html.pip-immersive .pip-stage:not(.fs-wide) > .clue-launch { order: 8; }
html.pip-immersive .pip-stage:not(.fs-wide) > [id^="mf-depth"] { order: 9; }
html.pip-immersive .pip-stage:not(.fs-wide) > .game-article { order: 10; }
html.pip-immersive .pip-stage:not(.fs-wide) > .ad-rail { order: 11; }
html.pip-immersive .pip-stage .fs-unit .cell { min-height: 0; min-width: 0; }
/* compact the controls so the board gets the room: article + ad rail are page furniture, not fullscreen content */
html.pip-immersive .pip-stage .game-article,
html.pip-immersive .pip-stage .ad-rail,
html.pip-immersive .pip-stage .hud-meta { display: none; }
html.pip-immersive .pip-stage:not(.fs-wide) > .mf-mobile-tools { order: 7; }
html.pip-immersive .pip-stage:not(.fs-wide) .mode-panel { padding-top: 6px; padding-bottom: 6px; }
html.pip-immersive .pip-stage:not(.fs-wide) .mode-panel .tool-actions { display: none; }
html.pip-immersive .pip-stage .diff-tabs { margin-top: 0; margin-bottom: 6px; }
/* fsfix: depth panels and the clue desk launcher are below-the-board extras; hide them in fullscreen so the stage never scrolls */
html.pip-immersive .pip-stage > [id^="mf-depth"], html.pip-immersive .pip-stage > .clue-launch { display: none; }
/* fsfix: short landscape: the difficulty tabs are a setting, drop them so HUD + mode + tools fit the side column */
@media (max-height: 480px) { html.pip-immersive .pip-stage.fs-wide > .diff-tabs { display: none; } }