/* Quem Manda no Quê · tokens (docs/design-system.md)
   Dois fundos: claro na trilha (padrão), escuro nos painéis ([data-tema="escuro"]).
   Uma cor por nível de governo. Piso tipográfico da casa: corpo ≥ 17px, apoio ≥ 15px. */
:root {
  --qmq-bg: #FBF7F0;
  --qmq-bg-2: #F0E9DD;
  --qmq-ink: #1B1917;
  --qmq-ink-2: #6B6560;
  --qmq-line: #1B1917;
  --qmq-line-2: #D9D2C7;
  --qmq-municipio: #B8471F;
  --qmq-estado: #1E6B70;
  --qmq-uniao: #5A2D5C;
  --qmq-acao: #E8B83C;
  --qmq-acao-ink: #1B1917;
  --qmq-neutro: #B9B2A8;
  --qmq-ok: #2F7D4F;
  --qmq-alerta: #B8471F;
  --qmq-sobre-nivel: #FBF7F0;        /* texto sobre as cores dos níveis */

  /* escala tipográfica (celular → computador) */
  --t-display: clamp(30px, 5.2vw, 64px);
  --t-h2: clamp(22px, 3vw, 34px);
  --t-h3: clamp(18px, 2vw, 22px);
  --t-numero: clamp(28px, 3vw, 32px);
  --t-corpo: clamp(17px, 1.05vw, 18px);
  --t-apoio: 15px;
  --t-etiqueta: 15px;

  --f-display: 'Archivo', 'Arial Narrow', Impact, sans-serif;
  --f-texto: 'Atkinson Hyperlegible', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* espaço em múltiplos de 4 */
  --e-1: 4px; --e-2: 8px; --e-3: 12px; --e-4: 16px; --e-5: 20px; --e-6: 24px;
  --e-8: 32px; --e-11: 44px; --e-14: 56px; --e-20: 80px;

  --r-card: 0;      /* passada visual 13/10/2026: blocos chapados, sem canto redondo (pedido do Glauber) */
  --r-bloco: 0;
  --fio: 3px solid var(--qmq-ink);
  --fio-fino: 1px solid var(--qmq-line-2);
  --r-pilula: 999px;

  --largura: 1200px;
  --largura-leitura: 65ch;
  --gutter: 20px;
  --toque: 48px;
  --foco: 0 0 0 3px var(--qmq-acao);
  --dur: 400ms;
  --curva: cubic-bezier(.2, .7, .2, 1);
}

[data-tema="escuro"] {
  --qmq-bg: #1B1917;
  --qmq-bg-2: #2A2724;
  --qmq-ink: #FBF7F0;
  --qmq-ink-2: #CFC8BE;
  --qmq-line: #3B3733;
  --qmq-line-2: #3B3733;
  --qmq-municipio: #D8603A;
  --qmq-estado: #3C9AA0;
  --qmq-uniao: #A86DAB;
  --qmq-acao: #E8B83C;
  --qmq-neutro: #8F877C;
  --qmq-ok: #5CB57E;
  --qmq-alerta: #E07A55;
  --qmq-sobre-nivel: #FBF7F0;
}

@media (max-width: 719px) {
  :root { --gutter: 16px; }
}