:root{
  --paper:#E8ECEE; --surface:#F6F8F9; --ink:#15212C; --muted:#56636F; --line:#C6CFD5; --accent:#B3132B;
  --map-bg:#E8ECEE; --zero:#D3D9DD; --edge:rgba(21,33,44,.32); --halo:#F6F8F9;
  --r0:#D2E1EE; --r1:#A6C5E0; --r2:#74A2CB; --r3:#477FB3; --r4:#245D93; --r5:#0C3A69;
  --serif:'Faustina', Georgia, 'Times New Roman', serif; --sans:'Geist', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --paper:#121B24; --surface:#18232F; --ink:#E4EBF0; --muted:#93A2AF; --line:#2A3947; --accent:#FF5D73;
  --map-bg:#121B24; --zero:#223040; --edge:rgba(6,12,18,.7); --halo:#121B24;
  --r0:#1C3854; --r1:#22517E; --r2:#2C6CA6; --r3:#4B8DCA; --r4:#83B6E3; --r5:#C9E2F7; color-scheme:dark;
}}
:root[data-theme="dark"]{
  --paper:#121B24; --surface:#18232F; --ink:#E4EBF0; --muted:#93A2AF; --line:#2A3947; --accent:#FF5D73;
  --map-bg:#121B24; --zero:#223040; --edge:rgba(6,12,18,.7); --halo:#121B24;
  --r0:#1C3854; --r1:#22517E; --r2:#2C6CA6; --r3:#4B8DCA; --r4:#83B6E3; --r5:#C9E2F7; color-scheme:dark;
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px); -webkit-text-size-adjust:100%}
body{margin:0; background:var(--paper); color:var(--ink); font:400 15px/1.5 var(--sans); font-feature-settings:"tnum" 1}
button,input,select{font:inherit; color:inherit}
:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
a{color:inherit; text-underline-offset:3px}

.app{max-width:1280px; margin:0 auto; padding:14px 16px 40px; display:flex; flex-direction:column; gap:18px}
.app.nodata .stage{order:2}
.app.nodata .side{order:3}
.top{display:flex; align-items:baseline; justify-content:space-between; gap:12px; order:1}
.brand{margin:0; font:600 17px/1.2 var(--serif); letter-spacing:.005em}
.brand span{font-family:var(--sans); font-weight:400; font-size:14px; color:var(--muted); margin-left:6px}
.filters{order:2; display:flex; flex-direction:column; gap:12px}
.stage{order:3; display:flex; flex-direction:column; gap:12px; scroll-margin-top:12px}
.side{order:4; display:flex; flex-direction:column; gap:26px}

