/* PERSEUS brand tokens — canonical CSS variables.
   Source of truth: brand/brand-tokens.json · Guide: DESIGN-SYSTEM.md
   Sync across repos: BRAND-SYNC.md. Import this file and use var(--perseus-*). */

:root {
  --perseus-gold: #D8B23E;
  --perseus-gold-soft: #E5C45A;
  --perseus-bg: #0A0A0A;
  --perseus-surface: #161616;
  --perseus-surface-2: #1F1F1F;
  --perseus-border: #2E2E2E;
  --perseus-text: #FAFAFA;
  --perseus-text-2: #A8A8A8;
  --perseus-text-3: #6E6E6E;
  --perseus-green: #3DD66E;
  --perseus-red: #FF4438;
  --perseus-blue: #2E9BFF;

  --perseus-radius: 10px;
  --perseus-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
  --perseus-space: 8px;

  --perseus-font-display: 'Bebas Neue', sans-serif;
  --perseus-font-word: 'Playfair Display', Georgia, serif;
  --perseus-font-body: 'Inter', -apple-system, sans-serif;
  --perseus-font-mono: 'DM Mono', monospace;
}

/* Light theme — applied by the viewer's system preference or a [data-theme=light] root. */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --perseus-gold: #B8901C;
    --perseus-gold-soft: #C9A227;
    --perseus-bg: #FFFFFF;
    --perseus-surface: #FAFAFA;
    --perseus-surface-2: #F0F0F0;
    --perseus-border: #E0E0E0;
    --perseus-text: #0A0A0A;
    --perseus-text-2: #444444;
    --perseus-text-3: #888888;
    --perseus-green: #1FA84D;
    --perseus-red: #E0231A;
    --perseus-blue: #0A6CD8;
    --perseus-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);
  }
}
:root[data-theme="light"] {
  --perseus-gold: #B8901C;
  --perseus-gold-soft: #C9A227;
  --perseus-bg: #FFFFFF;
  --perseus-surface: #FAFAFA;
  --perseus-surface-2: #F0F0F0;
  --perseus-border: #E0E0E0;
  --perseus-text: #0A0A0A;
  --perseus-text-2: #444444;
  --perseus-text-3: #888888;
  --perseus-green: #1FA84D;
  --perseus-red: #E0231A;
  --perseus-blue: #0A6CD8;
  --perseus-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);
}