/* ══════════════════════════════════════════════════════════════════
   theme-terminal.css — the VFD look.

   A theme file declares VALUES ONLY. Every selector that consumes
   them lives once in base.css, so the two themes cannot drift apart
   by one forgetting a rule the other has. Paper's whole content is
   the palette; it declares none of the effect variables below, and
   base.css falls back to `none` for each — which is the binary rule
   expressed structurally rather than by discipline.

   Selector is :root:not([data-theme="paper"]), not
   :root[data-theme="terminal"], so terminal is what you get with no
   attribute set at all — before the head script runs, and forever if
   JS never does.

   Colour from Figma 64:53 / 71:155.
══════════════════════════════════════════════════════════════════ */

:root:not([data-theme="paper"]){
  --bg:    #050a09;      /* Figma 64:53 / 71:155 */
  --fg:    #8dfffb;      /* Figma dir text, and the crest fill */
  --halo:  28,240,212;   /* #1cf0d4 — VFDraw's aqua tube glow */
  --weight: 500;         /* Doto Medium — Figma 1:1177 etc. */

  /* ── flicker ──────────────────────────────────────────────────
     Two banks. The crest is its own drive circuit (--b1); the tree,
     pane and divider share one (--b2) because a real VFD multiplexes
     by physical region, not per element. */
  --fx-crest: brightness(var(--b1));
  --fx-panel: brightness(var(--b2));

  /* Backlog #2 (2026-08-12): the full --b2 swing modulates LUMINANCE
     over a large filled area on a photo, where on text it's only ever
     modulating thin dot-matrix strokes — same depth reads as far more
     jarring on a photo than on the glyphs it was tuned for, to the
     point of a real nausea concern being raised. Damped, not removed:
     Sandy wants photos to still feel like they're on the same lit
     panel as everything else, just gentler.

     35% of the panel's full swing, computed from the SAME --b2 rather
     than a second independent driver — same phase, same beat, so a
     photo dims in step with the text around it instead of drifting
     out of sync with it.

     DIVIDED by --b2, not just scaled — and this half is the fix for a
     real bug the first version of this shipped with, not defensive
     styling. filter does not inherit like text-shadow; it composites
     the element's ENTIRE rendered subtree as a post-process. .pane
     already carries brightness(var(--b2)) — the panel's full swing —
     and every <img> renders inside it. So a naive
     brightness(1+(b2-1)*0.35) on the img doesn't REPLACE the parent's
     swing, it MULTIPLIES with it: the visible result was
     b2 × (1+(b2-1)×0.35), which is dominated by the parent's full,
     undamped b2 — indistinguishable from no damping at all, which is
     exactly what got reported back after shipping the first version.

     Dividing by b2 here cancels the parent's contribution algebraically
     so the two composite back down to the intended target:
       pane's b2  ×  (target / b2)  =  target
     where target = 1 + (b2-1) × 0.35, the actual 35%-damped value this
     was always meant to produce. b2 is bounded well away from 0 (stays
     in roughly 0.9–1.05 per MEASURED.depth=0.05 and grain=0.035), so
     the division is never near a singularity.

     prefers-reduced-motion still zeroes this for free — flicker.js
     never starts, --b2 stays at its default 1, and
     (1+(1-1)×0.35)/1 = 1 regardless. */
  --fx-panel-img: brightness(calc((1 + (var(--b2) - 1) * 0.35) / var(--b2)));

  /* ── glow ─────────────────────────────────────────────────────
     Crest: fitted against VFDraw's lossless glow export, then cut to
     35%. Percentages of the 200px box, so the halo scales with the
     crest rather than blooming when it shrinks into the tree. */
  --glow-crest:
    drop-shadow(0 0 calc(200px * .0379) rgba(var(--halo), .23))
    drop-shadow(0 0 calc(200px * .0867) rgba(var(--halo), .18));

  /* Text: NOT the old .13em/.23em numbers from the original "sandy
     pirouzi" text — those were fitted to Space Grotesk's ~1.8px stem
     at 20px, and this is Doto, a dot-matrix typeface. Measured Doto's
     actual dot: 14px wide rendered at 200px, i.e. 1.4px at 20px —
     about 22% thinner than assumed. Re-derived from that real number:
     1.4×1.4px=1.96px→0.10em, 2.5×1.4px=3.5px→0.18em. Alpha carries
     over unchanged at .35/.21 (the established 65%-cut intensity)
     because alpha is a property of the fitted curve's SHAPE, not of
     feature size.

     In em, which is why one declaration covers 22px tree rows and
     18px pane body alike — the ratio is to the glyph's own stroke,
     and Doto's stroke scales with type size. */
  --glow-text:
    0 0 0.10em rgba(var(--halo), .35),
    0 0 0.18em rgba(var(--halo), .21);

  /* Toggle: blur RE-DERIVED, not carried over — the icons are 1.125px
     strokes at 24px, not Doto's 1.4px dot, so the same ~1.4x/~2.5x
     ratios give 1.58px and 2.81px. The ALPHAS are the crest's .23/.18
     rather than the text's .35/.21 because this is a drop-shadow
     chain: those compound, where text-shadow layers each generate
     independently from the glyph and composite. Same fitted curve,
     different compositing maths. */
  --fx-toggle:
    brightness(var(--b2))
    drop-shadow(0 0 1.58px rgba(var(--halo), .23))
    drop-shadow(0 0 2.81px rgba(var(--halo), .18));
}