.field{display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--muted)}
select{appearance:none; background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2378858f' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 12px center; border:1px solid var(--line); border-radius:10px; padding:10px 32px 10px 12px; min-height:44px}

.chips{display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; margin:0 -16px; padding:0 16px}
.chips::-webkit-scrollbar{display:none}
.chips button,.seg button{flex:none; border:1px solid var(--line); background:transparent; border-radius:999px; padding:9px 14px; min-height:40px; cursor:pointer; white-space:nowrap; font-size:14px}
.chips button[aria-checked="true"],.seg button[aria-checked="true"]{background:var(--ink); color:var(--paper); border-color:var(--ink)}

.picker{position:relative; display:flex; flex-direction:column; gap:4px}
.picker label{font-size:13px; color:var(--muted)}
.picker input,.filter{width:100%; border:1px solid var(--line); background:var(--surface); border-radius:12px; padding:12px 14px; min-height:48px; font-size:16px}
.picker input::placeholder{color:var(--muted)}
.results{list-style:none; margin:6px 0 0; padding:4px; border:1px solid var(--line); border-radius:12px; background:var(--surface); max-height:min(60vh,420px); overflow:auto}
.results button{width:100%; display:grid; grid-template-columns:1fr auto; grid-template-areas:"n v" "m v"; text-align:left; gap:0 12px; padding:10px 10px; border:0; background:none; border-radius:8px; cursor:pointer}
.results button:hover,.results [aria-selected="true"] button{background:var(--paper)}
.results .n{grid-area:n; font-weight:500}
.results .meta{grid-area:m; font-size:13px; color:var(--muted)}
.results .v{grid-area:v; align-self:center; font:500 15px var(--serif)}
.results .empty{padding:12px; color:var(--muted)}
.close-list{align-self:flex-end}

.who h1{margin:0; font:650 clamp(30px,8.2vw,52px)/1.02 var(--serif); letter-spacing:-.012em; text-wrap:balance}
.who p{margin:6px 0 0; color:var(--ink); font-size:14px}
.who .sub{margin-top:2px; color:var(--muted)}
.who.empty h1{font-weight:500}
.who.empty p{color:var(--muted); max-width:46ch}

.map{position:relative; width:100%; background:var(--map-bg); border-radius:4px}
.map canvas{display:block; cursor:pointer; -webkit-tap-highlight-color:transparent}
.zoom{position:absolute; right:8px; bottom:8px; display:flex; gap:6px}
.zoom button{min-width:40px; height:40px; border-radius:10px; border:1px solid var(--line); background:var(--surface); font-size:20px; line-height:1; cursor:pointer}
.zoom .wide{font-size:13px; padding:0 12px}

.legend{display:flex; flex-direction:column; gap:10px}
.seg{display:flex; gap:6px}
.legend ul{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px 14px; font-size:13px; color:var(--muted)}
.legend li{display:flex; align-items:center; gap:6px}
.legend i{width:14px; height:14px; border-radius:3px; display:inline-block; box-shadow:inset 0 0 0 1px var(--edge)}

.hint{margin:0; color:var(--muted); font-size:14px}
.muni{border-top:2px solid var(--ink); padding-top:10px}
.muni.pinned{border-top-color:var(--accent)}
.muni-head{display:flex; justify-content:space-between; align-items:baseline}
.muni h3{margin:0; font:600 22px/1.2 var(--serif)}
dl{margin:0}
.muni dl{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:8px}
.muni dl div,.stats div{display:flex; flex-direction:column; justify-content:space-between}
.muni dt,.stats dt{font-size:12.5px; color:var(--muted); line-height:1.3}
.muni dd,.stats dd{margin:2px 0 0; font:600 22px/1.15 var(--serif)}

.share{display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px}
.share small{color:var(--muted); font-size:13px}

.stats{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 14px; padding-bottom:4px}
.stats div{border-top:1px solid var(--line); padding-top:8px}

h2{margin:0; font:600 21px/1.25 var(--serif)}
.ranking{display:flex; flex-direction:column; gap:10px}
.rk-head{display:flex; justify-content:space-between; align-items:center; gap:10px}
.rk-head select{min-height:40px; padding:8px 30px 8px 10px; font-size:14px}
.filter{font-size:15px; min-height:44px; padding:10px 12px}
.ranking ol{list-style:none; margin:0; padding:0; max-height:520px; overflow:auto; border-top:1px solid var(--line)}
.ranking li button{width:100%; display:grid; grid-template-columns:30px 1fr auto 64px; grid-template-rows:auto 3px; align-items:baseline; gap:2px 10px; padding:9px 2px 8px; border:0; border-bottom:1px solid var(--line); background:none; text-align:left; cursor:pointer}
.ranking li.on button{background:color-mix(in srgb, var(--accent) 9%, transparent)}
.ranking .pos{color:var(--muted); font-size:13px; text-align:right}
.ranking .nm{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ranking .vv{font:600 16px var(--serif); text-align:right}
.ranking .pp{font-size:13px; color:var(--muted); text-align:right}
.ranking .bar{grid-column:2 / 5; height:3px; background:transparent}
.ranking .bar i{display:block; height:100%; background:var(--r3); border-radius:2px}

.saved ul{list-style:none; margin:10px 0 0; padding:0; border-top:1px solid var(--line)}
.saved li{display:flex; align-items:center; gap:8px; border-bottom:1px solid var(--line)}
.saved li button:first-child{flex:1; display:flex; flex-direction:column; align-items:flex-start; padding:10px 2px; border:0; background:none; text-align:left; cursor:pointer}
.saved li.on .n{color:var(--accent)}
.saved .n{font-weight:500}
.saved .meta{font-size:13px; color:var(--muted)}

.source{display:flex; flex-direction:column; gap:14px; padding:18px; border:1.5px dashed var(--line); border-radius:14px; background:var(--surface)}
.source.drag{border-color:var(--accent)}
.source h2{font-size:22px}
.steps{margin:0; padding-left:20px; display:flex; flex-direction:column; gap:12px; color:var(--ink)}
.steps li::marker{font:600 15px var(--serif); color:var(--muted)}
.steps small{display:block; color:var(--muted); font-size:13px; margin-top:6px}
.row{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:8px}
.source.compact{border-style:solid; padding:14px; gap:6px; background:transparent}
.source.compact p{margin:0; font-size:14px; color:var(--muted); overflow-wrap:anywhere}
.source.compact strong{color:var(--ink); font-weight:500}
.btn{display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 18px; border-radius:12px; border:1px solid var(--ink); background:var(--ink); color:var(--paper); font-weight:500; text-decoration:none; cursor:pointer}
.btn.ghost{background:transparent; color:var(--ink); border-color:var(--line); min-height:42px}
.btn:disabled{opacity:.6}
.link{border:0; background:none; padding:6px 0; color:var(--muted); text-decoration:underline; text-underline-offset:3px; cursor:pointer; font-size:14px}
.progress{position:relative; height:46px; border-radius:12px; background:var(--paper); overflow:hidden}
.progress i{position:absolute; inset:0 auto 0 0; background:var(--r1)}
.progress span{position:relative; display:flex; height:100%; align-items:center; padding:0 14px; font-size:14px}
.error{margin:0; color:var(--accent); font-size:14px}
.credits{margin:0; font-size:12.5px; color:var(--muted); max-width:60ch}

@media (min-width:600px){
  .app{padding:20px 24px 48px}
  .chips{margin:0; padding:0; flex-wrap:wrap}
  .stats{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:960px){
  .app{display:grid; grid-template-columns:minmax(0,1.55fr) minmax(340px,1fr); grid-template-areas:"top top" "stage filters" "stage side"; grid-template-rows:auto auto 1fr; gap:22px 40px; align-items:start}
  .top{grid-area:top} .filters{grid-area:filters} .side{grid-area:side} .stage{grid-area:stage; position:sticky; top:calc(env(safe-area-inset-top,0px) + 16px)}
  .app.nodata{grid-template-areas:"top top" "stage side"}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ranking ol{max-height:46vh}
}
@media (prefers-reduced-motion: reduce){ *{scroll-behavior:auto!important} }

/* Bairro: votos por local de votação */
.locais{list-style:none; margin:12px 0 0; padding:0; border-top:1px solid var(--line)}
.locais li{display:grid; grid-template-columns:1fr auto; grid-template-rows:auto 3px; gap:2px 12px; padding:8px 0 7px; border-bottom:1px solid var(--line); align-items:baseline}
.locais .ln{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px}
.locais .lv{font:600 15px var(--serif); text-align:right}
.locais .bar{grid-column:1 / 3; height:3px}
.locais .bar i{display:block; height:100%; background:var(--r3); border-radius:2px}
.muni .hint{margin-top:10px; font-size:13px}
.legend .hint{font-size:13px}
.ranking li button{grid-template-columns:30px 1fr auto 64px}
/* Aviso: eleição sem votos por bairro */
.aviso{margin:0; padding:10px 12px; border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:8px; background:var(--surface); font-size:14px; color:var(--ink)}
/* Comparação entre eleições */
:root{ --d0:#B3132B; --d1:#E8949E; --d2:#CBD2D7; --d3:#86B3DC; --d4:#1F5E9E; --up:#1F7A4D }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --d0:#FF5D73; --d1:#B3566B; --d2:#3A4856; --d3:#4B8DCA; --d4:#9CCBF2; --up:#5BD18B } }
:root[data-theme="dark"]{ --d0:#FF5D73; --d1:#B3566B; --d2:#3A4856; --d3:#4B8DCA; --d4:#9CCBF2; --up:#5BD18B }
.up{color:var(--up)} .down{color:var(--accent)}
.cmp-bar{display:flex; justify-content:space-between; align-items:center; gap:12px; margin:0; padding:10px 12px; border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:8px; background:var(--surface); font-size:14px}
.cmp-dl{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:12px 0 0; padding-top:10px; border-top:1px dashed var(--line)}
.cmp-dl div{display:flex; flex-direction:column; justify-content:space-between}
.cmp-dl dt{font-size:12.5px; color:var(--muted); line-height:1.3}
.cmp-dl dd{margin:2px 0 0; font:600 17px/1.15 var(--serif)}
.traj{display:flex; flex-direction:column; gap:10px}
.traj ul{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.traj li{display:grid; gap:5px; padding:9px 4px 8px; border-bottom:1px solid var(--line)}
.traj li.em{background:color-mix(in srgb, var(--accent) 9%, transparent)}
.traj .tl{display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px}
.traj .ty{font:600 16px var(--serif)}
.traj .tc{flex:1; min-width:110px; color:var(--muted); font-size:13px}
.traj .tv{font:600 16px var(--serif)}
.traj .tp{color:var(--muted); font-size:13px}
.traj .btn{min-height:32px; padding:0 12px; font-size:13px}
.traj .btn[aria-pressed="true"]{background:var(--accent); border-color:var(--accent); color:#fff}
.traj .tag{font-size:12px; color:var(--muted); border:1px solid var(--line); border-radius:999px; padding:2px 9px}
.traj .bar{height:3px}
.traj .bar i{display:block; height:100%; background:var(--r3); border-radius:2px}
.ranking.cmp li button{display:grid; grid-template-columns:minmax(0,1fr) auto 84px; grid-template-areas:"nm dd pv" "vv vv vv"; grid-template-rows:auto auto; gap:1px 10px; align-items:baseline; padding:8px 4px}
.ranking.cmp .nm{grid-area:nm}
.ranking.cmp .vv{grid-area:vv; font:400 12.5px var(--sans); color:var(--muted); text-align:left; white-space:nowrap}
.ranking.cmp .dd{grid-area:dd; font:600 15px var(--serif); text-align:right}
.ranking.cmp .pv{grid-area:pv; font-size:13px; text-align:right; color:var(--muted)}
.ranking.cmp .pv.up,.ranking.cmp .dd.up{color:var(--up)} .ranking.cmp .pv.down,.ranking.cmp .dd.down{color:var(--accent)}
/* Análises: cores categóricas (validadas para daltonismo; ver README) e painéis */
:root{ --s0:#B9C2C9; --s1:#2a78d6; --s2:#eb6834; --s3:#1baf7a; --s4:#eda100 }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --s0:#46525E; --s1:#3987e5; --s2:#d95926; --s3:#199e70; --s4:#c98500 } }
:root[data-theme="dark"]{ --s0:#46525E; --s1:#3987e5; --s2:#d95926; --s3:#199e70; --s4:#c98500 }
.o-fefc{background:var(--s1)} .o-partido{background:var(--s2)} .o-doacoes{background:var(--s3)} .o-outros{background:var(--s4)}
.seg.modo{flex-wrap:wrap}
.seg.rolavel{overflow-x:auto; scrollbar-width:none}
.analise{display:flex; flex-direction:column; gap:12px}
.analise h3,.ranking h3,.perfil-grupo h3{margin:4px 0 0; font:600 15px var(--serif)}
.stats small{font-size:12px; color:var(--muted); margin-top:2px}
.concentracao{font-size:13.5px}
.concentracao strong{color:var(--ink); font-weight:600}
.origens{display:flex; flex-direction:column; gap:10px}
.pilha{display:flex; gap:2px; height:14px}
.pilha i{display:block; min-width:2px}
.pilha i:first-child{border-radius:4px 0 0 4px} .pilha i:last-child{border-radius:0 4px 4px 0} .pilha i:only-child{border-radius:4px}
.leg{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; font-size:13.5px}
.leg li{display:grid; grid-template-columns:14px 1fr auto 40px; gap:8px; align-items:baseline}
.leg i{width:12px; height:12px; border-radius:3px; display:inline-block; align-self:center}
.leg b{font-weight:600} .leg small{color:var(--muted); text-align:right}
figcaption .leg{flex-direction:row; flex-wrap:wrap; gap:4px 16px; margin-bottom:4px}
figcaption .leg li{display:flex; gap:6px; align-items:center}
.leg i.eleito{background:var(--s1); border-radius:50%} .leg i.outro{background:var(--s0); border-radius:50%}
.ficha{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 14px}
.ficha div{border-top:1px solid var(--line); padding-top:6px}
.ficha dt{font-size:12.5px; color:var(--muted)} .ficha dd{margin:2px 0 0; font-size:15px}
.lista-cands{list-style:none; margin:0; padding:0; border-top:1px solid var(--line); max-height:420px; overflow:auto}
.lista-cands li button{width:100%; display:grid; grid-template-columns:auto 1fr auto; grid-template-areas:"pos nm vv" "pos meta vv"; gap:0 10px; align-items:baseline; padding:8px 2px; border:0; border-bottom:1px solid var(--line); background:none; text-align:left; cursor:pointer}
.lista-cands li.on button{background:color-mix(in srgb, var(--accent) 9%, transparent)}
.lista-cands .pos{grid-area:pos; color:var(--muted); font-size:13px; min-width:22px; text-align:right}
.lista-cands .nm{grid-area:nm; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.lista-cands .meta{grid-area:meta; font-size:12.5px; color:var(--muted)}
.lista-cands .vv{grid-area:vv; font:600 15px var(--serif); text-align:right}
.grafico{margin:0; display:flex; flex-direction:column; gap:6px}
.grafico-area{position:relative}
.grafico svg{display:block; width:100%; height:auto; background:var(--surface); border-radius:6px; touch-action:pan-y; cursor:pointer}
.grafico .eixos line{stroke:var(--line); stroke-width:1}
.grafico .eixos text,.grafico .diag text{fill:var(--muted); font-size:10px}
.grafico .eixos .titulo{font-size:11px}
.grafico .diag line{stroke:var(--muted); stroke-width:1; opacity:.45}
.grafico circle{stroke:var(--surface); stroke-width:2}
.grafico circle.eleito{fill:var(--s1)} .grafico circle.outro{fill:var(--s0)}
.grafico circle.sel{fill:none; stroke:var(--accent); stroke-width:2.2}
.grafico circle.foco{fill:none; stroke:var(--ink); stroke-width:1.6}
.grafico figcaption{font-size:12.5px; color:var(--muted)}
.dica{position:absolute; transform:translate(-50%,calc(-100% - 12px)); background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:6px 9px; font-size:12.5px; line-height:1.35; white-space:nowrap; pointer-events:none; box-shadow:0 4px 14px rgba(0,0,0,.12); z-index:2}
.rede{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.rede li{padding:8px 0; border-bottom:1px solid var(--line); font-size:14px; line-height:1.45}
.rede .nm{font-weight:600}
.posicoes{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.posicoes li{display:grid; grid-template-columns:1fr auto; gap:2px 10px; padding:8px 0; border-bottom:1px solid var(--line); align-items:baseline}
.posicoes .nm{font-size:14px} .posicoes .vv{font:600 15px var(--serif)}
.posicoes small{grid-column:1 / 3; font-size:12.5px; color:var(--muted)}
.locais .ln small{color:var(--muted); font-size:12px}
.partidos,.leg-perfil,.doadores{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.partidos li{display:grid; grid-template-columns:1fr auto; gap:3px 10px; padding:8px 0; border-bottom:1px solid var(--line)}
.partidos .vv{font:600 15px var(--serif)}
.partidos .bar{grid-column:1 / 3; height:3px} .partidos .bar i{display:block; height:100%; background:var(--s1); border-radius:2px}
.partidos .meta{grid-column:1 / 3; font-size:12.5px; color:var(--muted)}
.partidos .abaixo{color:var(--ink); font-weight:600}
.leg-perfil li{display:grid; gap:3px; padding:7px 0; border-bottom:1px solid var(--line)}
.leg-perfil .nm{font-size:14px}
.leg-perfil .par{display:grid; grid-template-columns:minmax(0,1fr) 9.5em; align-items:center; gap:6px; min-width:0}
.leg-perfil .trilho{display:block; min-width:0}
.leg-perfil .par i{display:block; height:8px; border-radius:0 4px 4px 0}
.leg-perfil .par i.cand{background:var(--s0)} .leg-perfil .par i.eleito{background:var(--s1)}
.leg-perfil small{font-size:12px; color:var(--muted); white-space:nowrap}
.doadores li{padding:8px 0; border-bottom:1px solid var(--line)}
.doadores .cab{display:flex; justify-content:space-between; gap:10px}
.doadores .vv{font:600 15px var(--serif)}
.doadores p{margin:2px 0 0; font-size:13px; color:var(--muted)}
.doadores .link{padding:0; font-size:13px; color:var(--ink)}
.muni p.hint strong{color:var(--ink)}
.grafico .diag text{paint-order:stroke; stroke:var(--surface); stroke-width:3px; stroke-linejoin:round}
.analise > .link{align-self:flex-start}

/* ---------- perfis (só em Bayeux) ---------- */
.com-perfis .filters{order:2}
.perfis{order:3; display:flex; flex-direction:column; max-width:760px; width:100%}
.perfil{display:flex; flex-direction:column; gap:26px}
.perfil-topo{display:flex; gap:16px; align-items:flex-start}
.perfil-topo img{flex:none; width:88px; height:88px; object-fit:cover; border-radius:50%; background:var(--zero)}
.perfil-topo .who{min-width:0; display:flex; flex-direction:column; align-items:flex-start}
.perfil-topo .link{margin-top:4px}
.perfil-ano{margin:0 0 -14px; font:600 15px var(--serif)}
.voltar{align-self:flex-start; color:var(--muted); font-size:14px; padding:6px 0}
.lista-perfis{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.lista-perfis a{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 16px; align-items:center; padding:12px 4px; border-bottom:1px solid var(--line); text-decoration:none}
.lista-perfis a:hover{background:var(--surface)}
.lista-perfis a.fora{color:var(--muted)}
.lista-perfis .n{font-weight:500; min-width:0}
.lista-perfis .m{text-align:right; font:600 15px var(--serif)}
.lista-perfis small{display:block; font:400 13px var(--sans); color:var(--muted)}
.lista-perfis.destaque .n{font:600 18px var(--serif)}
.materias{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.materias li{padding:10px 0; border-bottom:1px solid var(--line); display:flex; flex-wrap:wrap; gap:2px 10px; align-items:baseline}
.materias small{color:var(--muted); font-size:12.5px}
.materias p{margin:0; flex-basis:100%; font-size:14px; overflow-wrap:anywhere}
.ligacoes .lv small{font:400 12px var(--sans); color:var(--muted)}
.locais .ln a{color:inherit}
@media (min-width:960px){
  .app.com-perfis{display:flex}
  .perfis{margin:0 auto}
}
.ligacoes .ln{white-space:normal; overflow:visible}
.ligacoes .ln small{display:block; font-size:12.5px; color:var(--muted)}
.ligacoes .lv small{display:block; text-align:right}
.trilha{display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 6px; font-size:14px}
.trilha .link{padding:4px 0; text-align:left}
.trilha [aria-current="true"]{color:var(--ink); text-decoration:none; font-weight:600}
.trilha span{color:var(--muted)}
.ramos li{padding:0; display:block}
.ramos .abre{display:grid; width:100%; grid-template-columns:1fr auto; grid-template-rows:auto 3px; gap:2px 12px; padding:8px 0 7px; border:0; background:none; text-align:left; align-items:baseline; font:inherit; color:inherit}
button.abre{cursor:pointer}
.ramos button.abre .ln::after{content:" ›"; color:var(--muted)}
.ramos button.abre:hover .ln{text-decoration:underline; text-underline-offset:3px}
.ramos .lv small{font:400 12px var(--sans); color:var(--muted)}
.ramos .bar{grid-column:1 / 3; height:3px}
.ressalva{margin:0; padding:10px 12px; border-left:3px solid var(--accent); background:var(--surface); font-size:14px}
.lista-alertas{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.lista-alertas li{padding:10px 0; border-bottom:1px solid var(--line)}
.lista-alertas .tipo{font:600 12px var(--sans); text-transform:uppercase; letter-spacing:.04em; color:var(--accent)}
.lista-alertas p{margin:4px 0 0; font-size:14px}
.alertas{display:flex; flex-direction:column; gap:12px}
.alertas details p{margin:6px 0 0}
.grupo-alertas{display:flex; flex-direction:column; gap:4px}
.grupo-alertas .locais{margin-top:6px}
.grupo-alertas .ln{white-space:normal}
.grupo-alertas .ln small{display:block; color:var(--muted); font-size:12.5px}

/* ---------- aviso legal, pular para o conteúdo e tabela do mapa ---------- */
.aviso-legal{order:5; grid-column:1 / -1; border-top:1px solid var(--line); padding-top:14px; font-size:13px; color:var(--muted); display:flex; flex-direction:column; gap:6px}
.aviso-legal p{margin:0; max-width:80ch}
.pular{position:absolute; left:-9999px}
.pular:focus{left:16px; top:8px; z-index:3; background:var(--surface); color:var(--ink); padding:8px 12px; border-radius:8px}
.tabela-mapa summary{cursor:pointer; padding:8px 0; font-size:14px}
.tabela-mapa .rolagem{overflow:auto; max-height:420px}
.tabela-mapa table{border-collapse:collapse; width:100%; font-size:14px}
.tabela-mapa th,.tabela-mapa td{padding:6px 8px; border-bottom:1px solid var(--line); text-align:right; white-space:nowrap}
.tabela-mapa th[scope="row"],.tabela-mapa thead th:first-child{text-align:left; font-weight:500}
.tabela-mapa caption{text-align:left; font-weight:600; padding:6px 0}
.seg.modo .grupo-modo{align-self:center; margin-left:8px; font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted)}
.seg.modo .grupo-modo.primeiro{margin-left:0; margin-right:2px}
.partidos li:has(> .abre){display:block; padding:0}
.partidos .abre{display:grid; width:100%; grid-template-columns:1fr auto; gap:3px 10px; padding:8px 0; border:0; background:none; text-align:left; font:inherit; color:inherit; cursor:pointer}
.partidos .abre:hover .nm{text-decoration:underline; text-underline-offset:3px}
.partidos .vv small{font:400 12px var(--sans); color:var(--muted)}
/* O mapa é sticky no desktop e, perto do fim da página, passaria por cima do rodapé: o rodapé fica numa linha
   própria da grade, acima do mapa e com fundo opaco. */
.aviso-legal{position:relative; z-index:3; background:var(--paper); padding-bottom:8px}
@media (min-width:960px){
  .app{grid-template-areas:"top top" "stage filters" "stage side" "foot foot"}
  .app.nodata{grid-template-areas:"top top" "stage side" "foot foot"}
  .aviso-legal{grid-area:foot}
  .stage{z-index:1}
}