@mkbabb/glass-ui 3.12.0 → 4.0.0

package/src/styles/tokens/color-radius.css

@@ -0,0 +1,287 @@
+/* tokens/color-radius.css
+   §4 radius reference · §5 warm-cream/muted-black palette · §5c constellation · §6 section palette · §6b viz basis.
+   Carved from the tokens.css cascade root; @import-ed by tokens.css in
+   cascade order. Same :root cascade context as its siblings. */
+:root {
+    /* §4  BORDER RADIUS — authored ONCE in theme.css's leading plain @theme
+       block (AV.W16 TW1). A plain @theme mints each `--radius-*` as a global
+       :root var, so the `var(--radius-card)` recipe reads across this file
+       resolve from that source. The prior §4 twin here doubled the override
+       surface (the anti-pattern the @theme-inline migration kills) — excised;
+       retune the scale at theme.css. */
+
+    /* ═══════════════════════════════════════════════
+       §5  COLOR PALETTE — Warm cream / muted black
+
+       Neutral scale: perceptually-uniform L* steps at hue 48 (warm paper).
+       Each pair visibly distinct at 20px viewing distance.
+           0 → 1  : 3 L   (page → soft field)
+           1 → 2  : 5 L   (soft field → chip / tab-inactive)
+           2 → 3  : 8 L   (chip → hover / highlight)
+           3 → 4  : 12 L  (highlight → subtle border)
+           4 → 5  : 25 L  (border → muted text, contrast jump)
+           5 → 6  : 10 L  (muted text → strong-muted text, secondary register)
+
+       Semantic aliases re-point into the scale — no back-compat shims.
+
+       BA.W-NO-GRAY — THE WARM-CHROMA FLOOR (R10-5 "No gray."). The ladder was
+       SPECIFIED warm (hue 48) but RESOLVED achromatic — at 6-10% sat across
+       L40-95 the painted OKLab chroma landed C 0.0055-0.0155 (below the ~0.020
+       perceptual gray floor) AND at hsl-48 the OKLab hue mapped to ~95° (a
+       yellow-green), NOT the warm-amber the --foreground ink carries (hsl-24 →
+       OKLab H≈56°). The fix is CHROMA-ONLY at constant L: warm the hue toward
+       the foreground register (hsl 28-34 → OKLab H 62-72°, warm MATERIAL not a
+       cast) AND lift the saturation off the gray floor. The L is unchanged (the
+       contrast contract — AA re-ratified, ±0.01 of HEAD). The mid/low-L rungs
+       clear the strong floor C≥0.020; the L90 chip is gamut-bound (it cannot
+       carry 0.020 at L90 without a visible cast — the triumvirate "tinted not
+       warm" trigger), so it lifts to a materially-warm C≈0.013 (~2.4× HEAD).
+       Machine-locked by proof:no-gray + tests-visual/no-gray.spec.ts. */
+    --neutral-0: hsl(40 30% 98%);   /* L 98 — page surface (warm-cream, KEEP-NEUTRAL surface) */
+    --neutral-1: hsl(38 26% 95%);   /* L 95 — soft field bg */
+    --neutral-2: hsl(34 28% 90%);   /* L 90 — chip / tab-inactive bg (warm, gamut-bound C≈0.013) */
+    --neutral-3: hsl(33 30% 82%);   /* L 82 — hover / highlight bg (warm, C≈0.025) */
+    --neutral-4: hsl(32 26% 70%);   /* L 70 — subtle border (warm, C≈0.036) */
+    --neutral-5: hsl(30 22% 40%);   /* L 40 — muted text (warm, C≈0.043; WCAG AA: 5.21:1 vs page / 4.90:1 vs muted) */
+    /* W7-α' (AK-FD1) — strong-muted text rung. One principled ladder step
+       (10 L darker, the 5→6 cadence above) past muted text toward
+       --foreground (L10). Sits at the 1/3 point of the L40→L10 muted→primary
+       gap: legible secondary text that reads less-faint than muted but not as
+       assertive as primary. By-COLOUR per the canon (a neutral step, not an
+       alpha mute). BA.W-NO-GRAY — re-saturated onto the warm identity in
+       lockstep with the ladder (hsl 28 24% — OKLab H 62°, C≈0.038, the warm
+       register; L held at 30). WCAG AA: 7.88:1 vs L98 page / 7.43:1 vs L95
+       muted (cf. neutral-5's 5.21:1) — comfortably above the 4.5:1 body floor. */
+    --neutral-6: hsl(28 24% 30%);   /* L 30 — strong-muted text (secondary register, warm) */
+
+    --background: var(--neutral-0);
+    --foreground: hsl(24 10% 10%);
+    /* BA.W-NO-GRAY L1 — the warm-bias glass PLATE. --card was `var(--neutral-0)`
+       (the near-achromatic L98 page, OKLab C 0.0017) — so every glass plate
+       (Card/Button/Toast/Popover/Dialog/Sheet, all --card-derived) composited a
+       flat gray slab over a flat backdrop (the G1/G8 defect, the user's "no gray
+       ... for cards, buttons"). Glass is TRANSMISSIVE — over a flat page there
+       is nothing behind to modulate, so the plate is its own near-neutral cream.
+       --card DECOUPLES from the page to a warm-cream value carrying a real OKLab
+       chroma (hsl 36 48% 97% → OKLab C 0.0062 at warm H 75°, L kept ~98 so the
+       page-card SURFACE read is byte-stable), so the plate reads WARM over ANY
+       backdrop — the plate floor (composited C ≥ 0.0035, ~2× HEAD) the gamut
+       allows a near-white translucent surface. The DARK --card is W-DARK-MATERIAL's
+       lifted hsl(24 8% 16%) (NOT re-warmed here — the dark register is its work).
+       Bounded: the cream family, never a tinted cast (the triumvirate bar). */
+    --card: hsl(36 48% 97%);
+    --card-foreground: var(--foreground);
+    --popover: var(--card);
+    --popover-foreground: var(--foreground);
+
+    /* R0G-5 (AO.W4) — warm-neutral public-data panel surface. One warmth step
+       off --card (hue 44 vs 48, +4 sat, −2 L) so a consumer's aurora-OFF
+       /dashboard/* surfaces read with the admin canon's warm-neutral chrome
+       instead of the colder bare card. Opaque surface (the --card family), not
+       a --surface-tint-* overlay. Consumer applies on /dashboard/* only. */
+    --surface-public-data-panel: hsl(44 16% 96%);
+
+    --muted: var(--neutral-1);
+    --muted-foreground: var(--neutral-5);
+    /* W7-α' (AK-FD1) — one rung less-faint than --muted-foreground for
+       secondary text that reads too-faint at the muted rung over resting
+       glass (CardDescription). By-colour neutral step, not alpha. */
+    --muted-foreground-strong: var(--neutral-6);
+    --secondary: var(--neutral-2);
+    --secondary-foreground: var(--foreground);
+    --accent: var(--neutral-3);
+    --accent-foreground: var(--foreground);
+
+    --border: var(--neutral-4);
+    --input: var(--neutral-4);
+
+    --primary: hsl(24 10% 10%);
+    --primary-foreground: var(--neutral-0);
+    --destructive: hsl(0 72% 50%);
+    --destructive-foreground: var(--neutral-0);
+    --ring: hsl(24 10% 10%);
+    --shadow: hsl(24 10% 10%);
+    --shadow-color: var(--foreground);
+
+    /* AQ.W2 §4 — native-control accent. `accent-color` is an inherited
+       built-in <color>, so per the §2b resolve-late discipline it reads a
+       dedicated UNREGISTERED token set per-mode (NOT light-dark()) and is
+       re-specified inside `.dark` — otherwise the accent freezes to the
+       light shade at the cascade root. Light: muted-black checkmarks /
+       sliders on warm cream. Dark arm (`.dark`) reads `--ring` (mid-tone),
+       not the near-white dark `--primary`, so a checkbox's white checkmark
+       keeps contrast headroom (accent-color.md §5). */
+    --accent-color: var(--primary);
+
+    /* Border hairline at whisper alpha — the canonical rung for
+       section-spine / panel-edge hairlines a consumer wants to read as an
+       iOS-26 whisper rather than a hard rule. Consumers compose this named
+       rung instead of hand-mixing `color-mix(... var(--border) ...)`
+       per-site (token-first). 45% is the canonical whisper. Auto-dark via
+       `--border` (which is `var(--neutral-4)`, light-dark()-resolved). */
+    --border-soft: color-mix(in srgb, var(--border) 45%, transparent);
+
+    /* AQ.W3 §W3.4 — tokenized scrollbar thumb + track. Minted in the color
+       block so the `scrollbar-color` / `::-webkit-scrollbar-thumb` rungs read a
+       single source. Auto-dark via `--muted-foreground` (light-dark()-resolved,
+       AQ.W2) — the OS scrollbar chrome also honors `color-scheme: dark`, so the
+       custom thumb tracks the dark surface without an explicit dark mirror. The
+       thumb α (25%) matches the prior inline `.scrollbar-thin` value byte-for-
+       byte; `transparent` track keeps the scroll-pane glass reading through. */
+    --scrollbar-thumb: color-mix(in srgb, var(--muted-foreground) 25%, transparent);
+    --scrollbar-track: transparent;
+
+    /* Foreground-tint rungs — canonical handles for the 36+ raw
+       `color-mix(in srgb, var(--foreground) N%, transparent)` sites surveyed
+       in R5 axis-1. Each rung's α is named in its key (4 → 4%, 22 → 22%).
+       Auto-dark via --foreground; no explicit dark mirrors needed. R5
+       vocab.γ gap row 1. Consumers land in W2.B + W3.C. */
+    --surface-tint-4:  color-mix(in srgb, var(--foreground)  4%, transparent);
+    --surface-tint-6:  color-mix(in srgb, var(--foreground)  6%, transparent);
+    --surface-tint-8:  color-mix(in srgb, var(--foreground)  8%, transparent);
+    --surface-tint-10: color-mix(in srgb, var(--foreground) 10%, transparent);
+    --surface-tint-12: color-mix(in srgb, var(--foreground) 12%, transparent);
+    --surface-tint-15: color-mix(in srgb, var(--foreground) 15%, transparent);
+    --surface-tint-18: color-mix(in srgb, var(--foreground) 18%, transparent);
+    --surface-tint-22: color-mix(in srgb, var(--foreground) 22%, transparent);
+    --surface-tint-25: color-mix(in srgb, var(--foreground) 25%, transparent);
+    /* Higher-α rungs added at L.W5 (absorbs K R4 — 4 P1 sites whose
+       literal `color-mix(in srgb, var(--foreground) {35,40,70}%, transparent)`
+       expressions bypassed the canonical token family). See `docs/tranches/L/
+       audit/W5-A-doc-cohort-proof.md`. */
+    --surface-tint-35: color-mix(in srgb, var(--foreground) 35%, transparent);
+    --surface-tint-40: color-mix(in srgb, var(--foreground) 40%, transparent);
+    --surface-tint-70: color-mix(in srgb, var(--foreground) 70%, transparent);
+
+    /* Muted-tinted surface rungs — canonical handles for the 9 raw
+       `color-mix(in srgb, var(--muted) N%, transparent)` sites in
+       FuzzySearch / SegmentedTabs / Slider scoped CSS. (AI.W5-δ — the
+       ProgressiveSidebar consumer retired at the wave; the canonical token
+       rung lives on for the remaining consumers.) Auto-dark via --muted.
+       R5 vocab.γ axis-1 row. */
+    --muted-soft:   color-mix(in srgb, var(--muted) 30%, transparent);
+    --muted-medium: color-mix(in srgb, var(--muted) 50%, transparent);
+
+    /* ═══════════════════════════════════════════════
+       §5c CONSTELLATION — Canvas2D proximity-graph lattice (AX.W17)
+
+       The H.W4 legibility intelligence promoted from the slides deck to
+       LIBRARY identity: the node tones, the edge hairline color, the per-mode
+       edge-alpha multipliers, and the field-yields-to-type translucency knob.
+       Only `--constellation-accent` (the anomaly tint) stays a CONSUMER preset
+       (slides aliases it to `--ncsu-red`); the library ships a neutral default.
+
+       PLAIN-hsl LITERALS, per arm — NEVER `light-dark()` and NEVER a
+       `var(--neutral-*)`/`var(--foreground)`/`var(--border)`/`var(--card)`
+       alias. Canvas2D silently REJECTS a `light-dark()` value into
+       `strokeStyle`/`fillStyle` (the W30 86.3%-red-splatter cardinal defect),
+       and the rejection is identical whether the value is a literal
+       `light-dark(…)` OR a `var()` that RESOLVES to one — so the constellation
+       tokens are plain-hsl LEAVES, the `:root` vs `.dark` cascade carrying two
+       literals. `proof:constellation-tokens` clause (c) machine-locks this
+       (the no-`light-dark(`-substring NOR transitive-`var()` static assertion).
+       ═══════════════════════════════════════════════ */
+    /* Node tones — readable on the warm-cream ground. The two-tone split (the
+       `dim` half rides `-node-dim`). Warm-grey ink, NOT a neutral-ladder alias. */
+    --constellation-node:      hsl(36 8% 46%);
+    --constellation-node-dim:  hsl(36 8% 60%);
+    /* Edge hairline stroke — warm near-black on cream (the plain-hsl complement
+       the slides deck reads to fix the `--foreground` light-dark() leak). */
+    --constellation-line:      hsl(24 14% 14%);
+    /* Anomaly tint — NEUTRAL library default (a desaturated warm accent). The
+       consumer overrides this (slides → `--ncsu-red`); the library does NOT
+       bake a brand hue. This is the single consumer-preset boundary. */
+    --constellation-accent:    hsl(18 58% 46%);
+    /* Edge-alpha multipliers — replace the magic `0.17` hairline / pointer-web
+       literals. The cream ground lifts the node tones, so the field can recede;
+       the focus-proximity edge reads a touch stronger. */
+    --constellation-edge-alpha:          0.22;
+    --constellation-edge-focus-alpha:  0.34;
+    /* §7 field-yields-to-type translucency knob — the legible-but-RECESSIVE
+       MIDPOINT, NOT max-legibility. On cream the node tones already read, so the
+       field recedes further: BELOW the slides 0.92 max-legibility reference. */
+    --constellation-alpha:               0.80;
+    /* ACCENT-edge skin weights (AZ.W-CON-GEN G3) — the flagged-node EDGE legibility
+       set the optional `drawEdges(…, accentIndex)` pass reads. `--constellation-accent`
+       (above) is the edge TINT; `-edge-floor` is the neutral-edge alpha MINIMUM so a
+       distance-faded hairline clears the perceptual floor on a bright ground (default
+       0 → byte-identical, the consumer lifts it on a very-light backdrop);
+       `-edge-accent-alpha` is the accent-incident edge multiplier (the flagged-node
+       tether reads a touch louder than the neutral lattice). Mode-arm where they
+       differ — the dark arm carries its own (dark-arm.css §5c). */
+    --constellation-edge-floor:          0;
+    --constellation-edge-accent-alpha:   0.30;
+
+    /* §interaction — the warp spring + the gravity-well tunings (NUMERIC, NOT
+       colors — read ONCE on mount via parseFloat, never reach a Canvas2D
+       fillStyle, so immune to the W30 light-dark()/Canvas2D leak; AY.W-CON2).
+       Mode-INVARIANT, declared ONCE in :root (the .dark arm needs no numeric
+       re-declare — a per-mode value SPLIT is what proof:constellation-tokens
+       clause (c) flags, and these tunings are identical in both modes).
+       `--constellation-warp-response` is the keyframes.js ANGULAR PERIOD (the
+       SwiftUI .spring(response:) axis), NOT a settle-duration — at ζ=1 the 2%
+       settle lands at t₂ ≈ 5.83/ω₀ ≈ 0.93·response (the engine keeps the
+       keyframes.js ω₀ = 2π/response convention, mints no second ω). */
+    --constellation-warp-response:    0.55;   /* s — keyframes.js angular period (NOT a settle) */
+    --constellation-warp-zeta:        1.0;    /* critically damped — a focal mark must NOT ring */
+    --constellation-well-gain:        14000;  /* inverse-square force scale (the held-pull gain) */
+    --constellation-well-reach:       340;    /* base-width px — the well's reach (k-scaled at step) */
+    --constellation-well-ramp:        4.0;    /* 1/s — the ARM rate (≈0.25s bloom; release is the fixed brisk WELL_RELEASE_RAMP — the field-cools invariant, not consumer-tunable) */
+    --constellation-well-max-speed:   4.0;    /* base-width px/frame cap — the no-slingshot clamp */
+    --constellation-well-hold-ms:     140;    /* ms hold before the well arms */
+    --constellation-wander-idle:      8000;   /* ms — min idle between auto re-targets (the W-CON1 drift cadence) */
+    --constellation-wander-jitter:    8000;   /* ms — random extra idle per cadence (so the rhythm is not metronomic) */
+
+    /* ═══════════════════════════════════════════════
+       §6  SECTION PALETTE — 13-stop jewel tones (light)
+       ═══════════════════════════════════════════════ */
+    /* AV.W16 TW2 — oklch ramp (perceptually-even L; hue preserved from the
+       prior hsl() cadence). Categorical jewel tones — distinct hues, not a
+       monotone scale. Authored as oklch pairs with the .dark mirror. */
+    --section-color-0:  oklch(0.552 0.192 359.8);  /* rose       */
+    --section-color-1:  oklch(0.502 0.165 305.9);  /* purple     */
+    --section-color-2:  oklch(0.484 0.163 265.5);  /* indigo     */
+    --section-color-3:  oklch(0.542 0.089 222.8);  /* teal-cyan  */
+    --section-color-4:  oklch(0.551 0.088 171.1);  /* forest     */
+    --section-color-5:  oklch(0.623 0.124 69.6);   /* amber      */
+    --section-color-6:  oklch(0.579 0.201 30.4);   /* tomato-red */
+    --section-color-7:  oklch(0.532 0.180 317.5);  /* violet     */
+    --section-color-8:  oklch(0.520 0.176 8.4);    /* ruby       */
+    --section-color-9:  oklch(0.492 0.038 239.6);  /* slate-blue */
+    --section-color-10: oklch(0.556 0.103 128.8);  /* olive      */
+    --section-color-11: oklch(0.601 0.092 208.0);  /* ocean      */
+    --section-color-12: oklch(0.513 0.163 291.9);  /* periwinkle */
+
+    /* Accent colors */
+    --accent-pink: oklch(0.613 0.197 353.8);
+    --section-heading: oklch(0.545 0.189 352.8);
+    --accent-red: oklch(0.574 0.216 27.5);
+
+    /* ═══════════════════════════════════════════════
+       §6b VIZ BASIS — core brand hues
+       ═══════════════════════════════════════════════ */
+    --viz-fourier:   oklch(0.579 0.201 30.4);
+    --viz-chebyshev: oklch(0.484 0.163 265.5);
+    --viz-legendre:  oklch(0.532 0.180 317.5);
+    --viz-amber:     var(--section-color-5);
+    --viz-green:     var(--section-color-4);
+
+    /* Semantic UI accents */
+    --tier-featured: oklch(0.841 0.173 84.2);
+    --tier-saved:    oklch(0.676 0.176 252.3);
+    --like:          oklch(0.633 0.200 24.9);
+    --success:       oklch(0.720 0.192 149.5);
+    --warning:       oklch(0.770 0.165 70.6);
+    --info:          oklch(0.626 0.186 259.6);
+    --delete:        oklch(0.597 0.198 25.5);
+
+    /* Semantic foregrounds — text/glyph atop --success/--warning/--info plates.
+       Notification.vue currently hardcodes `text-white`/`text-foreground`
+       inline; W2 migrates consumers to read these tokens. Warning carries a
+       dark glyph because the amber plate is too luminous for white. R5
+       vocab.γ gap row 4. */
+    --success-foreground: var(--neutral-0);
+    --warning-foreground: hsl(24 10% 10%);
+    --info-foreground:    var(--neutral-0);
+
+}

