/* Arcois design tokens. Source of truth for arcois.com AND the Exera console.
   The site copies this file to assets/tokens.css at build time. Names are
   stable; only values change. Light is the site default; the console flips
   [data-theme="dark"] on <html>. A section of a page can opt into the dark set
   with data-theme="dark". Every pair in scripts/check-contrast.py clears 4.5:1. */
:root {
  --bg: #F5F7FA; --bg-2: #EDF0F4;
  --surface: #FFFFFF; --surface-2: #F5F7FA; --surface-3: #EAEDF2;
  --line: #DDE2EA; --line-soft: #ECEFF3;
  --text: #0E1424; --muted: #4B5668; --faint: #6B7686;
  --brand: #0B48FF; --brand-strong: #0838CC; --brand-fill: #0B48FF; --on-brand: #FFFFFF;
  --brand-wash: rgba(11, 72, 255, 0.08);
  --good: #047857; --warn: #B45309; --bad: #B91C1C;
  --good-wash: rgba(4, 120, 87, 0.10); --warn-wash: rgba(180, 83, 9, 0.12); --bad-wash: rgba(185, 28, 28, 0.10);
  --shadow-sm: 0 1px 2px rgba(16, 20, 30, 0.04), 0 4px 12px -8px rgba(16, 20, 30, 0.10);
  --shadow: 0 1px 2px rgba(16, 20, 30, 0.05), 0 10px 24px -12px rgba(16, 20, 30, 0.16);
  --display: "Space Grotesk", "Hanken Grotesk", system-ui, sans-serif;
  --body: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
  --radius: 10px; --radius-sm: 7px;
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem; --space-5: 1.5rem;
  --space-6: 2rem; --space-7: 3rem; --space-8: 4rem; --space-9: 5rem; --space-10: 6rem; --space-11: 7.5rem; --space-12: 9rem;
  --measure: 64ch; --gutter: clamp(1rem, 5vw, 4rem); --band-max: 1140px;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1); --ease-in-out: cubic-bezier(0.4, 0.1, 0.2, 1);
  --dur-1: 0.14s; --dur-2: 0.24s;
  color-scheme: light;
}
[data-theme="dark"] {
  --bg: #070B12; --bg-2: #0C1220;
  --surface: #121A2A; --surface-2: #1A2334; --surface-3: #242E40;
  --line: #2A3447; --line-soft: #1E2737;
  --text: #ECEEF4; --muted: #9AA4B4; --faint: #7B8699;
  --brand: #4D7CFF; --brand-strong: #7A9DFF; --brand-fill: #2F63FF; --on-brand: #FFFFFF;
  --brand-wash: rgba(77, 124, 255, 0.16);
  --good: #34D399; --warn: #FBBF24; --bad: #F87171;
  --good-wash: rgba(52, 211, 153, 0.14); --warn-wash: rgba(251, 191, 36, 0.14); --bad-wash: rgba(248, 113, 113, 0.14);
  --shadow-sm: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 2px 6px -2px rgba(0, 0, 0, 0.5);
  --shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 8px 22px -8px rgba(0, 0, 0, 0.6);
  color-scheme: dark;
}
