/* ============================================================
   Design Tokens
   ------------------------------------------------------------
   The admin panel will read/write these values.
   Do not hardcode colors anywhere else.
   ============================================================ */

:root {
  /* ---------- Base palette ---------- */
  --paper: #EEEADB;
  --paper-2: #E4DEC9;
  --ink: #181510;
  --ink-2: #26221A;
  --white: #FAF7EF;

  /* ---------- Accent ---------- */
  --accent: #2B3FE0;
  --accent-dark: #1D2AA8;

  /* ---------- Semantic colors ---------- */
  --safety: #F5C400;
  --stone: #B4A992;
  --danger: #C23B22;
  --success: #2EA043;

  /* ---------- Surfaces (light mode) ---------- */
  --bg: var(--paper);
  --bg-2: var(--paper-2);
  --fg: var(--ink);
  --fg-soft: #4A4436;
  --surface: var(--white);
  --line: rgba(24,21,16,0.16);

  /* ---------- Typography ---------- */
  --font-display: 'Big Shoulders Display', sans-serif;
  --font-body: 'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  /* ---------- Spacing ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* ---------- Radius ---------- */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;

  /* ---------- Shadows ---------- */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.03);
  --shadow-md: 0 2px 8px rgba(0,0,0,0.06);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.08);

  /* ---------- Layout ---------- */
  --wrap: 1180px;
  --header-h: 72px;
}

/* ---------- Dark mode ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: var(--ink);
    --bg-2: var(--ink-2);
    --fg: var(--paper);
    --fg-soft: #C9C2AC;
    --surface: var(--ink-2);
    --line: rgba(238,234,219,0.16);
  }
}

:root[data-theme="dark"] {
  --bg: var(--ink);
  --bg-2: var(--ink-2);
  --fg: var(--paper);
  --fg-soft: #C9C2AC;
  --surface: var(--ink-2);
  --line: rgba(238,234,219,0.16);
}