/* =====================================================================
   Repique · tokens de design (piloto 2026-09-02, aplicado em Automações)
   Uma fonte só de verdade para cor, tipo, espaço e foco. O app (index.html)
   já define --bg/--panel/--txt/--line/--muted por tema; aqui entram os
   nomes de marca, a escala tipográfica e as tintas semânticas.
   ===================================================================== */
:root{
  /* paleta nomeada */
  --rq-repique:#FB4314;   /* a marca: o ponto */
  --rq-tinta:#12151C;
  --rq-papel:#F4F3EE;
  --rq-linha:#E4E3DD;
  --rq-sinal:#22C55E;
  /* tipografia */
  --font-display:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; /* decisão do Thiago: fonte do sistema, igual ao resto do app */
  --font-body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --fs-1:12px; --fs-2:13px; --fs-3:14px; --fs-4:16px; --fs-5:20px; --fs-6:28px;
  /* espaço e forma */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px;
  --r-s:8px; --r-m:12px; --r-l:16px;
  --ring:0 0 0 2px var(--bg,#0E0E11),0 0 0 4px var(--rq-repique);
  /* tintas semânticas (tema escuro = padrão do app) */
  --tint-quando-bg:#15263a; --tint-quando-fg:#9cc7ff;
  --tint-se-bg:#3a2a12;     --tint-se-fg:#f1c27b;
  --tint-faca-bg:#12321f;   --tint-faca-fg:#8fe0b0;
}
body.light{
  --tint-quando-bg:#e6f1fb; --tint-quando-fg:#0c447c;
  --tint-se-bg:#fdf0e6;     --tint-se-fg:#8a4d12;
  --tint-faca-bg:#e1f5ee;   --tint-faca-fg:#0f6e56;
}
/* piso de qualidade, vale para o app inteiro */
:focus-visible{ outline:2px solid var(--rq-repique); outline-offset:2px; border-radius:var(--r-s); }
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
/* o ponto: assinatura da marca, sinal de "está rodando" */
.rq-dot{ display:inline-block; width:.42em; height:.42em; border-radius:50%; background:var(--rq-repique); vertical-align:baseline; margin-left:.06em; }
.rq-dot.vivo{ animation:rq-pulse 2.4s ease-in-out infinite; }
@keyframes rq-pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.45; } }
