/* ============================================================================
   TOKENS — paleta unica da interface (piloto: /cs2/)
   Cada cor tem UM papel. Fora daqui nao se escreve hex/rgba de cor de UI.

   neutros  : fundo, superficie, campo, texto  (todos do mesmo matiz roxo-escuro)
   marca    : roxo  -> estrutura (bordas, barras de cabecalho, hover)
   ok       : verde -> ligado / acao principal / conectado
   aviso    : ambar -> build desatualizada, atencao
   erro     : vermelho -> agente fechado, falha
   usuario  : a cor do glow do usuario (magenta etc.) so aparece dentro do seletor de cor
   ============================================================================ */
:root {
  /* neutros */
  --ui-bg: #07030e;
  --ui-surface: rgba(14, 8, 25, .80);
  --ui-field: rgba(18, 10, 32, .72);
  --ui-text: #efe6ff;
  --ui-muted: #8c7ea3;
  --ui-dim: #6c5c82;

  /* marca (roxo) */
  --ui-brand: #9333ea;
  --ui-brand-soft: #a855f7;
  --ui-line: rgba(147, 51, 234, .24);
  --ui-line-strong: rgba(168, 85, 247, .5);
  --ui-brand-wash: rgba(147, 51, 234, .14);
  --ui-brand-mid: #5b21b6;                      /* roxo escuro: faixa de brilho dos botoes de acao */
  --ui-brand-deep: #2e1065;                     /* roxo profundo: corpo dos botoes de acao */
  --ui-brand-night: #14062e;                    /* quase preto arroxeado: fundo/sombra dos botoes de acao */
  --ui-brand-glow: rgba(124, 58, 237, .38);

  /* semanticas */
  --ui-ok: #00ff88;
  --ui-ok-wash: rgba(0, 255, 136, .12);
  --ui-warn: #fbbf24;
  --ui-bad: #ff4d6d;
  --ui-bad-wash: rgba(255, 77, 109, .12);
}

/* ----------------------------------------------------------------------------
   Nomes legados -> tokens. Carregue tokens.css POR ULTIMO em cada pagina:
   o ciano deixa de existir como cor de UI; magenta/lilas viram o roxo da marca.
   (a cor do glow do usuario, --neon-pink, fica fora e so aparece no seletor)
   ---------------------------------------------------------------------------- */
:root {
  --neon-green: var(--ui-ok); --neon-green-light: var(--ui-ok); --neon-mint: var(--ui-ok);
  --neon-green-glow: rgba(0, 255, 136, .35); --neon-green-dim: var(--ui-ok-wash);
  --neon-cyan: var(--ui-brand-soft); --neon-cyan-2: var(--ui-brand-soft);
  --neon-cyan-glow: rgba(168, 85, 247, .3); --neon-cyan-dim: var(--ui-brand-wash);
  --neon-purple: var(--ui-brand-soft); --neon-purple-deep: var(--ui-brand); --neon-magenta: var(--ui-brand-soft);
  --neon-red: var(--ui-bad); --neon-red-glow: rgba(255, 77, 109, .35); --neon-red-dim: var(--ui-bad-wash);
  --neon-orange: var(--ui-warn); --neon-gold: var(--ui-warn); --neon-yellow: var(--ui-warn);
  --text-light: var(--ui-text); --text-muted: var(--ui-muted); --text-dim: var(--ui-dim);
  --btn-purple: var(--ui-brand); --btn-purple-hover: var(--ui-brand-soft);
  --cyber-border-focus: var(--ui-line-strong);
}