/* Estilo compartilhado: Urnas */
:root {
  --bg:#0e1216; --surface:#161b21; --fg:#e8ecf0; --mut:#9aa5b1; --line:#262e37; --hover:rgba(79,195,208,.09);
  --acc:#4fc3d0; --acc-fg:#08242a; --acc-soft:#12313a;
  --neg:#ff8a80; --neg-soft:#3a1d1b; --pos:#6fd39b; --pos-soft:#14301f;
  --warn:#3a3217; --warnb:#8a6d1c;
  --r:10px; --sh:none;
  --font:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
}
* { box-sizing:border-box; }
html { color-scheme:dark; }
body { margin:0; background:var(--bg); color:var(--fg); font:14px/1.5 var(--font); -webkit-font-smoothing:antialiased; }
a { color:var(--acc); }
code { font-size:12px; background:var(--acc-soft); padding:1px 5px; border-radius:4px; }
.num, td, th { font-variant-numeric:tabular-nums; }

/* Cabeçalho */
.topbar { position:sticky; top:0; z-index:1100; background:var(--surface); border-bottom:1px solid var(--line); }
.topbar .in { max-width:1280px; margin:0 auto; padding:0 16px; height:52px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.brand { font-weight:700; font-size:15px; color:var(--fg); text-decoration:none; display:flex; align-items:center; gap:8px; white-space:nowrap; }
.brand i { width:10px; height:10px; border-radius:3px; background:var(--acc); display:inline-block; }
.tabs { display:flex; gap:4px; }
.tabs a { padding:6px 12px; border-radius:8px; text-decoration:none; color:var(--mut); font-weight:500; }
.tabs a:hover { background:var(--hover); color:var(--fg); }
.tabs a[aria-current="page"] { background:var(--acc-soft); color:var(--acc); }

/* Estrutura */
.page { max-width:1280px; margin:0 auto; padding:20px 16px 48px; }
h1 { font-size:24px; line-height:1.25; margin:0 0 6px; letter-spacing:-.01em; }
h2 { font-size:18px; margin:0 0 10px; letter-spacing:-.005em; }
h3 { font-size:14px; margin:18px 0 6px; }
.sub, .mut { color:var(--mut); }
.sub { max-width:78ch; margin:0 0 16px; }
.card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--sh); padding:14px 16px; }
.actions { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; }
.btn { display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--fg); text-decoration:none; font-weight:500; }
.btn:hover { border-color:var(--acc); color:var(--acc); }

/* Controles */
.ctl { display:flex; flex-wrap:wrap; gap:12px; align-items:end; }
label { display:flex; flex-direction:column; font-size:12px; color:var(--mut); gap:4px; font-weight:500; }
select, input[type=number] { font:inherit; color:var(--fg); background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:6px 8px; min-height:34px; }
select:focus-visible, input:focus-visible, a:focus-visible, .btn:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }
.count { color:var(--mut); margin-left:auto; align-self:center; }

/* Tabela */
.tw { overflow:auto; border:1px solid var(--line); border-radius:var(--r); background:var(--surface); max-height:72vh; }
table { border-collapse:separate; border-spacing:0; width:100%; font-size:13px; }
th, td { padding:7px 10px; border-bottom:1px solid var(--line); text-align:right; white-space:nowrap; }
th { position:sticky; background:var(--surface); font-size:12px; font-weight:600; color:var(--mut); z-index:2; }
thead tr:first-child th { top:0; text-align:center; color:var(--fg); border-bottom:1px solid var(--line); }
thead tr:nth-child(2) th { top:33px; }
th.g1 { border-left:1px solid var(--line); }
td.g1 { border-left:1px solid var(--line); }
th.l, td.l { text-align:left; }
td[title] { cursor:help; text-decoration:underline dotted var(--mut); text-underline-offset:3px; }
tr.d { cursor:pointer; } tr.d:hover td { background:var(--hover); }
tbody tr:last-child td { border-bottom:0; }
.pill { display:inline-block; min-width:44px; padding:1px 8px; border-radius:999px; font-weight:600; text-align:center; }
.pill.neg { background:var(--neg-soft); color:var(--neg); }
.pill.pos { background:var(--pos-soft); color:var(--pos); }
.neg { color:var(--neg); } .pos { color:var(--pos); }
.tw-note { margin:8px 0 0; font-size:12px; color:var(--mut); max-width:80ch; }

