/* ============================================================================
   BEATRIZ AI COACH — TOKENS (design system v1.2, Parte A, seções 2.2/2.3/2.4)
   ============================================================================
   FONTE ÚNICA de cor, tipo e espaço da interface. Regra de governança (seção 6):
   toda cor/tamanho/espaço novo vem de token nomeado — hex solto em código é
   defeito; cor nova só entra ALTERANDO esta paleta, nunca numa tela isolada.

   COMO ISTO SE LIGA AO CSS LEGADO: o :root do style.css NÃO foi apagado — as
   variáveis legadas (--bg, --panel, --ink, --line, --blue, …) passaram a ser
   ALIASES destes tokens (ver o bloco de remapeamento no style.css). Assim as
   ~2.500 linhas existentes mudam de paleta sem reescrita, e código novo deve
   usar os tokens DAQUI diretamente.

   Carregado ANTES do style.css no index.html. Custom properties resolvem em
   computed-value time, então a ordem não é load-bearing — é só legibilidade.
   ============================================================================ */
:root{
  /* ---- 2.2 FUNDOS E TRAÇOS (a profundidade — elevação por CLAREAMENTO, nunca sombra preta) ---- */
  --bg-0:#05080F;      /* poço — atrás de tudo (moldura do app, palco em imersão) */
  --bg-1:#0A1120;      /* base — fundo padrão da página */
  --bg-2:#101A2E;      /* superfície — cards, tabela, console de chat */
  --bg-3:#16233C;      /* elevado — pop-ups, painel de detalhe, hover de linha */
  --stroke-1:#1C2A44;  /* traço fino (hairline 1px) — divisórias e contorno de card */
  --stroke-2:#2A3B5C;  /* traço interativo — contorno de campo, chip e botão secundário */

  /* ---- 2.2 TEXTO (o contraste; piso 4,5:1 — o --text-3 é o piso; --text-mute NUNCA carrega informação) ---- */
  --text-1:#EAF2FF;    /* dados, títulos, valores — o que decide (≈16:1 sobre --bg-1) */
  --text-2:#B7C5DC;    /* corpo de leitura e explicação (≈11:1) */
  --text-3:#7E8FAD;    /* metadado, rótulo de apoio, legenda (≈5,8:1 — o piso) */
  --text-mute:#55617A; /* SÓ desabilitado/placeholder (≈3:1) — proibido para informação */

  /* ---- 2.2 ACENTO VIVO (assinatura HUD): interação e presença da IA.
          Proibido em texto corrido e fundos grandes; meta de área ~2% da tela. ---- */
  --ciano:#3DDDF2;
  --ciano-ink:#041018;           /* texto sobre botão primário ciano (2.6) */
  --ciano-veu:rgba(61,221,242,.12);
  --ciano-halo:rgba(61,221,242,.40);

  /* ---- 2.2 SEMÂNTICAS (matiz = estado, contrato ÚNICO e global; herdadas do PDI).
          Três intensidades por token: cheia (texto/ícone), véu (fundo de chip a 12%),
          halo (glow externo a ~40%). Estado nunca é só cor: chip = cor + ícone + palavra. ---- */
  --ok:#34D690;    --ok-veu:rgba(52,214,144,.12);   --ok-halo:rgba(52,214,144,.40);
  --warn:#F5B840;  --warn-veu:rgba(245,184,64,.12); --warn-halo:rgba(245,184,64,.40);
  --crit:#F26D6D;  --crit-veu:rgba(242,109,109,.12);--crit-halo:rgba(242,109,109,.40);
  --proc:#A88BFA;  --proc-veu:rgba(168,139,250,.12);--proc-halo:rgba(168,139,250,.40);

  /* ---- F5: paleta FIXA de séries de gráfico (semântica só quando o dado é bom/ruim) ---- */
  --serie-1:var(--ciano);
  --serie-2:#6EA8FE;   /* azul */
  --serie-3:var(--proc);
  --serie-4:var(--ok);

  /* ---- 2.3 TIPOGRAFIA (poucos tamanhos, cada um com papel; desktop raiz 16px) ----
     display-kpi: SÓ número-herói de KPI, nunca frase. h1-sala: 1 por tela.
     corpo: leitura longa nunca menor. rotulo: caixa alta, piso absoluto 11px. */
  --font-ui:'Inter',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',Consolas,monospace;  /* todo valor numérico em coluna: tabular-nums, à direita */
  --fs-kpi:30px;    --fw-kpi:700;
  --fs-h1:22px;     --fw-h1:650;
  --fs-h2:17px;     --fw-h2:600;
  --fs-corpo:15px;  --fw-corpo:450; --lh-corpo:1.6;
  --fs-apoio:13px;  --lh-apoio:1.5;
  --fs-rotulo:11px; --fw-rotulo:650; --ls-rotulo:.08em;

  /* ---- 2.4 GRADE, ESPAÇO E CHASSI (unidade 8px, micro 4px) ---- */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px;
  --r-card:12px; --r-ctl:8px; --r-chip:999px;
  --topbar-h:56px;
  --hairline:1px solid var(--stroke-1);

  /* ---- 2.7 MOVIMENTO (easing único; decoração contínua proibida — as únicas animações
          permanentes: respiração do item ativo do menu, ponto AO VIVO, badge de alerta 3 ciclos) ---- */
  --ease:cubic-bezier(.2,.8,.2,1);
  --dur-micro:150ms; --dur-painel:250ms; --dur-palco:400ms;
}

/* Papéis tipográficos como CLASSES utilitárias (2.3) — para markup novo; o legado
   continua com suas classes e herda a paleta pelos aliases. */
.t-kpi{font-size:var(--fs-kpi);font-weight:var(--fw-kpi);font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--text-1)}
.t-h1{font-size:var(--fs-h1);font-weight:var(--fw-h1);color:var(--text-1)}
.t-h2{font-size:var(--fs-h2);font-weight:var(--fw-h2);color:var(--text-1)}
.t-corpo{font-size:var(--fs-corpo);font-weight:var(--fw-corpo);line-height:var(--lh-corpo);color:var(--text-2)}
.t-apoio{font-size:var(--fs-apoio);line-height:var(--lh-apoio);color:var(--text-3)}
.t-rotulo{font-size:var(--fs-rotulo);font-weight:var(--fw-rotulo);letter-spacing:var(--ls-rotulo);text-transform:uppercase;color:var(--text-3)}
.t-num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;text-align:right}

/* prefers-reduced-motion: estados finais estáticos (2.5/2.7) — vale para TODA animação nova
   deste redesign (as classes de chassi/ícones/padrões respeitam via este kill genérico). */
@media (prefers-reduced-motion:reduce){
  .hud-anim,.hud-anim *{animation:none!important;transition:none!important}
}
