/* main.css  -  base. The game commits to one look (night-broadcast navy), so there is no light theme. */
:root {
  --ink: #f2f5fb; --dim: #9fb0cc; --navy: #0b1530; --panel: #13214a; --edge: #2a3d72; --gold: #ffcf3f; --live: #38d47a;
  --display: "Barlow Condensed", "Arial Narrow", Arial, sans-serif; --body: "Barlow", Arial, sans-serif;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; overflow: hidden; background: var(--navy); color: var(--ink); font-family: var(--body); }
#view { position: fixed; inset: 0; width: 100%; height: 100%; display: block; }
[hidden] { display: none !important; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
button:focus-visible, select:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }

/* iPhone held upright (Safari will not turn the page): the whole game is drawn a quarter turn round, filling the
   screen between the notch and the home bar. Hold the phone sideways to play. Sizes are set by Sideways.js. */
body.sideways { position: fixed; left: 0; top: 0; width: var(--sw-w); height: var(--sw-h); transform-origin: 0 0; transform: translate(var(--sw-x), var(--sw-y)) rotate(90deg); }