/* Guia da Transparência · Resultado do 2º turno de 2026 (#/resultado-2026). Usa os tokens --n-* do tema da eleição (claro e escuro).
   A abertura é sempre no azul-marinho do Guia, com o amarelo de destaque e a cor do partido de quem venceu. Só CSS, sem biblioteca. */

.r26{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;margin-top:6px}
.r26>*,.r26-bloco>*{min-width:0}

/* ---------- abertura ---------- */
.r26-hero{position:relative;overflow:hidden;border-radius:18px;background:radial-gradient(120% 90% at 85% 10%,#13306A 0%,#071D41 55%,#040F24 100%);color:#fff;
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center;min-height:520px;isolation:isolate}
.r26-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(50% 60% at 78% 50%,color-mix(in srgb,var(--ca) 34%,transparent),transparent 70%);
  animation:r26-pulsa 6s ease-in-out infinite alternate}
.r26-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,var(--ca) 0 50%,#FFCD07 50% 100%);transform-origin:left;animation:r26-risca 1.6s .3s cubic-bezier(.2,.7,.2,1) both}
.r26-hero-txt{padding:44px 40px;position:relative;z-index:1;order:1}
.r26-hero-mapa{order:2;padding:24px 28px 24px 0;align-self:stretch;display:flex;align-items:center;justify-content:center}
.r26-hero-mapa svg{width:100%;max-height:480px;filter:drop-shadow(0 18px 40px rgba(0,0,0,.45))}
.r26-uf{fill:var(--c);stroke:#071D41;stroke-width:1.6;opacity:0;transform-box:fill-box;transform-origin:center;animation:r26-acende .7s var(--d) cubic-bezier(.2,.8,.2,1.2) both}
.r26-sobre{margin:0;font:600 .78rem/1.4 var(--n-mono);letter-spacing:.06em;text-transform:uppercase;color:#C5D4EB;animation:r26-sobe .6s .1s both}
.r26 .r26-selo{display:inline-block;margin:14px 0 6px;padding:5px 12px;border-radius:999px;background:#FFCD07;color:#071D41;font:800 .85rem/1.3 var(--n-ui);letter-spacing:.03em;text-transform:uppercase;animation:r26-sobe .6s .25s both}
.r26-pessoa{display:flex;align-items:center;gap:18px;margin-top:6px}
.r26 .r26-foto{width:92px;height:92px;flex:none;border-radius:50%;box-shadow:0 0 0 4px var(--ca),0 0 0 8px rgba(255,255,255,.08);animation:r26-surge .9s .35s cubic-bezier(.2,.8,.2,1.1) both}
.r26-nome{margin:0;font:900 clamp(3rem,7.5vw,6.2rem)/.92 var(--n-display);letter-spacing:.01em;text-transform:uppercase;color:#fff;display:flex;flex-wrap:wrap}
.r26-nome span{display:inline-block;animation:r26-letra .7s calc(.45s + var(--i) * .045s) cubic-bezier(.2,.8,.2,1) both}
.r26-partido{margin:10px 0 0;color:#DBE8FB;font:500 1rem/1.4 var(--n-ui);animation:r26-sobe .6s .9s both}
.r26-placar{display:flex;flex-wrap:wrap;gap:12px 30px;margin:24px 0 18px;animation:r26-sobe .6s 1s both}
.r26-placar b{display:block;font:800 clamp(1.7rem,3.4vw,2.6rem)/1 var(--n-display);color:#fff;font-variant-numeric:tabular-nums}
.r26-placar div:first-child b{color:#FFCD07}
.r26-placar small{color:#C5D4EB;font-size:.82rem}
.r26 .r26-barra{position:relative;display:flex;height:16px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.1)}
.r26 .r26-barra span{width:var(--w);transform-origin:left;animation:r26-cresce 1.4s 1.1s cubic-bezier(.2,.7,.2,1) both}
.r26 .r26-barra .a{background:var(--ca)}
.r26 .r26-barra .b{background:var(--cb);transform-origin:right}
.r26 .r26-barra .meio{position:absolute;left:50%;top:-4px;bottom:-4px;width:2px;background:#fff;opacity:.85}
.r26-barra-leg{display:flex;justify-content:space-between;gap:12px;margin-top:6px;font-size:.8rem;color:#C5D4EB}
.r26-origem{margin:18px 0 0;max-width:56ch;font-size:.88rem;line-height:1.5;color:#DBE8FB;border-left:3px solid #FFCD07;padding-left:10px;animation:r26-sobe .6s 1.3s both}

/* ---------- blocos ---------- */
.r26-bloco{background:var(--n-folha);border:1px solid var(--n-linha);border-radius:16px;padding:28px;box-shadow:var(--n-sombra)}
.r26-bloco h2{margin:4px 0 10px;font:700 clamp(1.3rem,2.4vw,1.75rem)/1.25 var(--n-serif);color:var(--n-tinta)}
.r26-bloco h2 em{font-style:normal;font-family:var(--n-display);font-size:1.25em}
.r26-bloco p{color:var(--n-tinta2);line-height:1.55}
.r26-k{margin:0;font:600 .74rem/1.4 var(--n-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--n-caneta)}

.r26-cem{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:28px;align-items:center}
.r26-grade{display:grid;grid-template-columns:repeat(10,1fr);gap:5px}
.r26-grade i{aspect-ratio:1;border-radius:4px;background:var(--c);animation:r26-ponto .45s calc(var(--k,0) * 1ms) both}

.r26-mapa{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:24px;align-items:center}
.r26-mapa-svg svg{width:100%;max-height:560px}
.r26-m-uf{fill:color-mix(in srgb,var(--c) calc(var(--a) * 100%),var(--n-terra));stroke:var(--borda,var(--n-folha));stroke-width:var(--bw,1.4);cursor:pointer;transition:filter .2s,stroke-width .2s;outline:none}
.r26-m-uf[style*="--borda"]{--bw:4}
.r26-m-uf:hover,.r26-m-uf:focus-visible,.r26-m-uf.on{filter:brightness(1.12) drop-shadow(0 0 6px rgba(0,0,0,.25));stroke:var(--n-tinta);--bw:3}
.r26-mapa-info{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;min-height:56px;margin:14px 0;padding:12px 14px;border-radius:12px;background:var(--n-folha2);color:var(--n-tinta)}
.r26-mapa-info b{width:100%;font-size:1.05rem}
.r26-mapa-info small{width:100%;color:var(--n-tinta2)}
.r26-mapa-info i,.r26 .r26-leg i,.r26-pt{display:inline-block;width:11px;height:11px;border-radius:3px;background:var(--c);margin-right:6px;vertical-align:-1px}
.r26 .r26-leg{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.88rem;color:var(--n-tinta2)}
.r26 .r26-leg i.vira{background:transparent;box-shadow:inset 0 0 0 3px var(--n-amarelo)}

.r26-tts{display:grid;gap:18px;margin-top:16px}
.r26-tt-nome{display:flex;align-items:center;gap:10px;margin-bottom:8px;color:var(--n-tinta)}
.r26-tt-nome small{color:var(--n-tinta2)}
.r26-tt-barras{display:grid;gap:6px}
.r26-tt-barras span{position:relative;display:block;height:30px;width:var(--w);min-width:180px;border-radius:6px;background:var(--c);transform-origin:left;animation:r26-cresce 1.2s cubic-bezier(.2,.7,.2,1) both}
.r26-tt-barras .t1{opacity:.45}
.r26-tt-barras em{position:absolute;left:10px;top:50%;transform:translateY(-50%);font:600 .8rem/1 var(--n-mono);font-style:normal;color:#fff;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.r26-tt-barras .t1 em{color:var(--n-tinta);text-shadow:none}
.r26-tt-ganho{margin:6px 0 0;font-size:.88rem}

.r26-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:14px}
.r26-nums div{padding:14px;border-radius:12px;background:var(--n-folha2)}
.r26-nums b{display:block;font:800 1.6rem/1.1 var(--n-display);color:var(--n-tinta);font-variant-numeric:tabular-nums}
.r26-nums small{color:var(--n-tinta2)}

.r26-govs{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:14px}
.r26-gov{padding:14px;border-radius:12px;border:1px solid var(--n-linha);border-top:4px solid var(--c,var(--n-linha));background:var(--n-folha)}
.r26-gov>small{font:600 .74rem/1.4 var(--n-mono);text-transform:uppercase;letter-spacing:.05em;color:var(--n-tinta2)}
.r26-gov-p{display:flex;align-items:center;gap:10px;margin-top:8px}
.r26-gov-p b{display:block;color:var(--n-tinta)}
.r26-gov-p span{font-size:.86rem;color:var(--n-tinta2)}
.r26-gov-s{margin:8px 0 0;font-size:.82rem}

.r26-tab td:nth-child(3),.r26-tab td:nth-child(9),.r26-tab td:first-child{white-space:nowrap}
.r26-tab td:nth-child(n+4):nth-child(-n+8),.r26-tab th:nth-child(n+4):nth-child(-n+8){text-align:right;font-variant-numeric:tabular-nums}
.r26-acoes{display:flex;flex-wrap:wrap;gap:10px}
.r26-fonte{font-size:.82rem;margin:0}

/* ---------- movimento ---------- */
@keyframes r26-acende{from{opacity:0;transform:translateY(-14px) scale(.85)}to{opacity:1;transform:none}}
@keyframes r26-sobe{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes r26-letra{from{opacity:0;transform:translateY(.5em) rotate(4deg);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes r26-surge{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes r26-cresce{from{transform:scaleX(0)}to{transform:none}}
@keyframes r26-risca{from{transform:scaleX(0)}to{transform:none}}
@keyframes r26-ponto{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:none}}
@keyframes r26-pulsa{from{opacity:.7}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.r26 *,.r26 *::before,.r26 *::after,.r26-hero::before,.r26-hero::after{animation:none!important;opacity:1}}

/* ---------- celular ---------- */
@media (max-width:860px){
  .r26-hero{grid-template-columns:1fr;min-height:0}
  .r26-hero-mapa{order:0;padding:16px 20px 0;max-height:190px}
  .r26-hero-mapa svg{max-height:170px}
  .r26-hero-txt{padding:18px 20px 28px}
  .r26 .r26-foto{width:64px;height:64px}
  .r26-cem,.r26-mapa{grid-template-columns:1fr}
  .r26-grade{max-width:340px}
  .r26-bloco{padding:20px 16px}
}
@media (max-width:420px){.r26-placar{gap:10px 20px}.r26-barra-leg{flex-direction:column;gap:2px}}
[data-theme="contrast"] .r26-hero{background:#000;border:1px solid #fff}
/* Blocos fechados (padrão "para leigo", 10/11/2026): a grade de duas colunas passa para o corpo do bloco. */
.r26 .bloco-t{color:var(--n-tinta)}
.r26 .bloco-s{color:var(--n-tinta2)}
.r26 .bloco-t em{font-style:normal}
.r26-cem.bloco,.r26-mapa.bloco{display:block}
.r26-cem.bloco>.bloco-c{grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:28px;align-items:center}
.r26-mapa.bloco>.bloco-c{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:24px;align-items:center}
@media (max-width:860px){.r26-cem.bloco>.bloco-c,.r26-mapa.bloco>.bloco-c{grid-template-columns:1fr}}