/* Detalhe com gráfico de barras */
#det { display:none; margin:0 0 16px; }
#det .head { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; }
#det .head b { font-size:15px; }
#det .facts { color:var(--mut); margin:4px 0 0; }
.chart { margin-top:14px; display:grid; grid-template-columns:34px 1fr; gap:0 8px; }
.yax { display:flex; flex-direction:column; justify-content:space-between; align-items:flex-end; height:120px; font-size:11px; color:var(--mut); }
.bars { display:flex; align-items:flex-end; gap:6px; height:120px; border-bottom:1px solid var(--mut); background:repeating-linear-gradient(to top, transparent 0, transparent 59px, var(--line) 59px, var(--line) 60px); }
.bar { flex:1; min-width:10px; max-width:56px; background:var(--acc); border-radius:4px 4px 0 0; position:relative; }
.bar.late { background:var(--neg); }
.bar:hover { filter:brightness(1.15); }
.bar:hover::after { content:attr(data-tip); position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%); background:var(--fg); color:var(--bg); padding:3px 8px; border-radius:6px; font-size:12px; white-space:nowrap; z-index:5; pointer-events:none; }
.xax { grid-column:2; display:flex; gap:6px; margin-top:4px; }
.xax span { flex:1; min-width:10px; max-width:56px; text-align:center; font-size:11px; color:var(--mut); }
.legend { display:flex; gap:14px; flex-wrap:wrap; margin-top:10px; font-size:12px; color:var(--mut); }
.legend i { display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:5px; vertical-align:-1px; }

