/* Modo TV: tela inteira em paisagem, sem rolagem, fundo escuro. Tamanhos em vh para caber em qualquer TV.
   Cores dos candidatos clareadas por igual para o fundo escuro (a mesma regra para os dois lados). */
:root {
  --fundo: #0E0F12; --cartao: #17191E; --linha: #2A2D34; --t1: #F5F5F7; --t2: #B8BAC2; --t3: #8A8D96;
  --a: #4C8DF6; --b: #F2665E; --pix: #2BB5A4;
  --fonte: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; height: 100%; }
body.tv { height: 100vh; width: 100vw; overflow: hidden; background: var(--fundo); color: var(--t1); font-family: var(--fonte);
  font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased; display: grid;
  grid-template-rows: 8vh minmax(0, 1fr) 33vh 3vh; padding: 0 2.5vw; }
h2 { margin: 0; font-size: 1.7vh; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--t3); }

/* topo */
.tv-topo { display: grid; grid-template-columns: 1fr 1.4fr 1fr; align-items: center; gap: 2vw; border-bottom: 1px solid var(--linha); }
.tv-marca { display: flex; align-items: center; gap: 1.2vw; font-size: 2.2vh; font-weight: 600; }
.tv-ao-vivo { padding: .5vh 1vw; border-radius: 99px; background: #3A3D45; font-size: 1.6vh; letter-spacing: .08em; text-transform: uppercase; }
.tv-ao-vivo.vivo { background: #1A7F37; }
.tv-progresso-texto { font-size: 2vh; color: var(--t2); margin-bottom: .8vh; text-align: center; }
.tv-progresso-texto strong { color: var(--t1); font-size: 2.4vh; }
.tv-barra { height: 1vh; border-radius: 99px; background: var(--linha); overflow: hidden; }
.tv-barra-cheia { height: 100%; width: 0; background: var(--t1); transition: width .8s ease; }
.tv-hora { display: flex; justify-content: flex-end; align-items: center; gap: 1vw; font-size: 1.8vh; color: var(--t2); }
.tv-botao { font: inherit; font-size: 1.6vh; color: var(--t1); background: transparent; border: 1px solid var(--linha); border-radius: 99px;
  padding: .6vh 1vw; cursor: pointer; }
/* aviso por cima da tela (fora da grade, para não desalinhar as linhas) */
.tv-alerta { position: fixed; top: 10vh; left: 50%; transform: translateX(-50%); z-index: 3; max-width: 80vw; padding: 1vh 1.5vw;
  border-radius: 1vh; background: #3B2A12; color: #FFC777; font-size: 2vh; font-weight: 600; text-align: center; }

/* meio: candidato · medidor · candidato */
.tv-meio { display: grid; grid-template-columns: 1fr 1.25fr 1fr; align-items: center; gap: 2vw; min-height: 0; padding: .8vh 0; }
.tv-cand { display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0; }
.tv-foto { height: 15vh; width: auto; aspect-ratio: 161 / 225; object-fit: cover; border-radius: 1.6vh; border: .5vh solid var(--cor, var(--t3));
  background: var(--cartao); }
.tv-cand[data-lado="a"] { --cor: var(--a); }
.tv-cand[data-lado="b"] { --cor: var(--b); }
.tv-nome { margin-top: 1.2vh; font-size: 2.8vh; font-weight: 600; }
.tv-cand > .tv-rotulo { margin-top: 1vh; }
.tv-pct { font-size: 10.5vh; line-height: 1; min-height: 10.5vh; font-weight: 700; letter-spacing: -.02em; color: var(--cor); margin-top: .3vh; }
.tv-faixa { font-size: 1.8vh; color: var(--t2); margin-top: .4vh; }
.tv-contado { margin-top: 1.4vh; padding-top: 1vh; border-top: 1px solid var(--linha); display: flex; flex-direction: column; align-items: center; gap: .3vh; min-width: 60%; }
.tv-contado-num { font-size: 2.6vh; font-weight: 600; color: var(--t1); }
.tv-rotulo { font-size: 1.5vh; color: var(--t3); text-transform: uppercase; letter-spacing: .08em; }

.tv-centro { display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0; }
.tv-sobre { font-size: 1.7vh; color: var(--t3); text-transform: uppercase; letter-spacing: .08em; }
.tv-medidor { width: 100%; max-height: 22vh; margin-top: .6vh; }
#tv-arco-a { stroke: var(--a); stroke-opacity: .35; }
#tv-arco-b { stroke: var(--b); stroke-opacity: .35; }
#tv-ponteiro { transition: transform 1s cubic-bezier(.2, .8, .2, 1); }
.tv-pontas { display: flex; justify-content: space-between; width: 80%; font-size: 1.6vh; color: var(--t3); text-transform: uppercase; letter-spacing: .06em; }
.tv-pontas span:first-child { color: var(--a); }
.tv-pontas span:last-child { color: var(--b); }
.tv-esperar { margin-top: 1vh; font-size: 1.9vh; color: var(--t2); max-width: 40vw; }
.tv-manchete { margin-top: 1.2vh; font-size: 2.6vh; font-weight: 600; max-width: 38vw; }
.tv-selo { margin-top: 1vh; padding: .6vh 1.2vw; border-radius: 99px; background: #133A20; color: #7EE2A0; font-size: 1.9vh; font-weight: 600; }
.tv-contagem { margin-top: 1.4vh; display: flex; flex-direction: column; align-items: center; }
.tv-contagem span { font-size: 7vh; font-weight: 700; letter-spacing: -.02em; }
.tv-contagem small { font-size: 1.7vh; color: var(--t3); }

/* base: comparecimento · outros candidatos · Pix */
.tv-base { display: grid; grid-template-columns: 1.45fr 1.3fr 1fr; gap: 1.2vw; padding: 1.2vh 0; min-height: 0; border-top: 1px solid var(--linha); }
.tv-painel { background: var(--cartao); border-radius: 1.6vh; padding: 1.6vh 1.2vw; min-height: 0; overflow: hidden; }
.tv-tabela { width: 100%; margin-top: .6vh; border-collapse: collapse; font-size: 1.75vh; }
.tv-tabela th { text-align: left; font-size: 1.4vh; font-weight: 600; color: var(--t3); text-transform: uppercase; letter-spacing: .04em; padding: 0 .6vw .5vh 0; white-space: nowrap; }
.tv-tabela td { padding: .45vh .6vw .45vh 0; color: var(--t1); white-space: nowrap; border-top: 1px solid var(--linha); }
.tv-tabela td:first-child { color: var(--t2); }
.tv-tabela .sobe { color: #FFC777; }
.tv-tabela .desce { color: #9AD4FF; }
.tv-tabela .a { color: var(--a); font-weight: 600; }
.tv-tabela .b { color: var(--b); font-weight: 600; }
.tv-explica { list-style: none; margin: .8vh 0 0; padding: 0; display: flex; flex-direction: column; gap: .8vh; font-size: 1.8vh; line-height: 1.35; color: var(--t2); }
.tv-explica li::before { content: '•'; color: var(--t3); margin-right: .6vw; }
.tv-explica b { color: var(--t1); }
.tv-lista { list-style: none; margin: 1vh 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .5vh 1.5vw; font-size: 1.9vh; }
.tv-lista li { display: flex; justify-content: space-between; gap: 1vw; color: var(--t2); white-space: nowrap; }
.tv-vazio { font-size: 1.9vh; color: var(--t3); grid-column: 1 / -1; }
.tv-lista li span:last-child { color: var(--t1); font-weight: 600; }
.tv-lista li.destaque span:last-child { color: #FFC777; }
.tv-transf { margin-top: 1vh; font-size: 1.9vh; color: var(--t2); display: flex; flex-wrap: wrap; gap: .4vh 1.4vw; }
.tv-transf b { color: var(--t1); }
.tv-h2-espaco { margin-top: 1.6vh; }
.tv-lote { margin-top: .8vh; font-size: 1.9vh; color: var(--t2); }
.tv-lote b { color: var(--t1); }
.tv-pix { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; gap: 1vh; background: var(--cartao); border-radius: 1.6vh; padding: 1.4vh 1.2vw; min-height: 0;
  border: 1px solid #1F4D47; }
.tv-qr { height: 100%; max-height: 21vh; width: auto; aspect-ratio: 1; background: #FFFFFF; border-radius: 1vh; padding: .6vh; }
.tv-pix-texto { display: flex; flex-direction: column; align-items: center; gap: .3vh; min-width: 0; font-size: 1.6vh; color: var(--t2); }
.tv-pix-texto strong { font-size: 2.4vh; color: var(--pix); }
.tv-pix-chave { color: var(--t1); font-weight: 600; font-size: 1.75vh; white-space: nowrap; }

.tv-rodape { display: flex; align-items: center; justify-content: center; gap: 1.5vw; font-size: 1.4vh; color: var(--t3); }
.tv-voltar { color: var(--t2); }
.tv-girar { display: none; }
@media (orientation: portrait) {
  .tv-girar { display: flex; position: fixed; inset: auto 0 0 0; padding: 1.5vh; justify-content: center; background: #3A3D45; color: var(--t1);
    font-size: 2vh; font-weight: 600; z-index: 2; }
}