/* FIELD'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 FIELD's own: the panel's size, the rings' light over its face
   (js/panel2d.js) and the readout. The rings are orange, FIELD's own light; the page is gold, as every page is. */

/* ---------- the stage: the panel (20 HP, 101.3 mm), its rings lit by the engine, the knobs playable ---------- */
.stage { --panel-ratio: 101.3 / 128.5; --panel-max: 560px; --panel-max-narrow: 520px; }
.panel2d { isolation: isolate; }        /* the rings' light screens over the face, and nothing else */
/* the rings' light over the dark glass (screen: black adds nothing), and its bloom */
.field-light, .field-bloom {
  position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; mix-blend-mode: screen;
}
.field-bloom { filter: blur(9px); opacity: 0.7; }
.p2 { z-index: 1; }                     /* the parts over the light */

/* the readout of the knob being turned */
.readout {
  min-height: 1.4em;
  font: italic 700 0.78rem/1.35 "Space Mono", ui-monospace, monospace; color: var(--ink);
}
#patch-note { min-height: 5.6em; }