/* THARN's page: the shared skin is ../module.css (site/public/module.css), which lays out the stage and draws its parts
   as every module page has them; this is only what's THARN's own: the panel's size, the headlights' glare over it
   (js/panel2d.js), and the status and readout. The headlights are THARN's own cold white; the page is gold, as every
   page is. */

/* ---------- the stage: the panel (12 HP, 60.66 mm), its headlights lit by the engine, the knobs playable ---------- */
/* the glare may spill past the panel, never past the page */
.stage { --panel-ratio: 60.66 / 128.5; --panel-max: 335px; --panel-max-narrow: 311px; overflow-x: clip; }
/* the glare reaches past the panel's edges, so the panel doesn't clip it; the face keeps the rounded corners */
.panel2d { overflow: visible; border-radius: 0; }
.panel-face { border-radius: 3px; }
.panel-lit { position: absolute; inset: 0; width: 100%; height: 100%; }
.stage.live .panel-lit { display: none; }
/* the headlights' glare, over everything and past the panel's edges, screened over the page itself (no isolation
   here: black adds nothing, on the panel or off it) */
.p2-glare {
  position: absolute; max-width: none; pointer-events: none; mix-blend-mode: screen; opacity: 0; z-index: 2;
}
.p2 { z-index: 1; }

/* the status (passing through, frozen, sprinting: the last two in bold) and the readout of the knob being turned */
.status[data-state="frozen"], .status[data-state="sprint"] { font-weight: 700; }
.readout {
  min-height: 2.8em;
  font: italic 700 0.78rem/1.35 "Space Mono", ui-monospace, monospace; color: var(--ink);
}
#patch-note { min-height: 7.2em; }