/* AI-103 English Trainer — design tokens (single source of truth).
   Slate neutrals · Study=teal · Speak=amber · themed light + dark (AA verified).
   Imported into Pencil as variables (mode axis: light/dark). */

:root {
  /* Neutrals — Slate (light) */
  --bg: #F6F8FA;
  --surface: #FFFFFF;
  --surface-2: #EDF1F5;
  --border: #DCE2EA;
  --text: #16202E;
  --text-muted: #566373;
  --text-faint: #8892A1;

  /* Module accents (solid = for filled buttons w/ white text, AA ≥4.5) */
  --study: #0B7A70;            /* teal — Study module */
  --study-fg: #FFFFFF;
  --study-soft: #0B7A7014;
  --speak: #B45309;            /* amber — Speak module */
  --speak-fg: #FFFFFF;
  --speak-soft: #B4530914;
  --primary: #0B7A70;          /* default accent = Study */
  --primary-fg: #FFFFFF;

  /* Semantic */
  --success: #15803D;
  --warning: #B45309;
  --danger: #B91C1C;
  --weak: #B45309;             /* weak-area highlight */

  /* Radii / spacing / shadow */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --shadow: 0 1px 2px rgba(16,24,40,.05), 0 4px 12px rgba(16,24,40,.06);

  /* Type */
  --font-ui: 'Inter', system-ui, sans-serif;
  --font-display: 'Geist', 'Inter', sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, monospace;
}

/* Dark (dark-first study focus) — accents brighter, used with dark fg */
:root[data-theme="dark"],
:root:not([data-theme="light"]) {
  --bg: #0E141B;
  --surface: #161E28;
  --surface-2: #1E2833;
  --border: #2A3542;
  --text: #E7ECF3;
  --text-muted: #9AA7B8;
  --text-faint: #6D7A8B;

  --study: #2DD4BF;
  --study-fg: #06231F;
  --study-soft: #2DD4BF1F;
  --speak: #F5A524;
  --speak-fg: #241703;
  --speak-soft: #F5A5241F;
  --primary: #2DD4BF;
  --primary-fg: #06231F;

  --success: #4ADE80;
  --warning: #F5A524;
  --danger: #F87171;
  --weak: #F5A524;

  --shadow: 0 1px 2px rgba(0,0,0,.3), 0 6px 16px rgba(0,0,0,.35);
}