/* ============================================================
   Cerne — Color tokens
   Enterprise / Apple-style minimal light: white surfaces, near-
   black ink for text, ONE navy accent reserved for interactive
   elements (links, buttons, focus, eyebrows). No gradients-as-
   decoration, no glow, no mascot colors. Semantic names unchanged
   so existing components re-theme automatically.
   ============================================================ */

:root {
  /* ---- Pure ---- */
  --white: #ffffff;
  --black: #0a0c10;

  /* ---- Navy scale (the one accent hue) ---- */
  --navy-950: #060a12;
  --navy-900: #0b1220;
  --navy-800: #111c30;
  --navy-700: #16233d;
  --navy-600: #1b2a4a; /* brand ink — used sparingly for tinted headings */
  --navy-500: #28406e; /* SIGNAL ACCENT — primary action, links, focus */
  --navy-400: #3f5a8c;
  --navy-300: #7089b3;
  --navy-200: #aebedb;
  --navy-100: #dde4f0;
  --navy-50:  #f0f3f9;

  /* ---- Neutral ink (true cool gray, not blue-tinted — Apple-style body text) ---- */
  --ink-900: #101214; /* headings, strongest text */
  --ink-800: #1c1f24;
  --ink-700: #34383f; /* body */
  --ink-600: #4c5058;
  --ink-500: #6b7078; /* muted */
  --ink-400: #8b9099; /* caption / faint-ish */
  --ink-300: #b4b8c0; /* faint labels */

  /* ---- Neutral surfaces & borders ---- */
  --slate-50:  #fafafb; /* soft card fill */
  --slate-100: #f5f6f8; /* sunken / section break bg */
  --slate-150: #eef0f3; /* image placeholder bg */
  --slate-200: #e4e6ea; /* app canvas / deep page bg */
  --border-100: #eeeff2; /* hairline */
  --border-200: #e2e4e8; /* default card border */
  --border-300: #cfd2d8; /* divider */
  --border-dotted: #c3c7ce;

  /* ---- Status (sober, desaturated) ---- */
  --green-700: #1e5c3a;  --green-600: #2b7a4c;  --green-200: #b7dcc4;  --green-100: #e7f2ea;
  --amber-700: #6e4f1c;  --amber-600: #94661c;  --amber-500: #b17f24;  --amber-200: #e8d4ac;  --amber-100: #f6efe1;
  --red-700: #7a2424;    --red-600: #963030;    --red-200: #dcb8b8;    --red-100: #f1e2e2;

  /* ============================================================
     Semantic aliases — reference these in product UI
     ============================================================ */

  /* Surfaces */
  --surface-page:    var(--white);
  --surface-card:    var(--white);
  --surface-soft:    var(--slate-50);
  --surface-sunken:  var(--slate-100);
  --surface-hover:   var(--slate-100);
  --surface-canvas:  var(--slate-200);
  --surface-brand-soft: var(--navy-50);
  --surface-dark:    var(--navy-900); /* reserved for occasional dark accent bands */

  /* Panel fill for the rare dark accent section (e.g. closing CTA band) */
  --gradient-panel: linear-gradient(165deg, var(--navy-800) 0%, var(--navy-950) 100%); /* @kind color */

  /* Text */
  --text-strong:  var(--ink-900);
  --text-heading: var(--ink-900); /* near-black headings, Apple-style — not tinted navy */
  --text-ink:     var(--ink-800);
  --text-body:    var(--ink-700);
  --text-lead:    var(--ink-600);
  --text-muted:   var(--ink-500);
  --text-faint:   var(--ink-400);
  --text-on-brand: var(--white);
  --text-link:    var(--navy-500);

  /* Borders */
  --border-subtle:  var(--border-100);
  --border-default: var(--border-200);
  --border-strong:  var(--border-300);
  --border-brand:   var(--navy-500);

  /* Brand / primary action — the ONE signal accent */
  --brand:        var(--navy-500);
  --brand-hover:  var(--navy-600);
  --brand-active: var(--navy-700);
  --brand-bright: var(--navy-400);
  --brand-ink:    var(--navy-600);
  --brand-ring:   var(--navy-200);

  /* Status triplets */
  --status-ok-fg: var(--green-700);   --status-ok-bg: var(--green-100);   --status-ok-border: var(--green-200);
  --status-warn-fg: var(--amber-600); --status-warn-bg: var(--amber-100); --status-warn-border: var(--amber-200);
  --status-down-fg: var(--red-700);   --status-down-bg: var(--red-100);   --status-down-border: var(--red-200);

  /* Focus — thick, visible, brand-tinted */
  --focus-ring: 0 0 0 3px var(--navy-200);

  /* Back-compat aliases (older files may still read --blue-*) */
  --blue-50: var(--navy-50); --blue-100: var(--navy-100); --blue-150: var(--navy-100); --blue-200: var(--navy-200);
  --blue-300: var(--navy-300); --blue-400: var(--navy-400); --blue-500: var(--navy-500); --blue-600: var(--navy-600);
  --blue-700: var(--navy-700); --blue-800: var(--navy-800);
}