/* Entenda o Brasil — design tokens da web. Fonte única de cor, raio e tipografia (espelha ios/Praxis/DesignSystem/Theme.swift
   e docs/identidade.md). Altere aqui, nunca nas páginas. */
:root {
  /* marca */
  --barro: #C8642F;
  --barro-escuro: #8E3F18;
  --ipe: #F2B705;
  --mata: #1E7F5C;
  --urucum: #D7263D;
  --anil: #2E3A87;
  --jenipapo: #6A4C93;
  --jambo: #B23A48;
  --algodao: #FFF8EE;
  --carvao: #1F1B16;

  /* noite (mesmo céu das ilustrações) */
  --noite-1: #0F1B3D;
  --noite-2: #1B2A5C;
  --noite-3: #2B1E4F;
  --espaco: #0B1330;

  /* brilhos */
  --brilho-ipe: #FFD84A;
  --brilho-ciano: #5CE1F2;
  --brilho-mata: #4CD99A;
  --brilho-coral: #FF9E6B;
  --brilho-lilas: #B08CFF;

  /* semânticas */
  --bg: var(--espaco);
  --text: var(--algodao);
  --text-2: #A9B4DA;
  --glass: rgba(255, 255, 255, .07);
  --glass-2: rgba(255, 255, 255, .11);
  --border: rgba(255, 255, 255, .14);
  --border-strong: rgba(255, 255, 255, .28);
  --border-input: rgba(255, 255, 255, .5); /* contorno de campo: ≥ 3:1 sobre a noite (WCAG 1.4.11) */
  --link: #8FD9FF;
  --focus: var(--brilho-ipe);

  /* cursos (versões claras para texto sobre a noite) */
  --curso-ef: #4CD99A;
  --curso-pb: #A9B8FF;
  --curso-gp: #C4A8FF;
  --curso-hb: #FF9E6B;
  --curso-se: #FF8A98;
  --curso-cf: var(--brilho-ipe);
  --curso-sb: var(--brilho-ciano);

  /* realces de texto, estados e fundos que mudam com o tema */
  --accent: var(--brilho-ipe);      /* kicker, títulos de artigo */
  --accent-2: var(--brilho-ciano);  /* capítulos, seções */
  --hover-text: #fff;
  --ok: #4CD99A; --ok-bg: rgba(76, 217, 154, .14);
  --err: #FF9AA6; --err-bg: rgba(255, 138, 152, .14);
  --sel: var(--brilho-ipe); --sel-bg: rgba(255, 216, 74, .14);
  --par-1: #FFD84A; --par-2: #5CE1F2; --par-3: #FF9E6B; --par-4: #B08CFF; --par-5: #4CD99A; /* pares/caixas (sempre com número ou nome) */
  --footer-bg: rgba(11, 19, 48, .6);
  --stars: .9;
  --bg-image:
    radial-gradient(900px 500px at 50% 105%, rgba(176, 140, 255, .28), transparent 70%),
    linear-gradient(180deg, var(--noite-1) 0%, var(--noite-2) 45%, var(--noite-3) 100%);

  /* forma */
  --radius: 18px;
  --radius-lg: 24px;
  --radius-pill: 999px;
  --shadow-glow: 0 10px 30px rgba(255, 158, 107, .35);

  /* tipografia (apenas fontes do sistema) */
  --font-display: ui-serif, "New York", Georgia, "Times New Roman", serif;
  --font-body: ui-rounded, "SF Pro Rounded", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --gutter: clamp(16px, 5vw, 32px);
  --maxw: 1080px;
}

/* Tema claro (prefers-color-scheme: light): mesmas marcas sobre o fundo algodão do app (docs/identidade.md).
   Só tokens semânticos mudam; contraste de texto ≥ 4.5:1 sobre --bg (conferido em site/README.md). */
@media (prefers-color-scheme: light) {
  :root {
    --bg: var(--algodao);
    --text: var(--carvao);
    --text-2: #5B4F44;
    --glass: rgba(255, 255, 255, .72);
    --glass-2: rgba(31, 27, 22, .07);
    --border: rgba(31, 27, 22, .16);
    --border-strong: rgba(31, 27, 22, .34);
    --border-input: rgba(31, 27, 22, .6);
    --link: var(--anil);
    --focus: var(--anil);
    --curso-pb: #2E3A87;
    --curso-gp: #5E4386;
    --curso-hb: #9A4520;
    --curso-cf: #7A5600;
    --curso-sb: #0B6870;
    --curso-ef: #17694B;
    --curso-se: #9C2F3C;
    --accent: var(--barro-escuro);
    --accent-2: #0B6870;
    --hover-text: var(--carvao);
    --ok: #17694B; --ok-bg: rgba(30, 127, 92, .12);
    --err: #B01E33; --err-bg: rgba(215, 38, 61, .10);
    --sel: var(--anil); --sel-bg: rgba(46, 58, 135, .10);
    --par-1: #8A6400; --par-2: #0B6870; --par-3: #9A4520; --par-4: #5E4386; --par-5: #17694B;
    --footer-bg: rgba(31, 27, 22, .04);
    --stars: 0;
    --shadow-glow: 0 8px 22px rgba(200, 100, 47, .28);
    --bg-image: linear-gradient(180deg, #FFFBF5 0%, var(--algodao) 40%, #F7EEDF 100%);
  }
}