/* Reduto360 · Acompanhamento da apuração · estilo (celular primeiro; tema claro; marca: azul e verde)
   Especificação visual: simples/prototipo/estilo.css. Tudo sai dos tokens --ac-*; toda classe e todo id da página levam o prefixo ac- (a landing, que mora na mesma origem,
   usa .chip, .btn e --margem, e a colisão destruiria os dois). Nenhuma cor de partido. As 12 cores de candidato (slot = posição na lista pelo NÚMERO da urna) foram
   escolhidas por distância mínima medida (visão normal, deuteranopia e protanopia: >= 17 de ΔE76 entre qualquer par).
   Item (e) da crítica: para cada cor existem QUATRO tokens sólidos (cheia, texto sobre a cheia, versão "poucas seções" e texto sobre ela). A versão "poucas seções" é a
   cor cheia misturada ao branco do cartão (55%/45%), calculada e escrita em hex (teste/cores_slots.py), e NÃO uma transparência: nenhuma regra deste arquivo usa
   opacidade em elemento que tenha texto ou fique sob um rótulo, e todo par texto/fundo tem >= 4,5:1 (medido por teste/fp2b/verificar_a11y.py, inclusive o texto SVG). */

:root {
  color-scheme: light;
  --ac-fundo: #EEF3FB;
  --ac-cartao: #FFFFFF;
  --ac-tinta: #0A1E43;          /* texto principal (azul-marinho da marca): 16:1 sobre o cartão */
  --ac-tinta-2: #3C4B69;        /* texto de apoio: 8,6:1 */
  --ac-tinta-3: #56627D;        /* legenda: 6:1 sobre o cartão e 5,3:1 sobre o fundo da página */
  --ac-linha: #DCE4F1;
  --ac-linha-2: #B9C6DE;
  --ac-marca: #1B4FA8;          /* azul da marca */
  --ac-marca-escuro: #133C85;
  --ac-marca-suave: #E7EFFC;
  --ac-verde: #12874F;          /* verde de texto e ação: 4,9:1 sobre o branco */
  --ac-verde-escuro: #0B6B3D;
  --ac-verde-vivo: #2FC875;
  --ac-verde-suave: #E3F7EC;
  --ac-ao-vivo: #D92D3A;
  --ac-ambar-fundo: #FFF3C9;
  --ac-ambar-tinta: #5A4200;
  --ac-ambar-borda: #E3C458;
  --ac-erro-fundo: #FDEBEC;
  --ac-erro-tinta: #8A1620;
  --ac-erro-borda: #F3B6BA;
  --ac-info-borda: #BFD3F3;
  --ac-sem-dado: #E4E9F2;
  --ac-raio: 18px;
  --ac-sombra: 0 1px 2px rgba(10, 30, 67, .06), 0 8px 24px -12px rgba(10, 30, 67, .16);
  --ac-f-ui: "Geist", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ac-margem: 16px;
  --ac-cor-sem-slot: #6F7C98;   /* candidato sem slot (mais de 12) */
  /* 12 cores de candidato: cheia, texto sobre a cheia, "poucas seções" (sólida) e texto sobre ela */
  --ac-s0: #4E79A7; --ac-sobre0: #FFFFFF; --ac-sf0: #9EB5CF; --ac-sobref0: #0A1E43;
  --ac-s1: #D55E00; --ac-sobre1: #000000; --ac-sf1: #E8A673; --ac-sobref1: #0A1E43;
  --ac-s2: #59A14F; --ac-sobre2: #0A1E43; --ac-sf2: #A4CB9E; --ac-sobref2: #0A1E43;
  --ac-s3: #6A3D9A; --ac-sobre3: #FFFFFF; --ac-sf3: #AD94C7; --ac-sobref3: #0A1E43;
  --ac-s4: #F0E442; --ac-sobre4: #0A1E43; --ac-sf4: #F7F097; --ac-sobref4: #0A1E43;
  --ac-s5: #264653; --ac-sobre5: #FFFFFF; --ac-sf5: #8899A0; --ac-sobref5: #0A1E43;
  --ac-s6: #009E73; --ac-sobre6: #0A1E43; --ac-sf6: #73CAB2; --ac-sobref6: #0A1E43;
  --ac-s7: #56B4E9; --ac-sobre7: #0A1E43; --ac-sf7: #A2D6F3; --ac-sobref7: #0A1E43;
  --ac-s8: #FF9DA7; --ac-sobre8: #0A1E43; --ac-sf8: #FFC9CF; --ac-sobref8: #0A1E43;
  --ac-s9: #E69F00; --ac-sobre9: #0A1E43; --ac-sf9: #F1CA73; --ac-sobref9: #0A1E43;
  --ac-s10: #E9C46A; --ac-sobre10: #0A1E43; --ac-sf10: #F3DFAD; --ac-sobref10: #0A1E43;
  --ac-s11: #A6CEE3; --ac-sobre11: #0A1E43; --ac-sf11: #CEE4F0; --ac-sobref11: #0A1E43;
}
.ac-slot-0 { --ac-cor: var(--ac-s0); --ac-sobre: var(--ac-sobre0); --ac-cor-fraca: var(--ac-sf0); --ac-sobre-fraca: var(--ac-sobref0); }
.ac-slot-1 { --ac-cor: var(--ac-s1); --ac-sobre: var(--ac-sobre1); --ac-cor-fraca: var(--ac-sf1); --ac-sobre-fraca: var(--ac-sobref1); }
.ac-slot-2 { --ac-cor: var(--ac-s2); --ac-sobre: var(--ac-sobre2); --ac-cor-fraca: var(--ac-sf2); --ac-sobre-fraca: var(--ac-sobref2); }
.ac-slot-3 { --ac-cor: var(--ac-s3); --ac-sobre: var(--ac-sobre3); --ac-cor-fraca: var(--ac-sf3); --ac-sobre-fraca: var(--ac-sobref3); }
.ac-slot-4 { --ac-cor: var(--ac-s4); --ac-sobre: var(--ac-sobre4); --ac-cor-fraca: var(--ac-sf4); --ac-sobre-fraca: var(--ac-sobref4); }
.ac-slot-5 { --ac-cor: var(--ac-s5); --ac-sobre: var(--ac-sobre5); --ac-cor-fraca: var(--ac-sf5); --ac-sobre-fraca: var(--ac-sobref5); }
.ac-slot-6 { --ac-cor: var(--ac-s6); --ac-sobre: var(--ac-sobre6); --ac-cor-fraca: var(--ac-sf6); --ac-sobre-fraca: var(--ac-sobref6); }
.ac-slot-7 { --ac-cor: var(--ac-s7); --ac-sobre: var(--ac-sobre7); --ac-cor-fraca: var(--ac-sf7); --ac-sobre-fraca: var(--ac-sobref7); }
.ac-slot-8 { --ac-cor: var(--ac-s8); --ac-sobre: var(--ac-sobre8); --ac-cor-fraca: var(--ac-sf8); --ac-sobre-fraca: var(--ac-sobref8); }
.ac-slot-9 { --ac-cor: var(--ac-s9); --ac-sobre: var(--ac-sobre9); --ac-cor-fraca: var(--ac-sf9); --ac-sobre-fraca: var(--ac-sobref9); }
.ac-slot-10 { --ac-cor: var(--ac-s10); --ac-sobre: var(--ac-sobre10); --ac-cor-fraca: var(--ac-sf10); --ac-sobre-fraca: var(--ac-sobref10); }
.ac-slot-11 { --ac-cor: var(--ac-s11); --ac-sobre: var(--ac-sobre11); --ac-cor-fraca: var(--ac-sf11); --ac-sobre-fraca: var(--ac-sobref11); }
.ac-slot-nenhum { --ac-cor: var(--ac-cor-sem-slot); --ac-sobre: #FFFFFF; --ac-cor-fraca: #B8C0D1; --ac-sobre-fraca: #0A1E43; }
.ac-slot-marca { --ac-cor: var(--ac-marca); --ac-sobre: #FFFFFF; --ac-cor-fraca: #A9BFE3; --ac-sobre-fraca: #0A1E43; }

* { box-sizing: border-box; }
/* O atributo hidden perde para qualquer display declarado; a página alterna vistas por hidden, então ele tem de mandar sempre. */
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body.ac-pagina { margin: 0; background: var(--ac-fundo); color: var(--ac-tinta); font-family: var(--ac-f-ui); font-size: 16px; line-height: 1.45; overflow-x: hidden; }
/* Resets com especificidade ZERO (:where): um reset de especificidade 0,1,1 derrubaria as margens, a cor e a fonte de toda classe simples abaixo (.ac-nota, .ac-cands__mais, .ac-cargo...). */
:where(.ac-pagina) :where(img, svg) { display: block; max-width: 100%; }
:where(.ac-pagina) button { font: inherit; color: inherit; }
:where(.ac-pagina) a { color: var(--ac-marca); }
:where(.ac-pagina) :where(h1, h2, h3, p) { margin: 0; }
.ac-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.ac-pular { position: absolute; left: -999px; top: 8px; background: var(--ac-marca); color: #fff; padding: 10px 14px; border-radius: 10px; z-index: 100; }
.ac-pular:focus { left: 8px; }
:where(.ac-pagina) :focus-visible { outline: 3px solid var(--ac-marca); outline-offset: 2px; border-radius: 6px; }
.ac-conteudo:focus { outline: none; }

/* ------------------------------------------------------------ topo */
.ac-topo { background: var(--ac-cartao); }
.ac-topo__miolo { max-width: 1180px; margin: 0 auto; padding: 8px var(--ac-margem); display: flex; align-items: center; gap: 10px; }
.ac-marca { display: block; flex: none; }
.ac-marca__img { width: 66px; height: auto; }
.ac-topo__texto { flex: 1; min-width: 0; }
.ac-topo__eleicao { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ac-tinta-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ac-topo__titulo { font-size: 20px; white-space: nowrap; line-height: 1.1; font-weight: 800; letter-spacing: -.02em; color: var(--ac-marca); }
.ac-topo__lado { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.ac-selo { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px 5px 8px; border-radius: 999px; background: #FDECEE; color: #A3202C; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.ac-selo__ponto { width: 9px; height: 9px; border-radius: 50%; background: var(--ac-ao-vivo); animation: ac-pulsa 1.6s ease-in-out infinite; }
.ac-selo[data-fase="pre_votacao"] { background: var(--ac-marca-suave); color: var(--ac-marca-escuro); }
.ac-selo[data-fase="pre_votacao"] .ac-selo__ponto { background: var(--ac-marca); animation: none; }
.ac-selo[data-fase="encerrada"] { background: var(--ac-verde-suave); color: var(--ac-verde-escuro); }
.ac-selo[data-fase="encerrada"] .ac-selo__ponto { background: var(--ac-verde); animation: none; }
.ac-selo[data-fase="desconhecida"] { background: #EEF0F4; color: var(--ac-tinta-2); }
.ac-selo[data-fase="desconhecida"] .ac-selo__ponto { background: #6F7C98; animation: none; }
@keyframes ac-pulsa { 0%, 100% { box-shadow: 0 0 0 0 rgba(217, 45, 58, .45); } 50% { box-shadow: 0 0 0 6px rgba(217, 45, 58, 0); } }
.ac-icone-botao { width: 44px; height: 44px; margin: -6px -8px -6px 0; border: 0; background: transparent; color: var(--ac-marca); display: none; align-items: center; justify-content: center; border-radius: 12px; cursor: pointer; }
.ac-topo__fio { height: 4px; background: linear-gradient(90deg, var(--ac-marca) 0%, #2F7BC4 55%, var(--ac-verde-vivo) 100%); }

/* ------------------------------------------------------------ abas de cargo (grudam no topo ao rolar) */
.ac-cargos { position: sticky; top: 0; z-index: 30; background: #FFFFFF; border-bottom: 1px solid var(--ac-linha); }
.ac-cargos__trilho { max-width: 1180px; margin: 0 auto; display: flex; gap: 8px; padding: 10px var(--ac-margem); overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; }
.ac-cargos__trilho::-webkit-scrollbar { display: none; }
.ac-cargo { flex: 0 0 auto; min-height: 44px; padding: 0 18px; border-radius: 999px; border: 1.5px solid var(--ac-linha-2); background: #fff; font-weight: 600; font-size: 15px; color: var(--ac-tinta-2); cursor: pointer; scroll-snap-align: start; white-space: nowrap; }
.ac-cargo[aria-selected="true"] { background: var(--ac-marca); border-color: var(--ac-marca); color: #fff; box-shadow: 0 6px 14px -8px rgba(27, 79, 168, .8); }
/* Sem dado para mostrar (carregando, erro, gate) as abas não têm o que trocar. */
body[data-tela="iniciando"] .ac-cargos, body[data-tela="verificando-acesso"] .ac-cargos, body[data-tela="carregando"] .ac-cargos,
body[data-tela="sem-cadastro"] .ac-cargos, body[data-tela="erro-sem-dado"] .ac-cargos { display: none; }

/* ------------------------------------------------------------ avisos (faixas) */
.ac-avisos { max-width: 1180px; margin: 0 auto; padding: 0 var(--ac-margem); }
.ac-aviso { margin-top: 12px; padding: 12px 14px; border-radius: 14px; font-size: 14px; line-height: 1.4; }
.ac-aviso strong { font-weight: 700; }
.ac-aviso__saida { margin-left: 4px; font-weight: 600; white-space: nowrap; }
.ac-aviso[data-aviso="atrasada"], .ac-aviso[data-aviso="limite"] { background: var(--ac-ambar-fundo); color: var(--ac-ambar-tinta); border: 1px solid var(--ac-ambar-borda); }
.ac-aviso[data-aviso="atrasada"] a, .ac-aviso[data-aviso="limite"] a { color: var(--ac-ambar-tinta); }
.ac-aviso[data-aviso="indisponivel"], .ac-aviso[data-aviso="falha"] { background: var(--ac-erro-fundo); color: var(--ac-erro-tinta); border: 1px solid var(--ac-erro-borda); }
.ac-aviso[data-aviso="indisponivel"] a, .ac-aviso[data-aviso="falha"] a { color: var(--ac-erro-tinta); }
.ac-aviso[data-aviso="uf-sem-dado"], .ac-aviso[data-aviso="demora"] { background: var(--ac-marca-suave); color: var(--ac-marca-escuro); border: 1px solid var(--ac-info-borda); }

/* ------------------------------------------------------------ miolo */
.ac-conteudo { max-width: 1180px; margin: 0 auto; padding: 14px var(--ac-margem) 8px; }
.ac-vista { display: grid; gap: 14px; min-width: 0; }
.ac-cartao { background: var(--ac-cartao); border: 1px solid var(--ac-linha); border-radius: var(--ac-raio); box-shadow: var(--ac-sombra); padding: 18px 16px; min-width: 0; }
.ac-cartao { scroll-margin-top: 84px; }
/* Sem o mapa (ac-mapa.js ausente ou malha ausente) a página segue: a tabela e o seletor bastam. */
body[data-sem-mapa="sim"] #ac-mapa-cartao, body[data-sem-mapa="sim"] #ac-mapa2-cartao { display: none; }
.ac-cartao__titulo { font-size: 13px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--ac-tinta-3); }
.ac-cartao__sub { margin-top: 4px; font-size: 14px; color: var(--ac-tinta-2); }
.ac-lista-titulo { margin-top: 20px; }

/* hero: quanto da apuração já foi */
.ac-hero__linha { display: flex; align-items: baseline; gap: 4px 10px; margin-top: 8px; flex-wrap: wrap; }
.ac-hero__numero { font-size: 58px; line-height: .95; font-weight: 800; letter-spacing: -.045em; font-variant-numeric: tabular-nums; color: var(--ac-tinta); }
.ac-hero__numero small { font-size: .5em; font-weight: 700; letter-spacing: 0; margin-left: 2px; color: var(--ac-tinta-2); }
.ac-hero__rotulo { font-size: 17px; font-weight: 500; color: var(--ac-tinta-2); line-height: 1.2; }
.ac-barra { margin-top: 14px; height: 12px; border-radius: 999px; background: var(--ac-linha); overflow: hidden; }
.ac-barra__cheia { height: 100%; width: var(--ac-p, 0%); border-radius: 999px; background: linear-gradient(90deg, var(--ac-marca), var(--ac-verde-vivo)); transition: width .8s cubic-bezier(.23, 1, .32, 1); }
.ac-hero__meta { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 14px; color: var(--ac-tinta-2); }
.ac-hero__meta b { font-weight: 600; color: var(--ac-tinta); }
.ac-chips { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
.ac-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 0 12px; border-radius: 999px; font-size: 13px; font-weight: 600; background: var(--ac-marca-suave); color: var(--ac-marca-escuro); }
.ac-chip[data-variante="final"] { background: var(--ac-verde-suave); color: var(--ac-verde-escuro); }
.ac-chip[data-variante="espera"] { background: #EEF0F4; color: var(--ac-tinta-2); }
.ac-chip[data-variante="atraso"] { background: var(--ac-ambar-fundo); color: var(--ac-ambar-tinta); }
.ac-chip--relogio { background: transparent; color: var(--ac-tinta-3); padding: 0; font-weight: 500; font-size: 13px; min-height: 22px; font-variant-numeric: tabular-nums; }
.ac-chip--relogio svg { width: 15px; height: 15px; flex: none; }

/* contagem para as 17h (pré-votação) */
.ac-espera__hora { margin-top: 10px; font-size: 34px; line-height: 1.05; font-weight: 800; letter-spacing: -.03em; color: var(--ac-marca); }
.ac-espera__faltam { margin-top: 8px; font-size: 18px; color: var(--ac-tinta-2); font-variant-numeric: tabular-nums; }
.ac-espera__faltam b { color: var(--ac-tinta); font-weight: 700; }
.ac-nota--colada { margin-top: 2px; }

/* lista de candidatos */
.ac-cands { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 4px; }
.ac-cand { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; column-gap: 12px; align-items: center; padding: 10px 6px; border-radius: 14px; border: 0; background: transparent; text-align: left; width: 100%; min-height: 44px; }
button.ac-cand { cursor: pointer; }
button.ac-cand:hover { background: #F4F7FC; }
.ac-cand[aria-pressed="true"] { background: var(--ac-marca-suave); box-shadow: inset 0 0 0 2px var(--ac-marca); }
/* MINIATURA DO CANDIDATO (retrato 5:7, a proporção do arquivo do TSE: 161x225). O quadrado de cor continua sendo a LEGENDA DE COR do candidato (mesma cor da barra de votos e do mapa):
   com foto ele vira o ANEL em volta dela (--ac-anel), sem foto é o bloco inteiro com a inicial, nas MESMAS medidas (a lista não muda de altura quando uma foto falha).
   Sem opacity (a guarda proíbe e o contraste da cor se perderia) e sem sombra pesada: o fio escuro de 1 px do quadrado, que já existia, segue sendo o contorno do anel. */
.ac-cand__cor { --ac-anel: 3px; --ac-raio-cor: 10px; position: relative; overflow: hidden; width: 40px; height: 56px; border-radius: var(--ac-raio-cor); background: var(--ac-cor, var(--ac-cor-sem-slot)); color: var(--ac-sobre, #FFFFFF); display: grid; place-items: center; font-size: 16px; font-weight: 800; box-shadow: inset 0 0 0 1px rgba(10, 30, 67, .35); }
.ac-cand__foto { position: absolute; top: var(--ac-anel); left: var(--ac-anel); width: calc(100% - 2 * var(--ac-anel)); height: calc(100% - 2 * var(--ac-anel)); object-fit: cover; object-position: 50% 20%; border-radius: calc(var(--ac-raio-cor) - var(--ac-anel)); }
.ac-cand__nome { font-size: 17px; font-weight: 700; line-height: 1.15; overflow-wrap: anywhere; }
.ac-cand__apoio { margin-top: 2px; font-size: 13px; color: var(--ac-tinta-3); }
.ac-cand__frente { margin-top: 1px; font-size: 13px; font-weight: 600; color: var(--ac-verde); }
.ac-cand__pct { text-align: right; font-size: 26px; line-height: 1; font-weight: 800; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.ac-cand__votos { margin-top: 3px; font-size: 13px; color: var(--ac-tinta-3); text-align: right; font-variant-numeric: tabular-nums; }
.ac-cand__faixa { grid-column: 2 / 4; margin-top: 8px; height: 8px; border-radius: 999px; background: var(--ac-linha); overflow: hidden; }
.ac-cand__faixa > i { display: block; height: 100%; width: var(--ac-p, 0%); border-radius: 999px; background: var(--ac-cor, var(--ac-cor-sem-slot)); box-shadow: inset 0 0 0 1px rgba(10, 30, 67, .25); transition: width .8s cubic-bezier(.23, 1, .32, 1); }
.ac-cand__sit { display: inline-block; margin-top: 4px; padding: 1px 9px; border-radius: 999px; background: var(--ac-verde-suave); color: var(--ac-verde-escuro); font-size: 13px; font-weight: 700; letter-spacing: .02em; }
.ac-cands__mais { margin-top: 10px; width: 100%; min-height: 46px; border-radius: 14px; border: 1.5px solid var(--ac-linha-2); background: #fff; font-weight: 600; font-size: 15px; color: var(--ac-marca); cursor: pointer; }
.ac-nota { margin-top: 12px; font-size: 13px; line-height: 1.4; color: var(--ac-tinta-3); }
/* definição matemática do TSE (04/10/2026): aviso dentro do cartão, acima da lista de candidatos (criado pelo ac-listas.js só quando há definição); no telão fica só o selo */
.ac-definicao { margin-top: 14px; padding: 10px 14px; border-radius: 14px; background: var(--ac-verde-suave); color: var(--ac-verde-escuro); border: 1px solid #BDE5CE; font-size: 14px; font-weight: 600; line-height: 1.4; }
.ac-definicao:not([hidden]) + .ac-lista-titulo { margin-top: 14px; }
body[data-modo="telao"] .ac-definicao { display: none; }

/* mapa: o desenho do SVG é do ac-mapa.css; aqui só o cartão que o contém */
.ac-mapa__moldura { margin-top: 8px; position: relative; }
.ac-mapa__moldura > svg { width: 100%; height: auto; max-height: 520px; }
.ac-mapa__legenda { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px; }
.ac-mapa__legenda:empty { display: none; }
.ac-leg { flex: 0 0 auto; white-space: nowrap; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px 0 8px; border-radius: 12px; border: 1.5px solid var(--ac-linha-2); background: #fff; font-size: 14px; font-weight: 600; cursor: pointer; }
.ac-leg[aria-pressed="true"] { border-color: var(--ac-marca); background: var(--ac-marca-suave); }
.ac-leg__cor { width: 18px; height: 18px; border-radius: 5px; background: var(--ac-cor, var(--ac-cor-sem-slot)); box-shadow: inset 0 0 0 1px rgba(10, 30, 67, .4); flex: none; }
.ac-leg__n { font-weight: 500; color: var(--ac-tinta-3); font-size: 13px; }
.ac-mapa__chave { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; color: var(--ac-tinta-3); }
.ac-chave { display: inline-flex; align-items: center; gap: 7px; }
.ac-chave i { width: 18px; height: 14px; border-radius: 4px; border: 1px solid var(--ac-linha-2); flex: none; }
.ac-chave__sem { background: repeating-linear-gradient(45deg, #fff 0 3px, #C3CFE4 3px 5px); }
.ac-chave__fraca { background: var(--ac-sf0); }
.ac-link-seta { display: inline-flex; align-items: center; min-height: 44px; margin-top: 6px; font-weight: 600; font-size: 15px; }

/* cartão do estado */
.ac-estado__cab { display: flex; justify-content: space-between; align-items: baseline; gap: 4px 10px; flex-wrap: wrap; }
.ac-estado__nome { font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.ac-estado__sua { font-size: 13px; font-weight: 700; color: var(--ac-verde-escuro); background: var(--ac-verde-suave); border-radius: 999px; padding: 2px 9px; margin-left: 8px; vertical-align: 2px; }
.ac-estado__prog { font-size: 14px; color: var(--ac-tinta-2); }
.ac-estado__prog b { color: var(--ac-tinta); }
#ac-estado .ac-cands, #ac-est .ac-cands { margin-top: 8px; }
#ac-estado .ac-cand { padding: 8px 4px; }
#ac-estado .ac-cand__pct { font-size: 22px; }
#ac-estado .ac-cand { grid-template-columns: 34px minmax(0, 1fr) auto; }
#ac-estado .ac-cand__cor { --ac-anel: 2px; --ac-raio-cor: 9px; width: 34px; height: 48px; font-size: 14px; }
.ac-estado__txt { margin-top: 8px; font-size: 14px; color: var(--ac-tinta-2); }
.ac-estado__txt:empty { display: none; }
.ac-nota:empty { display: none; }
.ac-link-botao { margin-top: 12px; display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border-radius: 12px; border: 0; background: var(--ac-marca); color: #fff; font-weight: 600; font-size: 15px; cursor: pointer; text-align: left; }
#ac-estado[data-situacao="carregando"] .ac-cands, #ac-estado[data-situacao="sem-numero"] .ac-cands, #ac-estado[data-situacao="indeterminado"] .ac-cands, #ac-estado[data-situacao="vazio"] .ac-cands { display: none; }
.ac-est__titulo { margin-top: 20px; }
.ac-est__erro-titulo { font-size: 18px; font-weight: 800; margin-top: 12px; }
.ac-erro__espera { margin-top: 8px; font-size: 14px; color: var(--ac-tinta-2); font-variant-numeric: tabular-nums; }
.ac-erro__espera b { color: var(--ac-tinta); }

/* tabela "Estado a estado" (a grade do G1, melhor): aberta por padrão no desktop; no celular o resumo é um cartão de largura total */
.ac-tabela-cartao { padding: 0; overflow: hidden; }
.ac-tabela-cartao > summary { list-style: none; cursor: pointer; padding: 16px; display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 64px; }
.ac-tabela-cartao > summary::-webkit-details-marker { display: none; }
.ac-tabela__tit { display: grid; gap: 3px; min-width: 0; }
.ac-tabela__sub { font-size: 14px; color: var(--ac-tinta-2); }
.ac-tabela__acao { flex: none; display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 14px; border-radius: 999px; background: var(--ac-marca-suave); color: var(--ac-marca-escuro); font-size: 14px; font-weight: 700; }
.ac-tabela__acao::before { content: "Abrir"; }
.ac-tabela__acao::after { content: ""; width: 8px; height: 8px; border-right: 2.5px solid var(--ac-marca); border-bottom: 2.5px solid var(--ac-marca); transform: rotate(45deg); margin: -3px 0 0 2px; transition: transform .2s; }
.ac-tabela-cartao[open] > summary .ac-tabela__acao::before { content: "Fechar"; }
.ac-tabela-cartao[open] > summary .ac-tabela__acao::after { transform: rotate(-135deg); margin-top: 3px; }
.ac-tabela-corpo { padding: 0 16px 14px; }
.ac-tabela-rolagem { overflow-x: auto; }
table.ac-est { width: 100%; border-collapse: collapse; font-size: 15px; table-layout: fixed; }
table.ac-est th:nth-child(1) { width: 26%; }
table.ac-est th:nth-child(2), table.ac-est th:nth-child(3) { width: 27%; }
table.ac-est th:nth-child(4) { width: 20%; }
table.ac-est caption { display: block; text-align: left; font-size: 13px; color: var(--ac-tinta-3); padding-bottom: 8px; }
table.ac-est th { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--ac-tinta-3); font-weight: 700; text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--ac-linha-2); }
table.ac-est td { padding: 8px 6px; border-bottom: 1px solid var(--ac-linha); vertical-align: middle; font-variant-numeric: tabular-nums; }
table.ac-est .ac-linha--sel td { background: var(--ac-marca-suave); }
table.ac-est .ac-num { text-align: right; white-space: nowrap; }
table.ac-est .ac-lid { display: flex; align-items: center; gap: 8px; min-width: 0; }
table.ac-est .ac-lid__nome { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
table.ac-est .ac-lid__pct { flex: none; margin-left: auto; }
table.ac-est .ac-lid i { width: 14px; height: 14px; border-radius: 4px; background: var(--ac-cor, var(--ac-cor-sem-slot)); box-shadow: inset 0 0 0 1px rgba(10, 30, 67, .4); flex: none; }
table.ac-est .ac-lid__pct { font-weight: 700; }
table.ac-est .ac-vazio { color: var(--ac-tinta-3); }
table.ac-est .ac-ord { display: none; }
table.ac-est button.ac-nome { border: 0; background: none; padding: 6px 0; min-height: 44px; min-width: 44px; font-weight: 600; color: var(--ac-marca); cursor: pointer; text-align: left; font-size: 15px; }
table.ac-est .ac-sec__pct { font-weight: 700; }
.ac-estados-ul { list-style: none; margin: 12px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
.ac-estado-bt { width: 100%; min-height: 44px; padding: 0 12px; border-radius: 12px; border: 1.5px solid var(--ac-linha-2); background: #fff; color: var(--ac-marca); font-weight: 600; font-size: 15px; text-align: left; cursor: pointer; }
.ac-estado-bt[aria-pressed="true"] { border-color: var(--ac-marca); background: var(--ac-marca-suave); }
@media (max-width: 719px) {
  table.ac-est thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
  table.ac-est, table.ac-est tbody, table.ac-est tr, table.ac-est td { display: block; }
  table.ac-est caption { display: block; }
  table.ac-est tr { padding: 6px 4px 10px; border-bottom: 1px solid var(--ac-linha); display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; align-items: center; }
  table.ac-est td { border: 0; padding: 1px 0; }
  table.ac-est td.ac-t-nome { grid-column: 1; grid-row: 1; }
  table.ac-est td.ac-t-sec { grid-column: 2; grid-row: 1; text-align: right; font-size: 14px; color: var(--ac-tinta-2); align-self: center; }
  table.ac-est td.ac-t-p1 { grid-column: 1 / -1; grid-row: 2; font-size: 14px; display: flex; align-items: center; gap: 8px; padding: 2px 0 1px; }
  table.ac-est td.ac-t-p2 { grid-column: 1 / -1; grid-row: 3; font-size: 14px; display: flex; align-items: center; gap: 8px; padding: 1px 0 2px; }
  table.ac-est td.ac-t-p1 .ac-lid, table.ac-est td.ac-t-p2 .ac-lid { flex: 1 1 auto; }
  table.ac-est .ac-ord { display: inline-block; flex: none; width: 18px; font-size: 12px; font-weight: 700; color: var(--ac-tinta-3); }
  table.ac-est .ac-linha--sel { background: var(--ac-marca-suave); border-radius: 12px; }
  table.ac-est .ac-linha--sel td { background: transparent; }
  .ac-tabela__sub { font-size: 13px; }
}

/* gate (sem cadastro): o formulário mora num iframe do mesmo domínio (o CSS escuro da landing não encosta nesta página) */
.ac-gate { text-align: center; padding: 26px 18px 22px; }
.ac-gate h2 { font-size: 26px; line-height: 1.12; font-weight: 800; letter-spacing: -.03em; margin-top: 12px; }
.ac-gate p { margin-top: 10px; color: var(--ac-tinta-2); font-size: 16px; }
.ac-gate__mapa { max-width: 300px; margin: 14px auto 0; pointer-events: none; }
.ac-gate:has(.ac-gate__quadro:not([hidden])) .ac-gate__mapa { display: none; }
.ac-gate__quadro { display: block; width: 100%; min-height: 420px; border: 0; border-radius: 14px; margin-top: 16px; background: transparent; }
.ac-gate__aviso { font-size: 14px !important; }
.ac-botao { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; border-radius: 14px; border: 0; font-weight: 700; font-size: 16px; cursor: pointer; text-decoration: none; background: var(--ac-marca); color: #fff; }
.ac-pagina a.ac-botao { color: #fff; }
.ac-botao--verde, .ac-pagina a.ac-botao--verde { background: #0F7A47; color: #fff; }
.ac-botao--leve, .ac-pagina a.ac-botao--leve { background: #fff; color: var(--ac-marca); border: 1.5px solid var(--ac-linha-2); font-weight: 600; }
.ac-botao--zap, .ac-pagina a.ac-botao--zap { background: #1FA855; color: #04210F; }
.ac-gate__acoes { margin-top: 18px; display: grid; gap: 10px; }
.ac-gate__acoes[hidden] { display: none; }

/* carregando e erro */
.ac-esqueleto { height: 120px; border-radius: 14px; background: linear-gradient(100deg, #E8EEF8 30%, #F5F8FD 50%, #E8EEF8 70%); background-size: 200% 100%; animation: ac-brilho 1.4s linear infinite; }
.ac-esqueleto--alto { height: 220px; }
@keyframes ac-brilho { to { background-position: -200% 0; } }
.ac-vazio-cartao { text-align: center; padding: 26px 18px; }
.ac-vazio-cartao h2 { font-size: 20px; font-weight: 800; }
.ac-vazio-cartao p { margin-top: 8px; color: var(--ac-tinta-2); }
.ac-vazio-cartao .ac-botao { margin-top: 16px; }
.ac-vazio-cartao .ac-nota { color: var(--ac-tinta-3); }
.ac-demora { text-align: center; }
.ac-vista--cartao { max-width: 720px; margin: 0 auto; width: 100%; }

/* seletor de estado (cargos estaduais) */
.ac-seletor { display: grid; gap: 6px; }
.ac-seletor label { font-size: 13px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--ac-tinta-3); }
.ac-seletor select { width: 100%; min-height: 52px; border-radius: 14px; border: 1.5px solid var(--ac-linha-2); background-color: #fff; padding: 0 44px 0 14px; font: inherit; font-size: 18px; font-weight: 700; color: var(--ac-tinta); appearance: none; -webkit-appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--ac-marca) 50%), linear-gradient(135deg, var(--ac-marca) 50%, transparent 50%); background-position: calc(100% - 22px) 22px, calc(100% - 16px) 22px; background-size: 6px 6px; background-repeat: no-repeat; }

/* rodapé */
.ac-rodape { margin-top: 18px; background: #fff; border-top: 1px solid var(--ac-linha); }
.ac-rodape__miolo { max-width: 1180px; margin: 0 auto; padding: 22px var(--ac-margem) 18px; display: grid; gap: 14px; }
.ac-rodape__titulo { font-weight: 700; font-size: 17px; }
.ac-rodape__botoes { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 10px; }
/* O telão só existe a partir de 720 px (tela cheia de TV ou monitor); no celular o botão nem aparece. */
#ac-bt-telao { display: none; }
.ac-rodape__fonte { font-size: 13px; color: var(--ac-tinta-3); line-height: 1.5; max-width: 70ch; }
.ac-rodape__marcas { display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: center; padding-top: 4px; }
.ac-rodape__item { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--ac-tinta-3); }
.ac-rodape__item img { height: 26px; width: auto; }
.ac-rodape__links { font-size: 14px; display: flex; flex-wrap: wrap; gap: 0 22px; }
.ac-rodape__links a { display: inline-flex; align-items: center; min-height: 44px; }

/* ------------------------------------------------------------ desktop */
@media (min-width: 720px) {
  :root { --ac-margem: 24px; }
  .ac-topo__titulo { font-size: 30px; }
  .ac-marca__img { width: 104px; }
  .ac-icone-botao { display: inline-flex; }
  #ac-bt-telao { display: inline-flex; }
  .ac-tabela-corpo { padding: 0 22px 18px; }
}
@media (min-width: 960px) {
  .ac-conteudo { padding-top: 18px; }
  .ac-vista--grade { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: start; gap: 18px; }
  .ac-vista--grade > .ac-col-esq { grid-column: 1; grid-row: 1 / span 2; }
  .ac-vista--grade > .ac-col-dir { grid-column: 2; }
  .ac-vista--grade > .ac-largo { grid-column: 1 / -1; }
  .ac-cartao { padding: 22px 22px; }
  .ac-tabela-cartao { padding: 0; }
  .ac-hero__numero { font-size: 84px; }
  .ac-hero__rotulo { font-size: 20px; }
  .ac-cand__nome { font-size: 18px; }
  .ac-cand__pct { font-size: 30px; }
  #ac-estado .ac-cand__pct { font-size: 24px; }
  .ac-mapa__moldura > svg { max-height: 640px; }
  .ac-tabela-cartao > summary { padding: 18px 22px; }
}

/* ------------------------------------------------------------ telão (?tv=1 ou botão): tudo cabe numa tela de 1280x720, sem rolagem, texto grande */
body[data-modo="telao"] { background: var(--ac-fundo); font-size: clamp(18px, 1.5vw, 34px); height: 100vh; overflow: hidden; display: flex; flex-direction: column; }
body[data-modo="telao"] .ac-rodape, body[data-modo="telao"] .ac-cargos, body[data-modo="telao"] .ac-icone-botao, body[data-modo="telao"] .ac-pular, body[data-modo="telao"] .ac-nota,
body[data-modo="telao"] .ac-cands__mais, body[data-modo="telao"] .ac-mapa__chave, body[data-modo="telao"] .ac-tabela-cartao, body[data-modo="telao"] #ac-estados-lista,
body[data-modo="telao"] #ac-estado, body[data-modo="telao"] .ac-cartao__sub, body[data-modo="telao"] #ac-ir-tabela, body[data-modo="telao"] .ac-link-seta { display: none; }
body[data-modo="telao"] .ac-topo__miolo { max-width: none; padding: .8vw 2vw; }
body[data-modo="telao"] .ac-topo__titulo { font-size: 2.4vw; }
body[data-modo="telao"] .ac-topo__eleicao { font-size: 1vw; }
body[data-modo="telao"] .ac-marca__img { width: 6vw; height: auto; }
body[data-modo="telao"] .ac-selo { font-size: 1.1vw; padding: .4vw 1vw; }
body[data-modo="telao"] .ac-avisos { max-width: none; padding: 0 2vw; }
body[data-modo="telao"] .ac-conteudo { max-width: none; width: 100%; padding: 1vw 2vw; flex: 1; min-height: 0; display: flex; }
body[data-modo="telao"] .ac-vista--grade { flex: 1; min-height: 0; width: 100%; align-items: stretch; grid-template-columns: 5fr 6fr; gap: 1.4vw; grid-template-rows: minmax(0, 1fr); }
body[data-modo="telao"] .ac-vista--grade > .ac-col-dir { grid-column: 1; grid-row: 1; min-height: 0; overflow: hidden; }
body[data-modo="telao"] .ac-vista--grade > .ac-col-esq { grid-column: 2; grid-row: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
body[data-modo="telao"] .ac-col-esq .ac-mapa__moldura { flex: 1; min-height: 0; position: relative; }
body[data-modo="telao"] .ac-mapa__moldura > svg { position: absolute; inset: 0; width: 100%; height: 100%; max-height: none; }
body[data-modo="telao"] .ac-cartao { padding: 1.2vw 1.4vw; }
body[data-modo="telao"] .ac-cartao__titulo { font-size: 1vw; }
body[data-modo="telao"] .ac-hero__numero { font-size: 6.4vw; }
body[data-modo="telao"] .ac-hero__rotulo { font-size: 1.6vw; }
body[data-modo="telao"] .ac-barra { margin-top: 1vh; height: 1.2vh; }
body[data-modo="telao"] .ac-hero__meta { font-size: 1.15vw; margin-top: 1vh; }
body[data-modo="telao"] .ac-chips { margin-top: 1vh; }
body[data-modo="telao"] .ac-chip { font-size: 1.05vw; min-height: 2.4vw; }
body[data-modo="telao"] .ac-chip--relogio { font-size: 1.05vw; min-height: 0; }
body[data-modo="telao"] .ac-cands { margin-top: .6vh; gap: 0; }
body[data-modo="telao"] .ac-lista-titulo { margin-top: 1.2vh; }
body[data-modo="telao"] .ac-cand { padding: .5vh .3vw; grid-template-columns: 2.6vw minmax(0, 1fr) auto; column-gap: 1vw; cursor: default; pointer-events: none; }
/* telão: a miniatura tem a mesma largura de antes (2.6vw) e a altura 5:7 (3.64vw) cabe no bloco de texto da linha (nome + apoio ~3.7vw): a lista não perde linha visível */
/* A LISTA DE CANDIDATOS NO TELÃO MOSTRA SÓ AS LINHAS QUE CABEM (por altura, não por quantidade fixa). O cartão tem altura fixa (a tela) e `overflow: hidden`: com a lista em fluxo normal, a última
   linha ficava cortada ao meio (final em 1280x720, 1366x768 e 1024x600; com as duas faixas no topo, em todos os tamanhos medidos). Aqui o cartão vira coluna e a lista ocupa o que sobra, em colunas
   que QUEBRAM: a linha que não cabe vai inteira para a 2ª coluna, que fica fora da caixa (largura 100% por coluna) e é recortada. `overflow: clip` (e não só `hidden`) impede que um Tab
   em linha escondida role a caixa para mostrá-la e desloque o telão; `hidden` fica de reserva para navegador sem `clip`. Quem manda é a medida do navegador (teste/fp2b/telao_corte.py). */
body[data-modo="telao"] #ac-brasil { display: flex; flex-direction: column; padding-bottom: .3vw; }   /* a lista agora respeita a caixa de conteúdo (antes a última linha invadia o preenchimento de baixo): menos folga embaixo devolve a linha */
body[data-modo="telao"] #ac-brasil > * { flex: 0 0 auto; }
body[data-modo="telao"] #ac-brasil > #ac-brasil-cands { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; overflow: hidden; overflow: clip; }
body[data-modo="telao"] #ac-brasil-cands > .ac-cand-li { flex: 0 0 auto; width: 100%; }
body[data-modo="telao"] .ac-cand__cor { --ac-anel: .22vw; --ac-raio-cor: .6vw; width: 2.6vw; height: 3.64vw; font-size: 1.3vw; }
body[data-modo="telao"] .ac-cand__nome { font-size: 1.7vw; }
body[data-modo="telao"] .ac-cand__apoio, body[data-modo="telao"] .ac-cand__votos, body[data-modo="telao"] .ac-cand__frente { font-size: 1.05vw; }
body[data-modo="telao"] .ac-cand__pct { font-size: 2.6vw; }
body[data-modo="telao"] .ac-cand__faixa { margin-top: .6vh; height: .8vh; }
body[data-modo="telao"] .ac-leg { font-size: 1.15vw; min-height: 2.8vw; pointer-events: none; }
body[data-modo="telao"] .ac-mapa__legenda { margin-top: .8vh; margin-bottom: .8vh; }
body[data-modo="telao"] .ac-mapa__moldura svg { pointer-events: none; }
body[data-modo="telao"] .ac-espera__hora { font-size: 3.4vw; }
body[data-modo="telao"] .ac-espera__faltam { font-size: 1.8vw; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media print {
  .ac-cargos, .ac-icone-botao, .ac-rodape__botoes, .ac-pular { display: none !important; }
  body.ac-pagina { background: #fff; }
}