@import url("https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:wght@400;700&family=Bricolage+Grotesque:opsz,wght@12..96,600;12..96,800&display=swap");
:root{
  --tinta:#1c2230; --tinta2:#4a5263; --papel:#ffffff; --fundo:#eef1f5; --linha:#c9d0db;
  --laranja:#b35806; --roxo:#542788; --foco:#0b5fff; --alerta:#fff4c2; --alerta-borda:#8a6d00;
  --r:6px; --t:"Atkinson Hyperlegible",system-ui,sans-serif; --d:"Bricolage Grotesque",var(--t);
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--t);color:var(--tinta);background:var(--fundo);line-height:1.5;font-size:1rem}
a{color:var(--roxo)}
:focus-visible{outline:3px solid var(--foco);outline-offset:2px}
.pular{position:absolute;left:-999px}.pular:focus{left:8px;top:8px;z-index:99;background:#fff;padding:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
header.topo{background:var(--tinta);color:#fff;padding:10px 16px;display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center}
.marca{font-family:var(--d);font-weight:800;font-size:1.3rem;letter-spacing:-.02em;color:#fff;text-decoration:none;display:flex;align-items:center;gap:8px}
.marca i{display:inline-block;width:22px;height:12px;background:linear-gradient(90deg,var(--laranja) 0 33%,#f2f0ee 33% 66%,#8073ac 66%);border-radius:2px}
nav.menu{display:flex;gap:4px 14px;flex-wrap:wrap}
nav.menu a{color:#dfe4ee;text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
nav.menu a[aria-current=page]{color:#fff;border-color:#b2abd2}
.faixa-exemplo{background:repeating-linear-gradient(-45deg,#ffe08a 0 12px,#ffd35a 12px 24px);color:#3a2b00;font-weight:700;text-align:center;padding:6px 16px}
.aviso{background:var(--alerta);border-left:5px solid var(--alerta-borda);padding:10px 12px;font-weight:700;font-size:.95rem;border-radius:var(--r)}
main{padding:0}
.pagina{max-width:46rem;margin:0 auto;padding:24px 16px 48px}
.pagina h1{font-family:var(--d);font-size:2rem;line-height:1.1;letter-spacing:-.02em;margin:.2em 0 .5em}
.pagina h2{font-family:var(--d);font-size:1.35rem;margin:1.6em 0 .4em}
/* mapa */
.app{display:grid;grid-template-rows:auto 1fr;min-height:calc(100dvh - 52px)}
.barra{padding:12px 16px;background:var(--papel);border-bottom:1px solid var(--linha);display:grid;gap:10px}
.busca{position:relative}
.busca input{width:100%;font:inherit;font-size:1.05rem;padding:12px 14px;border:2px solid var(--tinta2);border-radius:var(--r)}
.resultados{list-style:none;margin:4px 0 0;padding:0;background:#fff;border:1px solid var(--linha);border-radius:var(--r);position:absolute;left:0;right:0;z-index:20;max-height:50vh;overflow:auto}
.resultados:empty{display:none}
.resultados li{padding:10px 12px;cursor:pointer;border-bottom:1px solid #eef}
.resultados li[aria-selected=true],.resultados li:hover{background:#ece9f6}
.resultados small{display:block;color:var(--tinta2)}
.abas{display:flex;gap:6px}
.abas button{font:inherit;padding:6px 12px;border:2px solid var(--tinta);background:#fff;border-radius:999px;cursor:pointer}
.abas button[aria-selected=true]{background:var(--tinta);color:#fff}
.palco{position:relative;display:grid}
#mapa{min-height:62vh;height:100%}
.mapa-carregando{position:absolute;top:12px;left:50%;transform:translateX(-50%);margin:0;padding:6px 12px;background:#fff;border:1px solid #dde2ea;border-radius:4px;font-size:.9rem;z-index:2}
.mapa-carregando[hidden]{display:none}
.sobre-mapa{position:absolute;left:8px;right:8px;bottom:28px;display:grid;gap:6px;pointer-events:none}
.sobre-mapa>*{pointer-events:auto}
.legenda{background:#fffffff2;border-radius:var(--r);padding:8px 10px;font-size:.85rem;max-width:20rem}
.legenda .grad{height:12px;border-radius:2px;background:linear-gradient(90deg,#b35806,#e08214,#fdb863,#f2f0ee,#b2abd2,#8073ac,#542788)}
.legenda .eixo{display:flex;justify-content:space-between}
.painel{background:var(--papel);padding:16px;border-top:4px solid var(--tinta)}
.painel h2{font-family:var(--d);font-size:1.4rem;line-height:1.15;margin:0 0 2px}
.painel .end{color:var(--tinta2);margin:0 0 12px}
.numeros{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:8px;margin:12px 0}
.numeros div{background:var(--fundo);padding:8px;border-radius:var(--r)}
.numeros b{display:block;font-family:var(--d);font-size:1.5rem;line-height:1.1}
.numeros .var b{font-size:1.9rem}
.numeros span{font-size:.82rem;color:var(--tinta2)}
.shap{list-style:none;padding:0;margin:8px 0}
.shap li{display:grid;grid-template-columns:1fr;gap:2px;margin:0 0 10px}
.shap .trilho{position:relative;height:14px;background:linear-gradient(90deg,transparent calc(50% - 1px),var(--tinta2) calc(50% - 1px) calc(50% + 1px),transparent calc(50% + 1px)),#f3f4f7;border-radius:2px}
.shap .b{position:absolute;top:2px;bottom:2px}
.perfil{display:grid;grid-template-columns:1fr auto;gap:2px 12px;margin:0;font-size:.95rem}
.perfil dt{color:var(--tinta2)}.perfil dd{margin:0;text-align:right;font-weight:700}
.acoes{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.botao{font:inherit;font-weight:700;padding:10px 14px;border-radius:var(--r);border:2px solid var(--tinta);background:#fff;color:var(--tinta);cursor:pointer;text-decoration:none;display:inline-block}
.botao.forte{background:var(--tinta);color:#fff}
.fechar{float:right}
table{border-collapse:collapse;width:100%;font-size:.92rem;background:#fff}
th,td{border-bottom:1px solid var(--linha);padding:6px 8px;text-align:left}
td.n,th.n{text-align:right}
details.tabela{background:#fff;padding:8px 16px}
details.tabela summary{cursor:pointer;font-weight:700;padding:6px 0}
.tabela-rolagem{overflow-x:auto;max-height:60vh}
#perfis{padding:16px;background:var(--papel)}
.graf{margin:0 0 24px}
.graf svg{width:100%;height:auto;display:block}
footer.rodape{padding:16px;font-size:.85rem;color:var(--tinta2);border-top:1px solid var(--linha);background:#fff}
.metr{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:8px}
.metr div{background:#fff;padding:10px;border-radius:var(--r);border:1px solid var(--linha)}
.metr b{font-family:var(--d);font-size:1.6rem;display:block}
[hidden]{display:none!important}
@media (min-width:900px){
  .app{grid-template-columns:1fr 26rem;grid-template-rows:auto 1fr}
  .barra{grid-column:1/-1;grid-template-columns:1fr auto;align-items:start}
  .palco{grid-column:1}
  .lateral{grid-column:2;overflow:auto;max-height:calc(100dvh - 120px)}
  .painel{border-top:0;border-left:4px solid var(--tinta)}
  #mapa{min-height:0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.aviso-fraude{background:#eef3ff;border-left:5px solid #2d4fa3;padding:10px 12px;font-size:.92rem;border-radius:var(--r)}
.medida{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.medida select{font:inherit;padding:6px 8px;border:2px solid var(--tinta);border-radius:var(--r)}
.empilha{display:flex;height:22px;border-radius:2px;overflow:hidden;margin:6px 0;border:1px solid var(--linha)}
.empilha span{display:block}
.decomp li{margin:2px 0}
.chave{display:inline-block;width:12px;height:12px;margin-right:6px;vertical-align:-1px;border:1px solid #1c2230}
.destaques ol{padding-left:1.4em}.destaques li{margin:0 0 14px;background:#fff;padding:10px;border-radius:var(--r)}
.verif input{font:inherit;font-size:1.2rem;padding:10px;border:2px solid var(--tinta);border-radius:var(--r);width:12em}
.ok{background:#e6f4ea;border-left:5px solid #1e6b34;padding:12px}.nao{background:#fde8e8;border-left:5px solid #9b1c1c;padding:12px}

.recorte{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.recorte select,.recorte input{font:inherit;padding:6px 8px;border:2px solid var(--tinta);border-radius:var(--r)}
.busca-mun{position:relative;display:flex;gap:6px;align-items:center}
.recorte .resultados [aria-selected=true]{outline:3px solid var(--tinta)}
.resumo dl{display:grid;grid-template-columns:1fr auto;gap:4px 12px;margin:8px 0}
.resumo dd{margin:0;text-align:right;font-variant-numeric:tabular-nums;font-weight:700}

/* dicas dos indicadores e "como ler" do gráfico de associações */
details.como-ler { margin: .5rem 0; font-size: .92em; }
details.como-ler summary { cursor: pointer; font-weight: 600; }
details.dica { display: inline-block; margin-left: .35rem; }
details.dica summary { cursor: pointer; list-style: none; display: inline-block; width: 1.2em; height: 1.2em; line-height: 1.2em;
  text-align: center; border-radius: 50%; border: 1px solid currentColor; font-size: .8em; opacity: .75; }
details.dica summary::-webkit-details-marker { display: none; }
details.dica[open] small { display: block; font-weight: normal; margin: .25rem 0 .4rem; max-width: 34rem; }

/* abertura da home: a pergunta e de onde vieram os votos */
.abertura{background:var(--papel);padding:20px 16px 12px;border-bottom:1px solid var(--linha)}
.abertura>*{max-width:62rem;margin-left:auto;margin-right:auto}
.abertura h1{font-family:var(--d);font-size:clamp(1.5rem,4vw,2.3rem);line-height:1.1;letter-spacing:-.02em;margin:.1em auto .4em}
.abertura>p{margin-top:0}
.fluxos{margin:16px auto}
.fluxos h2,.fluxos-recorte h2{font-family:var(--d);font-size:1.3rem;margin:0 0 .3em}
.fluxo-lead{font-size:1.05rem}
.fluxo-linha{display:grid;grid-template-columns:6.5rem 1fr;gap:8px;align-items:center;margin:6px 0}
.fluxo-nome{display:flex;flex-direction:column;line-height:1.15}
.fluxo-nome span{font-size:.85rem;color:var(--tinta2)}
.fluxo-barra{display:flex;height:30px;background:#f3f4f7;border-radius:3px;overflow:hidden}
.fluxo-barra span{display:block;height:100%;color:#fff;font-size:.78rem;font-weight:700;line-height:30px;padding:0 4px;white-space:nowrap;overflow:hidden;text-overflow:clip;border-right:1px solid #fff}
.fluxo-legenda{list-style:none;padding:0;margin:6px 0 14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:4px 14px;font-size:.88rem}
.fluxo-bloco{margin:8px 0}
.r2-negativo{background:#fde8e8;color:#9b1c1c;font-weight:700}
footer.rodape .autoria a{font-weight:600}
.fluxos-recorte{margin-top:16px}
.fluxos-recorte .fluxo-linha{grid-template-columns:5.5rem 1fr}
.citacao{background:#fff;border:1px solid var(--linha);border-radius:var(--r);padding:10px 12px;white-space:pre-wrap;word-break:break-word;font-size:.92rem}
.pagina h3{font-family:var(--d);font-size:1.15rem;margin:1.4em 0 .3em}
.pagina h4{margin:1.2em 0 .3em}
@media (max-width:520px){.fluxo-linha{grid-template-columns:1fr}}
.matriz{margin-top:24px}
.matriz caption{caption-side:top;text-align:left;font-weight:700;padding:6px 0}
.matriz td.n{white-space:nowrap}
.matriz tr.r2 th,.matriz tr.r2 td{background:#f3f4f7;font-size:.85rem}
.legenda-metodos{margin:4px 0 8px;padding-left:1.2em;font-size:.9rem}
