/* Design tokens. Change the look here, nowhere else. */
:root {
  color-scheme: light dark;
  --paper: #EEF0EE;      /* neutral light */
  --surface: #FFFFFF;
  --ink: #1B1F24;
  --ink-2: #5A626B;
  --line: #D6DAD6;
  --lane: #2B57C9;       /* track blue: the main action only */
  --lane-ink: #FFFFFF;
  --spirit: #A97A1F;     /* verse and Spirit, old gold */
  --ok: #2F7D4F;
  --warn: #B4472F;

  --font-display: 'Barlow Condensed', 'Arial Narrow', 'Helvetica Neue', sans-serif;
  --font-body: 'Barlow', -apple-system, 'Segoe UI', sans-serif;
  --font-verse: 'Source Serif 4', Georgia, serif;

  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 36px;
  --r-btn: 12px; --r-card: 20px; --r-pill: 999px;
  --safe-top: env(safe-area-inset-top, 0px);
  /* Android standalone can draw behind the system buttons without reporting their height; main.js sets --nav-fallback there. */
  --safe-bottom: max(env(safe-area-inset-bottom, 0px), var(--nav-fallback, 0px));
}
@media (prefers-color-scheme: dark) {
  :root {
    /* graphite base so the few accents stand out: blue = main action, gold = verse/Spirit, green = done */
    --paper: #1B1D20; --surface: #25282C; --ink: #EDEEEA; --ink-2: #9AA1A9; --line: #34383E;
    --lane: #6E93F0; --lane-ink: #0F1520; --spirit: #E1B65A; --ok: #6CC08B; --warn: #E3846A;
  }
}
