/* Terminal Commerce — Color tokens
   Brand model: deep "ink" navy-black terminal surfaces + a BRIGHT, DESATURATED
   "spectrum" of complementary hues (harmonized in oklch) as the identity.
   Electric-but-soft cyan is the single interactive accent; the full spectrum
   drives the animated wordmark, icons, and accent moments. Warm-neutral paper
   underneath. Base scales first, then semantic aliases. */

:root {
  /* ---- Ink (brand dark / terminal surfaces) ---- */
  --ink-900: #080c14; /* deepest background */
  --ink-800: #0b1220; /* primary terminal surface (matches CLI --term-bg) */
  --ink-700: #111a2c; /* raised panel on ink */
  --ink-600: #18243a; /* card on ink */
  --ink-500: #243149; /* hairline border on ink */
  --ink-400: #36465f; /* stronger border / muted icon on ink */
  --ink-300: #5a6b86; /* muted text on ink */
  --ink-200: #8fa0bb; /* secondary text on ink */

  /* ---- Spectrum (bright, desaturated complementary identity) ----
     7 evenly-spaced hues harmonized in oklch (L≈.70–.83, C≈.11–.13): softer and
     more sophisticated than the old neon set, still bright. Hex are the sRGB
     resolves of those oklch values. */
  --spec-pink:   #ec86aa; /* oklch(.74 .13 358) */
  --spec-coral:  #ee9373; /* oklch(.75 .12 40)  */
  --spec-amber:  #ebc166; /* oklch(.83 .12 85)  */
  --spec-lime:   #7ccd8e; /* oklch(.78 .12 150) */
  --spec-cyan:   #47c5d2; /* oklch(.76 .11 205) */
  --spec-blue:   #729fe9; /* oklch(.70 .12 260) */
  --spec-violet: #b48ce2; /* oklch(.71 .13 305) */
  /* the spectrum as a sweep — used for the wordmark, CTA bands, accent rules */
  --gradient-spectrum: linear-gradient(90deg, #ec86aa, #ee9373, #ebc166, #7ccd8e, #47c5d2, #729fe9, #b48ce2); /* @kind color */
  --gradient-spectrum-200: linear-gradient(90deg, #ec86aa, #ee9373, #ebc166, #7ccd8e, #47c5d2, #729fe9, #b48ce2, #ec86aa, #ee9373, #ebc166, #7ccd8e, #47c5d2, #729fe9, #b48ce2); /* @kind color */

  /* ---- Cyan accent ramp (the single interactive hue, desaturated to match) ---- */
  --cyan-700: #06707e; /* deep, for text-on-light AA */
  --cyan-600: #1e97a5;
  --cyan-500: #47c5d2; /* PRIMARY accent — focus, cursor, highlights */
  --cyan-400: #72d7de;
  --cyan-200: #b4eaec;
  --cyan-100: #d7f3f4;
  --cyan-50:  #e8f9f9;

  /* ---- Paper (warm-neutral light surfaces) ---- */
  --paper-0:   #ffffff; /* card */
  --paper-50:  #faf9f6; /* page background (light) */
  --paper-100: #f3f1ec; /* sunken surface */
  --paper-200: #e8e5dd; /* subtle border */
  --paper-300: #d8d3c8; /* strong border */

  /* ---- Stone (warm gray text on light) ---- */
  --stone-900: #1b1a16; /* primary text */
  --stone-700: #3c3a33;
  --stone-500: #6c675b; /* secondary text */
  --stone-400: #948e80; /* disabled / placeholder */

  /* ---- Semantic status (harmonious, kept distinct from the spectrum identity) ---- */
  --success-icon: #29845a; --success-surface: #ecf6f0; --success-text: #0c5132; --success-border: #a9e3c4;
  --caution-icon: #b98900; --caution-surface: #fff6e9; --caution-text: #5e4200; --caution-border: #f1cd8e;
  --critical-icon: #c62a1b; --critical-surface: #fdecea; --critical-text: #8e1f0b; --critical-border: #f4c4bd;
  --info-icon:    #2a6fdb; --info-surface:    #ecf2fb; --info-text:    #14457f; --info-border:    #bcd3f4;

  /* ================= SEMANTIC ALIASES ================= */
  --bg-page: var(--paper-50);
  --bg-sunken: var(--paper-100);
  --surface-card: var(--paper-0);
  --surface-ink: var(--ink-800);
  --surface-ink-raised: var(--ink-700);

  --text-primary: var(--stone-900);
  --text-secondary: var(--stone-500);
  --text-disabled: var(--stone-400);
  --text-on-ink: #e6edf3;
  --text-on-ink-muted: var(--ink-200);

  --border-subtle: var(--paper-200);
  --border-strong: var(--paper-300);
  --border-on-ink: var(--ink-500);

  /* interactive accent = electric cyan */
  --accent: var(--cyan-500);
  --accent-hover: var(--cyan-600);
  --accent-strong: var(--cyan-700);
  --accent-glow: var(--cyan-400);
  --accent-text: var(--cyan-700); /* cyan-colored text on light surfaces (AA) */
  --accent-soft: rgba(71, 197, 210, 0.14);
  --on-accent: var(--ink-900); /* ink text on a cyan fill */

  --link: var(--info-icon);
  --link-hover: #14457f;
  --focus-ring: var(--cyan-500);
}