/* =========================================================================
   spectral-state.css — Spectral State

   A semantic state-color system: a small, identity-free vocabulary of eight STATE
   roles — seven sparse neon state signals on a 12-step wheel, plus a neutral role
   that resolves to the theme foreground — calibrated per theme.

   SPECIALIZED, OPT-IN foundation primitive. It is for surfaces that encode the
   *state* of architectural elements — e.g. an interactive state diagram where a
   node's color says "this is earned / held / deflated". It is NOT general UI
   color, and it is NOT used by the static diagram scaffolds (`diagram-static-H`,
   `diagram-static-V`), which are structural and assert no state.

   Layer this ON TOP of `colors_and_type.css` — it relies on that file's theme
   resolution (`[data-theme]` + `prefers-color-scheme`) and its `--fg-*` tokens.
   Offline; no CDN.

   STATUS: v1.1 — restructured after first-consumer proving. The eight-role
   vocabulary and the wheel-as-resource concept were validated in a real surface
   (asset-pipeline-ASK's interactive IA state spine, which exercised all eight
   roles by reference). That proving surfaced a category error: `proposed` is a
   POTENTIALITY, not a degree of achieved provenness — it does not belong on the
   health ramp. v1.1 moves `proposed` to the orthogonal axis (magenta 300°) and
   recolors the now-4-stop health ramp to a clean green → yellow → orange → red
   gradient, which also retires the prior yellow-family perceptual-evenness
   watch-point (two near-yellows collapse to one). The role NAMES are unchanged;
   AP re-consumes the recolor by re-sync.

   ---------------------------------------------------------------------------
   WHEEL LOGIC
   ---------------------------------------------------------------------------
   12-hue neon wheel as the palette RESOURCE: hsl(H, S, L), H = n×30°. The wheel
   is a resource, not a mandate to invent twelve states — only the eight roles
   below draw from it. Meaning comes from SPARSE, intentional coloring against
   the neutral lavender field: a node takes a neon hue only to say something.

   Health ramp — achieved-provenness axis (ordered, green "go" → red "no"):
     state-earned      120°  green        operationally grounded at full depth
     state-structural   60°  yellow       schema/structurally proven
     state-partial      30°  orange       operational at bounded depth
     state-deflated      0°  red          pressure showed it unnecessary / dead

   Orthogonal categories (NOT a health judgment; "different axis"):
     state-held        180°  cyan         a named open question
     state-external    270°  violet       owned elsewhere (inherited / upstream)
     state-proposed    300°  magenta      a candidate / potentiality; not yet pressured

   Neutral — the lavender identity field (the default; no neon):
     state-neutral     = var(--fg-1)       no asserted state

   ONE state role per node. Color encodes state ONLY — evidence depth, risk,
   normative force, and structural-axis membership belong in panels/metadata on
   the consuming surface, never in hue. (Consumer-side rule, noted for context.)
   ========================================================================= */

/* ---------- Light (default) — on the light lavender field ----------
   Deeper, more saturated neon so each hue reads against the light gradient.
   (S 85% / L 45%.) The single yellow stop (`structural` 60°) is the brightness
   watch-point on light; confirmed acceptable by the first consumer. An optional
   strengthening (lower L / higher S on that stop) is available but not required. */
:root {
  --state-earned:     hsl(120, 85%, 45%);
  --state-structural: hsl( 60, 85%, 45%);
  --state-partial:    hsl( 30, 85%, 45%);
  --state-proposed:   hsl(300, 85%, 45%);
  --state-deflated:   hsl(  0, 85%, 45%);
  --state-held:       hsl(180, 85%, 45%);
  --state-external:   hsl(270, 85%, 45%);
  /* no asserted state — renders as the theme's default foreground (lavender
     field), never a neon. Auto-flips per theme via --fg-1. */
  --state-neutral:    var(--fg-1);
}

/* ---------- Dark — on the dark ink field ----------
   Bright neon (S 95% / L 60%) to pop against the dark gradient. Explicit theme
   + auto (prefers-color-scheme) blocks mirror each other, matching the
   foundation's theme model. --state-neutral inherits var(--fg-1) (lavender). */
:root[data-theme="dark"] {
  --state-earned:     hsl(120, 95%, 60%);
  --state-structural: hsl( 60, 95%, 60%);
  --state-partial:    hsl( 30, 95%, 60%);
  --state-proposed:   hsl(300, 95%, 60%);
  --state-deflated:   hsl(  0, 95%, 60%);
  --state-held:       hsl(180, 95%, 60%);
  --state-external:   hsl(270, 95%, 60%);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-theme="dark"]) {
    --state-earned:     hsl(120, 95%, 60%);
    --state-structural: hsl( 60, 95%, 60%);
    --state-partial:    hsl( 30, 95%, 60%);
    --state-proposed:   hsl(300, 95%, 60%);
    --state-deflated:   hsl(  0, 95%, 60%);
    --state-held:       hsl(180, 95%, 60%);
    --state-external:   hsl(270, 95%, 60%);
  }
}