/* Tokens do design system (docs/DESIGN-SYSTEM.md). Componentes usam só estes tokens. */
:root {
  --bg-primary: #0E121A;
  --bg-secondary: #12110F;
  --surface-primary: #181A20;
  --surface-secondary: #202229;
  --surface-elevated: #292B32;
  --text-primary: #F5F2EB;
  --text-secondary: #C8C5BE;
  --text-tertiary: #92918D;
  --text-disabled: #64656A;
  --accent-primary: #C8A45D;
  --accent-secondary: #A98243;
  --accent-dark: #735A2E;
  --deep-blue: #17263D;
  --on-accent: #0E121A;
  --success: #7FB77E;
  --warning: #D9A441;
  --info: #7DA3D9;

  --font-display: 'Lora', Georgia, 'Times New Roman', serif;
  --font-ui: 'Nunito', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --space-xs: 4px; --space-s: 8px; --space-sm: 12px; --space-m: 16px;
  --space-l: 24px; --space-xl: 32px; --space-xxl: 48px;
  --radius-s: 8px; --radius-m: 12px; --radius-l: 20px; --radius-full: 999px;
  --shadow-1: 0 1px 3px rgba(0,0,0,.35);
  --shadow-2: 0 6px 18px rgba(0,0,0,.4);
  --motion-fast: 120ms; --motion-normal: 250ms; --motion-slow: 500ms;
  --touch-min: 44px;
}

/* Tema claro (pergaminho): mesmos nomes, outros valores. */
:root[data-tema="claro"] {
  --bg-primary: #FBF7EE;
  --bg-secondary: #F5EFE0;
  --surface-primary: #FFFFFF;
  --surface-secondary: #F3ECDD;
  --surface-elevated: #FFFFFF;
  --text-primary: #2A2118;
  --text-secondary: #5A4E40;
  --text-tertiary: #7A6E60;
  --accent-primary: #8A6A2A;
  --accent-secondary: #A98243;
  --on-accent: #FFFFFF;
  --shadow-1: 0 1px 3px rgba(60,40,10,.15);
  --shadow-2: 0 6px 18px rgba(60,40,10,.18);
}

/* Tokens de trilha e superfícies de destaque */
:root {
  --no-bloqueado: #2A2D36;
  --no-bloqueado-sombra: #1B1D24;
  --no-feito: var(--accent-secondary);
  --no-feito-sombra: var(--accent-dark);
  --no-ativo: var(--accent-primary);
  --no-ativo-sombra: var(--accent-dark);
  --hero-1: #1B2B47;
  --hero-2: #17263D;
}
:root[data-tema="claro"] {
  --no-bloqueado: #E4DBC8;
  --no-bloqueado-sombra: #CFC4AC;
  --hero-1: #3A4A66;
  --hero-2: #2B3A55;
}

@media (prefers-reduced-motion: reduce) {
  :root { --motion-fast: 0ms; --motion-normal: 0ms; --motion-slow: 0ms; }
}