.p-free{background:transparent;color:var(--ok);box-shadow:inset 0 0 0 1px currentColor} .p-block{background:var(--neutral-soft);color:var(--faint)}
.p-block::before{background:none;box-shadow:inset 0 0 0 1.5px currentColor}
/* plano interactivo: el plano es un papel blanco en ambos temas, así que sus colores no cambian con el tema */
.plano{--m-disp:#0AA3B8;--m-sep:#DB9A2B;--m-pag:#2F74D0;--m-venc:#D2402F;--m-canc:#7657C2;--m-block:#8E9591}
.plano .bar{margin-bottom:10px}
.leyenda{display:flex;flex-wrap:wrap;gap:6px}
.leyenda button{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:4px 11px;font-size:13px;font-weight:500;color:var(--ink)}
.leyenda button i{width:11px;height:11px;border-radius:3px;background:var(--c)}
.leyenda button b{font-variant-numeric:tabular-nums;color:var(--muted);font-weight:600}
.leyenda button[aria-pressed="false"]{opacity:.45}
.zoom{display:flex;gap:4px}
.zoom button{width:34px;height:34px;border:1px solid var(--line);background:var(--surface);border-radius:8px;font-size:17px;font-weight:600;color:var(--ink);display:grid;place-items:center}
.zoom button.txt{width:auto;padding-inline:10px;font-size:13px}
.planobox{position:relative;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;height:min(72vh,720px);min-height:360px;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}
.planobox.drag{cursor:grabbing}
.planobox svg{display:block;width:100%;height:100%}
.planobox .lote{fill:var(--c);fill-opacity:.45;stroke:#fff;stroke-width:.8;cursor:pointer;transition:fill-opacity .15s}
.planobox .calles{fill:none;stroke:#7F97C9;stroke-width:.45}
.planobox .nums text{fill:#1E2A23;font-family:var(--body);font-weight:600;text-anchor:middle;dominant-baseline:central;pointer-events:none}
.planobox .mzs text{fill:#17201B;fill-opacity:.55;font-family:var(--display);font-weight:700;font-size:15px;text-anchor:middle;dominant-baseline:central;pointer-events:none;paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-opacity:.8}
.planobox .lote:hover,.planobox .lote:focus-visible{fill-opacity:.7;stroke-width:2.2;outline:none}
.planobox .lote.dim{fill-opacity:.08;stroke-opacity:.25}
.planobox .lote.sel{fill-opacity:.75;stroke:#111;stroke-width:2.4}
.planobox .lote.block{fill:url(#rayado)}
.planobox .cargando{position:absolute;inset:0;display:grid;place-items:center;color:#5B6860;font-size:14px}
.ptip{position:absolute;pointer-events:none;z-index:2;background:#17201B;color:#fff;border-radius:8px;padding:8px 10px;font-size:12.5px;line-height:1.4;max-width:260px;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.ptip b{font-family:var(--display);font-size:14px}
.ptip .s{color:#B9C4BD}
.plano .note{margin-top:10px}
.plano{--m-rtres:#9A5B3C;--c-rec:#8CC98A;--c-edu:#8FB3E0;--c-otros:#F2C877;--c-com:#E58FB4;--c-agua:#1F7FD6;--c-desague:#8A5A2B}
/* capas del plano */
.planobox .trazo{fill:none;stroke:#9AA3B5;stroke-width:.35}
.planobox .borde{fill:none;stroke:#2B332E;stroke-width:1.3}
.planobox .aporte polygon{stroke:#fff;stroke-width:.8;fill-opacity:.75}
.planobox .aporte.rec polygon{fill:var(--c-rec)} .planobox .aporte.edu polygon{fill:var(--c-edu)} .planobox .aporte.otros polygon{fill:var(--c-otros)} .planobox .aporte.com polygon{fill:var(--c-com)}
.planobox .aporte text{fill:#1E2A23;font-family:var(--body);font-weight:700;font-size:8px;text-anchor:middle;dominant-baseline:central;pointer-events:none}
.planobox .aporte text.s{font-weight:500;font-size:7px}
.planobox .renuncia,.planobox .rayada{fill:url(#rayaFina);stroke:#9AA29D;stroke-width:.5}
.planobox .cotas text{fill:#3B5BA5;font-family:var(--body);font-weight:600;font-size:6.5px;text-anchor:middle;dominant-baseline:central;pointer-events:none;paint-order:stroke;stroke:#fff;stroke-width:2px}
.planobox .red{pointer-events:visiblePainted}
.planobox .agua path{fill:none;stroke:var(--c-agua);stroke-width:1.6;stroke-linecap:round}
.planobox .agua .nodo{fill:#fff;stroke:var(--c-agua);stroke-width:1.2} .planobox .agua .nodo.bajo{fill:#D2402F}
.planobox .agua .valv{fill:var(--c-agua)} .planobox .agua .valv.purga{fill:#fff;stroke:var(--c-agua);stroke-width:1}
.planobox .desague circle{fill:var(--c-desague);stroke:#fff;stroke-width:1}
.capas{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.capas .capa{display:inline-flex;align-items:center;gap:7px;border:1px dashed var(--line);background:transparent;border-radius:8px;padding:4px 10px;font-size:12.5px;font-weight:500;color:var(--muted)}
.capas .capa i{width:14px;height:4px;border-radius:2px;background:#9AA3B5}
.capas .capa.aportes i{background:var(--c-rec);height:10px;width:10px} .capas .capa.cotas i{background:#3B5BA5}
.capas .capa.agua i{background:var(--c-agua)} .capas .capa.desague i{background:var(--c-desague);border-radius:50%;width:9px;height:9px}
.capas .capa[aria-pressed="true"]{border-style:solid;background:var(--surface);color:var(--ink)}
/* ficha técnica */
.ficha{margin-top:22px}
.ficha h2{margin:0 0 4px}
.ficha .fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-top:12px}
.ficha .panel{margin:0}
.ficha .panel.wide{grid-column:1/-1}
.ficha h3{font-size:15px;font-family:var(--body);font-weight:700;margin:0 0 8px}
.ficha h4{font-size:13.5px;margin:0 0 6px;display:flex;align-items:center;gap:7px}
.ficha table{width:100%;min-width:0;border-collapse:collapse;font-size:13px}
.ficha td{padding:5px 0;border-bottom:1px solid var(--line);vertical-align:top}
.ficha td:first-child{color:var(--muted);padding-right:12px}
.ficha td.r{white-space:nowrap;text-align:right}
.ficha tr.t td{font-weight:700;color:var(--ink);border-bottom:0}
.ficha tr.h td{font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--faint)}
.ficha .sw{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.ficha .sw.rec{background:var(--c-rec)} .ficha .sw.edu{background:var(--c-edu)} .ficha .sw.otros{background:var(--c-otros)} .ficha .sw.com{background:var(--c-com)}
.ficha .sw.agua{background:var(--c-agua)} .ficha .sw.desague{background:var(--c-desague)}
.ficha .fgrid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.ficha .vias{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.ficha .via svg{display:block;width:100%;height:16px;border-radius:3px;overflow:hidden;margin:5px 0}
.ficha .via .vt{display:flex;justify-content:space-between;font-size:13px}
.ficha .via .vp{font-size:11.5px;color:var(--muted)}
.ficha ul{margin:0;padding-left:18px;display:grid;gap:6px;font-size:13px}
@media (max-width:520px){.planobox{height:62vh}}