/* Veystrum design tokens: ONE block for the public site, the pricing page and
   the app shell.

   White cards on a pale-blue canvas, navy primary actions, navy text. Red is
   kept for destructive actions only; a late or overdue state is burnt orange
   and always carries a glyph as well as a colour.

   Contrast (WCAG 2.1, checked 2026-09-28):
     ink   #14243d on canvas #f2f6fb   14.3:1
     navy  #0c2e6d on surface #ffffff 12.9:1  (and white text on navy, the same)
     ink-faint #5b6b82 on canvas       4.7:1  (AA body text)
     ring  #086e87 on surface          5.9:1  (focus indicator needs 3:1)
     late  #9a3a0a on late-soft        6.2:1

   The older names (--ground, --panel, --teal, --paper, --accent ...) are kept
   as aliases so every page that already reads them follows this block rather
   than carrying its own copy. The shell and the pricing page inline this file
   at start-up (src/ui/tokens.mjs); static pages link it. */
:root{
  color-scheme: light;
  --canvas:#f2f6fb;
  --surface:#ffffff;
  --sunken:#eaf1f8;
  --ink:#14243d;
  --ink-soft:#44546c;
  --ink-faint:#5b6b82;
  --line:#cdd7e5;
  --line-strong:#b3c1d4;
  --navy:#0c2e6d;
  --navy-deep:#08204d;
  --navy-soft:#e3ecf8;
  --mark-accent:#35b8c9;
  --teal-text:#0e7c8f;
  --ring:#086e87;
  --danger:#b42233;
  --late:#9a3a0a;  --late-soft:#fdeee4;
  --warn:#855a0c;  --warn-soft:#fbf1dc;
  --good:#1b6b43;  --good-soft:#e3f3ea;
  --shadow:0 1px 2px rgba(12,46,109,.06), 0 10px 28px -18px rgba(12,46,109,.35);
  --radius:12px;

  /* aliases */
  --ground:var(--canvas);
  --panel:var(--surface);
  --paper:var(--canvas);
  --teal:var(--navy);
  --teal-deep:var(--navy-deep);
  --cyan:var(--mark-accent);
  --amber:#a0620f;
  --accent:var(--navy);
  --accent-ink:#ffffff;
  --accent-soft:var(--navy-soft);
}
html{background:var(--canvas)}
:focus-visible{outline:2px solid var(--ring); outline-offset:2px}