:root {
  --noite: #1B2140;
  --crepusculo: #3A2C5E;
  --rosa: #B54A78;
  --sol: #FFC145;
  --laranja: #F08A45;
  --rio: #24506A;
  --rio-claro: #4C86A0;
  --papel: #F2F4F8;
  --branco: #FFFFFF;
  --tinta: #1B2140;
  --tinta-suave: #4A5270;
  --linha: #D5DBE6;
  --lavanda: #F3F0FA;
  --f-titulo: 'Bricolage Grotesque', 'Trebuchet MS', system-ui, sans-serif;
  --f-texto: 'Figtree', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  /* Área da barra de status do celular (app e telas com entalhe): o menu desce para não ficar por baixo do relógio */
  --inset-topo: max(env(safe-area-inset-top, 0px), var(--safe-area-inset-top, 0px));
  --topo-h: calc(56px + var(--inset-topo));
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--topo-h) + 12px); -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px));
  background: var(--papel);
  color: var(--tinta);
  font-family: var(--f-texto);
  font-size: 1.0625rem;
  line-height: 1.55;
}
h1, h2, h3 { font-family: var(--f-titulo); line-height: 1.1; margin: 0; }
p { margin: 0; }
a { color: var(--rio); }
button { font: inherit; cursor: pointer; }
:focus-visible {
  outline: 4px solid var(--sol) !important;
  outline-offset: 4px !important;
  box-shadow: 0 0 20px rgba(255, 193, 69, 0.8) !important;
  transform: scale(1.03);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  z-index: 50;
}
.so-leitor { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pular { position: absolute; left: -999px; top: 8px; background: var(--sol); color: var(--tinta); padding: 8px 14px; z-index: 100; border-radius: 8px; }
.pular:focus { left: 8px; }

/* Topo */
.topo {
  position: sticky; top: 0; z-index: 30;
  height: var(--topo-h);
  display: flex; align-items: center; gap: 20px;
  padding: var(--inset-topo) 16px 0;
  background: var(--noite);
  color: var(--lavanda);
}
.marca {
  font-family: var(--f-titulo); font-weight: 800; font-size: 1.25rem;
  color: var(--sol); text-decoration: none; white-space: nowrap;
  flex: none;
}
.menu { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; margin-left: auto; }
.menu::-webkit-scrollbar { display: none; }
.menu a {
  color: var(--lavanda); text-decoration: none; padding: 8px 12px; border-radius: 999px;
  font-weight: 500; font-size: .95rem; white-space: nowrap;
}
.menu a:hover { background: rgba(255, 255, 255, .12); }

.hero {
  position: relative;
  min-height: 85vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 40px 20px;
  background: linear-gradient(rgba(6, 9, 19, 0.4), rgba(6, 9, 19, 0.4)), 
              url('fundo-m.webp') center/cover no-repeat;
}
@media (min-width: 900px) {
  .hero {
    background: linear-gradient(rgba(6, 9, 19, 0.4), rgba(6, 9, 19, 0.4)),
                url('fundo.webp') center/cover no-repeat;
  }
}

.hero-video, .hero-overlay { display: none !important; }

.glass-card {
  position: relative;
  z-index: 3;
  background: rgba(17, 23, 41, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 24px;
  padding: 40px 30px;
  max-width: 800px;
  width: 100%;
  text-align: center;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.7);
}

.badge-ao-vivo {
  display: inline-block;
  background: rgba(0, 210, 255, 0.12);
  color: #00d2ff;
  border: 1px solid rgba(0, 210, 255, 0.3);
  padding: 6px 16px;
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  margin-bottom: 20px;
  text-transform: uppercase;
}

.neon-title {
  font-size: clamp(2.5rem, 4.5vw, 4rem);
  font-weight: 800;
  color: #ffffff;
  text-shadow: 0 0 30px rgba(0, 210, 255, 0.5);
  margin-bottom: 12px;
  letter-spacing: -0.5px;
}

.slogan-sub {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #ff9f43;
  margin-bottom: 30px;
  font-weight: 500;
}

.glass-card .agora {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: rgba(0, 0, 0, 0.65);
  border: 1px solid rgba(0, 210, 255, 0.3);
  padding: 12px 24px;
  border-radius: 50px;
  color: #ffffff;
  font-size: 1rem;
  font-weight: 500;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
  margin-top: 20px;
  max-width: 100%;
  word-break: break-word;
}

.glass-card #agoraTexto {
  color: #00d2ff !important;
  font-weight: 600;
}

.glass-card .ponto {
  width: 10px;
  height: 10px;
  background-color: #22c55e;
  border-radius: 50%;
  box-shadow: 0 0 10px #22c55e;
  animation: pulseDot 1.5s infinite;
}

@keyframes pulseDot {
  0% { transform: scale(0.9); opacity: 0.7; }
  50% { transform: scale(1.3); opacity: 1; }
  100% { transform: scale(0.9); opacity: 0.7; }
}

.hero-player-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-top: 15px;
}

