/* SEOport design tokens (UI-01). Shared by public, account and admin. Light is the default; dark follows the OS. */
:root {
  --ink: #0b1b33;
  --ink-2: #33415a;
  --ink-3: #5a6781;
  --surface: #faf8f4;
  --surface-2: #f1ede5;
  --paper: #ffffff;
  --line: #ddd7ca;
  --accent: #08655f;        /* >= 5.7:1 on every light surface, white text on it 6.9:1 */
  --accent-strong: #064d49;
  --accent-soft: #d8efed;
  --accent-2: #b7791f;      /* sparing second accent */
  --accent-2-soft: #f6e7c8;
  --ok: #1f7a43; --ok-soft: #dcf1e3;
  --warn: #8a5a00; --warn-soft: #f9ecc8;
  --danger: #b3261e; --danger-soft: #fadcd9;
  --info: #1d5fa8; --info-soft: #dbe8f7;
  --focus: #0b5cd6;
  --on-accent: #ffffff; --on-danger: #ffffff;

  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --fs-0: clamp(0.875rem, 0.85rem + 0.1vw, 0.9375rem);
  --fs-1: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
  --fs-2: clamp(1.125rem, 1.05rem + 0.35vw, 1.3125rem);
  --fs-3: clamp(1.375rem, 1.2rem + 0.8vw, 1.75rem);
  --fs-4: clamp(1.75rem, 1.4rem + 1.6vw, 2.5rem);
  --fs-5: clamp(2.125rem, 1.5rem + 3vw, 3.75rem);
  --fw-regular: 400; --fw-semibold: 600; --fw-bold: 700;
  --lh-tight: 1.15; --lh-body: 1.6;

  --s-1: 0.25rem; --s-2: 0.5rem; --s-3: 0.75rem; --s-4: 1rem; --s-5: 1.5rem;
  --s-6: 2rem; --s-7: 3rem; --s-8: 4.5rem; --s-9: 6.5rem;
  --r-1: 4px; --r-2: 8px; --r-3: 16px; --r-pill: 999px;
  --shadow-1: 0 1px 2px rgb(11 27 51 / 0.08), 0 1px 1px rgb(11 27 51 / 0.04);
  --shadow-2: 0 8px 24px rgb(11 27 51 / 0.12);
  --container: 1240px;      /* header, page content and footer all use this same width */
  --gutter: clamp(1rem, 4vw, 2rem);
  --target: 44px;           /* minimum touch target */
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink: #eef2f8; --ink-2: #c5cee0; --ink-3: #9aa7bf;
    --surface: #0b1424; --surface-2: #121d31; --paper: #16223a; --line: #2a3957;
    --accent: #3fc1ba; --accent-strong: #7fdad4; --accent-soft: #133a3b;
    --accent-2: #e5b657; --accent-2-soft: #3a2f14;
    --ok: #6fd596; --ok-soft: #12301e; --warn: #f0c35a; --warn-soft: #3a2f10;
    --danger: #ff8d85; --danger-soft: #3d1815; --info: #8db9ee; --info-soft: #12294a;
    --focus: #8db9ee; --on-accent: #04201f; --on-danger: #2a0a08;
    --shadow-1: 0 1px 2px rgb(0 0 0 / 0.5);
    --shadow-2: 0 8px 24px rgb(0 0 0 / 0.5);
  }
}
:root[data-theme="dark"] {
  --ink: #eef2f8; --ink-2: #c5cee0; --ink-3: #9aa7bf;
  --surface: #0b1424; --surface-2: #121d31; --paper: #16223a; --line: #2a3957;
  --accent: #3fc1ba; --accent-strong: #7fdad4; --accent-soft: #133a3b;
  --accent-2: #e5b657; --accent-2-soft: #3a2f14;
  --ok: #6fd596; --ok-soft: #12301e; --warn: #f0c35a; --warn-soft: #3a2f10;
  --danger: #ff8d85; --danger-soft: #3d1815; --info: #8db9ee; --info-soft: #12294a;
  --focus: #8db9ee; --on-accent: #04201f; --on-danger: #2a0a08;
}