/* LEDE — Color tokens
   Navy is the brand ink (from the official LEDE logo, #033175). Copper is the single warm accent
   (use sparingly, <=8%). Bronze is the typographic copper (AA-safe for small text/links). */
:root {
  /* Base palette */
  --navy: #033175;
  --navy-900: #02224F;
  --graphite: #232A33;
  --slate: #5B6770;
  --slate-300: #9FB1C4;
  --copper: #B87333;
  --bronze: #8C5A2B;
  --paper: #F7F5F2;
  --paper-2: #EFEBE4;
  --mist: #E7E2DB;
  --line: #DED8CF;
  --white: #FFFFFF;

  /* Sister brand — reference only, never mix into LEDE pieces */
  --teal-greendata: #00B5B8;

  /* Semantic — surfaces */
  --surface-page: var(--paper);
  --surface-card: var(--white);
  --surface-sunken: var(--paper-2);
  --surface-invert: var(--navy);
  --surface-invert-900: var(--navy-900);

  /* Semantic — text */
  --text-strong: var(--navy);     /* headings, emphasis */
  --text-body: var(--graphite);   /* long-form reading */
  --text-muted: var(--slate);     /* secondary text */
  --text-on-invert: var(--paper);
  --text-on-invert-muted: var(--slate-300);
  --text-link: var(--bronze);

  /* Semantic — lines & accents */
  --border: var(--line);
  --border-strong: var(--mist);
  --accent: var(--copper);        /* the copper line / datum motif */
  --accent-ink: var(--bronze);    /* copper as readable text */

  /* Status (derived, used sparingly in UI) */
  --ok: #2E6B3E;
  --ok-surface: #E6EFE7;
  --warn: #9B3A2E;
  --warn-surface: #FBE9E7;
}