/**
 * accent.css — Unified accent system (Superhuman premium-feel step 3/4).
 *
 * Continuation of [[project-motion-language-superhuman-2026-05-23]] (step 2).
 * Step 2 made every transition feel coherent; step 3 makes every accent read
 * as one brand voice.
 *
 * The contract:
 *
 *   PRIMARY:  mint  — interaction. Hover, focus, links, active tabs, primary
 *                     CTAs, "the one thing on this screen that's the answer".
 *   STATUS:   amber — warning (status only)
 *             red   — error / danger (status only)
 *   COLLAPSED: blue, purple — both collapse into mint via cascade redirect.
 *              Verbatim _ported/* uses blue in ~442 places (hover, focus,
 *              active dropdown items, scrollbar thumb, "live" pings, niche
 *              verdict). All of these are interactive affordances or
 *              positive-signal states — exactly the primary-accent role.
 *
 * Strategy: TOKEN REDIRECT — same playbook as motion.css. shell.css L106-117
 * (dark) and L195-205 (light) define `--blue`, `--blue2`, `--blue-d`, the
 * `--blue-a*` alpha family, and `--purple`. Redefining these tokens in a
 * later-loaded stylesheet redirects every `var(--blue*)` / `var(--purple*)`
 * reference to mint via CSS-variable cascade. Zero per-selector edits across
 * the ~50 ported CSS files.
 *
 * Affordance tokens (`--glow-blue`, `--focus-border`, `--sb-thumb`) are
 * redirected too so the entire interactive-feedback system collapses to a
 * single hue family — the Superhuman "one accent does one job" rule.
 *
 * Why blue → mint and not the other way: mint is already the brand voice
 * (CTA gradient, scrollbar emphasis, mint-bordered card emphasis `--bm`).
 * Collapsing the smaller hue family into the established brand voice
 * preserves the existing CTA hierarchy while removing the dual-accent muddle.
 *
 * Loaded after motion.css → wins the cascade for token redefinition.
 *
 * Notes:
 *  - The `--bar` brand gradient (shell.css L7) uses hardcoded hex stops so
 *    is unaffected by this redirect — the multi-stop logo bar still reads as
 *    multi-colour, which is intentional brand identity vs. accent system.
 *  - Amber and red stay as-is — they're already status-only.
 *  - Alpha mismatches between blue-a* (06,08,10,12,15,18,20,25,30,40,50) and
 *    mint-a* (06,10,12,15,20,25,30,40): the 08/18/50 stops map to the closest
 *    mint stop (10/20/explicit-rgba). Visual difference at ±0.02 alpha is
 *    imperceptible against any backdrop.
 */

/* Var()-aliased redirects — identical in both themes because they ultimately
 * resolve via `--mint*` whose hex value is theme-defined in shell.css.
 * `:where()` is zero-specificity but still applies to both :root + light
 * scope; no other selector defines these tokens so cascade is unambiguous. */
:where(:root, html[data-theme="light"]) {
  --blue:     var(--mint);
  --blue2:    var(--mint2);
  --blue-d:   var(--mint-d);

  --blue-a06: var(--mint-a06);
  --blue-a08: var(--mint-a10);  /* mint has no a08 — a10 is closest */
  --blue-a10: var(--mint-a10);
  --blue-a12: var(--mint-a12);
  --blue-a15: var(--mint-a15);
  --blue-a18: var(--mint-a20);  /* mint has no a18 — a20 is closest */
  --blue-a20: var(--mint-a20);
  --blue-a25: var(--mint-a25);
  --blue-a30: var(--mint-a30);
  --blue-a40: var(--mint-a40);

  --purple:     var(--mint);
  --purple-a10: var(--mint-a10);
  --purple-a15: var(--mint-a15);

  --glow-blue: var(--glow-mint);
}

/* Theme-specific stops — these use literal rgba() because mint has no a50
 * token and `--focus-border` / `--sb-thumb` are hardcoded affordance tokens.
 * Dark mint = #2ED8A8 (46,216,168); light mint = #009E7A (0,158,122). */
:root {
  --blue-a50:     rgba(46,216,168,0.50);
  --focus-border: rgba(46,216,168,0.50);
  --sb-thumb:     rgba(46,216,168,0.50);
}

html[data-theme="light"] {
  --blue-a50:     rgba(0,158,122,0.50);
  --focus-border: rgba(0,158,122,0.50);
  --sb-thumb:     rgba(0,158,122,0.50);
}
