/* Casa Resuelta — tokens do design system (docs/04). Herdados do PDF aprovado. */
:root {
  /* cores-base */
  --navy: #0E1420;        /* fundo do tablero, header, modo taller */
  --navy-2: #172033;      /* caixa do painel, cards sobre navy */
  --ink: #141A26;         /* texto principal sobre claro */
  --paper: #FAF7F2;       /* fundo de leitura (igual às páginas do PDF) */
  --line: #E7E1D6;        /* divisórias e bordas sobre claro */
  --muted: #6B7280;       /* texto secundário (4,52:1 sobre paper) */
  --orange: #FF8A00;      /* ação principal, foco, cor padrão de módulo — nunca como cor de texto sobre claro */
  --yellow: #FFC233;      /* faixa de segurança */
  --white: #FFFFFF;
  --on-navy: #E8ECF3;     /* texto sobre navy */
  --on-navy-muted: #9AA6BA;

  /* recuadros: cor de destaque · texto do rótulo (AA) · fundo */
  --danger: #DC2626;  --danger-ink: #B91C1C;  --danger-bg: #FEF2F2;
  --tip: #D97706;     --tip-ink: #B45309;     --tip-bg: #FFFBEB;
  --ok: #16A34A;      --ok-ink: #15803D;      --ok-bg: #F0FDF4;
  --pro: #2563EB;     --pro-ink: #1D4ED8;     --pro-bg: #EFF6FF;
  --link: #B45309;    /* laranja escurecido para texto/links (4,7:1 sobre paper) */

  /* cor do módulo: definida por elemento (style="--mod: #FFC233").
     Para texto sobre claro usa a versão escurecida. docs/04 sugere 70%; com 70% o amarelo de
     Electricidad dá 3,85:1 (reprova AA). 62% passa em todos os 17 módulos (pior: 5,11:1). */
  --mod: var(--orange);
  --mod-ink: color-mix(in oklab, var(--mod) 62%, black);

  /* tipografia */
  --f-display: "Bebas Neue", Impact, "Arial Narrow", sans-serif;
  --f-cond: "Barlow Condensed", "Arial Narrow", sans-serif;
  --f-body: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-marker: "Permanent Marker", "Comic Sans MS", cursive;

  --fs-body: 1.0625rem;        /* 17 px (18 px no desktop) */
  --lh-body: 1.55;
  --fs-small: 0.875rem;
  --fs-chip: 0.9375rem;        /* 15 px, Barlow */
  --fs-section: 1.25rem;       /* 20/22 px, Inter 700 */
  --fs-lesson: 2.5rem;         /* 40/56 px, Bebas */
  --fs-screen: 2.25rem;
  --measure: 68ch;

  /* espaço, raio, sombra */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px;
  --r-sm: 6px; --r: 10px; --r-lg: 16px; --r-pill: 999px;
  --shadow-1: 0 1px 2px rgb(20 26 38 / .08), 0 1px 1px rgb(20 26 38 / .04);
  --shadow-2: 0 6px 20px rgb(20 26 38 / .12);
  --tap: 44px;                  /* alvo mínimo de toque */

  /* assinatura: faixa de segurança (só no header, no topo de "Atención" e na celebração) */
  --hazard: repeating-linear-gradient(-45deg, var(--yellow) 0 10px, var(--ink) 10px 20px);

  /* movimento (um único momento orquestrado: o breaker subindo) */
  --t-lever: 180ms;
  --t-led: 240ms;
  --ease-snap: cubic-bezier(.2, .9, .3, 1.3);
}

@media (min-width: 900px) {
  :root {
    --fs-body: 1.125rem;
    --fs-section: 1.375rem;
    --fs-lesson: 3.5rem;
    --fs-screen: 3rem;
  }
}