/* =============================================================
PlayMode — tokens da identidade.
Este é o ÚNICO arquivo onde cor, fonte e espaçamento são definidos.
Mexer aqui muda o site inteiro. Mexer em outro lugar quebra a identidade.
ATENÇÃO: as fontes do Google NÃO são mais carregadas por @import aqui.
O @import obrigava o navegador a baixar em fila
(html -> style.css -> tokens.css -> google -> arquivo da fonte).
Agora o fica direto no de cada página, em paralelo.
Se criar uma página nova, copie o bloco de do index.html.
============================================================= */
:root{
/* superfícies — tubo de TV desligado */
--void:#08080A;
--panel:#101014;
--panel-2:#16161B;
--line:#2A2A31;
/* texto — fósforo */
--bone:#EDEAE3;
--soft:#C0BDB6;
--dim:#84827D;
/* duas tintas de canal. Não acrescente uma terceira. */
--cy:#21E7F0;
--mg:#FF2D8E;
/* estado */
--ok:#21E7F0;
--alerta:#FF2D8E;
/* tipografia */
--f-texto:"Archivo","Archivo Fallback",system-ui,sans-serif;
--f-osd:"VT323","VT323 Fallback",ui-monospace,monospace;
/* larguras de fonte usadas no display (Archivo é variável) */
--w-display:"wdth" 120,"wght" 900;
--w-titulo:"wdth" 112,"wght" 800;
/* espaço */
--gut:clamp(14px,4vw,44px);
--max:1240px;
--sec:clamp(28px,5vw,58px);
/* alvo mínimo de toque no celular */
--toque:44px;
}
/* -------------------------------------------------------------
Fontes de reserva com métricas ajustadas.
Enquanto Archivo e VT323 baixam, o texto é desenhado com a fonte
do sistema NA MESMA ALTURA DE LINHA. Quando a fonte real chega,
ela troca sem empurrar nada — é isso que zera a parte do layout
shift causada por fonte (pedaço grande do CLS 0,48 do relatório).
------------------------------------------------------------- */
@font-face{
font-family:"Archivo Fallback";
src:local("Arial"),local("Helvetica Neue"),local("Roboto"),local("Segoe UI");
size-adjust:100.5%;
ascent-override:94.2%;
descent-override:24.2%;
line-gap-override:0%;
}
@font-face{
font-family:"VT323 Fallback";
src:local("Courier New"),local("Consolas"),local("DejaVu Sans Mono");
size-adjust:78%;
ascent-override:98%;
descent-override:22%;
line-gap-override:0%;
}
/* Tema claro. A identidade continua a mesma; só inverte o tubo, sem criar
uma segunda marca aleatória com cores de aplicativo bancário. */
html[data-theme="light"]{
--void:#F2EEE5;
--panel:#FCFAF5;
--panel-2:#E8E3D9;
--line:#B8B1A5;
--bone:#111116;
--soft:#3E3C40;
--dim:#666269;
--ok:#007E86;
--alerta:#B8005D;
}