/* Tokens de cor, forma e tipografia (26/10/2026). Carregado ANTES de todas as folhas e única fonte destes valores.
   Antes havia seis blocos em cascata (style, operations, polish x4, trendai): o trendai.css, por vir por último, vencia,
   então os valores abaixo são os que já valiam na tela. Mudar um tom aqui muda o produto inteiro; as folhas só usam var().
   Só ficam fora daqui os tokens de uma tela só (os --am-* do mapa, no attackmap.css). */
:root {
  color-scheme: dark;

  /* superfícies e linhas */
  --bg: #000;
  --panel: #0c0c0c;
  --panel2: #141414;
  --raise: #161616;
  --hover: rgb(255 255 255 / 3%);
  --line: #2a2a2a;
  --line-soft: #1d1d1d;
  --line-strong: #323232;
  --control-border: #696975; /* borda de campo e botão: 3:1 contra o painel (WCAG 1.4.11) */

  /* texto */
  --text: #f1f1f1;
  --muted: #b6b6b6;
  --quiet: #989898;
  --link: #e4e4ea;
  --id: #a9a9b3;

  /* marca TrendAI: vermelho de ação, foco e degradê do site */
  --ta-red: #d71920;
  --ta-red-400: #f94548;
  --ta-red-600: #ae1218;
  --ta-orange: #ff9500;
  --ta-grad: linear-gradient(90deg, #d71920 0%, #d71920 45%, #ff9500 100%);
  --accent: #d71920;
  --focus: #f94548;

  /* severidade (iguais às cores de app.js) e atenção */
  --sev-critical: #f94548;
  --sev-high: #f39a4c;
  --sev-medium: #d4bc72;
  --sev-low: #8f97a2;
  --critical: var(--sev-critical);
  --high: var(--sev-high);
  --medium: var(--sev-medium);
  --low: var(--sev-low);
  --attention: #f0b35a;

  /* estados dos ativos (Frota) */
  --fleet-down: #ff4557;
  --fleet-warning: #f39a4c;
  --fleet-unknown: #8f8f99;
  --fleet-off: #7a7a85; /* 26/10/2026: era #4a4a52 (2,09:1 no cartão); agora 4,33:1 (WCAG 1.4.11) */
  --fleet-healthy: #4fae84;
  --chart: #83afe3;

  /* tons que ainda aparecem soltos nas folhas (os mais repetidos). Não são os tokens de cima: unificá-los muda o visual,
     então ficam nomeados aqui até alguém decidir para qual token cada um vai. */
  --white: #fff;
  --black: #000;
  --red-500: #ed2337; /* o vermelho antigo (antes de 20/10), ainda em botões e bordas de operations/v3 */
  --red-400: #ff4557;
  --red-300: #ff3a4e;
  --red-600: #d61f31;
  --red-200: #ff8f9b; /* vermelho claro para texto sobre fundo escuro */
  --gray-700: #3a3a3a;
  --gray-650: #34343c;
  --gray-300: #a3a3ad;
  --gray-200: #d6d6de;
  --ink-900: #181818;
  --ink-950: #0e0e11;

  /* forma */
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 10px;
  --shell-width: 252px;
  --lift: 0 1px 0 rgb(255 255 255 / 3%) inset, 0 1px 2px rgb(0 0 0 / 35%);
  --float: 0 24px 64px -16px rgb(0 0 0 / 75%), 0 2px 8px rgb(0 0 0 / 45%);
  --ease: cubic-bezier(.2, .7, .2, 1);

  /* tipografia: Work Sans (licença ao lado) e uma escala curta. Piso de 12 px para texto legível. */
  --ta-font: "Work Sans", "Segoe UI", system-ui, sans-serif;
  --font: var(--ta-font);
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --fs-xl: 20px;
  --fs-2xl: 24px;
}