*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden}
body{background:var(--bg);color:var(--ink);font-family:"Segoe UI",Roboto,Arial,sans-serif;display:flex;flex-direction:column}
header{display:flex;align-items:center;justify-content:space-between;padding:1.2vh 1.6vw;border-bottom:1px solid var(--line)}
header h1{font-size:3.4vh;font-weight:800;letter-spacing:.01em}
header .sub{font-size:1.7vh;color:var(--muted);margin-top:.3vh}
#relogio{font-size:4.2vh;font-weight:700;font-variant-numeric:tabular-nums}
main{flex:1;display:flex;min-height:0}
#mapa{flex:1;min-width:0;padding:.6vh .6vw}
#mapa svg{width:100%;height:100%;display:block}
aside{width:22vw;min-width:300px;background:var(--panel);border-left:1px solid var(--line);padding:2vh 1.4vw;display:flex;flex-direction:column;gap:1.6vh}

.k-livres{border-radius:1.2vh;padding:1.6vh 1.2vw;background:color-mix(in srgb,var(--livre) 16%,transparent);border:2px solid var(--livre)}
.k-livres .rot{font-size:2.1vh;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.k-livres .num{font-size:11vh;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.k-livres .setores{display:flex;gap:1.2vw;font-size:2.3vh;margin-top:.6vh}
.k-livres .setores b{font-size:3vh;font-variant-numeric:tabular-nums}
.sub-k{font-size:2vh;color:var(--muted);margin-top:.4vh}

.linha{display:flex;align-items:center;justify-content:space-between;font-size:2.5vh;padding:.7vh 0;border-bottom:1px solid var(--line)}
.linha .chip{display:inline-block;width:2.4vh;height:2.2vh;border-radius:.5vh;margin-right:.7vw;vertical-align:-.3vh}
.linha b{font-size:3.2vh;font-variant-numeric:tabular-nums}
.linha.total{border-bottom:0;color:var(--muted);font-size:2.1vh}
.linha.total b{font-size:2.6vh;color:var(--ink)}
.linha.total.erro b{color:var(--novo)}

.como{margin-top:auto;font-size:2.1vh;line-height:1.35;border:1px dashed var(--line);border-radius:1vh;padding:1.2vh .9vw}
.como strong{display:block;font-size:2.4vh;margin-bottom:.4vh}
.como .ex-linha{margin:.4vh 0}
.como .ex-rot{font-size:2vh;color:var(--muted);font-style:italic}
.como .ex{display:inline-block;transition:opacity .4s;font-size:3vh;font-weight:800;letter-spacing:.04em;color:var(--accent)}

.rodape{font-size:1.6vh;color:var(--muted);display:flex;justify-content:space-between;gap:.5vw;flex-wrap:wrap}
.rodape .sem-conexao{color:var(--novo);font-weight:700;display:none}
body.offline .rodape .sem-conexao{display:inline}

/* assentos */
.s rect{rx:3.4px}
.s text{font-weight:800;text-anchor:middle;dominant-baseline:central;pointer-events:none}
.s.livre rect{fill:var(--livre)} .s.livre text{fill:var(--livre-num)}
.s.livre.alt rect{fill:var(--livre2)} .s.livre.alt text{fill:#fff}
.s.entregue rect{fill:var(--entregue)} .s.entregue text{fill:var(--entregue-num)}
.s.adm rect{fill:var(--adm);stroke:var(--adm-stroke);stroke-width:1;stroke-dasharray:2 1.6} .s.adm text{fill:var(--adm-num)}
.s.esp rect{stroke:var(--lote-esp)}
.s.alunos rect{fill:var(--alunos)} .s.alunos text{fill:var(--alunos-num)}
.s.novo rect{fill:var(--novo);animation:pulso .9s ease-in-out infinite alternate}
.s.novo text{fill:#fff}
@keyframes pulso{from{stroke:#fff;stroke-width:0}to{stroke:#fff;stroke-width:2.4}}

.palco{fill:var(--palco)} .palco-t{fill:var(--palco-ink);font-weight:800;font-size:15px;letter-spacing:.3em;text-anchor:middle;dominant-baseline:central}
.setor-t{fill:var(--ink);font-weight:800;font-size:9.5px;text-anchor:middle;letter-spacing:.08em}
.setor-t tspan.m{fill:var(--muted);font-weight:600}
.bloco-t{fill:var(--muted);font-weight:700;font-size:7.5px;text-anchor:middle;letter-spacing:.05em}
.fil{fill:var(--muted);font-weight:800;font-size:8px;text-anchor:middle;dominant-baseline:central}
.fil-bg{fill:var(--bg)}
.alunos-t{fill:var(--alunos-num);font-weight:900;font-size:12px;text-anchor:middle;dominant-baseline:central;letter-spacing:.15em}
.alunos-bg{fill:var(--alunos);stroke:var(--alunos-num);stroke-width:1}
.lote-esp{fill:none;stroke:var(--lote-esp);stroke-width:1.6;stroke-dasharray:3 2}
.ponte{stroke:var(--livre);stroke-width:1.6;stroke-linecap:round;opacity:.9}
.ponte.ocupado{stroke:var(--entregue)}