/* base.css — tokens, reset e tipografia.
   Os tokens de marca e de superfície NÃO são arbitrados aqui: vêm da identidade
   da Automatize já documentada em bio-link-automatize (cobalto #4363DA amostrado
   da própria logo, âmbar #F0B429 como sinal, e as superfícies escuras da marca).
   O peso da interface está na leitura de texto longo, não em gráfico. */
:root{
  /* superfícies — faixas claras da marca */
  --fundo:#F4F5F7;
  --superficie:#FFFFFF;
  --superficie-2:#FAFBFC;
  --superficie-3:#EEF0F5;
  --superficie-4:#DFE3EC;

  /* texto */
  --tinta:#0E1424;
  --tinta-2:#59617A;
  /* #676F84 e não o #8B93A8 da marca: os rótulos em caixa alta ficam em 10,5px
     e o tom original entrega 3,07:1 sobre branco, abaixo do mínimo AA. */
  --tinta-3:#676F84;

  /* linhas */
  --linha:#DFE3EC;
  --linha-2:#ECEFF4;

  /* marca — cobalto da logo, escurecido para texto sobre fundo claro */
  --marca:#4363DA;
  --marca-2:#3452C4;
  --marca-3:#26397F;
  --marca-suave:#E8ECFB;
  --btn-marca:#4363DA; --btn-marca-hover:#3452C4;

  /* âmbar da marca: sinal, não decoração. Usado como preenchimento;
     o texto usa a versão escura, que passa em contraste. */
  --ambar:#F0B429;

  /* semântica do diagnóstico — verde/âmbar/cinza, sem vermelho de pressão */
  --ok:#11845C;        --ok-suave:#E2F2EB;   --ok-texto:#0B6144;
  --atencao:#855903;   --atencao-suave:#FBF1DC;
  --neutro:#676F84;    --neutro-suave:#EEF0F5;
  --duvida:#6B4FA8;    --duvida-suave:#F0EBFA;
  --alerta:#A8432A;    --alerta-suave:#FAE9E4;

  /* tipografia */
  --f-titulo:"Archivo","Segoe UI",system-ui,sans-serif;
  --f-texto:"Inter","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;

  /* medidas */
  --r:12px; --r-sm:8px; --r-xs:5px;
  --sombra:0 1px 2px rgba(14,20,36,.05), 0 1px 3px rgba(14,20,36,.04);
  --sombra-2:0 6px 20px rgba(14,20,36,.10);
  --sombra-3:0 18px 50px rgba(14,20,36,.18);
  --t:170ms cubic-bezier(.4,0,.2,1);
  --lateral:236px;
}

/* Escuro: as superfícies são as mesmas da marca (deep, background, surface,
   surface-high) — o tema escuro daqui é literalmente o da Automatize. */
:root[data-tema="escuro"]{
  --fundo:#0A0E1A;
  --superficie:#0E1424;
  --superficie-2:#161D31;
  --superficie-3:#1C2338;
  --superficie-4:#2A3350;
  --tinta:#F4F5F7;
  --tinta-2:#C3C8D4;
  --tinta-3:#8B93A8;
  --linha:#2A3350;
  --linha-2:#1C2338;
  --marca:#8FA8F0;
  --marca-2:#AFC0F6;
  --marca-3:#CBD6FA;
  --marca-suave:#1B2444;
  --btn-marca:#4363DA; --btn-marca-hover:#5573E6;
  --ambar:#F0B429;
  --ok:#4FC49A;        --ok-suave:#12302A;   --ok-texto:#7FD9B8;
  --atencao:#F0B429;   --atencao-suave:#2E2617;
  --neutro:#8B93A8;    --neutro-suave:#1C2338;
  --duvida:#A791E0;    --duvida-suave:#241E3D;
  --alerta:#E08A6E;    --alerta-suave:#33211B;
  --sombra:0 1px 2px rgba(0,0,0,.3), 0 1px 3px rgba(0,0,0,.2);
  --sombra-2:0 6px 20px rgba(0,0,0,.4);
  --sombra-3:0 18px 50px rgba(0,0,0,.55);
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--fundo);
  color:var(--tinta);
  font-family:var(--f-texto);
  font-size:14px;
  line-height:1.55;
  font-variant-numeric:tabular-nums;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4,h5{font-family:var(--f-titulo);margin:0;line-height:1.18;letter-spacing:-.018em;font-weight:700}
h1{font-size:25px;font-weight:800}
h2{font-size:19px}
h3{font-size:16px}
h4{font-size:14px}
p{margin:0}

a{color:var(--marca);text-decoration:none;text-underline-offset:2px}
a:hover{text-decoration:underline}

button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
input,select,textarea{font:inherit;color:inherit}

:focus-visible{outline:2px solid var(--marca);outline-offset:2px;border-radius:var(--r-xs)}

svg{flex:none;display:block}

code,kbd,.mono{font-family:var(--f-mono);font-size:.92em}

::selection{background:var(--marca-suave);color:var(--marca-3)}

/* barra de rolagem discreta */
*::-webkit-scrollbar{width:11px;height:11px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:var(--superficie-4);border-radius:99px;border:3px solid var(--fundo)}
*::-webkit-scrollbar-thumb:hover{background:var(--tinta-3)}

/* utilitários */
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.rotulo{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--tinta-3);font-weight:500}
.esmaecido{color:var(--tinta-2)}
.tenue{color:var(--tinta-3)}
.quebra{white-space:pre-wrap;overflow-wrap:anywhere}
.nowrap{white-space:nowrap}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
}