:root {
  /* Surfaces & text ------------------------------------------------------- */
  --ink: #1E1E1E;
  --ink-soft: #33383D;
  --paper: #FFFFFF;
  --paper-alt: #F2F7FB;
  --text: #1E1E1E;
  --text-muted: #5C6873;
  --line: #E3EAF0;

  /* Brand blue -----------------------------------------------------------
     Two tiers, split by ROLE. This is not stylistic — #38B6FF scores 2.26:1
     on white, so it fails WCAG as a text or button-background colour.
       --brand        decorative only: glows, borders, flame, underlines, and
                      button backgrounds paired with --ink text (7.39:1, AAA).
                      Never small text. Never with white text.
       --brand-bright hover state. Brightening RAISES contrast to 9.11:1, so
                      the brand metaphor and accessibility agree.
       --brand-deep   any blue text: links, eyebrows, stat values (5.70:1, AA).
     See docs/superpowers/specs/2026-07-16-blue-rebrand-sabeely-focus-design.md
     ---------------------------------------------------------------------- */
  --brand: #38B6FF;
  --brand-bright: #6FC9FF;
  --brand-deep: #0A6BA8;
  --brand-deeper: #075E94;
  --brand-soft: #EAF6FE;

  /* Status ---------------------------------------------------------------- */
  --success: #0F7A5A;
  --error: #D64533;

  /* Motion ---------------------------------------------------------------- */
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 0.18s;
  --dur: 0.28s;
  --shadow-lift: 0 12px 28px -8px rgba(10, 107, 168, 0.28);
  --shadow-glow: 0 0 0 4px var(--brand-soft);

  /* Type ------------------------------------------------------------------ */
  --font-display: 'Fraunces', Georgia, serif;
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Back-compat aliases ---------------------------------------------------
     The old red palette used the "first-light" prefix, plus "emerald". Both are
     aliased onto the new tokens so no page can break mid-refactor. Remove once
     every page is verified.
     NB: do not write a glob for those old names in a comment here. A literal
     asterisk before a slash ends the comment early and silently kills every
     declaration below it. ------------------------------------------------- */
  --first-light: var(--brand);
  --first-light-deep: var(--brand-deep);
  --first-light-deep-hover: var(--brand-deeper);
  --first-light-soft: var(--brand-soft);
  --emerald: var(--success);
  --emerald-deep: var(--success);
}