.sol-btn-modern {
  width: 95px;
  height: 95px;
  border-radius: 50%;
  background: linear-gradient(135deg, #00d2ff, #0056b3);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 35px rgba(0, 210, 255, 0.4);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.sol-btn-modern:hover {
  transform: scale(1.12);
  box-shadow: 0 0 60px rgba(0, 210, 255, 0.85);
  background: linear-gradient(135deg, #33dcff, #0072ff);
}

.sol-btn-modern svg {
  width: 36px;
  height: 36px;
}

@media (max-width: 768px) {
  .glass-card { padding: 35px 20px; border-radius: 24px; }
  .sol-btn-modern { width: 80px; height: 80px; }
}

.hero-aviso { text-align: center; padding: 0 20px 14px; min-height: 0; color: #FFD9A0; font-weight: 500; }
.hero-aviso:empty { display: none; }

.ico-pausa, .ico-carrega { display: none; }
body[data-radio="tocando"] .ico-play, body[data-radio="conectando"] .ico-play { display: none; }
body[data-radio="tocando"] .ico-pausa { display: block; }
body[data-radio="conectando"] .ico-carrega { display: block; animation: gira 1s linear infinite; }
@keyframes gira { to { transform: rotate(360deg); } }

/* Seções */
.secao { padding: 56px 0; }
.secao-clara { background: var(--branco); }
.secao-in { max-width: 1080px; margin: 0 auto; padding: 0 20px; }
.secao-estreita { max-width: 640px; }
.secao h2 { font-weight: 800; font-size: clamp(1.6rem, 4.6vw, 2.5rem); letter-spacing: -.01em; }
.secao-sub { margin-top: 10px; color: var(--tinta-suave); max-width: 62ch; }
.nota { margin-top: 18px; font-size: .9rem; color: var(--tinta-suave); }

.btn-prim, .btn-sec {
  border-radius: 999px; padding: 10px 20px; font-weight: 700; border: 2px solid var(--tinta);
  transition: transform .1s, background .15s;
}
.btn-prim { background: var(--sol); border-color: var(--sol); color: var(--tinta); }
.btn-prim:hover { background: #FFB61F; border-color: #FFB61F; }
.btn-sec { background: transparent; color: inherit; border-color: currentColor; }
.btn-sec:hover { background: rgba(27, 33, 64, .08); }
button:active { transform: translateY(1px); }

/* Notícias */
.secao-cab { display: flex; flex-wrap: wrap; gap: 16px 32px; justify-content: space-between; align-items: flex-end; }
.noticia-controles { display: flex; gap: 10px; align-items: center; }
.segmento { display: inline-flex; border: 2px solid var(--tinta); border-radius: 999px; overflow: hidden; }
.segmento button { border: 0; background: transparent; padding: 8px 16px; font-weight: 700; color: var(--tinta); }
.segmento button[aria-pressed="true"] { background: var(--tinta); color: var(--lavanda); }

.chips { display: flex; gap: 8px; overflow-x: auto; padding: 22px 0 6px; scrollbar-width: none; }
.chips::-webkit-scrollbar { display: none; }
.chip {
  flex: none; border: 2px solid var(--linha); background: var(--branco); color: var(--tinta);
  border-radius: 999px; padding: 6px 14px; font-weight: 500;
}
.chip[aria-pressed="true"] { background: var(--rio); border-color: var(--rio); color: var(--branco); }

.resumo { margin-top: 18px; padding: 16px 18px; border-left: 6px solid var(--rosa); background: var(--branco); }
.resumo h3 { font-size: 1.1rem; margin-bottom: 6px; }

.noticias { margin-top: 18px; }
.manchete { display: block; padding: 6px 0 22px 20px; border-left: 8px solid var(--sol); text-decoration: none; color: var(--tinta); }
.manchete .tit { font-family: var(--f-titulo); font-weight: 800; font-size: clamp(1.5rem, 4.2vw, 2.3rem); line-height: 1.12; }
.manchete:hover .tit, .noticia:hover .tit { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.lista-not { display: grid; grid-template-columns: 1fr; column-gap: 40px; margin-top: 8px; }
@media (min-width: 800px) { .lista-not { grid-template-columns: 1fr 1fr; } }
.noticia { display: block; padding: 16px 0; border-top: 1px solid var(--linha); text-decoration: none; color: var(--tinta); }
.noticia .tit { font-weight: 700; font-size: 1.08rem; line-height: 1.3; }
.tit { display: block; }
.meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; font-size: .9rem; }
.meta .fonte { font-weight: 700; color: var(--rio); }
.meta .tempo { color: var(--tinta-suave); }
.vazio { padding: 24px 0; color: var(--tinta-suave); }

/* Horóscopo */
.signos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 26px; }
@media (min-width: 720px) { .signos { grid-template-columns: repeat(6, 1fr); } }
.signo {
  border: 2px solid var(--linha); background: var(--papel); color: var(--tinta);
  border-radius: 14px; padding: 12px 6px; display: flex; flex-direction: column; align-items: center; gap: 2px;
  font-weight: 700; font-size: .95rem;
}
.signo .simb { font-size: 1.7rem; line-height: 1.1; }
.signo .datas { font-weight: 400; font-size: .75rem; color: var(--tinta-suave); }
.signo:hover { border-color: var(--rio); }
.signo[aria-pressed="true"] { background: var(--sol); border-color: var(--sol); }
.signo[aria-pressed="true"] .datas { color: var(--tinta); }

.descobrir { margin-top: 18px; }
.descobrir summary { cursor: pointer; font-weight: 700; color: var(--rio); }
.descobrir-form { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-top: 12px; }
.descobrir-form label { display: flex; flex-direction: column; gap: 4px; font-weight: 500; font-size: .95rem; }
.descobrir-form p { flex-basis: 100%; font-weight: 700; }
select, input[type="text"], textarea {
  font: inherit; color: var(--tinta); background: var(--branco);
  border: 2px solid var(--linha); border-radius: 10px; padding: 9px 12px; width: 100%;
}
.descobrir-form select { width: auto; min-width: 90px; }
select:focus, input:focus, textarea:focus { border-color: var(--rio); outline: none; box-shadow: 0 0 0 3px rgba(36, 80, 106, .25); }

.horoscopo { margin-top: 26px; padding: 26px 22px; background: var(--noite); color: var(--lavanda); border-radius: 18px; }
.horo-cab { display: flex; align-items: center; gap: 16px; }
.horo-simb { font-size: 3.2rem; line-height: 1; color: var(--sol); }
.horo-cab h3 { font-size: 1.7rem; color: var(--branco); }
.horo-cab p { color: #CFC8E4; font-size: .95rem; }
.horo-corpo { display: grid; gap: 16px 32px; margin-top: 20px; }
@media (min-width: 800px) { .horo-corpo { grid-template-columns: 1fr 1fr; } }
.horo-corpo h4 { margin: 0 0 4px; font-family: var(--f-titulo); font-size: 1.05rem; color: var(--sol); }
.horo-extras { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .2); }
.horo-extras strong { color: var(--sol); }

/* Clima */
.clima { margin-top: 24px; display: grid; gap: 22px; }
@media (min-width: 800px) { .clima { grid-template-columns: minmax(220px, 300px) 1fr; align-items: center; } }
.clima-agora { display: flex; align-items: center; gap: 16px; }
.clima-agora .emoji { font-size: 3.4rem; line-height: 1; }
.clima-agora .grau { font-family: var(--f-titulo); font-weight: 800; font-size: 3.2rem; line-height: 1; }
.clima-agora .desc { font-weight: 700; }
.clima-agora .detalhe { font-size: .92rem; color: var(--tinta-suave); }
.clima-dias { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.dia { text-align: center; padding: 10px 4px; border-top: 3px solid var(--rio-claro); }
.dia .nome { font-weight: 700; }
.dia .emoji { font-size: 1.7rem; line-height: 1.3; }
.dia .max { font-weight: 700; }
.dia .min { color: var(--tinta-suave); }
.dia .chuva { font-size: .8rem; color: var(--rio); }

.clima-busca { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; justify-content: center; }
.input-cidade { padding: 8px 12px; border-radius: 6px; border: 1px solid var(--linha); font-size: 14px; flex: 1; max-width: 250px; background: var(--branco); }
.btn-busca-cidade { padding: 8px 16px; border-radius: 6px; border: none; background: var(--noite); color: var(--branco); cursor: pointer; font-weight: bold; }
.clima-local { font-weight: bold; font-size: 1.1rem; margin-bottom: 12px; text-align: center; }

/* Passatempo */
.passa-grade { display: grid; gap: 20px; margin-top: 26px; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); align-items: start; }
.bloco { padding: 24px 22px; border-radius: 18px; }
.bloco h3 { font-size: 1.25rem; margin-bottom: 14px; }
#gauches { background: var(--sol); color: var(--tinta); }
.gauches-termo { font-family: var(--f-titulo); font-weight: 800; font-size: 2.4rem; line-height: 1.1; }
#gSig { margin: 8px 0 16px; }
#quiz { background: var(--rio); color: var(--branco); }
#forca { background: var(--papel); border: 2px solid var(--linha); }

.quiz-pergunta { font-weight: 700; font-size: 1.1rem; margin-bottom: 12px; }
.quiz-opcoes { display: grid; gap: 8px; }
.quiz-opcoes button {
  text-align: left; padding: 10px 14px; border-radius: 10px; border: 2px solid rgba(255, 255, 255, .5);
  background: transparent; color: var(--branco); font-weight: 500;
}
.quiz-opcoes button:hover:not(:disabled) { background: rgba(255, 255, 255, .15); }
.quiz-opcoes button.certa { background: #2E9E6B; border-color: #2E9E6B; }
.quiz-opcoes button.errada { background: #B5384A; border-color: #B5384A; }
.quiz-opcoes button:disabled { cursor: default; }
.quiz-rodape { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 14px; min-height: 42px; }
.quiz-rodape .btn-sec { border-color: var(--branco); color: var(--branco); padding: 8px 16px; }
.quiz-prog { font-size: .9rem; opacity: .9; }

.forca-palavra { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 12px; }
.forca-palavra span {
  width: 30px; height: 40px; border-bottom: 4px solid var(--tinta); display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--f-titulo); font-weight: 800; font-size: 1.5rem;
}
.forca-info { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 12px; font-weight: 500; }
.vidas { letter-spacing: 3px; color: var(--rosa); }
.teclado { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.teclado button {
  padding: 8px 0; border-radius: 8px; border: 2px solid var(--linha); background: var(--branco); color: var(--tinta); font-weight: 700;
}
.teclado button:disabled { opacity: .35; cursor: default; }
.teclado button.acerto { background: #CDEBDC; border-color: #2E9E6B; opacity: 1; }
.forca-msg { margin: 14px 0 0; font-weight: 700; min-height: 1.5em; }
#forcaNova { margin-top: 10px; }

/* Pedidos */
.form { margin-top: 22px; display: grid; gap: 16px; }
.form label { display: flex; flex-direction: column; gap: 6px; font-weight: 700; }
.tipo { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; }
.tipo legend { font-weight: 700; margin-bottom: 8px; padding: 0; }
.tipo label { flex-direction: row; align-items: center; gap: 8px; font-weight: 500; }
.tipo input { width: 20px; height: 20px; accent-color: var(--rio); }
.form .btn-prim { justify-self: start; }
#pResp { font-weight: 700; }
#pResp.erro { color: #B5384A; }

/* Rodapé e player */
.rodape { background: var(--noite); color: var(--lavanda); padding: 32px 20px; text-align: center; }
.rodape #rodapeNome { font-family: var(--f-titulo); font-weight: 800; font-size: 1.3rem; color: var(--sol); }
.rodape .nota { color: #B9B3D0; }

.player {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
  display: flex; align-items: center; gap: 14px;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  background: var(--noite); color: var(--lavanda);
  border-top: 3px solid var(--sol);
}
.player-btn {
  flex: none; width: 52px; height: 52px; border-radius: 50%; border: 0; background: var(--sol);
  display: flex; align-items: center; justify-content: center;
}
.player-btn svg { width: 26px; height: 26px; }
.player-btn:hover { background: #FFB61F; }
.player-info { min-width: 0; flex: 1; }
.player-estado { font-size: .8rem; color: #B9B3D0; }
.player-musica { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Estilos do painel admin */
.admin-stat-card {
  background: var(--branco);
  border: 2px solid var(--linha);
  border-radius: 10px;
  padding: 10px 16px;
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
}
.admin-stat-card h3 {
  font-size: 0.85rem;
  color: var(--tinta-suave);
  margin: 0;
}
.admin-numero {
  font-family: var(--f-titulo);
  font-weight: 800;
  font-size: 1.25rem;
  color: var(--rio);
}

/* ---------- Divulgação, patrocínio e anúncios ---------- */
.compartilhar { position: relative; z-index: 3; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 18px; }
.btn-zap {
  display: inline-block; background: #25D366; color: #0B2E1A; font-weight: 700; text-decoration: none;
  border-radius: 999px; padding: 10px 20px; border: 2px solid #25D366;
}
.btn-zap:hover { background: #1FBE5B; border-color: #1FBE5B; }
.btn-sec-claro {
  background: rgba(17, 23, 41, .75); color: #fff; border: 2px solid rgba(255, 255, 255, .6);
  border-radius: 999px; padding: 10px 20px; font-weight: 700;
}
.btn-sec-claro:hover { background: rgba(255, 255, 255, .18); }
.btn-sec-claro[hidden] { display: none; }
a.btn-sec-claro { display: inline-block; text-decoration: none; }

.quiz-regiao {
  display: inline-block; font-size: .78rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  background: rgba(255, 255, 255, .18); border-radius: 999px; padding: 3px 12px; margin-bottom: 10px;
}

.patro-grade { display: grid; gap: 16px; margin-top: 22px; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.patro-card {
  display: flex; flex-direction: column; gap: 6px; align-items: flex-start; padding: 18px; border-radius: 16px;
  border: 2px solid var(--linha); background: var(--papel); color: var(--tinta); text-decoration: none;
}
a.patro-card:hover { border-color: var(--rio); }
.patro-card img { max-width: 100%; max-height: 90px; width: auto; height: auto; object-fit: contain; }
.patro-card strong { font-family: var(--f-titulo); font-size: 1.15rem; }
.patro-card span { color: var(--tinta-suave); font-size: .95rem; }
.patro-casa { border-style: dashed; background: var(--lavanda); }
.patro-casa .patro-cta { color: var(--rio); font-weight: 700; }
.publicidade { margin-top: 26px; }
.publicidade-rotulo { font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--tinta-suave); margin-bottom: 6px; }

.anuncie-lista { margin: 18px 0 0; padding-left: 20px; display: grid; gap: 8px; }
#aResp { font-weight: 700; }
#aResp.erro { color: #B5384A; }

.rodape-links { margin-top: 8px; }
.rodape-links a { color: var(--sol); }
.rodape-credito {
  max-width: 560px; margin: 22px auto 0; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .14);
  font-size: .86rem; color: #B9B3D0; letter-spacing: .01em;
}
.rodape-credito strong { color: var(--lavanda); font-weight: 700; }

.cookies {
  position: fixed; left: 12px; right: 12px; bottom: calc(100px + env(safe-area-inset-bottom, 0px)); z-index: 60;
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: center;
  background: var(--noite); color: var(--lavanda); border: 2px solid var(--sol); border-radius: 16px; padding: 12px 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .45); max-width: 720px; margin: 0 auto;
}
.cookies p { margin: 0; flex: 1 1 260px; }
.cookies a { color: var(--sol); }

/* ---------- Programação e compartilhar música ---------- */
.prog-lista { margin-top: 22px; display: grid; gap: 22px; }
.prog-dia h3 { font-size: 1.1rem; margin-bottom: 10px; text-transform: capitalize; }
.prog-itens { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.prog-item {
  display: flex; align-items: center; gap: 14px; padding: 12px 16px; border-radius: 14px;
  background: var(--papel); border: 2px solid var(--linha);
}
.prog-item.agora { background: var(--sol); border-color: var(--sol); color: var(--tinta); }
.prog-hora { font-family: var(--f-titulo); font-weight: 800; white-space: nowrap; min-width: 6.5ch; }
.prog-nome { font-weight: 700; flex: 1; overflow-wrap: anywhere; }
.prog-tag { font-size: .75rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; border-radius: 999px; padding: 3px 10px; background: var(--tinta); color: var(--branco); white-space: nowrap; }
.prog-tag.ao-vivo { background: #B5384A; }

.player-comp {
  flex: none; width: 44px; height: 44px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .45);
  background: transparent; color: var(--lavanda); display: flex; align-items: center; justify-content: center;
}
.player-comp svg { width: 20px; height: 20px; }
.player-comp:hover { background: rgba(255, 255, 255, .15); }
.player-comp[hidden] { display: none; }

/* Relógio discreto no player (horário de Brasília) */
.player-relogio { flex: none; text-align: right; line-height: 1.15; color: #B9B3D0; opacity: .85; font-variant-numeric: tabular-nums; user-select: none; }
.rel-hora { display: block; font-size: .95rem; font-weight: 700; color: var(--lavanda); letter-spacing: .02em; }
.rel-data { display: block; font-size: .72rem; text-transform: capitalize; }
@media (min-width: 769px) { .player-relogio { opacity: 1; } .rel-hora { font-size: 1.6rem; } .rel-data { font-size: 1rem; margin-top: 2px; } }
@media (max-width: 420px) { .player { gap: 10px; } .rel-hora { font-size: .85rem; } .rel-data { font-size: .66rem; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
/* ===== Destaque de evento (Grenal) ===== */
.destaque-evento { padding: 0 16px; margin: 0 auto 8px; max-width: 980px; }
.destaque-evento[hidden] { display: none; }
.dst-in {
  position: relative; overflow: hidden; isolation: isolate;
  display: grid; grid-template-columns: 1fr 1.6fr 1fr; align-items: center; gap: 8px;
  padding: 22px 14px; border-radius: 22px; color: #fff; text-align: center;
  background:
    linear-gradient(105deg, #0b6fb3 0%, #0b6fb3 26%, #101418 26%, #101418 38%, transparent 38%),
    linear-gradient(-105deg, #d4101c 0%, #d4101c 26%, #fff 26%, #fff 30%, transparent 30%),
    linear-gradient(180deg, #151a33, #0c0f22);
  box-shadow: 0 12px 34px rgba(8, 12, 40, .45);
}
.dst-in::after { /* brilho que passa */
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,.16) 50%, transparent 65%);
  transform: translateX(-120%); animation: dstBrilho 4.5s ease-in-out infinite;
}
@keyframes dstBrilho { 0% { transform: translateX(-120%); } 55%, 100% { transform: translateX(120%); } }
.dst-centro { padding: 0 4px; }
.dst-chamada { margin: 0 0 2px; font: 800 12px/1.2 var(--f-texto); letter-spacing: .14em; color: var(--sol); }
.dst-titulo {
  margin: 0; font: 800 clamp(40px, 11vw, 72px)/1 var(--f-titulo); letter-spacing: .04em; text-transform: uppercase;
  text-shadow: 0 0 18px rgba(255,255,255,.35), 0 4px 0 rgba(0,0,0,.35); animation: dstPulso 2.4s ease-in-out infinite;
}
@keyframes dstPulso { 50% { transform: scale(1.045); text-shadow: 0 0 28px rgba(255,255,255,.6), 0 4px 0 rgba(0,0,0,.35); } }
.dst-quando { margin: 6px 0 2px; font: 700 15px/1.3 var(--f-texto); }
.dst-contagem { margin: 0 0 12px; font: 600 14px/1.3 var(--f-texto); color: #ffe7a3; }
.dst-ouvir {
  border: 0; cursor: pointer; padding: 11px 22px; border-radius: 999px;
  font: 800 15px/1 var(--f-texto); color: #1b2140; background: var(--sol);
  box-shadow: 0 4px 0 rgba(0,0,0,.3); transition: transform .15s;
}
.dst-ouvir:hover { transform: translateY(-2px); }
.dst-ouvir:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.dst-lado { display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 0; }
.dst-nome { font: 800 clamp(13px, 3.4vw, 20px)/1.15 var(--f-titulo); text-transform: uppercase; letter-spacing: .04em; text-shadow: 0 2px 6px rgba(0,0,0,.6); overflow-wrap: anywhere; }
.dst-escudo-box { width: clamp(52px, 15vw, 96px); aspect-ratio: 1; display: grid; place-items: center; }
.dst-escudo-box[hidden] { display: none; }
.dst-escudo { max-width: 100%; max-height: 100%; object-fit: contain; filter: drop-shadow(0 4px 8px rgba(0,0,0,.5)); animation: dstFlutua 3s ease-in-out infinite; }
.dst-b .dst-escudo { animation-delay: -1.5s; }
@keyframes dstFlutua { 50% { transform: translateY(-5px); } }
.dst-aovivo .dst-contagem { color: #fff; font-weight: 800; }
.dst-aovivo .dst-contagem::before { content: ''; display: inline-block; width: 10px; height: 10px; margin-right: 8px; border-radius: 50%; background: #ff3b3b; animation: dstPonto 1s ease-in-out infinite; }
@keyframes dstPonto { 50% { opacity: .25; transform: scale(.7); } }
@media (max-width: 520px) { .dst-in { padding: 18px 8px; gap: 4px; } .dst-quando { font-size: 13px; } }
@media (prefers-reduced-motion: reduce) { .dst-in::after, .dst-titulo, .dst-escudo, .dst-aovivo .dst-contagem::before { animation: none; } }
.dst-centro { background: radial-gradient(ellipse at center, rgba(10,13,32,.82) 35%, rgba(10,13,32,0) 75%); padding: 14px 6px; }
.dst-nome { overflow-wrap: normal; word-break: normal; }
@media (max-width: 520px) {
  .dst-in { grid-template-columns: 0.85fr 1.7fr 0.85fr; }
  .dst-nome { font-size: 11px; letter-spacing: 0; }
  .dst-titulo { font-size: clamp(34px, 11vw, 52px); }
}
@media (max-width: 520px) {
  .dst-in { grid-template-columns: 1fr 1fr; gap: 10px 4px; padding: 18px 10px 20px; }
  .dst-centro { grid-column: 1 / -1; order: 3; background: radial-gradient(ellipse at center, rgba(10,13,32,.8) 40%, rgba(10,13,32,0) 80%); }
  .dst-a { order: 1; } .dst-b { order: 2; }
  .dst-nome { font-size: 15px; letter-spacing: .03em; }
  .dst-titulo { font-size: clamp(44px, 15vw, 64px); }
  .dst-escudo-box { width: 72px; }
}
.dst-escudo-box { width: clamp(70px, 22vw, 124px); aspect-ratio: auto; height: clamp(84px, 26vw, 148px); }
@media (max-width: 520px) { .dst-escudo-box { width: 96px; height: 112px; } }

/* ===== Destaques do dia (manchetes em movimento) ===== */
.destaque-dia { padding: 0 16px; margin: 0 auto 8px; max-width: 980px; }
.destaque-dia[hidden], #destaqueEvento:not([hidden]) ~ .destaque-dia { display: none; }
.dd-in { position: relative; overflow: hidden; border-radius: 22px; color: #fff; isolation: isolate;
  background: linear-gradient(135deg, #1B2140, #3A2C5E 55%, #B54A78); box-shadow: 0 12px 34px rgba(27,33,64,.4); }
.dd-in::before, .dd-in::after { content: ''; position: absolute; z-index: -1; border-radius: 50%; filter: blur(40px); opacity: .55; }
.dd-in::before { width: 60%; aspect-ratio: 1; left: -10%; top: -30%; background: #FFC145; animation: ddFlutua 14s ease-in-out infinite alternate; }
.dd-in::after { width: 55%; aspect-ratio: 1; right: -12%; bottom: -40%; background: #4C86A0; animation: ddFlutua 17s ease-in-out infinite alternate-reverse; }
@keyframes ddFlutua { to { transform: translate(18%, 14%) scale(1.25); } }
.dd-topo { display: flex; align-items: center; gap: 12px; padding: 14px 16px 0; font: 700 13px/1.2 var(--f-texto); }
.dd-tag { display: inline-flex; align-items: center; gap: 8px; letter-spacing: .12em; color: #FFC145; }
.dd-tag i { width: 9px; height: 9px; border-radius: 50%; background: #ff4d4d; animation: dstPonto 1.2s ease-in-out infinite; }
.dd-data { opacity: .85; font-weight: 600; }
.dd-contador { margin-left: auto; opacity: .8; font-variant-numeric: tabular-nums; }
.dd-pausa { border: 1px solid rgba(255,255,255,.4); background: rgba(255,255,255,.12); color: #fff; padding: 6px 12px; border-radius: 999px; cursor: pointer; font: 700 12px/1 var(--f-texto); }
.dd-pausa:focus-visible, .dd-slide:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.dd-palco { position: relative; min-height: clamp(190px, 46vw, 300px); }
.dd-slide { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; gap: 12px; padding: 14px 22px 22px;
  color: #fff; text-decoration: none; opacity: 0; transform: translateX(6%) scale(1.03); pointer-events: none;
  transition: opacity .6s ease, transform 1.2s cubic-bezier(.2,.7,.2,1); }
.dd-slide.dd-ativo { opacity: 1; transform: none; pointer-events: auto; animation: ddZoom 9s ease-out forwards; }
@keyframes ddZoom { from { transform: scale(1); } to { transform: scale(1.025); } }
.dd-fonte { align-self: flex-start; padding: 5px 12px; border-radius: 999px; background: rgba(255,255,255,.16); font: 700 13px/1.2 var(--f-texto); }
.dd-tit { font: 800 clamp(22px, 5.4vw, 40px)/1.15 var(--f-titulo); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; text-shadow: 0 2px 10px rgba(0,0,0,.35); }
.dd-palavra { display: inline-block; margin-right: .28em; opacity: 0; transform: translateY(14px); }
.dd-ativo .dd-palavra { animation: ddPalavra .6s cubic-bezier(.2,.7,.2,1) forwards; }
@keyframes ddPalavra { to { opacity: 1; transform: none; } }
.dd-barras { display: flex; gap: 5px; padding: 0 16px 14px; }
.dd-barra { flex: 1; height: 4px; border-radius: 4px; background: rgba(255,255,255,.22); overflow: hidden; }
.dd-barra i { display: block; height: 100%; width: 0; background: #FFC145; }
.dd-barra.dd-feita i { width: 100%; }
.dd-barra.dd-corre i { animation: ddBarra 7s linear forwards; }
@keyframes ddBarra { to { width: 100%; } }
.dd-parado .dd-barra.dd-corre i, .dd-parado .dd-slide.dd-ativo { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .dd-in::before, .dd-in::after, .dd-slide.dd-ativo, .dd-tag i { animation: none; }
  .dd-slide { transition: opacity .3s; transform: none; }
  .dd-palavra { opacity: 1; transform: none; }
  .dd-ativo .dd-palavra { animation: none; }
}
.dd-tag, .dd-contador { white-space: nowrap; }
@media (max-width: 520px) { .dd-contador { display: none; } .dd-data { font-size: 12px; margin-left: auto; } .dd-topo { gap: 8px; } .dd-pausa { padding: 6px 10px; } }
@media (max-width: 520px) { .dd-data { display: none; } .dd-pausa { margin-left: auto; } }

/* Contato e páginas extras */
.rodape-contato { margin-top: 6px; }
.rodape-contato a { color: var(--sol); overflow-wrap: anywhere; }
.contato-direto { margin: 14px 0 18px; line-height: 1.5; }
.contato-direto a { font-weight: 700; overflow-wrap: anywhere; }

/* Agenda em destaque */
.dd-agenda { margin-left: auto; background: #FFC145; color: #1B2140; padding: 6px 14px; border-radius: 999px; text-decoration: none; font: 800 12px/1 var(--f-texto); }
.dd-agenda:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.dd-contador { margin-left: 0; }
.dd-onde { font: 600 clamp(14px, 3.6vw, 18px)/1.3 var(--f-texto); opacity: .92; }
@media (max-width: 520px) { .dd-pausa { margin-left: 0; } }
.dd-agenda, .dd-pausa { white-space: nowrap; }
@media (max-width: 520px) { .dd-tag { letter-spacing: .06em; font-size: 12px; } .dd-agenda { padding: 6px 12px; } }

/* Agenda em destaque (cartões) — só aparece enquanto o banner de evento está na tela */
.agenda-top { display: none; padding: 0 16px; margin: 0 auto 10px; max-width: 980px; }
#destaqueEvento:not([hidden]) ~ .agenda-top:not([hidden]) { display: block; }
.at-in { background: var(--branco); border: 1px solid var(--linha); border-radius: 22px; padding: 14px 14px 16px; }
.at-cab { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 12px; margin-bottom: 10px; }
.at-cab h2 { margin: 0; font-size: 1.15rem; }
.at-todos { font-weight: 800; font-size: .9rem; color: var(--rio); }
.at-lista { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(210px, 78%); gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; scrollbar-width: thin; }
.at-card { scroll-snap-align: start; display: flex; gap: 12px; align-items: flex-start; padding: 12px; border-radius: 16px; background: var(--lavanda); color: var(--tinta); text-decoration: none; border: 2px solid transparent; }
.at-card:hover, .at-card:focus-visible { border-color: var(--crepusculo); outline: none; }
.at-data { flex: none; width: 52px; border-radius: 12px; background: var(--crepusculo); color: #fff; display: grid; place-items: center; padding: 6px 0; line-height: 1; }
.at-data b { font: 800 1.45rem/1 var(--f-titulo); }
.at-data small { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; margin-top: 2px; }
.at-corpo { display: grid; gap: 3px; min-width: 0; }
.at-quando { font-size: .78rem; font-weight: 800; color: var(--rosa); text-transform: uppercase; letter-spacing: .05em; }
.at-nome { font: 800 1.02rem/1.2 var(--f-titulo); overflow-wrap: anywhere; }
.at-onde { font-size: .84rem; color: var(--tinta-suave); font-weight: 600; overflow-wrap: anywhere; }
@media (min-width: 900px) { .at-lista { grid-auto-flow: row; grid-template-columns: repeat(5, 1fr); grid-auto-columns: auto; overflow: visible; } .at-card { flex-direction: column; } .at-data { width: 56px; } }

/* Páginas abertas por cima da rádio (paginas-overlay.js) */
html.ov-aberto, html.ov-aberto body { overflow: hidden; }
.ov-pagina {
  position: fixed; left: 0; right: 0; top: 0; bottom: var(--player-h, 76px); z-index: 35;
  display: flex; flex-direction: column; background: var(--noite);
}
.ov-barra { flex: none; display: flex; align-items: center; gap: 12px; padding: calc(8px + var(--inset-topo)) 12px 8px; background: var(--noite); color: var(--lavanda); border-bottom: 1px solid rgba(255,255,255,.12); }
.ov-voltar { white-space: nowrap; border: 0; border-radius: 999px; padding: 10px 16px; font: inherit; font-weight: 700; background: var(--sol); color: var(--tinta); cursor: pointer; }
.ov-nota { font-size: .85rem; opacity: .8; }
.ov-frame { flex: 1; width: 100%; border: 0; background: var(--noite); }

/* ===== Identidade RDW (Rádio Web): logo animada ===== */
:root { --rdw-ciano: #00d2ff; --rdw-grad: linear-gradient(90deg, #FFC145, #F08A45, #FF4F8B, #00d2ff, #FFC145); }
.marca.rdw { display: inline-flex; align-items: center; gap: 9px; line-height: 1; position: relative; }
.rdw-eq { display: inline-flex; align-items: flex-end; gap: 3px; height: 26px; }
.rdw-eq i {
  display: block; width: 5px; height: 100%; border-radius: 3px;
  background: linear-gradient(180deg, #00d2ff, #FF4F8B 55%, #FFC145);
  transform-origin: bottom; transform: scaleY(.35);
  animation: rdw-eq 1s ease-in-out infinite;
  box-shadow: 0 0 8px rgba(0, 210, 255, .55);
}
.rdw-eq i:nth-child(1) { animation-delay: -.7s; }
.rdw-eq i:nth-child(2) { animation-delay: -.2s; animation-duration: .8s; }
.rdw-eq i:nth-child(3) { animation-delay: -.5s; animation-duration: 1.15s; }
.rdw-eq i:nth-child(4) { animation-delay: -.35s; animation-duration: .9s; }
@keyframes rdw-eq { 0%, 100% { transform: scaleY(.25); } 50% { transform: scaleY(1); } }
.rdw-txt {
  font-family: var(--f-titulo); font-weight: 800; font-size: 1.7rem; letter-spacing: .06em;
  background: var(--rdw-grad); background-size: 300% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
  animation: rdw-cor 5s linear infinite, rdw-brilho 2.4s ease-in-out infinite;
}
@keyframes rdw-cor { to { background-position: 300% 0; } }
@keyframes rdw-brilho { 0%, 100% { filter: drop-shadow(0 0 3px rgba(255, 193, 69, .5)); } 50% { filter: drop-shadow(0 0 11px rgba(255, 79, 139, .95)); } }

/* RDW grande no início do site */
.rdw-hero { position: relative; z-index: 3; display: block; width: 100%; text-align: center; margin: 0 auto 18px; padding: 8px 0 4px; }
.rdw-hero::before, .rdw-hero::after {
  content: ""; position: absolute; left: 50%; top: 46%; width: 160px; height: 160px; margin: -80px 0 0 -80px;
  border-radius: 50%; border: 2px solid rgba(0, 210, 255, .55); opacity: 0; pointer-events: none;
  animation: rdw-onda 3s ease-out infinite;
}
.rdw-hero::after { border-color: rgba(255, 79, 139, .55); animation-delay: 1.5s; }
@keyframes rdw-onda { 0% { transform: scale(.5); opacity: .9; } 100% { transform: scale(2.6); opacity: 0; } }
.rdw-grande {
  position: relative; display: flex; justify-content: center; gap: .04em;
  font-family: var(--f-titulo); font-weight: 800; font-size: clamp(4.2rem, 22vw, 7.6rem); line-height: 1; letter-spacing: .02em;
}
.rdw-grande span {
  display: inline-block;
  background: var(--rdw-grad); background-size: 300% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
  animation: rdw-cor 4s linear infinite, rdw-pula 2.2s ease-in-out infinite, rdw-brilho 2.2s ease-in-out infinite;
}
.rdw-grande span:nth-child(2) { animation-delay: 0s, .25s, .25s; }
.rdw-grande span:nth-child(3) { animation-delay: 0s, .5s, .5s; }
@keyframes rdw-pula { 0%, 100% { transform: translateY(0) rotate(-1.5deg); } 50% { transform: translateY(-9px) rotate(1.5deg); } }
.rdw-sub {
  position: relative; display: inline-block; margin-top: 4px; padding: 5px 16px; border-radius: 999px;
  font-family: var(--f-titulo); font-weight: 800; font-size: .8rem; letter-spacing: .28em; color: #1B2140;
  background: var(--rdw-grad); background-size: 300% 100%; animation: rdw-cor 5s linear infinite;
  box-shadow: 0 0 18px rgba(255, 79, 139, .5);
}
/* Quem pediu "reduzir animações" (ou está com economia de bateria) ainda vê a logo viva, só mais calma:
   continuam a troca de cores e o equalizador, que ficam no lugar; saem os pulos e as ondas grandes. */
@media (prefers-reduced-motion: reduce) {
  .rdw-txt, .rdw-grande span { animation: rdw-cor 7s linear infinite !important; }
  .rdw-eq i { animation: rdw-eq 1.4s ease-in-out -.7s infinite !important; }
  .rdw-eq i:nth-child(2) { animation: rdw-eq 1.1s ease-in-out -.2s infinite !important; }
  .rdw-eq i:nth-child(3) { animation: rdw-eq 1.6s ease-in-out -.5s infinite !important; }
  .rdw-eq i:nth-child(4) { animation: rdw-eq 1.2s ease-in-out -.35s infinite !important; }
  .rdw-hero::before, .rdw-hero::after { display: none; }
}

/* Placar e tempo de jogo no banner */
.dst-placar { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 8px 0 0; font-family: var(--f-titulo); font-weight: 800; line-height: 1; }
.dst-placar[hidden], .dst-tempo[hidden] { display: none; }
.dst-gol { min-width: 1.1ch; font-size: clamp(46px, 14vw, 78px); color: #fff; text-shadow: 0 0 18px rgba(255, 193, 69, .8), 0 3px 8px rgba(0, 0, 0, .7); font-variant-numeric: tabular-nums; }
.dst-x { font-size: clamp(22px, 6vw, 34px); color: var(--sol); }
.dst-tempo { margin: 6px 0 2px; font: 800 clamp(15px, 4.4vw, 20px)/1.2 var(--f-texto); letter-spacing: .08em; color: #fff; font-variant-numeric: tabular-nums; }

/* Conteúdo próprio: guias */
.guias-tit { margin: 28px 0 12px; font-family: var(--f-titulo); font-size: 1.2rem; }
.guias-grade { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.guia-card { display: flex; flex-direction: column; gap: 6px; padding: 18px; border-radius: 16px; background: var(--lavanda); color: var(--tinta); text-decoration: none; border: 1px solid var(--linha); }
.guia-card strong { font-family: var(--f-titulo); font-size: 1.1rem; }
.guia-card span { color: var(--tinta-suave); font-size: .96rem; }
.guia-card:hover { border-color: var(--rosa); transform: translateY(-2px); }
.termos dt { font-family: var(--f-titulo); font-weight: 800; font-size: 1.1rem; margin-top: 14px; color: var(--crepusculo); }
.termos dd { margin: 2px 0 0; }

/* Setas para avançar e voltar nos destaques da agenda */
.dd-corpo { position: relative; }
.dd-seta { position: absolute; top: 50%; margin-top: -19px; z-index: 3; width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(255,255,255,.45); background: rgba(10,13,32,.45); color: #fff; font: 700 26px/1 var(--f-texto); display: grid; place-items: center; padding: 0 0 3px; cursor: pointer; }
.dd-seta:hover { background: rgba(10,13,32,.75); }
.dd-seta:focus-visible, .dd-seta:focus { outline: 3px solid #fff !important; outline-offset: 2px !important; transform: none !important; box-shadow: none !important; }
.dd-ant { left: 8px; } .dd-prox { right: 8px; }
.dd-slide { padding-left: 54px; padding-right: 54px; }
.dd-barra { cursor: pointer; padding: 6px 0; background-clip: content-box; height: 16px; }
@media (max-width: 520px) { .dd-seta { width: 34px; height: 34px; margin-top: -17px; font-size: 24px; } .dd-slide { padding-left: 46px; padding-right: 46px; } }

/* ===== Banner Eleições 2026 ===== */
.banner-eleicao { padding: 0 16px; margin: 0 auto 10px; max-width: 980px; }
.banner-eleicao[hidden] { display: none; }
.el-in {
  position: relative; overflow: hidden; isolation: isolate;
  display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 18px;
  padding: 22px 22px 18px; border-radius: 22px 22px 0 0; color: #fff;
  background: linear-gradient(120deg, #00843d, #0a5c3a 30%, #0d2f6e 62%, #0b3d91 82%, #0a7a3d);
  background-size: 260% 260%; animation: elFundo 9s ease-in-out infinite;
  box-shadow: 0 12px 34px rgba(8, 12, 40, .4);
}
.el-in::before { /* losango amarelo da bandeira, girando devagar */
  content: ''; position: absolute; z-index: -1; width: 420px; height: 420px; right: -120px; top: -150px;
  background: radial-gradient(circle, rgba(255,214,10,.28), rgba(255,214,10,0) 65%);
  transform: rotate(45deg); animation: elGira 14s linear infinite;
}
.el-in::after { content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,.16) 50%, transparent 65%);
  transform: translateX(-120%); animation: dstBrilho 5s ease-in-out infinite; }
.el-urna { width: clamp(78px, 17vw, 120px); aspect-ratio: 1; filter: drop-shadow(0 6px 12px rgba(0,0,0,.35)); }
.el-voto { animation: elVoto 2.8s ease-in infinite; }
.el-tag { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 6px; padding: 4px 12px; border-radius: 999px;
  background: #ffd60a; color: #0d2f6e; font: 800 12px/1.2 var(--f-texto); letter-spacing: .12em; }
.el-tag i { width: 9px; height: 9px; border-radius: 50%; background: #0d2f6e; }
.banner-eleicao[data-fase="apuracao"] .el-tag { background: #ff3b3b; color: #fff; }
.banner-eleicao[data-fase="apuracao"] .el-tag i, .banner-eleicao[data-fase="votando"] .el-tag i { background: #fff; animation: dstPonto 1s ease-in-out infinite; }
.banner-eleicao[data-fase="votando"] .el-tag { background: #fff; color: #00843d; }
.banner-eleicao[data-fase="votando"] .el-tag i { background: #00843d; }
.el-titulo { margin: 0; font: 900 clamp(28px, 6.4vw, 50px)/1 var(--f-titulo); letter-spacing: .01em;
  background: linear-gradient(90deg, #fff, #ffd60a, #fff); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: elTitulo 3.5s linear infinite; text-shadow: none; }
.el-sub { margin: 8px 0 4px; font: 600 15px/1.4 var(--f-texto); max-width: 60ch; }
.el-conta { margin: 0 0 12px; font: 800 15px/1.3 var(--f-texto); color: #ffe27a; font-variant-numeric: tabular-nums; }
.el-botoes { display: flex; flex-wrap: wrap; gap: 10px; }
.el-apurar, .el-ouvir { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 18px; border-radius: 999px; font: 800 15px/1.2 var(--f-texto); text-decoration: none; cursor: pointer; transition: transform .2s; }
.el-apurar { background: #ffd60a; color: #0d2f6e; border: 0; box-shadow: 0 6px 16px rgba(0,0,0,.25); animation: elPulsa 2.2s ease-in-out infinite; }
.el-ouvir { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,.8); }
.el-apurar:hover, .el-ouvir:hover { transform: translateY(-2px); }
.el-apurar:focus-visible, .el-ouvir:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.el-faixa { overflow: hidden; border-radius: 0 0 22px 22px; background: #ffd60a; color: #0d2f6e; box-shadow: 0 12px 34px rgba(8, 12, 40, .25); }
.el-faixa-mov { display: flex; width: max-content; animation: elFaixa 40s linear infinite; }
.el-faixa-mov span { padding: 9px 22px; font: 800 13px/1.2 var(--f-texto); text-transform: uppercase; letter-spacing: .06em; white-space: nowrap; }
.el-faixa-mov span::after { content: '★'; margin-left: 22px; color: #00843d; }
@keyframes elFundo { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes elGira { to { transform: rotate(405deg); } }
@keyframes elVoto { 0% { transform: translateY(-14px); opacity: 0; } 18% { opacity: 1; } 55% { transform: translateY(26px); opacity: 1; } 70%, 100% { transform: translateY(40px); opacity: 0; } }
@keyframes elTitulo { to { background-position: -200% 0; } }
@keyframes elPulsa { 0%, 100% { box-shadow: 0 6px 16px rgba(0,0,0,.25), 0 0 0 0 rgba(255,214,10,.6); } 50% { box-shadow: 0 6px 16px rgba(0,0,0,.25), 0 0 0 10px rgba(255,214,10,0); } }
@keyframes elFaixa { to { transform: translateX(-50%); } }
@media (max-width: 560px) {
  .el-in { grid-template-columns: 1fr; text-align: center; padding: 18px 14px 14px; gap: 6px; }
  .el-urna { margin: 0 auto; width: 76px; }
  .el-botoes { justify-content: center; }
  .el-sub { font-size: 14px; margin-left: auto; margin-right: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .el-in, .el-in::before, .el-in::after, .el-voto, .el-titulo, .el-apurar, .el-faixa-mov, .el-tag i { animation: none !important; }
  .el-titulo { color: #fff; background: none; }
}

/* placar da apuração */
.el-placar { margin: 4px 0 14px; max-width: 620px; }
.el-placar[hidden] { display: none; }
.el-abas { display: inline-flex; gap: 4px; padding: 3px; border-radius: 999px; background: rgba(0,0,0,.25); margin-bottom: 10px; }
.el-aba { border: 0; border-radius: 999px; padding: 6px 14px; min-height: 32px; background: transparent; color: #fff; font: 700 13px/1 var(--f-texto); cursor: pointer; }
.el-aba[aria-selected="true"] { background: #fff; color: #0d2f6e; }
.el-cand { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; align-items: end; margin-bottom: 10px; }
.el-cand-nome { font: 800 clamp(15px, 3.6vw, 19px)/1.15 var(--f-titulo); text-transform: uppercase; }
.el-cand-nome small { font: 600 12px/1 var(--f-texto); opacity: .8; margin-left: 6px; text-transform: none; }
.el-cand-pct { font: 900 clamp(24px, 6vw, 36px)/1 var(--f-titulo); font-variant-numeric: tabular-nums; }
.el-cand-barra { grid-column: 1 / -1; height: 12px; border-radius: 999px; background: rgba(255,255,255,.18); overflow: hidden; }
.el-cand-barra i { display: block; height: 100%; width: 0; border-radius: 999px; background: #ffd60a; transition: width 1.2s ease; }
.el-cand:nth-child(2) .el-cand-barra i { background: #8fd3ff; }
.el-cand-votos { grid-column: 1 / -1; font: 600 12px/1.2 var(--f-texto); opacity: .85; font-variant-numeric: tabular-nums; }
.el-cand.el-eleito .el-cand-nome::after { content: ' ✓ ELEITO'; color: #ffd60a; font-size: .8em; }
.el-prog-barra { height: 6px; border-radius: 999px; background: rgba(255,255,255,.2); overflow: hidden; }
.el-prog-barra i { display: block; height: 100%; width: 0; background: #fff; transition: width 1.2s ease; }
.el-prog-txt { margin: 6px 0 0; font: 600 13px/1.3 var(--f-texto); opacity: .9; }
@media (max-width: 560px) { .el-placar { margin-left: auto; margin-right: auto; text-align: left; } }