/* dot-connect · 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; }

/* dot-connect: board + score row first; options, forecast panel and buttons below the fold. */
html.pip-immersive .pip-stage .how { display: none; }
html.pip-immersive .pip-stage.fs-wide > #board-wrap.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) > .opts { order: 6; }
html.pip-immersive .pip-stage:not(.fs-wide) > .chain-forecast { order: 7; }
html.pip-immersive .pip-stage:not(.fs-wide) > #record { order: 8; }