/* Conclusões */
.layout { display:block; }
.toc { display:none; }
@media (min-width:1100px) {
  .layout { display:grid; grid-template-columns:210px minmax(0,1fr); gap:32px; }
  .toc { display:block; position:sticky; top:76px; align-self:start; font-size:13px; }
  .toc a { display:block; padding:5px 10px; border-left:2px solid var(--line); color:var(--mut); text-decoration:none; }
  .toc a:hover { color:var(--fg); border-color:var(--acc); }
}
main.doc { max-width:960px; }
main.doc h2 { margin:32px 0 8px; padding-top:20px; border-top:1px solid var(--line); scroll-margin-top:72px; }
main.doc h2:first-of-type { border-top:0; padding-top:0; margin-top:16px; }
main.doc ul { padding-left:20px; } main.doc li { margin:4px 0; }
.warn { background:var(--warn); border:1px solid var(--warnb); border-radius:var(--r); padding:12px 14px; margin:12px 0; }
.warn::before { content:"ⓘ "; font-size:16px; }
.kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; margin:12px 0; }
.kpi { background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:12px 14px; box-shadow:var(--sh); }
.kpi b { display:block; font-size:24px; letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.kpi span { font-size:12px; color:var(--mut); }
main.doc .tw { margin:6px 0 10px; max-height:420px; overscroll-behavior:contain; }
main.doc .tw thead th { top:0; }
main.doc p, main.doc li { max-width:80ch; }
.lead { font-size:15px; line-height:1.6; }
.aviso { background:var(--acc-soft); border:1px solid var(--acc); border-radius:var(--r); padding:14px 16px; margin:14px 0; }
.aviso .tit { display:block; font-weight:700; color:var(--acc); margin-bottom:4px; font-size:15px; }
.aviso p { margin:6px 0; }
.tres { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:12px; margin:12px 0; }
.tres > div { background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--mut); border-radius:var(--r); padding:12px 14px; }
.tres > div.ok { border-top-color:var(--pos); } .tres > div.al { border-top-color:var(--warnb); }
.tres h3 { margin:0 0 6px; font-size:15px; }
.tres ul { margin:0; padding-left:18px; } .tres li { margin:6px 0; }
details { margin:8px 0; border:1px solid var(--line); border-radius:var(--r); background:var(--surface); }
details > summary { cursor:pointer; padding:9px 14px; font-weight:500; color:var(--acc); list-style-position:inside; }
details > summary:hover { background:var(--hover); }
details[open] > summary { border-bottom:1px solid var(--line); }
details > :not(summary) { margin-left:14px; margin-right:14px; }
details > .tw { margin:10px 14px; }
.tag { display:inline-block; padding:1px 8px; border-radius:999px; font-size:12px; font-weight:600; }
.tag.ok { background:var(--pos-soft); color:var(--pos); } .tag.al { background:var(--warn); color:#f3d27a; }
pre { background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:10px 14px; overflow-x:auto; margin:6px 0 10px; }
pre code { background:none; padding:0; font-size:12.5px; line-height:1.6; }
.barra { display:inline-block; height:10px; background:var(--acc); border-radius:3px; vertical-align:middle; }
.barra.b2 { background:var(--mut); }
dl.gl { display:grid; grid-template-columns:max-content 1fr; gap:6px 16px; margin:8px 0; }
dl.gl dt { font-weight:600; } dl.gl dd { margin:0; color:var(--mut); }
@media (max-width:760px) { dl.gl { grid-template-columns:1fr; } dl.gl dd { margin-bottom:6px; } }

td > b[data-l] { font-weight:inherit; }
/* Tabela vira lista de cartões no celular */
@media (max-width:760px) {
  .page { padding:14px 12px 40px; }
  .tabs a { padding:6px 8px; }
  .count { margin-left:0; width:100%; }
  .tw.cards { border:0; background:none; max-height:none; overflow:visible; }
  .cards table, .cards tbody, .cards tr, .cards td { display:block; }
  .cards thead { display:none; }
  .cards tr.d { background:var(--surface); border:1px solid var(--line); border-radius:var(--r); margin-bottom:10px; padding:8px 12px; }
  /* cartão: título; Zona/Seção/Aptos; depois uma linha por medida (nome | 1T | 2T | Δ) */
  .cards tr.d { display:grid; grid-template-columns:minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)); column-gap:6px; align-items:center; }
  .cards tr.d:hover td { background:none; }
  .cards td { border:0; padding:3px 0; white-space:normal; text-align:left; min-width:0; }
  .cards td.g1 { border-left:0; }
  .cards td[data-l]::before, .cards b[data-l]::before { content:attr(data-l); color:var(--mut); font-size:11px; margin-right:4px; font-weight:400; }
  .cards td.l { grid-column:1 / -1; font-weight:600; font-size:15px; padding-bottom:4px; }
  .cards td.l::before { content:none; }
  .cards td[title] { text-decoration:none; cursor:default; }
  .cards td.r::before { padding-right:4px; }
  .cards td[data-l="Zona"], .cards td[data-l="Seção"], .cards td[data-l="Aptos"] { display:block; padding-bottom:6px; border-bottom:1px solid var(--line); }
  .cards td[data-l="Aptos"] { grid-column:3 / 5; }
  .cards td[data-l="Zona"], .cards td[data-l="Seção"] { margin-bottom:4px; }
  .cards td.r { display:contents; }
  .cards td.r::before { content:attr(data-r); grid-column:1; color:var(--mut); font-size:12px; line-height:1.25; padding:5px 0; }
  .cards td b { font-weight:400; }
  .filtros .grp > label { flex:1 1 42%; min-width:0; }
  .filtros .grp > label select, .filtros .grp > label input { width:100%; }
  .actions .btn { width:100%; text-align:center; }
  .maisf > summary { cursor:pointer; padding:6px 0; font-weight:600; }
  /* tabelas das páginas de texto: uma linha da tabela vira um cartão com pares nome/valor */
  main.doc .tw.emp { border:0; background:none; max-height:none; overflow:visible; }
  .emp table, .emp tbody, .emp tr, .emp td { display:block; }
  .emp thead { display:none; }
  .emp tr { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:2px 12px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); margin-bottom:8px; padding:8px 12px; }
  .emp td { border:0; padding:2px 0; white-space:normal; text-align:left; min-width:0; overflow-wrap:anywhere; }
  .emp td[data-h]::before { content:attr(data-h); display:block; color:var(--mut); font-size:11px; line-height:1.3; }
  .emp td:first-child, .emp td.l { grid-column:1 / -1; }
  .emp td:first-child { font-weight:600; font-size:14px; padding-bottom:4px; }
  .emp td:first-child[data-h]::before { content:none; }
  .emp td[title] { text-decoration:none; cursor:default; }
  main.doc code { overflow-wrap:anywhere; }
  main.doc pre code { overflow-wrap:normal; }
}
@media (min-width:761px) { .maisf > summary { display:none; } }
.maisf > summary { list-style:none; } .maisf > summary::-webkit-details-marker { display:none; }
.maisf > summary::before { content:"▸ "; } .maisf[open] > summary::before { content:"▾ "; }
@media (max-width:420px) { .brand span { display:none; } }
/* Filtros livres */
.chips { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.chip { display:inline-flex; align-items:center; gap:6px; background:var(--acc-soft); color:var(--acc); border-radius:999px; padding:3px 4px 3px 10px; font-weight:500; }
.chip button { border:0; background:transparent; color:inherit; cursor:pointer; font-size:16px; line-height:1; border-radius:50%; width:20px; height:20px; }
.chip button:hover { background:var(--hover); }
button.btn { font:inherit; cursor:pointer; }
@media (prefers-reduced-motion: no-preference) { .btn, .tabs a { transition:background .15s, color .15s, border-color .15s; } }
/* Filtros da tabela */
.filtros { display:grid; gap:14px; margin-bottom:14px; }
.filtros .grp { display:flex; flex-wrap:wrap; gap:12px; align-items:end; }
.filtros .tit { width:100%; font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--mut); margin-bottom:-4px; }
.filtros [hidden] { display:none; }
.filtros input[type="number"] { width:90px; }
.filtros .sep { border-top:1px solid var(--line); padding-top:12px; }

/* Subnavegação das conclusões */
.subnav { display:flex; gap:6px; overflow-x:auto; margin:0 0 18px; padding-bottom:2px; }
.subnav a { white-space:nowrap; padding:5px 12px; border:1px solid var(--line); border-radius:999px; color:var(--mut); text-decoration:none; font-weight:500; }
.subnav a:hover { color:var(--fg); border-color:var(--acc); }
.subnav a[aria-current="page"] { background:var(--acc-soft); color:var(--acc); border-color:transparent; }