package/src/styles/tokens/dark-arm.css

@@ -0,0 +1,308 @@
+/* tokens/dark-arm.css
+   The .dark {} dark-mode re-resolution (foreground / shadow-color / section-palette / constellation dark arm). After light-dark.css (the non-light-dark() fallback floor).
+   Carved from the tokens.css cascade root; @import-ed by tokens.css in
+   cascade order. Same :root cascade context as its siblings. */
+
+/* ═══════════════════════════════════════════════
+   DARK MODE — warm dark, section palette brightened ~20% L
+
+   FALLBACK FLOOR (AQ.W2 §2c): this class block is the SOLE non-light-dark()
+   dark path. On a `light-dark()`-supporting engine with `.dark` present,
+   `.dark { color-scheme: dark }` (§1) makes every §-1b token resolve to its
+   dark arm and these explicit dark values agree with it (kept as the floor
+   for non-supporting engines). The pure `var()`-alias re-declarations
+   (`--muted`/`--secondary`/`--accent`/`--border`/`--input`/… and the
+   `--background`/`*-foreground` aliases) are DELETED — they auto-track the
+   `--neutral-*` ladder + `--foreground` resolved above; only EXPLICIT-color
+   dark values (and the non-color overrides §2d) stay.
+   ═══════════════════════════════════════════════ */
+.dark {
+    /* §1 — hard-pin native chrome to dark regardless of OS preference. §4 —
+       re-specify the inherited `accent-color` so it re-resolves to the dark
+       arm (§2b: an inherited built-in <color> set at `:root` would freeze to
+       the light shade without this re-specification). */
+    color-scheme: dark;
+    accent-color: var(--accent-color);
+
+    /* Neutral scale mirrors light-mode pattern: step UP from the background's
+       low L toward foreground. Same perceptual deltas as light. FALLBACK
+       FLOOR — kept verbatim for non-light-dark() engines (§2c); on a
+       supporting engine `color-scheme: dark` (above) drives the §-1b
+       light-dark() arms and these agree. */
+    /* BA.W-DARK-MATERIAL scope 1 — the luminous-dark elevation widen. The page floor
+       deepens (L6→L4, +1 warmth-sat) and the --card plate LIFTS (L10→L16, below) so the
+       page↔card gap goes from the HEAD 4-L collapse (card/page relL ≈ 2.0×, a 0.003-luma
+       band) to a real iOS/Material dark elevation step (card/page relL ≈ 5×, the five glass
+       rungs composite into a perceptible ladder). LOCKSTEP with light-dark.css:70/80.
+       BA.W-NO-GRAY — the WARM-CHROMA FLOOR dark arm, in LOCKSTEP with light-dark.css. The
+       dark neutrals warm off the achromatic hsl-24/48 onto the warm identity (hsl 28-36,
+       OKLab C off the gray floor on the NEW dark base — chip→border C 0.0138-0.0286, muted-fg
+       C 0.0255). The --neutral-0 page (hsl 24 9% 4%) is W-DARK-MATERIAL's luminance floor —
+       KEEP (chroma-only on the rungs above it). L held — the dark AA contract preserved. */
+    --neutral-0: hsl(24 9% 4%);    /* L 4  — page surface (dark, deepened — W-DARK-MATERIAL) */
+    --neutral-1: hsl(28 12% 11%);  /* L 11 — soft field (warm) */
+    --neutral-2: hsl(28 14% 16%);  /* L 16 — chip / tab-inactive (warm, C≈0.014) */
+    --neutral-3: hsl(30 18% 22%);  /* L 22 — hover / highlight (warm, C≈0.022) */
+    --neutral-4: hsl(30 16% 34%);  /* L 34 — subtle border (warm, C≈0.029) */
+    --neutral-5: hsl(34 14% 62%);  /* L 62 — muted text (warm, C≈0.026; WCAG AA: 7.64:1 vs page) */
+    /* W7-α' (AK-FD1) — strong-muted text. Same principled ladder step as
+       light, mirrored: 10 L LIGHTER than muted (62→72) toward --foreground
+       (L90), the 1/3 point of the L62→L90 muted→primary gap. By-colour.
+       BA.W-NO-GRAY — re-saturated onto the warm identity (hsl 36 14% — OKLab
+       C≈0.019, warm). WCAG AA: 10.29:1 vs L4 page (cf. neutral-5's 7.64:1). */
+    --neutral-6: hsl(36 14% 72%);  /* L 72 — strong-muted text (secondary register, warm) */
+
+    /* --background / --card-foreground / --popover-foreground / --muted /
+       --muted-foreground{,-strong} / --secondary{,-foreground} /
+       --accent{,-foreground} / --border / --input are pure var()-aliases —
+       DELETED here (AQ.W2 §2a): they auto-track the --neutral-* ladder +
+       --foreground above. Re-declaring them would be redundant. */
+    --foreground: hsl(48 10% 90%);
+    /* BA.W-DARK-MATERIAL scope 1 — the --card plate LIFTS L10→L16 (a warm-dark elevated
+       surface, macOS-window territory) so it sits ~5× the deepened L4 page relL — a
+       clearly distinct surface the five glass rungs ladder up from. LOCKSTEP light-dark.css:80. */
+    --card: hsl(24 8% 16%);
+    --popover: hsl(24 8% 16%);
+
+    /* R0G-5 (AO.W4) — dark mirror of the warm-neutral public-data panel.
+       --card's dark hsl(24 8% 16%) nudged one warmth step toward amber
+       (24→36) + +1 sat + +2 L so the dark dashboard panel lifts off the page.
+       BA.W-DARK-MATERIAL — re-anchored L12→L18 to stay ABOVE the lifted L16 card
+       (LOCKSTEP light-dark.css:82). */
+    --surface-public-data-panel: hsl(36 9% 18%);
+
+    /* BA.W-DARK-MATERIAL scope 4 — the chromatic dark --primary. HEAD was an achromatic
+       cream hsl(48 10% 90%) (oklab chroma ≈ 0.005 — every filled/active/selected control
+       painted a flat pale-grey slab). Re-anchored onto the legendre-violet house identity
+       hue (--section-color-7 / --viz-legendre's oklch register — a LIBRARY-identity chroma,
+       NOT a borrowed demo preset), oklab chroma 0.134. The dark ink --primary-foreground
+       stays hsl(24 10% 10%): 7.15:1 over the violet (clears the 4.5 text + 3.0 graphic
+       floors). Critical now the disco/audacious texture retires (R8-18) — the accent's
+       COLOR carries the identity. LOCKSTEP light-dark.css:84. */
+    --primary: oklch(0.739 0.134 318.1);
+    --primary-foreground: hsl(24 10% 10%);
+    /* AX.W44 — the `.dark` class fallback floor, in LOCKSTEP with the light-dark()
+       enhancement arm above (§2c). Same lifted `hsl(0 80% 60%)` so a
+       @supports-split engine and a class-toggle engine paint the SAME dark red
+       (4.60:1 as ink over --card / 5.03:1 as a plate vs page). */
+    --destructive: hsl(0 80% 60%);
+    --destructive-foreground: hsl(48 10% 90%);
+    --ring: hsl(48 10% 70%);
+    --shadow: hsl(0 0% 5%);
+
+    /* Section palette — brightened for dark backgrounds (oklch; AV.W16 TW2 —
+       mirrors the light-dark() dark halves above; hue preserved) */
+    --section-color-0:  oklch(0.721 0.145 354.0);
+    --section-color-1:  oklch(0.733 0.113 308.2);
+    --section-color-2:  oklch(0.718 0.107 268.4);
+    --section-color-3:  oklch(0.767 0.091 219.9);
+    --section-color-4:  oklch(0.776 0.105 172.6);
+    --section-color-5:  oklch(0.813 0.109 78.2);
+    --section-color-6:  oklch(0.693 0.151 28.1);
+    --section-color-7:  oklch(0.739 0.134 318.1);
+    --section-color-8:  oklch(0.709 0.142 2.3);
+    --section-color-9:  oklch(0.763 0.032 239.0);
+    --section-color-10: oklch(0.794 0.116 127.9);
+    --section-color-11: oklch(0.805 0.095 206.7);
+    --section-color-12: oklch(0.719 0.115 295.6);
+
+    --accent-pink: oklch(0.683 0.131 354.7);
+    --section-heading: oklch(0.711 0.123 349.3);
+    --accent-red: oklch(0.644 0.165 22.9);
+
+    --viz-fourier:   oklch(0.693 0.151 28.1);
+    --viz-chebyshev: oklch(0.718 0.107 268.4);
+    --viz-legendre:  oklch(0.739 0.134 318.1);
+
+    /* BA.W-CONFIG-CHASSIS.1 (CFG-4) — the `.dark` class fallback floor for the
+       configurator divider register, in LOCKSTEP with the `light-dark()`
+       enhancement arm minted in offsets-sizing.css (the dark halves). A
+       @supports-split engine (no `light-dark()`) and a class-toggle engine paint
+       the SAME lifted divider: off the L34 `--border` (too close to the L16
+       glass plate) toward the L90 `--foreground` warm-ink so a visible luminance
+       step survives the dark glass-floating surface. The SECTION divider runs
+       heavier than the inter-row hairline; the faint section tonal step is the
+       3% foreground wash. */
+    --configurator-divider: color-mix(in srgb, var(--foreground) 22%, transparent);
+    --configurator-divider-section: color-mix(in srgb, var(--foreground) 30%, transparent);
+    --configurator-section-tint: color-mix(in srgb, var(--foreground) 3%, transparent);
+    /* --viz-amber / --viz-green / --meter-track-stroke are pure var()-aliases
+       (→ --section-color-5/-4 / --foreground) — DELETED (§2a); they auto-track
+       their sources, which convert via §-1b. */
+
+    /* O.W6 Lane D — WCAG companion labels lift to L≈0.85 against the
+       deep dark canvas; same two-token discipline as light mode (canvas
+       hue preserved at `--chart-*`; only the label register shifts). */
+    --chart-ping-label:     oklch(0.85 0.12 230);
+    --chart-download-label: oklch(0.85 0.14 22);
+    --chart-upload-label:   oklch(0.85 0.12 55);
+    --chart-jitter-label:   oklch(0.85 0.14 305);
+
+    --tier-featured: oklch(0.867 0.165 88.7);
+    --tier-saved:    oklch(0.748 0.135 250.1);
+    --like:          oklch(0.690 0.162 22.2);
+    --success:       oklch(0.805 0.186 151.6);
+    --warning:       oklch(0.809 0.150 76.6);
+    --info:          oklch(0.713 0.138 259.5);
+    --delete:        oklch(0.644 0.170 23.1);
+
+    /* Semantic foregrounds — off-white over dark plates. Mirrors the
+       `--destructive-foreground` dark pattern (hsl 48 10% 90%). The warning
+       glyph stays dark-on-amber; the dark amber rung is luminous enough that
+       a darker glyph still reads (matches light-mode behaviour). */
+    --success-foreground: hsl(48 10% 96%);
+    --warning-foreground: hsl(24 10% 10%);
+    --info-foreground:    hsl(48 10% 96%);
+
+    --shadow-cartoon:       3px 3px 0px 0px color-mix(in srgb, var(--foreground) 6%, transparent);
+    --shadow-cartoon-hover: 4px 4px 0px 0px color-mix(in srgb, var(--foreground) 8%, transparent);
+    --shadow-soft:     0 4px 12px rgba(0, 0, 0, 0.3);
+    --shadow-elevated: 0 8px 24px rgba(0, 0, 0, 0.35);
+    --shadow-modal:
+        4px 4px 0px 0px color-mix(in srgb, var(--foreground) 6%, transparent),
+        0 24px 64px color-mix(in srgb, var(--foreground) 18%, transparent);
+
+    --shadow-cartoon-color:            rgb(255 255 255 / 0.07);
+    --shadow-cartoon-color-soft:       rgb(255 255 255 / 0.03);
+
+    /* §5c CONSTELLATION — dark arm (AX.W17). The H.W4 dark-mode lift: the node
+       tones step UP off the ink ground (the light arm's mid-grey would vanish on
+       L6 black), the hairline goes warm off-white, the field carries a touch more
+       presence to read at all. PLAIN-hsl literals, NEVER light-dark()/var(). */
+    --constellation-node:      hsl(42 9% 72%);
+    --constellation-node-dim:  hsl(42 8% 56%);
+    --constellation-line:      hsl(45 12% 86%);
+    /* Anomaly — brightened for the deep canvas (same neutral-default register;
+       the consumer still overrides to its brand). */
+    --constellation-accent:    hsl(20 70% 60%);
+    /* The dark hairlines lift harder over the ink ground, so the edge multipliers
+       run a touch lower than light to keep the field recessive. */
+    --constellation-edge-alpha:          0.20;
+    --constellation-edge-focus-alpha:  0.32;
+    /* §7 — the ink ground needs MORE field presence than cream to read at all, so
+       the dark alpha is modestly HIGHER than the light arm — but still BELOW the
+       slides 1.0 max-legibility reference (the recessive midpoint, not 1.0). */
+    --constellation-alpha:               0.88;
+    /* ACCENT-edge skin — dark arm (AZ.W-CON-GEN G3). The floor stays 0 (the dark
+       ground already lifts the hairlines, so no perceptual-floor lift is needed); the
+       accent-incident multiplier runs a touch louder on the deeper ground so the
+       flagged-node tether reads (the 0.34 dark reference). */
+    --constellation-edge-floor:          0;
+    --constellation-edge-accent-alpha:   0.34;
+
+    /* Glass opacity + grain for dark — five-tier ladder, alpha-monotonic.
+       Each rung lifts ~0.08 from its light counterpart so the dark surfaces
+       carry comparable read-weight against the deeper canvas. */
+    --glass-opacity-wash:     0.38;
+    --glass-opacity-quiet:    0.58;
+    --glass-opacity-resting:  0.72;
+    --glass-opacity-floating: 0.88;
+    --glass-opacity-overlay:  0.96;
+    --glass-opacity-chassis:  0.36;
+    --glass-grain-opacity: 0.045;
+    --glass-highlight: inset 0 0.5px 0 0 hsl(0 0% 100% / 0.08);
+
+    /* BA.W-DARK-MATERIAL scope 2 — dark glass is TRANSMISSIVE. The dark rung
+       backdrop-filter carries a saturate/brightness LUMINOSITY LIFT (the iOS-dark
+       "dark glass glows where light passes" model) so a backdrop GLOWS through the
+       plate instead of dying behind it. The light arm sits at saturate(1.05) — over a
+       near-black canvas that reads as no transmission; the dark arm lifts it so the
+       aurora/page behind reads with chroma + a glow. The blur() RADIUS is the
+       light-arm primitive UNTOUCHED (W-GLASS-CAL owns the radius dial-back) — only the
+       saturate/brightness COMPANIONS lift here. The lower rungs lift more (they're
+       thinner, the backdrop carries the read); the heavy overlay lifts least. */
+    --glass-blur-wash:     blur(calc(var(--glass-blur-wash-radius) * var(--glass-level))) saturate(1.35) brightness(1.18);
+    --glass-blur-quiet:    blur(calc(var(--glass-blur-quiet-radius) * var(--glass-level))) saturate(1.35) brightness(1.16);
+    --glass-blur-resting:  blur(calc(var(--glass-blur-resting-radius) * var(--glass-level))) saturate(1.30) brightness(1.14);
+    --glass-blur-floating: blur(calc(var(--glass-blur-floating-radius) * var(--glass-level))) saturate(1.28) brightness(1.10);
+    --glass-blur-overlay:  blur(calc(var(--glass-blur-overlay-radius) * var(--glass-level))) saturate(1.22) brightness(1.06);
+    --glass-blur-dock:     blur(calc(var(--glass-blur-dock-radius) * var(--glass-level))) saturate(1.30) brightness(1.12);
+
+    /* BA.W-DARK-MATERIAL scope 3 — the dark arm of the adaptive --glass-tint-* seam (the
+       SAME seam, NO third fork). The W55 self-engage block (glass/ladder.css) re-points
+       --glass-tint-source → --glass-tint-ink at --glass-tint-strength-aa. In LIGHT that is
+       a darken-over-bright; in DARK --glass-tint-ink resolves the light-cream --foreground,
+       so the SAME re-point becomes a gentle LIFT toward a luminous translucent dark (the
+       MIRROR of the light darken — the plate lifts OFF the deep page rather than dying into
+       it). HEAD applied the light 20% strength in dark too (the wrong-direction over-wash —
+       it flattened the silhouette toward cream). The dark arm re-declares the BOUNDED
+       strength to a gentle luminous-dark lift (12%) — over-light's 20% is a light-mode
+       concern (the bright bucket never engages in dark — there is no white backdrop). The
+       --glass-tint-ink token stays var(--foreground) (the light cream is the correct LIFT
+       ink in dark); only the STRENGTH re-tunes. The unconditional content-tier floor
+       (--glass-tint-strength-floor, light-mode-calm) is NOT re-declared here — in dark the
+       self-engage uses the AA arm directly (the luminous-dark lift is the desired default,
+       not a sub-perceptual silhouette). */
+    --glass-tint-strength-aa: 12%;
+    /* The unconditional content-tier self-engage (glass/ladder.css) reads
+       --glass-tint-strength-floor. In LIGHT that is the 4% sub-perceptual silhouette (the
+       calm-light card stays warm); in DARK the content tiers WANT the full luminous-dark
+       lift as the default (the plate lifts off the deep page — the desired register, not a
+       sub-perceptual edge), so the floor re-resolves to the AA lift here. ONE token, two
+       mode arms — the content-tier self-engage needs no mode branch. */
+    --glass-tint-strength-floor: 12%;
+
+    /* BA.W-DARK-MATERIAL scope 5 — the --surface-tint-* dark arm. The light family is
+       color-mix(in srgb, var(--foreground) N%, transparent) — over a near-black dark card
+       a LIGHT-ink (dark --foreground IS light cream) tint composites to near-black: the
+       9-rung chip/hairline/divider scale is INVISIBLE in dark. The dark arm KEEPS the
+       in-srgb space (the AW.W26 fence — NEVER oklab) but re-anchors the mix ink to a
+       BRIGHTER warm off-white so a chip/hairline LIFTS off the deep card (the inverse
+       intent of light's dark-ink tint). This re-resolves every --surface-tint-* consumer
+       (chip backplates, the dock-rail divider, the spine, the timeline dot) in lockstep,
+       zero per-site edit. The brighter ink is a near-white warm (hsl(48 12% 96%)) so the
+       higher rungs read as genuine hairlines on the L16 card. */
+    --surface-tint-4:  color-mix(in srgb, hsl(48 12% 96%)  4%, transparent);
+    --surface-tint-6:  color-mix(in srgb, hsl(48 12% 96%)  6%, transparent);
+    --surface-tint-8:  color-mix(in srgb, hsl(48 12% 96%)  8%, transparent);
+    --surface-tint-10: color-mix(in srgb, hsl(48 12% 96%) 10%, transparent);
+    --surface-tint-12: color-mix(in srgb, hsl(48 12% 96%) 12%, transparent);
+    --surface-tint-15: color-mix(in srgb, hsl(48 12% 96%) 15%, transparent);
+    --surface-tint-18: color-mix(in srgb, hsl(48 12% 96%) 18%, transparent);
+    --surface-tint-22: color-mix(in srgb, hsl(48 12% 96%) 22%, transparent);
+    --surface-tint-25: color-mix(in srgb, hsl(48 12% 96%) 25%, transparent);
+    --surface-tint-35: color-mix(in srgb, hsl(48 12% 96%) 35%, transparent);
+    --surface-tint-40: color-mix(in srgb, hsl(48 12% 96%) 40%, transparent);
+    --surface-tint-70: color-mix(in srgb, hsl(48 12% 96%) 70%, transparent);
+
+    /* Hairline-accent dark mirror — see light counterpart at line ~404. */
+    --hairline-catch-light: inset 0 0.5px 0 0 rgb(255 255 255 / 0.05);
+    --hairline-under-shadow: 0 0.5px 0 0 rgb(0 0 0 / 0.06);
+
+    /* Specular + curvature — softened for dark backdrops. Disco-grain stays
+       at the same opacity ceiling; the dark grain blend already lifts it. */
+    --glass-specular: inset 0 1.5px 0 0 hsl(0 0% 100% / 0.30);
+    /* AV.W15 M3 — the full-perimeter rim remaps to its dark weight inside
+       `.dark` (mirroring the `--glass-specular` remap above). The lit token
+       resolves to the `-dark` alpha on the deeper canvas. */
+    --glass-edge-light: var(--glass-edge-light-dark);
+
+    /* AW.W23 — the chromatic-fringe + adaptive-tint dark arm. The fringe drops
+       to a lower-luminance warm/cool pair on the deep canvas; `--glass-tint-
+       source` auto-flips with `--card` (no override needed — the default already
+       resolves the dark card). */
+    --glass-fringe-warm: oklch(0.78 0.07 40 / 0.18);
+    --glass-fringe-cool: oklch(0.74 0.06 230 / 0.14);
+    /* AX.W52 D19 — the curvature sheen is genuinely SOFTER on the deep canvas (the
+       prior dark arm re-declared the overlay BYTE-IDENTICAL to light, so it read
+       HARDER over the dark substrate — an unsoftened-dark defect). The `:root`
+       `--glass-curvature-overlay` already reads `var(--glass-curvature-intensity)`,
+       so lowering just the intensity here re-resolves the SAME warm-cream recipe at
+       a softer alpha — no byte-identical re-declaration. */
+    --glass-curvature-intensity: 0.012;
+
+    /* Gold — boosted for dark (oklch; AV.W16 TW2) */
+    --gold: oklch(0.784 0.143 86.0);
+    --gold-light: oklch(0.898 0.182 97.4);
+    --gold-dark: oklch(0.678 0.150 63.8);
+
+    /* Silver — lifted for dark (BA.W-ATLAS-RECONCILE C-3; mirrors gold's dark
+       arm: the polished metal lifts ~+0.03 L so the structure register reads on
+       the deep canvas. `--silver-deep` is mode-invariant — NOT re-declared here,
+       exactly as `--gold-deep` is omitted from this dark block). The cool hue
+       holds; the chroma stays near-achromatic. */
+    --silver: oklch(0.792 0.012 255);
+    --silver-light: oklch(0.912 0.010 255);
+    --silver-dark: oklch(0.648 0.014 255);
+}
+