/**
 * Auth by Email - design tokens
 *
 * The only place colors and typography are defined. Other CSS files reference
 * these custom properties.
 *
 * Dark mode is opt-in via @media (prefers-color-scheme: dark).
 */
:root {
  --abe-bg:        #f4efe6;
  --abe-card:      #ffffff;
  --abe-ink:       #0e0d0b;
  --abe-ink-soft:  #25221d;
  --abe-muted:     #5a544a;
  --abe-rule:      #cdc4b0;
  --abe-rule-soft: #ddd5bf;
  --abe-accent:    #0f172a;
  --abe-accent-fg: #ffffff;
  --abe-ok:        #1f5d3a;
  --abe-err:       #8a2c1f;
  --abe-warn-bg:   #f8f0e0;

  --abe-radius:    14px;
  --abe-radius-sm: 10px;

  --abe-font-display: 'Merriweather', Georgia, serif;
  --abe-font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --abe-font-mono:    'JetBrains Mono', 'IBM Plex Mono', ui-monospace, monospace;

  --abe-shadow: 0 1px 0 rgba(0,0,0,0.02), 0 12px 40px -12px rgba(14,13,11,0.12);
}

@media (prefers-color-scheme: dark) {
  :root {
    --abe-bg:        #0e0d0b;
    --abe-card:      #1a1816;
    --abe-ink:       #f4efe6;
    --abe-ink-soft:  #e8e1d0;
    --abe-muted:     #a8a195;
    --abe-rule:      #3a352e;
    --abe-rule-soft: #2a2620;
    --abe-accent:    #f4efe6;
    --abe-accent-fg: #0e0d0b;
  }
}
