/* ===== v2: divisões, arte, laboratório, OSI, fluxograma, simulador, busca ===== */
:root{--sm-house:#e2e8f0;--sm-block:#f8fafc;--sm-street:#d4d9df}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--sm-house:#334155;--sm-block:#16222b;--sm-street:#0b1116}}
:root[data-theme="dark"]{--sm-house:#334155;--sm-block:#16222b;--sm-street:#0b1116}
.art-l{font-size:12px;font-weight:700;fill:var(--text)} .art-s{font-size:10px;fill:var(--muted)}
.art{width:100%;height:auto}
.blink0{animation:blink 1.1s steps(2,start) infinite}.blink1{animation:blink .7s steps(2,start) infinite .2s}.blink2{animation:blink 1.6s steps(2,start) infinite .5s}
.spin{animation:spin 1.2s linear infinite;transform-box:fill-box;transform-origin:center}
@keyframes spin{to{transform:rotate(360deg)}}
.wave{animation:wave 1.8s ease-in-out infinite}.wave.w2{animation-delay:.25s}.wave.w3{animation-delay:.5s}
@keyframes wave{0%,100%{opacity:.25}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.blink0,.blink1,.blink2,.spin,.wave,.blink{animation:none}}
.hit{fill:transparent;cursor:pointer;stroke:transparent;stroke-width:3}
.hit:hover,.hit.on{stroke:var(--accent);stroke-dasharray:6 5}
.div-tile{border-top:4px solid var(--dc)}
.divlbl{font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--dc);margin:12px 4px 2px;padding-left:8px;border-left:3px solid var(--dc)}
.divlbl:first-child{margin-top:0}
.mods{max-height:calc(100vh - 40px);overflow:auto;padding-right:4px}
.mod{padding:7px 10px;font-size:.92rem}
.toc{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;padding:12px 16px}
.toc a{font-size:.88rem;text-decoration:none}
.trio{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:8px 0 12px}
.trio div{border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--surface2)}
.trio b{display:block;color:var(--accent);font-size:1.05rem}.trio span{font-size:.88rem}
.stack{display:flex;flex-direction:column;gap:3px;margin:8px 0}
.stack div{border-left:6px solid var(--c);background:color-mix(in srgb,var(--c) 12%,var(--surface));padding:5px 10px;border-radius:6px;font-size:.88rem;font-weight:600}
.legend-l{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.8rem;color:var(--muted)}
.legend-l span::before{content:"";display:inline-block;width:10px;height:10px;border-radius:3px;background:var(--c);margin-right:5px;vertical-align:-1px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:10px 0;font-size:.9rem}.kv dt{color:var(--muted)}.kv dd{margin:0;font-weight:600}
/* OSI */
.osi-grid{display:grid;grid-template-columns:minmax(280px,380px) minmax(0,1fr);gap:16px;align-items:start}
.osi-cols{display:grid;grid-template-columns:1.6fr 1fr;gap:8px;margin-bottom:6px;font-size:.8rem;color:var(--muted)}
.osi-rows{display:grid;grid-template-columns:1.6fr 1fr;gap:8px}
.osi-left,.osi-right{display:flex;flex-direction:column;gap:4px}
.osi-l{display:flex;align-items:center;gap:10px;height:46px;border:0;border-radius:10px;background:color-mix(in srgb,var(--c) 16%,var(--surface));color:var(--text);font:inherit;font-weight:700;cursor:pointer;padding:0 10px;text-align:left;border-left:6px solid var(--c)}
.osi-l i{font-style:normal;width:22px;height:22px;border-radius:6px;background:var(--c);color:#fff;display:grid;place-items:center;font-size:.8rem}
.osi-l small{margin-left:auto;font-weight:500;color:var(--muted);font-size:.72rem}
.osi-l.on{outline:2.5px solid var(--c);outline-offset:1px}
.osi-t{display:grid;place-items:center;border-radius:10px;background:color-mix(in srgb,var(--c) 22%,var(--surface));border:1.5px dashed var(--c);font-weight:700;font-size:.9rem;text-align:center;padding:4px}
.encv{margin-top:10px}.encrow{display:flex;flex-wrap:wrap;gap:3px;margin-top:6px}
.encrow span{background:var(--c);color:#fff;font-size:.78rem;font-weight:700;padding:5px 8px;border-radius:6px;animation:pop .35s ease}
@keyframes pop{from{transform:scale(.6);opacity:0}}
.trw{display:grid;grid-template-columns:200px 1fr;gap:18px}
.trlayers{display:flex;flex-direction:column;gap:4px}
.trl{padding:6px 10px;border-radius:8px;font-size:.84rem;background:var(--surface2);border-left:5px solid var(--c);color:var(--muted)}
.trl.cur{outline:2px solid var(--c);color:var(--text);font-weight:700}.trl.ok{background:color-mix(in srgb,#16a34a 18%,var(--surface))}.trl.bad{background:color-mix(in srgb,#dc2626 20%,var(--surface));color:var(--text)}
.bad-t{color:var(--red)}
/* fluxograma */
.flowwrap{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:16px;align-items:start}
.flowsvg{padding:0;overflow:hidden;height:calc(100vh - 220px);min-height:520px}
.flowsvg svg{width:100%;height:100%;cursor:grab;touch-action:none}
.fn path,.fn rect{fill:var(--surface);stroke:var(--c);stroke-width:2}
.fn text{font:600 12px var(--font);fill:var(--text)}
.fn{cursor:pointer}.fn:hover path,.fn:hover rect{fill:color-mix(in srgb,var(--c) 10%,var(--surface))}
.fn.vis path,.fn.vis rect{fill:color-mix(in srgb,var(--c) 18%,var(--surface));stroke-width:3}
.fn.cur path,.fn.cur rect{fill:var(--c);stroke-width:3}.fn.cur text{fill:#fff}
.fe path{fill:none;stroke:var(--muted);stroke-width:1.6;opacity:.7}
.fe rect{fill:var(--surface2);stroke:none}.fe text{font:600 10px var(--font);fill:var(--muted)}
.fe.vis path{stroke:var(--accent);stroke-width:3.5;opacity:1}.fe.vis text{fill:var(--accent)}
/* simulador */
.simwrap{display:grid;grid-template-columns:290px minmax(0,1fr);gap:14px;align-items:start}
.simside{grid-column:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:12px;align-items:start}.simside .card{margin-top:0!important}
.simpanel{display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - 150px);overflow:auto}
.sp{padding:14px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:6px 8px;margin-top:8px}
.row2 label,.laygrid label{font-size:.8rem;color:var(--muted)}
.row2 .fld{padding:6px 8px;font-size:.88rem;margin-top:2px}
.laygrid{display:grid;grid-template-columns:1fr 1fr;gap:2px 8px;margin-top:6px}
#smsvg{display:block;width:100%;height:auto;aspect-ratio:1400/950;max-height:calc(100vh - 120px);background:var(--sm-street);cursor:grab;touch-action:none}
.smzoom{position:absolute;top:10px;right:10px;display:flex;flex-direction:column;gap:4px}.smzoom .btn{background:var(--surface)}
.sm-street rect{fill:var(--sm-street)}
.sm-block{fill:var(--sm-block)}.sm-block.park{fill:color-mix(in srgb,#22c55e 25%,var(--sm-block))}
.sm-lot rect{fill:none;stroke:var(--line);stroke-width:.6}
.sm-name text{font:600 7px var(--font);fill:var(--muted);letter-spacing:.04em}
.sm-qlbl text{font:700 7.5px var(--font);fill:var(--muted);opacity:.7}
.sm-bairro{font:800 17px var(--font);opacity:.55;letter-spacing:.05em}
.sm-area{fill:color-mix(in srgb,var(--accent) 10%,transparent);stroke:var(--accent);stroke-width:2.5;stroke-dasharray:10 6;vector-effect:non-scaling-stroke;pointer-events:none}
.sm-house{stroke:rgba(0,0,0,.18);stroke-width:.5;cursor:pointer}.sm-house.sel{stroke:#000;stroke-width:2;vector-effect:non-scaling-stroke}
.sm-pole circle{fill:#64748b}
.sm-drop line{stroke-width:1.1;opacity:.8;vector-effect:non-scaling-stroke}
.sm-cable line{stroke-linecap:round;vector-effect:non-scaling-stroke;cursor:pointer}
.sm-cto,.sm-ceo{cursor:pointer}.sm-cto text{font:700 7px var(--font);fill:var(--text);paint-order:stroke;stroke:var(--surface);stroke-width:2.5}
.sm-cto.sel rect{stroke:#facc15;stroke-width:2.5}
.sm-draw{fill:color-mix(in srgb,var(--accent) 15%,transparent);stroke:var(--accent);stroke-width:2;vector-effect:non-scaling-stroke}
.smk{gap:8px}.smk div{background:var(--surface2);border-radius:10px;padding:8px}.smk b{display:block;font-size:1.05rem}.smk span{font-size:.75rem;color:var(--muted)}
.simside .tbl td,.simside .tbl th{padding:4px 6px}
@media (max-width:1100px){.osi-grid,.flowwrap,.trw{grid-template-columns:1fr}.simwrap{grid-template-columns:1fr}.simpanel{max-height:none}.simside{grid-column:1;grid-template-columns:1fr}}
/* busca */
.semstat{font-size:.8rem;color:var(--muted);display:flex;gap:6px;align-items:center;margin-top:6px}
.semstat i{width:8px;height:8px;border-radius:50%;background:var(--amber);display:inline-block}
.semstat.ok i{background:var(--green)}
.res .rt{font-weight:700;margin-bottom:2px}
