/* Elucidar — CSS custom properties derivadas de elucidar.tokens.json (fonte da verdade).
   Editar SEMPRE lá primeiro; este arquivo é derivação manual até haver build (Style Dictionary). */

:root {
  /* base */
  --paper-50: #ffffff;
  --paper-100: #faf7f2;
  --ink-900: #1a1611;
  --gold-400: #fbbf24;
  --gold-500: #f59e0b;
  --gold-600: #c86a04;
  --gold-700: #b45309;
  --yellow-500: #f5b700;
  --glow-200: #fde68a;
  --silver-400: #8a8f98;
  --silver-600: #5c6470;
  --night-950: #0f0d0a;
  --cream-100: #f5f0e8;
  --red-700: #b91c1c;
  --green-700: #15803d;

  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-text: "Inter", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: "JetBrains Mono", Consolas, "Courier New", monospace;
  --font-size-100: 16px;
  --font-size-200: 20px;
  --font-size-300: 25px;
  --font-size-400: 31px;
  --font-size-500: 39px;
  --font-size-600: 49px;
  --line-height-body: 1.45;
  --line-height-heading: 1.15;
  --measure: 65ch;

  --space-100: 8px;
  --space-200: 16px;
  --space-300: 24px;
  --space-400: 32px;
  --space-600: 48px;
  --space-800: 64px;
  --space-1200: 96px;
  --radius-100: 8px;

  --duration-micro: 180ms;
  --duration-transition: 300ms;
  --duration-max: 400ms;
  --easing-enter: cubic-bezier(0, 0, 0.2, 1);
  --easing-exit: cubic-bezier(0.4, 0, 1, 1);
  --easing-standard: cubic-bezier(0.4, 0, 0.2, 1);

  /* semantic — modo claro (padrão) */
  --color-bg: var(--paper-100);
  --color-surface: var(--paper-50);
  --color-bg-brand-block: var(--yellow-500); /* nunca dominante em proposta */
  --color-text: var(--ink-900); /* 16.84:1 */
  --color-text-secondary: var(--silver-600); /* 5.60:1 */
  --color-text-accent: var(
    --gold-700
  ); /* 4.70:1 — único dourado-texto em fundo claro */
  --color-accent-ui: var(
    --gold-600
  ); /* 3.56:1 — ícones/bordas/foco (SC 1.4.11) */
  --color-accent-vivid: var(
    --gold-500
  ); /* decorativo em fundo claro; texto só sobre ink */
  --color-border: var(--silver-400); /* 3.04:1 — nunca texto */
  --color-error: var(--red-700);
  --color-success: var(--green-700);
  --gradient-glow: linear-gradient(135deg, var(--gold-500), var(--glow-200));
}

[data-theme="dark"] {
  /* semantic — modo escuro derivado (thumbs, peças dev) */
  --color-bg: var(--night-950);
  --color-surface: #1a1611;
  --color-text: var(--cream-100); /* 17.10:1 */
  --color-text-accent: var(--gold-400); /* 11.62:1 */
  --color-accent-ui: var(--gold-400);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-micro: 1ms;
    --duration-transition: 1ms;
    --duration-max: 1ms;
  }
}