/* ---------- Gráficos (conclusoes.js: graf*) ---------- */
:root { --s-a:#d95926; --s-a2:#f0a27c; --s-mid:#6b7480; --s-b2:#86b6ef; --s-b:#3987e5; --eixo:#3a434d; }
.graf { background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px 16px 10px; margin:10px 0 14px; }
.graf > .gt { font-weight:600; margin:0 0 2px; }
.graf > .gs { font-size:12px; color:var(--mut); margin:0 0 10px; }
.leg { display:flex; flex-wrap:wrap; gap:4px 14px; font-size:12px; color:var(--mut); margin:0 0 10px; }
.leg i { display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:5px; vertical-align:-1px; }
/* barra 100% empilhada: uma linha por grupo */
.b100 { display:grid; grid-template-columns:minmax(90px,170px) 1fr; gap:8px 12px; align-items:center; font-size:13px; }
.b100 .pilha { display:flex; gap:2px; height:22px; }
.b100 .pilha span { border-radius:4px; min-width:2px; font-size:11px; line-height:22px; text-align:center; color:#fff; overflow:hidden; white-space:nowrap; font-variant-numeric:tabular-nums; }
.b100 .pilha span.esc { color:#0e1216; }
/* barras horizontais simples */
.bh { display:grid; grid-template-columns:38px 1fr 92px; gap:4px 10px; align-items:center; font-size:12px; font-variant-numeric:tabular-nums; }
.bh .tr { height:12px; } .bh .tr span { display:block; height:100%; background:var(--acc); border-radius:0 4px 4px 0; min-width:2px; }
.bh .v { text-align:right; color:var(--mut); }
.graf svg { display:block; width:100%; height:auto; overflow:visible; }
.graf svg text { fill:var(--mut); font-size:11px; font-family:var(--font); font-variant-numeric:tabular-nums; }
.graf svg .grade { stroke:var(--line); stroke-width:1; } .graf svg .base { stroke:var(--eixo); stroke-width:1; }
.graf svg rect.col { fill:var(--acc); } .graf svg rect.col:hover, .b100 .pilha span:hover, .bh .tr:hover span { filter:brightness(1.25); }
.graf svg .faixa { fill:rgba(240,162,124,.10); } .graf svg text.rot { fill:var(--fg); }
.dois { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:0 14px; }
#tip { position:fixed; z-index:50; pointer-events:none; background:#0b0f13; color:var(--fg); border:1px solid var(--line); border-radius:8px; padding:6px 9px; font-size:12px; line-height:1.4; max-width:260px; display:none; box-shadow:0 4px 14px rgba(0,0,0,.4); }
td.calor { font-variant-numeric:tabular-nums; }
@media (max-width:600px) { .b100 { grid-template-columns:1fr; gap:2px 0; } .b100 > div:nth-child(odd) { margin-top:8px; } .bh { grid-template-columns:32px 1fr 80px; } }

/* ---------- Página Digital ---------- */
:root { --s-com:#199e70; --s-sem:#9085e9; --s-ref:#5d6862; }
.halt { display:grid; grid-template-columns:40px 1fr 56px; gap:3px 10px; align-items:center; font-size:13px; font-variant-numeric:tabular-nums; }
.halt .tr { position:relative; height:20px; } .halt .tr::before { content:""; position:absolute; left:0; right:0; top:50%; border-top:1px dashed var(--line); }
.halt .ln { position:absolute; top:calc(50% - 1px); height:2px; background:var(--eixo); }
.halt .p { position:absolute; top:calc(50% - 6px); width:12px; height:12px; margin-left:-6px; border-radius:50%; border:2px solid var(--surface); }
.halt .p.a { background:var(--s-ref); } .halt .p.b { background:var(--s-sem); }
.halt .v { text-align:right; color:var(--mut); }
.escala { display:grid; grid-template-columns:40px 1fr 56px; gap:10px; font-size:11px; color:var(--mut); font-variant-numeric:tabular-nums; }
.escala div:nth-child(2) { position:relative; height:14px; } .escala span { position:absolute; transform:translateX(-50%); }
.busca { display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center; }
.busca input { flex:1 1 240px; min-width:0; font:inherit; padding:8px 12px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--fg); }
.busca input:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }
.bh.larga { grid-template-columns:minmax(120px, 220px) 1fr 64px; font-size:13px; }
@media (max-width:600px) { .bh.larga { grid-template-columns:1fr 60px; } .bh.larga > div:nth-child(3n+1) { grid-column:1 / -1; margin-top:6px; } }
.btn.on { border-color:var(--acc); color:var(--acc); }
