:root{--green:#008243;--green2:#006f39;--bg:#f5f7f8;--card:#fff;--text:#1e2528;--muted:#6d777c;--border:#dfe5e7;--danger:#bd2c2c;--shadow:0 8px 26px rgba(20,35,42,.08)}*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}.topbar{height:68px;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 20px;gap:22px;position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:10px;min-width:210px}.brand div{display:flex;flex-direction:column}.brand small{color:var(--muted);font-size:11px}.brand-mark{width:52px;height:52px;border-radius:16px;background:var(--green);color:#fff;display:grid;place-items:center;font-weight:800;font-size:25px}.brand-mark.small{width:36px;height:36px;border-radius:11px;font-size:18px}.tabs{display:flex;gap:4px;flex:1}.tab{border:0;background:transparent;padding:10px 14px;border-radius:10px;color:var(--muted);cursor:pointer}.tab.active{background:#edf7f2;color:var(--green);font-weight:700}.top-actions{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px}.view{display:none}.active-view{display:block}.toolbar{padding:12px 16px;display:flex;gap:10px;align-items:center;background:#fff;border-bottom:1px solid var(--border)}.toolbar .searchbox{display:flex;flex:1;max-width:560px}.searchbox input{border-radius:10px 0 0 10px;border-right:0}.searchbox .btn{border-radius:0 10px 10px 0}.btn{border:1px solid var(--border);background:#fff;color:var(--text);padding:9px 13px;border-radius:10px;cursor:pointer;font-weight:600}.btn:hover{background:#f8fafb}.btn.primary{background:var(--green);border-color:var(--green);color:#fff}.btn.primary:hover{background:var(--green2)}.btn.ghost{background:transparent}.btn.danger{color:var(--danger);border-color:#efcaca}.btn.full{width:100%}.map-layout{display:grid;grid-template-columns:minmax(0,1fr) 390px;height:calc(100vh - 125px);min-height:620px}.map-canvas{background:#e8edef;min-width:0;position:relative}.map-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);gap:5px}.side-panel{background:#fff;border-left:1px solid var(--border);overflow:auto}.empty-panel{padding:44px 30px;text-align:center;color:var(--muted)}.empty-panel h2{color:var(--text)}.big-pin{font-size:44px;color:var(--green)}.panel-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:16px}.panel-head h2{margin:3px 0 0}.panel-head small{color:var(--green);font-weight:700}.icon-btn{border:0;background:#f2f5f6;border-radius:50%;width:36px;height:36px;font-size:24px;cursor:pointer}.asset-form,#detailPanel{padding:20px}.asset-form label,.settings-card label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;color:#485156;margin-bottom:12px}input,select,textarea{width:100%;border:1px solid var(--border);background:#fff;border-radius:9px;padding:10px 11px;color:var(--text);outline:none}input:focus,select:focus,textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(0,130,67,.08)}textarea{resize:vertical}.form-grid{display:grid;gap:10px}.form-grid.two{grid-template-columns:1fr 1fr}.form-grid.three{grid-template-columns:1fr 1fr 1fr}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}.form-actions .danger{margin-right:auto}.hidden{display:none!important}.error-text{color:var(--danger);font-size:12px;margin:4px 0}.map-notice{position:absolute;z-index:15;left:50%;transform:translateX(-50%);top:138px;background:#172026;color:white;padding:10px 16px;border-radius:10px;box-shadow:var(--shadow)}.detail-top{display:flex;justify-content:space-between;gap:12px}.type-pill{display:inline-flex;padding:5px 8px;border-radius:8px;background:#edf7f2;color:var(--green);font-size:11px;font-weight:800}.detail-title{font-size:24px;margin:10px 0 2px}.muted{color:var(--muted)}.coords{font-family:Consolas,monospace;font-size:12px;background:#f5f7f8;padding:9px;border-radius:9px;margin:13px 0}.detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px}.kv{border-top:1px solid var(--border);padding:11px 0;display:grid;grid-template-columns:120px 1fr;gap:12px;font-size:13px}.kv span:first-child{color:var(--muted)}.trace{margin-top:18px}.trace-step{display:flex;gap:10px;align-items:flex-start;margin:7px 0}.trace-dot{width:12px;height:12px;border-radius:50%;background:var(--green);margin-top:4px;flex:none}.section-head{padding:25px 28px;display:flex;align-items:center;justify-content:space-between}.section-head h1,.settings-card h1{margin:0 0 5px}.section-head p,.settings-card>p{margin:0;color:var(--muted)}.table-wrap{margin:0 28px 28px;background:white;border:1px solid var(--border);border-radius:14px;overflow:auto}table{border-collapse:collapse;width:100%;min-width:820px}th,td{text-align:left;border-bottom:1px solid var(--border);padding:12px 14px;font-size:13px}th{background:#f8fafb;color:#5e696e;font-size:11px;text-transform:uppercase}tr:last-child td{border-bottom:0}.link-btn{border:0;background:none;color:var(--green);font-weight:700;cursor:pointer}.settings-card{max-width:820px;margin:28px auto;background:#fff;border:1px solid var(--border);border-radius:16px;padding:26px}.settings-card form{margin-top:22px}.callout{background:#f5faf7;border:1px solid #d9ece2;border-radius:11px;padding:13px;color:#4e6258;font-size:13px;margin-bottom:16px}.login-body{min-height:100vh;display:grid;place-items:center;background:linear-gradient(145deg,#f3f8f5,#eef2f4)}.login-card{width:min(420px,calc(100% - 30px));background:#fff;border:1px solid var(--border);border-radius:20px;padding:32px;box-shadow:var(--shadow)}.login-card h1{margin:18px 0 5px}.login-card>p{margin:0 0 25px;color:var(--muted)}.login-card small{display:block;color:var(--muted);margin-top:18px}.login-form label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;margin:12px 0}.login-form .btn{width:100%;margin-top:8px}.gm-asset-label{background:#fff;padding:4px 7px;border-radius:7px;border:1px solid rgba(0,0,0,.13);font-size:11px;font-weight:800;box-shadow:0 2px 8px rgba(0,0,0,.16);white-space:nowrap}.asset-marker{appearance:none;padding:0;cursor:pointer;width:34px;height:34px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--green);border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.25);display:grid;place-items:center}.asset-marker span{transform:rotate(45deg);font-size:14px}@media(max-width:900px){.topbar{height:auto;padding:10px 12px;flex-wrap:wrap}.brand{min-width:auto}.tabs{order:3;width:100%;overflow:auto}.top-actions{margin-left:auto}.toolbar{flex-wrap:wrap}.toolbar .searchbox{max-width:none;width:100%;flex-basis:100%}.map-layout{grid-template-columns:1fr;height:auto;min-height:0}.map-canvas{height:56vh;min-height:390px}.side-panel{border-left:0;border-top:1px solid var(--border);max-height:none}.map-notice{top:180px}.form-grid.three{grid-template-columns:1fr}.section-head{padding:18px}.table-wrap{margin:0 12px 20px}.settings-card{margin:15px}.top-actions #userBadge{display:none}}@media(max-width:520px){.form-grid.two{grid-template-columns:1fr}.detail-actions{grid-template-columns:1fr}.toolbar select,.toolbar>.btn{flex:1}.kv{grid-template-columns:100px 1fr}.settings-card{padding:18px}}

.maplibregl-map{font-family:Inter,Segoe UI,Arial,sans-serif}.maplibregl-ctrl-attrib{font-size:10px}.map-provider-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:9px;background:#f5faf7;border:1px solid #d9ece2;color:#4e6258;font-size:12px;font-weight:700}

/* v1.2+ · gestión de fibra */
.fiber-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:16px;padding:0 28px 28px}.cable-list-card,.fiber-main{background:#fff;border:1px solid var(--border);border-radius:14px;min-width:0}.cable-list-card{overflow:hidden}.cable-list-head{padding:14px;border-bottom:1px solid var(--border);display:grid;gap:10px}.cable-list{max-height:calc(100vh - 235px);overflow:auto}.cable-item{width:100%;border:0;border-bottom:1px solid var(--border);background:#fff;text-align:left;padding:13px 14px;cursor:pointer}.cable-item:hover,.cable-item.active{background:#f3faf6}.cable-item strong{display:block}.cable-meta{font-size:12px;color:var(--muted);margin-top:4px}.fiber-main{padding:18px;overflow:auto}.fiber-empty{text-align:center;color:var(--muted);padding:70px 20px}.fiber-empty h2{color:var(--text)}.cable-form.settings-card{margin:0;max-width:none;border:0;padding:0}.cable-summary{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap}.summary-badges{display:flex;gap:8px;flex-wrap:wrap}.summary-badge{background:#f3f6f7;border:1px solid var(--border);padding:7px 9px;border-radius:9px;font-size:12px}.fiber-table-wrap{margin-top:16px;overflow:auto;border:1px solid var(--border);border-radius:12px}.fiber-table{min-width:980px}.fiber-table td,.fiber-table th{padding:9px 10px}.fiber-swatch{display:inline-block;width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.25);vertical-align:-2px;margin-right:6px}.fiber-actions{display:flex;gap:6px;flex-wrap:wrap}.fiber-actions select,.fiber-actions input{padding:7px 8px;font-size:12px}.fiber-actions .btn{padding:7px 9px;font-size:12px}.fiber-state{font-size:11px;font-weight:800;padding:4px 7px;border-radius:7px;background:#eef2f3}.fiber-state.libre{color:#4c5b61}.fiber-state.en_uso,.fiber-state.continua{color:#006f39;background:#edf7f2}.fiber-state.averiada{color:#9f2424;background:#fff0f0}.fiber-state.reservada{color:#7b5d00;background:#fff7d8}.fiber-state.termina{color:#874600;background:#fff1e0}.cable-map-label{background:#fff;border:1px solid rgba(0,0,0,.18);border-radius:6px;padding:2px 5px;font-size:10px;font-weight:800}.fiber-help{background:#f5faf7;border:1px solid #d9ece2;border-radius:11px;padding:12px;margin:12px 0;font-size:12px;color:#4e6258}.row-edited{background:#fffbea}
@media(max-width:900px){.fiber-layout{grid-template-columns:1fr;padding:0 12px 20px}.cable-list{max-height:260px}.fiber-main{padding:12px}}

/* v1.3.0 · NAP + splitter integrado */
.conditional-card{border:1px solid #dce7e1;background:#f8fbf9;border-radius:12px;padding:13px;margin:4px 0 13px}.conditional-card>strong{display:block;color:#254436;margin-bottom:4px}.conditional-card>p{font-size:12px;color:var(--muted);margin:0 0 12px}.small-text{font-size:12px}.splitter-card{margin-top:16px;border:1px solid var(--border);border-radius:12px;padding:13px;background:#fbfcfc}.splitter-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:12px}.splitter-input{padding:10px;border-radius:9px;background:#f3f8f5;margin-bottom:12px;font-size:12px}.splitter-input small{display:block;color:var(--muted);font-weight:700;margin-bottom:5px}.splitter-ports{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.splitter-port{border:1px solid var(--border);border-radius:9px;padding:8px;display:flex;flex-direction:column;gap:3px;min-width:0}.splitter-port strong{font-size:12px}.splitter-port span{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.splitter-port.ocupado{background:#edf7f2;border-color:#b8dcc9}.splitter-port.reservado{background:#fff7d8;border-color:#ead57c}.splitter-port.averiado{background:#fff0f0;border-color:#efcaca}.fiber-destination{min-width:270px}.splice-selects{display:grid;gap:6px}.fiber-target-label{padding:8px 9px;border-radius:8px;background:#f4f7f8;border:1px solid var(--border);font-size:12px}.fiber-table{min-width:1180px}
@media(max-width:520px){.splitter-ports{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* v1.4.0 · cable persistente + splitter MUFA/NAP */
.network-cable-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;overflow:visible}.cable-overlay-outline{stroke:#fff;stroke-linecap:round;stroke-linejoin:round;opacity:.98}.cable-overlay-line{stroke-linecap:round;stroke-linejoin:round;opacity:1}.cable-overlay-legacy{stroke:#6f7b80;stroke-width:3;stroke-dasharray:8 5;stroke-linecap:round;opacity:.9}.cable-overlay-label{font:700 11px Inter,Segoe UI,Arial,sans-serif;fill:#203036;paint-order:stroke;stroke:#fff;stroke-width:4px;stroke-linejoin:round;text-anchor:middle}.maplibregl-marker{z-index:5}.maplibregl-ctrl-top-right,.maplibregl-ctrl-bottom-right,.maplibregl-ctrl-bottom-left{z-index:7}.mufa-splitter-ports{display:grid;gap:8px}.mufa-splitter-port{display:grid;grid-template-columns:48px 110px minmax(180px,1.3fr) minmax(170px,1fr) minmax(140px,1fr) auto;gap:7px;align-items:center;border:1px solid var(--border);padding:8px;border-radius:10px;background:#fff}.mufa-splitter-port select,.mufa-splitter-port input{margin:0;padding:8px;font-size:12px}.mufa-splitter-port strong{font-size:12px}@media(max-width:900px){.mufa-splitter-port{grid-template-columns:52px 1fr}.mufa-splitter-port>*:nth-child(n+3){grid-column:1/-1}}

/* v1.5.0 · splitter MUFA -> NAP seleccionable + diseño adaptable */
html,body{max-width:100%;overflow-x:hidden}main,.view,.map-layout,.side-panel,#detailPanel,.asset-form,.fiber-layout,.fiber-main,.splitter-card{min-width:0;max-width:100%}
.map-layout{grid-template-columns:minmax(0,1fr) clamp(360px,30vw,470px)}
.side-panel{overflow-x:hidden}
#detailPanel,.asset-form{width:100%}
#detailPanel select,#detailPanel input,#detailPanel textarea,.asset-form select,.asset-form input,.asset-form textarea{min-width:0;max-width:100%}
.splitter-card{overflow:hidden}
.mufa-splitter-ports{display:grid;gap:10px;min-width:0}
.mufa-splitter-port{display:block;min-width:0;border:1px solid var(--border);padding:10px;border-radius:11px;background:#fff}
.mufa-splitter-port.asignado{background:#f4fbf7;border-color:#bddfcd}
.mufa-splitter-port.reservado{background:#fffaf0;border-color:#e7d99a}
.mufa-splitter-port.averiado{background:#fff5f5;border-color:#efcaca}
.spl-port-head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;margin-bottom:9px}
.spl-port-head>strong{font-size:13px;flex:none}
.spl-port-destination{font-size:11px;color:var(--green);font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
.spl-port-grid{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:8px;min-width:0}
.spl-field{display:flex;flex-direction:column;gap:4px;min-width:0;color:#596469;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
.spl-field select,.spl-field input{font-size:12px;text-transform:none;letter-spacing:normal;width:100%;min-width:0;padding:8px}
.spl-field-wide{grid-column:1/-1}
.spl-port-actions{display:flex;justify-content:flex-end;margin-top:8px}
.spl-port-actions .btn{font-size:12px;padding:8px 10px}
.splitter-warning{margin:0 0 10px;padding:9px 10px;border-radius:9px;background:#fff8e6;border:1px solid #ead8a4;color:#70580e;font-size:11px;line-height:1.4}
.toolbar>*{min-width:0}.toolbar select{max-width:260px}.toolbar .searchbox{min-width:240px}
.detail-actions .btn{min-width:0;white-space:normal;text-align:center;text-decoration:none}
.kv strong{min-width:0;overflow-wrap:anywhere}

@media(max-width:1200px) and (min-width:901px){
  .topbar{gap:12px;padding:0 12px}.brand{min-width:185px}.tab{padding:9px 10px}
  .toolbar{gap:8px;padding:10px 12px}.toolbar .searchbox{max-width:430px}.toolbar select{max-width:210px}
  .map-layout{grid-template-columns:minmax(0,1fr) 370px}
  .asset-form,#detailPanel{padding:16px}
  .detail-title{font-size:21px}.kv{grid-template-columns:105px minmax(0,1fr)}
}

@media(max-width:900px){
  .toolbar select,.toolbar>.btn{min-width:140px;max-width:none}
  .map-layout{grid-template-columns:1fr;height:auto;min-height:0}
  .map-canvas{height:52vh;min-height:360px}
  .side-panel{width:100%;max-width:100%;overflow-x:hidden}
  .spl-port-grid{grid-template-columns:1fr 1fr}
  .fiber-table-wrap,.table-wrap{max-width:100%}
}

@media(max-width:600px){
  .topbar{align-items:flex-start}.brand{min-width:0;max-width:70%}.brand strong{overflow-wrap:anywhere}
  .tabs{gap:2px}.tab{padding:9px 10px;white-space:nowrap}
  .toolbar{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .toolbar .searchbox{grid-column:1/-1;width:100%;min-width:0}.toolbar select,.toolbar>.btn{width:100%;min-width:0;max-width:none}
  .asset-form,#detailPanel{padding:14px}
  .spl-port-grid{grid-template-columns:1fr}.spl-field-wide{grid-column:auto}
  .spl-port-head{align-items:flex-start}.spl-port-destination{white-space:normal;text-align:left}
  .splitter-head{flex-direction:column}.splitter-ports{grid-template-columns:repeat(2,minmax(0,1fr))}
  .section-head{align-items:flex-start;gap:12px;flex-wrap:wrap}.section-head .btn{width:100%}
  .settings-card{width:calc(100% - 20px);margin:10px;padding:15px}
}

/* v1.7.0 · puertos OLT + ocupación progresiva de fibras */
.olt-card{margin-top:16px;border:1px solid var(--border);border-radius:12px;padding:13px;background:#fbfcfc;min-width:0;overflow:hidden}
.olt-port-list{display:grid;gap:9px;margin-top:10px}
.olt-port-row{border:1px solid var(--border);border-radius:10px;padding:10px;background:#fff;min-width:0}
.olt-port-row.asignado{background:#f4fbf7;border-color:#bddfcd}.olt-port-row.reservado{background:#fffaf0;border-color:#e7d99a}.olt-port-row.averiado{background:#fff5f5;border-color:#efcaca}
.olt-port-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;min-width:0}.olt-port-head span{font-size:11px;color:var(--green);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.olt-port-grid{display:grid;grid-template-columns:minmax(90px,.65fr) minmax(150px,1.25fr) minmax(170px,1.25fr) minmax(130px,1fr);gap:8px;min-width:0}
.olt-port-grid label{font-size:10px;font-weight:800;text-transform:uppercase;color:#596469;display:flex;flex-direction:column;gap:4px;min-width:0}.olt-port-grid select,.olt-port-grid input{width:100%;min-width:0;font-size:12px;padding:8px;text-transform:none}
.olt-port-actions{display:flex;justify-content:flex-end;margin-top:8px}.fiber-source{font-size:10px;color:var(--green);font-weight:700;margin-top:4px;white-space:nowrap}
.fiber-blocked{background:#f7f7f7}.fiber-blocked td{opacity:.9}
@media(max-width:1200px){.olt-port-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.olt-port-grid{grid-template-columns:1fr}.olt-port-head{align-items:flex-start}.olt-port-head span{white-space:normal;text-align:right}}

/* v1.8.0 · separación lógica/recorrido + ODF/EDFA */
.route-only-note{margin:12px 0;padding:11px 12px;border:1px solid #d9e3e6;border-radius:10px;background:#f7fafb;font-size:12px;color:#526067}.route-only-note strong{display:block;color:#26363d;margin-bottom:3px}
.route-node.route-guide{border-style:dashed;background:#fafafa;color:#5f6a6e}.route-node.route-guide em{color:#7a8589}
.asset-marker[title^="POSTE"]{opacity:.82}
@media(max-width:1100px){.map-layout{grid-template-columns:minmax(0,1fr) minmax(330px,38vw)}}
@media(max-width:760px){.map-layout{grid-template-columns:1fr}.map-canvas{height:50vh;min-height:320px}.side-panel{max-height:none}.toolbar{grid-template-columns:1fr 1fr}.toolbar .searchbox{grid-column:1/-1}.tabs{overflow-x:auto;max-width:100%}}

/* v1.10 - metraje y reservas de cable */
.cable-meters { margin-top: 8px; }
.cable-meters .usage-total { font-weight: 700; }
.route-node b { display:block; font-size:11px; margin-top:4px; color:var(--muted,#64748b); font-weight:600; }
.route-reserve-label { display:block; margin-top:6px; font-size:11px; font-weight:600; color:var(--muted,#64748b); }
.route-reserve-label span { display:flex; align-items:center; gap:4px; margin-top:3px; }
.route-reserve-label input { width:78px; min-width:0; padding:5px 7px; border:1px solid #d5dde5; border-radius:7px; font-size:12px; }
.route-new-reserve { min-width:150px; font-size:12px; color:var(--muted,#64748b); }
.route-new-reserve input { width:100%; margin-top:3px; }
@media (max-width: 800px) { .route-add-row { grid-template-columns:1fr !important; } .route-new-reserve { width:100%; } }

/* v1.11 · editor ordenado de recorrido + metraje por hilo */
.cable-route-card,.fiber-usage-card{margin-top:14px;border:1px solid var(--border);border-radius:14px;background:#fff;padding:14px;min-width:0}
.route-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}.route-card-head strong{font-size:14px}.route-card-head .muted{font-size:12px;margin-top:3px}
.route-editor-list{display:grid;gap:7px}.route-editor-row{display:grid;grid-template-columns:36px minmax(140px,1.15fr) minmax(150px,.9fr) minmax(125px,.75fr) minmax(180px,auto);gap:10px;align-items:center;border:1px solid var(--border);border-radius:11px;padding:9px;background:#fbfcfc;min-width:0}.route-editor-row.active{border-color:#8bc9a8;background:#f2faf6}.route-editor-row.route-guide{border-style:dashed;background:#fafafa}.route-order{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#edf2f0;font-size:12px;font-weight:800}.route-point-info{min-width:0}.route-point-info strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.route-point-info span,.route-distance span{display:block;color:var(--muted);font-size:11px}.route-distance strong{display:block;font-size:11px;margin-top:3px}.route-reserve-inline{font-size:10px;font-weight:800;text-transform:uppercase;color:#596469;display:flex;flex-direction:column;gap:4px}.route-reserve-inline input{width:100%;min-width:72px;padding:7px;border:1px solid var(--border);border-radius:8px;font-size:12px}.route-row-actions{display:flex;gap:5px;justify-content:flex-end;flex-wrap:wrap}.btn.compact{padding:6px 8px;font-size:11px;min-height:32px}.btn.compact.danger{color:#a12626;border-color:#edcccc;background:#fff8f8}
.route-insert-panel{display:grid;grid-template-columns:minmax(180px,1.2fr) minmax(180px,1.1fr) minmax(135px,.65fr) auto;gap:8px;align-items:end;margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}.route-insert-panel label{font-size:10px;font-weight:800;text-transform:uppercase;color:#596469;display:flex;flex-direction:column;gap:4px;min-width:0}.route-insert-panel select,.route-insert-panel input{width:100%;min-width:0;text-transform:none;font-size:12px}.route-insert-panel .btn{min-height:40px}
.route-work-selector{margin-top:14px}.route-work-selector label{display:grid;gap:5px;font-size:12px;font-weight:800}.route-work-selector select{max-width:560px}
.fiber-usage-scroll{overflow:auto;max-height:360px;border:1px solid var(--border);border-radius:10px}.fiber-usage-table{width:100%;min-width:760px;border-collapse:collapse}.fiber-usage-table th,.fiber-usage-table td{padding:8px 9px;border-bottom:1px solid var(--border);font-size:11px;text-align:left;vertical-align:top}.fiber-usage-table th{position:sticky;top:0;background:#f7f9f8;z-index:1;font-size:10px;text-transform:uppercase;color:#596469}.fiber-usage-table tr:last-child td{border-bottom:0}
@media(max-width:1150px){.route-editor-row{grid-template-columns:34px minmax(130px,1fr) minmax(135px,1fr);}.route-reserve-inline{grid-column:2}.route-row-actions{grid-column:3;grid-row:2}.route-insert-panel{grid-template-columns:1fr 1fr}.route-insert-panel .btn{width:100%}}
@media(max-width:700px){.route-editor-row{grid-template-columns:32px minmax(0,1fr)}.route-distance,.route-reserve-inline,.route-row-actions{grid-column:2}.route-row-actions{justify-content:flex-start}.route-insert-panel{grid-template-columns:1fr}.fiber-usage-scroll{max-height:300px}}

.error-text.info-text{color:#52606d;background:#f4f8f6;border:1px solid #d7e8df;border-radius:10px;padding:10px 12px;margin-top:8px;}


/* v1.13 · mapa visual: iconos por componente, nombres y metraje por tramo */
.asset-marker-wrap{display:flex;flex-direction:column;align-items:center;gap:4px;transform:translateY(2px);pointer-events:auto;min-width:max-content}
.asset-marker-wrap .asset-marker{width:40px;height:40px;border-radius:11px;transform:none;background:#fff;border:2px solid #fff;box-shadow:0 2px 10px rgba(20,35,42,.28);display:grid;place-items:center;padding:6px;cursor:pointer}
.asset-marker-wrap .asset-marker svg{width:25px;height:25px;display:block}
.asset-marker-wrap.type-olt .asset-marker{outline:3px solid rgba(11,107,203,.88)}
.asset-marker-wrap.type-odf .asset-marker{outline:3px solid rgba(107,79,187,.88)}
.asset-marker-wrap.type-edfa .asset-marker{outline:3px solid rgba(217,119,6,.88)}
.asset-marker-wrap.type-mufa .asset-marker{outline:3px solid rgba(0,130,67,.9)}
.asset-marker-wrap.type-nap .asset-marker{outline:3px solid rgba(25,118,210,.9)}
.asset-marker-wrap.type-poste .asset-marker{width:31px;height:31px;padding:5px;border-radius:50%;outline:2px solid rgba(82,96,109,.8);opacity:.93}
.asset-marker-wrap.type-poste .asset-marker svg{width:20px;height:20px}
.asset-marker-wrap.type-cliente_onu .asset-marker{outline:3px solid rgba(123,31,162,.88)}
.asset-map-label{max-width:170px;background:rgba(255,255,255,.94);border:1px solid rgba(34,48,54,.13);border-radius:7px;padding:3px 6px;box-shadow:0 1px 4px rgba(20,35,42,.14);text-align:center;line-height:1.12;cursor:pointer;white-space:nowrap}
.asset-map-label strong{display:block;font-size:11px;color:#17252b;letter-spacing:.01em}
.asset-map-label span{display:block;max-width:155px;overflow:hidden;text-overflow:ellipsis;font-size:9px;color:#68757a;margin-top:2px}
.asset-marker-wrap.type-poste .asset-map-label{padding:2px 5px;background:rgba(255,255,255,.86)}
.asset-marker-wrap.type-poste .asset-map-label strong{font-size:9px}.asset-marker-wrap.type-poste .asset-map-label span{display:none}
.segment-meter-label rect{fill:rgba(255,255,255,.94);stroke:rgba(61,76,82,.25);stroke-width:1}
.segment-meter-label text{font:800 10px Inter,Segoe UI,Arial,sans-serif;fill:#26383f;text-anchor:middle;paint-order:stroke;stroke:#fff;stroke-width:2px}
.cable-name-label{font-size:10.5px;letter-spacing:.01em}
.network-map-legend{position:absolute;left:12px;bottom:26px;z-index:8;width:min(330px,calc(100% - 24px));background:rgba(255,255,255,.95);border:1px solid rgba(40,60,66,.14);border-radius:12px;padding:9px 10px;box-shadow:0 5px 18px rgba(20,35,42,.13);font-size:10px;backdrop-filter:blur(5px)}
.legend-title{font-weight:800;font-size:11px;margin-bottom:6px}.legend-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px 8px}.legend-item{display:flex;align-items:center;gap:5px;min-width:0;white-space:nowrap}.legend-symbol{width:20px;height:20px;border-radius:6px;background:#fff;border:1px solid #dbe3e6;display:grid;place-items:center;padding:2px}.legend-symbol svg{width:15px;height:15px}.legend-lines{border-top:1px solid #e1e7e9;margin-top:7px;padding-top:6px;display:flex;gap:10px;flex-wrap:wrap}.legend-lines span{display:flex;align-items:center;gap:5px}.line-demo{display:inline-block;width:24px;height:0;border-top:3px solid}.line-demo.troncal{border-color:#008243;border-top-width:5px}.line-demo.distribucion{border-color:#1976d2;border-top-width:4px}.line-demo.drop{border-color:#7b1fa2;border-top-width:3px}
@media(max-width:700px){.asset-map-label span{display:none}.asset-map-label strong{font-size:9px}.asset-marker-wrap .asset-marker{width:34px;height:34px}.asset-marker-wrap .asset-marker svg{width:21px;height:21px}.network-map-legend{width:auto;max-width:calc(100% - 24px)}.legend-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.segment-meter-label text{font-size:9px}}


/* v1.13.1 - visualización de reservas por punto */
.asset-map-reserve{margin-top:3px;padding:2px 5px;border-radius:5px;background:#fff6d8;border:1px solid #e9c85c;color:#715700;font-size:9px;font-weight:800;white-space:nowrap}
.asset-marker-wrap.type-poste .asset-map-reserve{display:block;font-size:8px;padding:1px 4px}
.reserve-detail-card{margin:12px 0;border:1px solid #ead27b;background:#fffaf0;border-radius:12px;padding:12px}
.reserve-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:8px;border-bottom:1px solid rgba(180,145,36,.22)}
.reserve-detail-head>span{background:#fff1b9;border:1px solid #e6c556;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:800;color:#705500;white-space:nowrap}
.reserve-detail-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 2px;border-bottom:1px solid rgba(180,145,36,.14)}
.reserve-detail-row:last-child{border-bottom:0;padding-bottom:0}.reserve-detail-row div{min-width:0}.reserve-detail-row div strong{display:block;font-size:12px}.reserve-detail-row div span{display:block;font-size:10px;color:var(--muted);margin-top:2px}.reserve-detail-row>b{font-size:12px;color:#725700;white-space:nowrap}
.cable-reserve-meta{margin-top:5px;font-size:10px;color:#7a5a00;background:#fff8df;border-radius:6px;padding:4px 6px;width:max-content;max-width:100%}
@media(max-width:700px){.asset-map-reserve{font-size:8px}.reserve-detail-head{flex-direction:column}.reserve-detail-head>span{align-self:flex-start}}

/* v1.14 · usuarios, evidencia fotográfica y GPS de técnicos */
.location-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.location-actions .btn{width:100%}
.evidence-card,.history-card{margin:12px 0;border:1px solid var(--border);border-radius:13px;background:#fff;padding:12px;min-width:0}.evidence-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}.photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.photo-card{position:relative;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:#fafbfb;min-width:0}.photo-card>a{display:block;aspect-ratio:4/3;background:#e9edef}.photo-card img{width:100%;height:100%;object-fit:cover;display:block}.photo-meta{padding:7px}.photo-meta strong,.photo-meta span{display:block}.photo-meta strong{font-size:10px}.photo-meta span{font-size:9px;color:var(--muted);margin-top:2px}.photo-meta p{font-size:9px;margin:5px 0 0;line-height:1.3}.photo-delete{position:absolute;right:5px;top:5px;background:rgba(255,255,255,.92)!important;width:28px;height:28px}.photo-upload-form{margin-top:10px;border-top:1px solid var(--border);padding-top:10px;display:grid;gap:8px}.photo-upload-form label{font-size:10px;font-weight:800;text-transform:uppercase;color:#596469;display:grid;gap:4px}.photo-upload-form input,.photo-upload-form select{font-size:12px;text-transform:none}.photo-location-actions{display:flex;gap:5px;flex-wrap:wrap}.history-list{margin-top:8px;display:grid;gap:8px}.history-row{display:grid;grid-template-columns:12px 1fr;gap:7px}.history-dot{width:8px;height:8px;border-radius:50%;background:#008243;margin-top:4px}.history-row strong,.history-row span{display:block}.history-row strong{font-size:10px}.history-row span{font-size:9px;color:var(--muted);margin-top:2px}.history-row p{font-size:9px;margin:3px 0 0;color:#536167}.user-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,380px);gap:16px;align-items:start}.user-form{position:sticky;top:80px}.check-row{display:flex!important;align-items:center;gap:8px!important;text-transform:none!important;font-size:12px!important}.check-row input{width:auto}.small-text{font-size:10px}
body[data-role="tecnico"] .admin-supervisor-only{display:none!important}
@media(max-width:900px){.user-layout{grid-template-columns:1fr}.user-form{position:static}.photo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.location-actions{grid-template-columns:1fr}.photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.evidence-head{flex-direction:column}.photo-location-actions{display:grid;grid-template-columns:1fr}.user-layout .table-wrap{overflow:auto}}


/* v1.16.0 · mapa más legible, panel lateral ocultable y estado en vivo */
.map-layout{grid-template-columns:1fr!important;position:relative;overflow:hidden}
.map-canvas{grid-column:1/-1;width:100%;height:100%}
.side-panel{position:absolute!important;right:0;top:0;bottom:0;width:clamp(360px,31vw,480px);max-width:94%;z-index:13;border-left:1px solid var(--border);border-top:0!important;background:#fff;box-shadow:-8px 0 24px rgba(20,35,42,.12);transform:translateX(101%);transition:transform .24s ease;visibility:hidden;overflow:auto!important}
.map-layout.panel-open .side-panel{transform:translateX(0);visibility:visible}
.map-panel-toggle{position:absolute;right:12px;top:12px;z-index:14;border:1px solid var(--border);background:rgba(255,255,255,.96);color:#243238;padding:8px 11px;border-radius:9px;font-weight:800;font-size:12px;box-shadow:0 2px 9px rgba(20,35,42,.15);cursor:pointer}
.map-layout.panel-open .map-panel-toggle{right:min(calc(clamp(360px,31vw,480px) + 12px),calc(94% + 12px))}
.live-status{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:12px;font-weight:800;color:#237346;background:#edf8f2;border:1px solid #d5ecdf;border-radius:999px;padding:7px 10px}.live-status i{width:8px;height:8px;border-radius:50%;background:#17a55b;box-shadow:0 0 0 3px rgba(23,165,91,.12)}.live-status.live-flash{background:#ddf5e7}.live-status.offline{color:#8b5a12;background:#fff6df;border-color:#eed49b}.live-status.offline i{background:#d9992d}
.asset-map-label{max-width:210px;padding:4px 7px;line-height:1.18}
.asset-map-label strong{font-size:12px!important}.asset-map-label span{font-size:12px!important;max-width:195px}
.asset-marker-wrap.type-poste .asset-map-label strong{font-size:12px!important}.asset-marker-wrap.type-poste .asset-map-label span{display:none}
.asset-map-reserve,.asset-marker-wrap.type-poste .asset-map-reserve{font-size:11px!important}
.cable-overlay-label{font:800 12px Inter,Segoe UI,Arial,sans-serif!important}.cable-name-label{font-size:12px!important}.segment-meter-label text{font:800 12px Inter,Segoe UI,Arial,sans-serif!important}
.latest-created .asset-map-label{border:2px solid rgba(0,130,67,.55);box-shadow:0 2px 10px rgba(0,130,67,.18)}
.latest-created .asset-map-label:after{content:'último';display:inline-block;margin-top:3px;font-size:9px;line-height:1;background:#008243;color:#fff;border-radius:999px;padding:2px 5px;text-transform:uppercase;letter-spacing:.04em}
@media(max-width:760px){.side-panel{position:absolute!important;left:0;right:0;top:0;bottom:0;width:100%;max-width:100%;height:100%;z-index:15}.map-layout.panel-open .map-panel-toggle{right:12px;z-index:16}.map-panel-toggle{top:10px}.asset-map-label strong,.asset-map-label span,.asset-marker-wrap.type-poste .asset-map-label strong{font-size:12px!important}.segment-meter-label text{font-size:12px!important}.live-status{padding:6px 8px}}
@media(prefers-reduced-motion:reduce){.side-panel{transition:none}}


/* v1.16.1 · etiquetas separadas + editor de fibras sin scroll horizontal */
.cable-name-label{dominant-baseline:middle}
.segment-meter-label text{dominant-baseline:middle}

/* El editor de fibras deja de ser una tabla horizontal. Cada fibra se muestra
   como una ficha completa y el botón Guardar siempre permanece visible. */
.fiber-table-wrap{overflow-x:hidden!important;overflow-y:visible!important;border:0!important;border-radius:0!important;max-width:100%!important}
.fiber-table{display:block!important;width:100%!important;min-width:0!important;table-layout:auto!important}
.fiber-table thead{display:none!important}
.fiber-table tbody{display:grid!important;gap:10px!important;width:100%!important}
.fiber-table tr{display:grid!important;grid-template-columns:minmax(82px,.55fr) minmax(105px,.7fr) minmax(105px,.7fr) minmax(145px,.9fr);gap:8px 10px!important;align-items:end!important;width:100%!important;padding:12px!important;border:1px solid var(--border)!important;border-radius:12px!important;background:#fff!important;box-sizing:border-box!important}
.fiber-table td{display:flex!important;flex-direction:column!important;justify-content:flex-end!important;gap:5px!important;min-width:0!important;padding:0!important;border:0!important;white-space:normal!important;overflow:visible!important}
.fiber-table td::before{font-size:10px;line-height:1.1;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.025em}
.fiber-table td:nth-child(1)::before{content:'Fibra'}
.fiber-table td:nth-child(2)::before{content:'Grupo / tubo'}
.fiber-table td:nth-child(3)::before{content:'Color'}
.fiber-table td:nth-child(4)::before{content:'Estado'}
.fiber-table td:nth-child(5)::before{content:'Acción en este punto'}
.fiber-table td:nth-child(6)::before{content:'Destino / continuidad'}
.fiber-table td:nth-child(7)::before{content:'Nota'}
.fiber-table td:nth-child(8)::before{content:'Guardar'}
.fiber-table td:nth-child(5),.fiber-table td:nth-child(6){grid-column:span 2}
.fiber-table td:nth-child(7){grid-column:span 3}
.fiber-table td:nth-child(8){grid-column:span 1}
.fiber-table select,.fiber-table input,.fiber-table button{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
.fiber-table .fiber-destination{min-width:0!important;width:100%!important}
.fiber-table .splice-selects{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;width:100%!important}
.fiber-table .fiber-target-label{width:100%!important;box-sizing:border-box!important;white-space:normal!important;overflow-wrap:anywhere!important}
.fiber-table .btn{min-height:42px!important}
.fiber-table .fiber-source{white-space:normal!important;overflow-wrap:anywhere!important}
.fiber-table tr.fiber-blocked{grid-template-columns:minmax(82px,.6fr) minmax(105px,.8fr) minmax(105px,.8fr) minmax(120px,.8fr) minmax(0,2.6fr)!important;align-items:center!important}
.fiber-table tr.fiber-blocked td:nth-child(5){grid-column:auto!important}
.fiber-table tr.fiber-blocked td:nth-child(n+6){display:none!important}

@media(max-width:1050px){
  .fiber-table tr{grid-template-columns:minmax(90px,1fr) minmax(110px,1fr)!important}
  .fiber-table td:nth-child(n){grid-column:auto!important}
  .fiber-table td:nth-child(5),.fiber-table td:nth-child(6),.fiber-table td:nth-child(7),.fiber-table td:nth-child(8){grid-column:span 2!important}
  .fiber-table tr.fiber-blocked{grid-template-columns:1fr 1fr!important}
  .fiber-table tr.fiber-blocked td:nth-child(5){grid-column:1/-1!important}
}
@media(max-width:620px){
  .fiber-table tr{grid-template-columns:1fr!important}
  .fiber-table td:nth-child(n){grid-column:1!important}
  .fiber-table .splice-selects{grid-template-columns:1fr!important}
  .fiber-table tr.fiber-blocked{grid-template-columns:1fr!important}
  .fiber-table tr.fiber-blocked td:nth-child(5){grid-column:1!important}
}


/* v1.16.2 · adaptación móvil de altura real + leyenda plegable */
.legend-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.legend-head .legend-title{margin:0}.legend-toggle{border:1px solid var(--border);background:#fff;color:#334247;border-radius:8px;padding:5px 8px;font-size:10px;font-weight:800;cursor:pointer}.network-map-legend.legend-collapsed{width:auto!important;min-width:116px;padding:7px 8px}.network-map-legend.legend-collapsed .legend-grid,.network-map-legend.legend-collapsed .legend-lines{display:none!important}

@media(max-width:760px){
  html,body{min-height:100%;overscroll-behavior-y:none}
  .topbar{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;gap:6px 10px!important;padding:7px 10px!important}
  .brand{grid-column:1;min-width:0!important;gap:8px!important}.brand-mark.small{width:42px!important;height:42px!important;border-radius:12px!important;font-size:20px!important}.brand strong{font-size:16px;white-space:nowrap}.brand small{font-size:10px}
  .top-actions{grid-column:2;grid-row:1;margin:0!important;align-self:center}.top-actions .btn{padding:8px 11px!important}
  .tabs{grid-column:1/-1!important;grid-row:2!important;order:initial!important;width:100%!important;gap:2px!important;overflow-x:auto!important;scrollbar-width:none!important;padding-bottom:1px}.tabs::-webkit-scrollbar{display:none}.tab{padding:8px 10px!important;font-size:13px!important;white-space:nowrap!important;flex:0 0 auto}
  #mapView>.toolbar{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:7px!important;padding:8px 10px!important;align-items:stretch!important}
  #mapView>.toolbar .searchbox{grid-column:1/-1!important;width:100%!important;min-width:0!important;max-width:none!important}.searchbox input{min-width:0!important;padding:9px 10px!important}.searchbox .btn{padding:8px 11px!important}
  #mapView>.toolbar select{width:100%!important;min-width:0!important;max-width:none!important;padding:9px 8px!important;font-size:13px!important}
  #newAssetBtn{width:100%!important;min-width:0!important;max-width:none!important;padding:9px 10px!important;font-size:13px!important}
  .live-status{width:100%!important;justify-content:center!important;min-width:0!important;padding:8px!important;font-size:12px!important}
  #mapView{min-height:0!important;overflow:hidden!important}
  #mapView .map-layout{height:var(--cms-map-mobile-height,420px)!important;min-height:300px!important;max-height:none!important;overflow:hidden!important}
  #mapView .map-canvas{height:100%!important;min-height:0!important;max-height:none!important}
  .network-map-legend{left:9px!important;bottom:10px!important;max-width:calc(100% - 18px)!important;font-size:10px!important}
  .network-map-legend.legend-collapsed{bottom:10px!important}
  .map-panel-toggle{top:10px!important;right:10px!important;padding:7px 9px!important}
}
@media(max-width:430px){
  .brand strong{font-size:15px}.brand-mark.small{width:38px!important;height:38px!important}.top-actions .btn{font-size:12px!important}
  #mapView>.toolbar{gap:6px!important;padding:7px 8px!important}.tab{padding:7px 9px!important}
  .legend-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}


/* v1.17.0 · tema claro / oscuro / automático */
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0f1518;--card:#151d21;--text:#e8eef0;--muted:#a5b0b5;--border:#2b3940;
  --danger:#ff8c8c;--shadow:0 8px 28px rgba(0,0,0,.35);
}
html[data-theme="dark"] body{background:var(--bg);color:var(--text)}
html[data-theme="dark"] .topbar,
html[data-theme="dark"] .toolbar,
html[data-theme="dark"] .side-panel,
html[data-theme="dark"] .settings-card,
html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] .cable-list-card,
html[data-theme="dark"] .fiber-main,
html[data-theme="dark"] .cable-route-card,
html[data-theme="dark"] .fiber-usage-card,
html[data-theme="dark"] .login-card{background:#151d21;border-color:var(--border);color:var(--text)}
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .btn{background:#10171b;border-color:#33434a;color:var(--text)}
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder{color:#738188}
html[data-theme="dark"] .btn:hover{background:#1b272c}
html[data-theme="dark"] .btn.primary{background:var(--green);border-color:var(--green);color:#fff}
html[data-theme="dark"] .btn.primary:hover{background:var(--green2)}
html[data-theme="dark"] .btn.ghost{background:transparent}
html[data-theme="dark"] .tab{color:#aab5ba}
html[data-theme="dark"] .tab.active{background:#173126;color:#5fd093}
html[data-theme="dark"] th{background:#182227;color:#aeb9be}
html[data-theme="dark"] td,html[data-theme="dark"] th{border-color:var(--border)}
html[data-theme="dark"] .coords,
html[data-theme="dark"] .summary-badge,
html[data-theme="dark"] .route-order,
html[data-theme="dark"] .fiber-state,
html[data-theme="dark"] .icon-btn{background:#1b252a;color:var(--text)}
html[data-theme="dark"] .conditional-card,
html[data-theme="dark"] .splitter-card,
html[data-theme="dark"] .olt-card,
html[data-theme="dark"] .route-only-note,
html[data-theme="dark"] .route-editor-row,
html[data-theme="dark"] .fiber-table tr,
html[data-theme="dark"] .mufa-splitter-port,
html[data-theme="dark"] .olt-port-row,
html[data-theme="dark"] .cable-item{background:#151d21;border-color:var(--border);color:var(--text)}
html[data-theme="dark"] .cable-item:hover,html[data-theme="dark"] .cable-item.active,
html[data-theme="dark"] .route-editor-row.active{background:#183026}
html[data-theme="dark"] .route-editor-row.route-guide,html[data-theme="dark"] .route-node.route-guide{background:#12191d;color:#b0bbc0}
html[data-theme="dark"] .fiber-help,
html[data-theme="dark"] .callout,
html[data-theme="dark"] .splitter-input,
html[data-theme="dark"] .live-status{background:#173126;border-color:#27533e;color:#75d9a4}
html[data-theme="dark"] .live-status.offline{background:#2a2315;border-color:#57451f;color:#e6c66e}
html[data-theme="dark"] .fiber-target-label{background:#182227;border-color:var(--border);color:var(--text)}
html[data-theme="dark"] .fiber-blocked{background:#12191d!important}
html[data-theme="dark"] .olt-port-row.asignado,html[data-theme="dark"] .mufa-splitter-port.asignado,html[data-theme="dark"] .splitter-port.ocupado{background:#173126;border-color:#28553f}
html[data-theme="dark"] .olt-port-row.reservado,html[data-theme="dark"] .mufa-splitter-port.reservado,html[data-theme="dark"] .splitter-port.reservado{background:#2a2517;border-color:#5a4b24}
html[data-theme="dark"] .olt-port-row.averiado,html[data-theme="dark"] .mufa-splitter-port.averiado,html[data-theme="dark"] .splitter-port.averiado{background:#2b191b;border-color:#633238}
html[data-theme="dark"] .asset-form label,html[data-theme="dark"] .settings-card label,
html[data-theme="dark"] .spl-field,html[data-theme="dark"] .olt-port-grid label,
html[data-theme="dark"] .route-reserve-inline,html[data-theme="dark"] .route-insert-panel label{color:#aab5ba}
html[data-theme="dark"] .map-panel-toggle{background:rgba(18,25,29,.96);color:#e8eef0;border-color:#37464d}
html[data-theme="dark"] .network-map-legend{background:rgba(18,25,29,.96);border-color:#34434a;color:#e6edef}
html[data-theme="dark"] .legend-toggle{background:#11181c;color:#e5ecef;border-color:#34434a}
html[data-theme="dark"] .asset-map-label,html[data-theme="dark"] .asset-marker-wrap.type-poste .asset-map-label{background:rgba(17,24,28,.94);border-color:rgba(218,231,236,.18);box-shadow:0 2px 8px rgba(0,0,0,.34)}
html[data-theme="dark"] .asset-map-label strong{color:#f0f5f7}
html[data-theme="dark"] .asset-map-label span{color:#b3bec3}
html[data-theme="dark"] .segment-meter-label rect{fill:rgba(17,24,28,.95);stroke:rgba(220,232,236,.24)}
html[data-theme="dark"] .segment-meter-label text{fill:#f0f5f7;stroke:#11181c}
html[data-theme="dark"] .cable-overlay-label,html[data-theme="dark"] .cable-name-label{fill:#f0f5f7!important;stroke:#11181c!important}
html[data-theme="dark"] .cable-overlay-outline{stroke:#0d1316}
html[data-theme="dark"] .login-body{background:linear-gradient(145deg,#0c1215,#131c20)}
html[data-theme="dark"] .map-empty{color:#b0bbc0}
html[data-theme="dark"] .map-provider-badge{background:#173126;border-color:#27533e;color:#8bdcaf}
html[data-theme="dark"] .photo-card,html[data-theme="dark"] .audit-card,html[data-theme="dark"] .reserve-card{background:#151d21;border-color:var(--border)}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:86px}.theme-icon{font-size:16px;line-height:1}.theme-label{font-size:12px}
.login-theme-toggle{position:fixed;right:14px;top:14px;z-index:10;border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:10px;padding:8px 11px;font-weight:700;cursor:pointer;box-shadow:var(--shadow)}
@media(max-width:760px){.theme-toggle{min-width:42px!important;padding:8px!important}.theme-toggle .theme-label{display:none}.theme-toggle .theme-icon{font-size:18px}.top-actions{gap:5px!important}}


/* v1.17.2 · panel lateral ancho + puertos PON sin recortes */
@media(min-width:761px){
  .side-panel{
    width:clamp(540px,42vw,720px)!important;
    max-width:96%!important;
  }
  .map-layout.panel-open .map-panel-toggle{
    right:min(calc(clamp(540px,42vw,720px) + 12px),calc(96% + 12px))!important;
  }
}

/* La configuración PON prioriza lectura completa de cable/fibra. */
.olt-card{min-width:0!important;overflow:visible!important}
.olt-port-list{min-width:0!important}
.olt-port-row{min-width:0!important;overflow:visible!important}
.olt-port-grid{
  display:grid!important;
  grid-template-columns:minmax(105px,.55fr) minmax(190px,1.05fr) minmax(230px,1.25fr)!important;
  gap:9px 10px!important;
  align-items:end!important;
  min-width:0!important;
}
.olt-port-grid label{min-width:0!important;margin:0!important}
.olt-port-grid label:nth-child(4){grid-column:1/-1!important}
.olt-port-grid select,.olt-port-grid input{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
.olt-port-grid select{font-size:12px!important}
.olt-port-grid input{font-size:12px!important}
.olt-port-actions{margin-top:9px!important}
.olt-port-actions .btn{min-width:142px!important}
.olt-port-head span{max-width:72%;white-space:normal!important;text-align:right;overflow-wrap:anywhere!important}

/* En paneles medianos dejamos Cable y Fibra con una fila propia. */
@media(min-width:761px) and (max-width:1180px){
  .side-panel{width:min(620px,58vw)!important}
  .map-layout.panel-open .map-panel-toggle{right:min(calc(min(620px,58vw) + 12px),calc(96% + 12px))!important}
  .olt-port-grid{grid-template-columns:minmax(105px,.55fr) minmax(0,1fr)!important}
  .olt-port-grid label:nth-child(3){grid-column:1/-1!important}
  .olt-port-grid label:nth-child(4){grid-column:1/-1!important}
}

/* En móvil cada campo ocupa todo el ancho y nunca genera desplazamiento lateral. */
@media(max-width:760px){
  .olt-port-grid{grid-template-columns:1fr!important}
  .olt-port-grid label:nth-child(n){grid-column:1!important}
  .olt-port-actions{display:grid!important;grid-template-columns:1fr!important}
  .olt-port-actions .btn{width:100%!important;min-width:0!important}
  .olt-port-head span{max-width:65%;white-space:normal!important}
}


/* v1.17.3 · Selector móvil de fibras para listas largas (hasta 288 hilos) */
body.fiber-picker-open{overflow:hidden!important;touch-action:none}
.mobile-fiber-picker{position:fixed;inset:0;z-index:10050;display:flex;align-items:flex-end;justify-content:center}
.mobile-fiber-picker-backdrop{position:absolute;inset:0;background:rgba(13,22,28,.52);backdrop-filter:blur(1px)}
.mobile-fiber-sheet{position:relative;z-index:1;width:min(100%,720px);max-height:min(82dvh,760px);background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:18px 18px 0 0;box-shadow:0 -18px 45px rgba(0,0,0,.2);display:grid;grid-template-rows:auto auto minmax(0,1fr);overflow:hidden}
.mobile-fiber-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 14px 10px;border-bottom:1px solid var(--border)}
.mobile-fiber-sheet-head>div{display:grid;gap:3px;min-width:0}.mobile-fiber-sheet-head strong{font-size:16px}.mobile-fiber-sheet-head span{font-size:11px;color:var(--muted)}
.mobile-fiber-close{flex:none}
.mobile-fiber-search-wrap{padding:10px 12px;border-bottom:1px solid var(--border);background:var(--card)}
.mobile-fiber-search-wrap input{font-size:16px!important;min-height:44px!important}
.mobile-fiber-list{overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;padding:8px 10px max(18px,env(safe-area-inset-bottom));scrollbar-gutter:stable}
.mobile-fiber-option{width:100%;min-height:54px;border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:11px;margin:0 0 7px;padding:8px 10px;display:grid;grid-template-columns:64px 20px minmax(0,1fr);align-items:center;gap:9px;text-align:left;font:inherit;cursor:pointer}
.mobile-fiber-option.selected{border-color:var(--green);background:#edf7f2;box-shadow:0 0 0 2px rgba(0,130,67,.08)}
.mobile-fiber-option.empty-option{grid-template-columns:1fr;color:var(--muted)}
.mobile-fiber-number{font-weight:800;font-variant-numeric:tabular-nums;font-size:14px}.mobile-fiber-swatch{width:18px;height:18px;border-radius:50%;border:1px solid rgba(0,0,0,.24)}
.mobile-fiber-main{display:grid;gap:2px;min-width:0}.mobile-fiber-main strong{font-size:14px}.mobile-fiber-main small{font-size:11px;color:var(--muted);white-space:normal}
.mobile-fiber-empty{padding:28px 12px;text-align:center;color:var(--muted)}
html[data-theme="dark"] .mobile-fiber-option.selected{background:#173126;border-color:#2e8b57}
@media(min-width:821px) and (pointer:fine){.mobile-fiber-picker{align-items:center;padding:24px}.mobile-fiber-sheet{border-radius:18px;max-height:min(78vh,760px)}}
@supports not (height:1dvh){.mobile-fiber-sheet{max-height:82vh}}


/* v1.17.4 · scroll móvil robusto fuera del mapa */
@media(max-width:760px){
  html,body{
    height:auto!important;
    min-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:auto!important;
    touch-action:pan-y!important;
    -webkit-overflow-scrolling:touch;
  }
  main{height:auto!important;min-height:0!important;overflow:visible!important;touch-action:pan-y!important}
  .view{height:auto!important;max-height:none!important;overflow:visible!important;touch-action:pan-y!important}
  #fiberView.active-view,#settingsView.active-view,#listView.active-view,#usersView.active-view,#nocView.active-view{
    display:block!important;
    height:auto!important;
    min-height:calc(100dvh - 96px)!important;
    max-height:none!important;
    overflow:visible!important;
    position:relative!important;
    touch-action:pan-y!important;
  }
  #fiberView .section-head,#settingsView .settings-card,#listView .table-wrap,#usersView .user-layout{
    touch-action:pan-y!important;
  }
  #fiberView .fiber-layout{
    display:grid!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    align-items:start!important;
  }
  #fiberView .fiber-main{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    touch-action:pan-y!important;
  }
  #fiberView .cable-form,#fiberView #cableDetail,#fiberView .fiber-table-wrap{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    touch-action:pan-y!important;
  }
  #settingsView .settings-card{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    margin-bottom:calc(28px + env(safe-area-inset-bottom))!important;
  }
  #settingsView form,#fiberView form{overflow:visible!important;touch-action:pan-y!important}
  /* El listado de cables puede tener su propio scroll corto, pero nunca bloquea el de la página. */
  #fiberView .cable-list{max-height:260px!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain auto!important;touch-action:pan-y!important;-webkit-overflow-scrolling:touch}
  /* Solo el mapa conserva viewport controlado. */
  #mapView.active-view{overflow:hidden!important;touch-action:auto!important}
}
@supports not (height:100dvh){
  @media(max-width:760px){
    #fiberView.active-view,#settingsView.active-view,#listView.active-view,#usersView.active-view,#nocView.active-view{min-height:calc(100vh - 96px)!important}
  }
}

/* v1.18 - Nodos / planta interna */
.asset-marker-wrap.type-nodo .asset-marker{width:50px;height:50px;border-width:3px;background:var(--card,#fff)}
.asset-marker-wrap.type-nodo .asset-marker svg{width:29px;height:29px}
.legend-symbol.type-nodo{color:#008243}
.node-summary-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;margin:14px 0;border:1px solid var(--border,#dfe5e8);border-radius:14px;background:var(--card,#fff)}
.node-plant-modal{position:fixed;inset:0;z-index:5000;display:flex;align-items:stretch;justify-content:center;padding:18px}
.node-plant-modal.hidden{display:none}
.node-plant-backdrop{position:absolute;inset:0;background:rgba(8,18,22,.62);backdrop-filter:blur(2px)}
.node-plant-shell{position:relative;z-index:1;width:min(1280px,100%);max-height:calc(100vh - 36px);overflow:auto;background:var(--card,#fff);color:var(--text,#172126);border:1px solid var(--border,#d9e1e5);border-radius:18px;box-shadow:0 24px 80px rgba(0,0,0,.28)}
.node-plant-head{position:sticky;top:0;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;border-bottom:1px solid var(--border,#d9e1e5);background:var(--card,#fff)}
.node-plant-head small{display:block;color:var(--muted,#66747d);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.node-plant-head h2{margin:3px 0 0;font-size:22px}
.node-plant-content{padding:18px}
.plant-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.plant-diagram-scroll{overflow-x:auto;border:1px solid var(--border,#d9e1e5);border-radius:15px;background:var(--card,#fff);margin-bottom:16px}
.plant-diagram{display:block;width:100%;min-width:780px;height:auto}
.plant-links path{fill:none;stroke:#65727a;stroke-width:3}
.plant-link-label{font-size:11px;fill:var(--muted,#66747d);text-anchor:middle;paint-order:stroke;stroke:var(--card,#fff);stroke-width:4px;stroke-linejoin:round}
.plant-node{cursor:pointer}
.plant-node rect{fill:var(--card,#fff);stroke:#008243;stroke-width:2}
.plant-node:hover rect{stroke-width:4}
.plant-node-code{font-size:13px;font-weight:800;text-anchor:middle;fill:var(--text,#172126)}
.plant-node-meta{font-size:11px;text-anchor:middle;fill:var(--muted,#66747d)}
.plant-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:16px;align-items:start}
.plant-grid>section,.outbound-section{border:1px solid var(--border,#d9e1e5);border-radius:15px;padding:14px;background:var(--card,#fff)}
.plant-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.rack-card{border:1px solid var(--border,#d9e1e5);border-radius:12px;padding:12px;margin-bottom:10px}
.rack-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}
.rack-title span{display:block;color:var(--muted,#66747d);font-size:12px;margin-top:2px}
.rack-equipment{display:flex;flex-wrap:wrap;gap:8px}
.rack-equipment button{display:flex;align-items:center;gap:7px;padding:8px 10px;border:1px solid var(--border,#d9e1e5);border-radius:10px;background:var(--card,#fff);color:inherit;cursor:pointer}
.rack-equipment svg{width:22px;height:22px}
.rack-equipment small{display:block;color:var(--muted,#66747d)}
.inline-plant-form{display:grid;grid-template-columns:1fr 90px auto;gap:8px;margin-top:12px}
.internal-link-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 0;border-bottom:1px solid var(--border,#d9e1e5)}
.internal-link-row>div{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.internal-link-row small{color:var(--muted,#66747d)}
.internal-link-form{display:grid;grid-template-columns:1.2fr .8fr 1.2fr .8fr .8fr auto;gap:8px;align-items:end;margin-top:12px}
.internal-link-form label{min-width:0}.internal-link-form select{width:100%}
.mini-danger{border:0;background:transparent;color:#c62828;cursor:pointer;padding:5px}
.outbound-section{margin-top:16px}.outbound-cable{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--border,#d9e1e5)}.outbound-cable span{color:var(--muted,#66747d)}
.plant-empty,.plant-loading{padding:48px 20px;text-align:center;color:var(--muted,#66747d)}
body.modal-open{overflow:hidden}
@media(max-width:850px){
  .node-plant-modal{padding:0}.node-plant-shell{max-height:100%;height:100%;border-radius:0;border:0}
  .node-plant-content{padding:12px}.plant-toolbar{align-items:flex-start;flex-direction:column}.plant-toolbar .btn{width:100%}
  .plant-grid{grid-template-columns:1fr}.internal-link-form{grid-template-columns:1fr 1fr}.internal-link-form .btn{grid-column:1/-1}
  .inline-plant-form{grid-template-columns:1fr 80px}.inline-plant-form .btn{grid-column:1/-1}
  .node-summary-card{align-items:stretch;flex-direction:column}.node-summary-card .btn{width:100%}
}

/* v1.18.1 - ocupación exclusiva de puertos de planta interna */
.internal-link-row.port-conflict{border-color:#dc2626;background:color-mix(in srgb,#dc2626 8%,var(--surface,#fff));}
.port-conflict-badge{display:inline-flex;margin-left:8px;padding:3px 7px;border-radius:999px;background:#dc2626;color:#fff;font-size:11px;font-weight:800;letter-spacing:.02em;}
.port-availability-hint{display:block;margin-top:5px;font-size:11px;color:var(--muted,#64748b);font-weight:700;}
.internal-link-form option:disabled{color:#b91c1c;}

/* v1.18.3 - planta interna y ODF coherentes */
.internal-link-builder{display:grid!important;grid-template-columns:minmax(260px,1fr) 150px minmax(260px,1fr);gap:14px!important;align-items:stretch!important;margin-top:14px;padding:14px;border:1px solid var(--border,#d9e1e5);border-radius:16px;background:color-mix(in srgb,var(--card,#fff) 94%,var(--accent,#008243) 6%)}
.internal-endpoint-card{position:relative;display:grid;gap:10px;padding:14px;border:1px solid var(--border,#d9e1e5);border-radius:14px;background:var(--card,#fff);min-width:0}
.internal-endpoint-card label{display:grid;gap:5px;font-size:11px;font-weight:800;text-transform:uppercase;color:var(--muted,#66747d)}
.internal-endpoint-card select{width:100%;min-width:0;text-transform:none}
.endpoint-step{position:absolute;top:10px;right:10px;width:28px;height:28px;border-radius:999px;display:grid;place-items:center;background:var(--accent-bg,#eaf7f0);color:var(--accent,#008243);font-weight:900}
.endpoint-title{font-size:16px;font-weight:900;padding-right:36px}
.internal-link-middle{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:12px;text-align:center}
.internal-link-middle label{display:grid;gap:5px;font-size:10px;font-weight:800;text-transform:uppercase;color:var(--muted,#66747d)}
.internal-arrow{font-size:32px;line-height:1;color:var(--accent,#008243);font-weight:900}
.internal-connect-btn{grid-column:1/-1;justify-self:end;min-width:180px}

.olt-port-row.internal-linked{border-color:color-mix(in srgb,var(--accent,#008243) 40%,var(--border,#d9e1e5));background:color-mix(in srgb,var(--accent-bg,#eaf7f0) 55%,var(--card,#fff))}
.olt-internal-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.olt-internal-summary>div{padding:10px;border:1px solid var(--border,#d9e1e5);border-radius:11px;background:var(--card,#fff);min-width:0}
.olt-internal-summary small{display:block;font-size:9px;font-weight:900;color:var(--muted,#66747d);letter-spacing:.05em;margin-bottom:4px}
.olt-internal-summary strong{font-size:12px;overflow-wrap:anywhere}
.olt-node-note{margin-top:9px;font-size:11px;color:var(--muted,#66747d);line-height:1.4}

.odf-card{margin-top:14px;padding:14px;border:1px solid var(--border,#d9e1e5);border-radius:15px;background:var(--card,#fff)}
.odf-port-list{display:grid;gap:10px;margin-top:12px}
.odf-port-row{padding:12px;border:1px solid var(--border,#d9e1e5);border-radius:13px;background:color-mix(in srgb,var(--card,#fff) 94%,var(--accent,#008243) 6%)}
.odf-port-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.odf-port-head>div:first-child{display:flex;align-items:center;gap:9px}.odf-port-head strong{font-size:15px}.odf-port-head span{font-size:10px;font-weight:900;color:var(--accent,#008243)}
.odf-source{font-size:11px;font-weight:800;color:var(--muted,#66747d)}
.odf-port-grid{display:grid;grid-template-columns:minmax(180px,1.2fr) minmax(200px,1.3fr);gap:9px;min-width:0}
.odf-port-grid label{display:grid;gap:4px;min-width:0;font-size:10px;font-weight:800;text-transform:uppercase;color:var(--muted,#66747d)}
.odf-port-grid label:nth-child(3){grid-column:1/-1}
.odf-port-grid select,.odf-port-grid input{width:100%;min-width:0;text-transform:none}
.odf-port-actions{display:flex;justify-content:flex-end;margin-top:10px}
.odf-empty{margin-top:10px;padding:12px;border-radius:11px;background:var(--panel,#f6f8f9);font-size:12px;color:var(--muted,#66747d);line-height:1.5}

@media(max-width:900px){
  .internal-link-builder{grid-template-columns:1fr!important}
  .internal-link-middle{display:grid;grid-template-columns:auto 1fr;align-items:center;text-align:left}
  .internal-arrow{transform:rotate(90deg);font-size:26px}
  .internal-connect-btn{grid-column:1;justify-self:stretch;width:100%}
}
@media(max-width:650px){
  .olt-internal-summary,.odf-port-grid{grid-template-columns:1fr}
  .odf-port-grid label:nth-child(3){grid-column:1}
  .odf-port-actions .btn{width:100%}
}
/* v1.18.4 - disponibilidad visual de fibras */
select option:disabled{color:#c62828!important;font-weight:700}
.mobile-fiber-option.occupied{border-color:#ef9a9a;background:#fff4f4;color:#b71c1c;opacity:.92;cursor:not-allowed}
.mobile-fiber-option.occupied .mobile-fiber-main small{color:#c62828;font-weight:800}
html[data-theme="dark"] .mobile-fiber-option.occupied{background:#351919;border-color:#7f3434;color:#ffb3b3}
html[data-theme="dark"] .mobile-fiber-option.occupied .mobile-fiber-main small{color:#ff8a80}

/* v1.19.0 - NOC de solo lectura */
#nocView{padding-bottom:32px}
.noc-head{gap:18px;align-items:flex-start}
.noc-head-actions{display:flex;gap:10px;align-items:center;min-width:min(520px,100%)}
.noc-head-actions select{min-width:260px}
.noc-summary{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:12px;margin:0 28px 16px}
.noc-kpi{padding:16px;border:1px solid var(--border);border-radius:14px;background:var(--card);display:flex;align-items:center;justify-content:space-between;gap:12px}
.noc-kpi span{color:var(--muted);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.noc-kpi strong{font-size:26px}
.noc-kpi.up{border-color:color-mix(in srgb,#16a34a 35%,var(--border));background:color-mix(in srgb,#16a34a 7%,var(--card))}.noc-kpi.up strong{color:#16a34a}
.noc-kpi.down{border-color:color-mix(in srgb,#dc2626 35%,var(--border));background:color-mix(in srgb,#dc2626 7%,var(--card))}.noc-kpi.down strong{color:#dc2626}
.noc-kpi.unknown strong{color:#64748b}
.noc-content{margin:0 28px 28px}.noc-node-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}.noc-node-head h2{margin:0 0 4px}.noc-node-head p{margin:0;color:var(--muted)}
.noc-device-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px;margin-top:16px}.plant-device-grid{margin-bottom:16px}
.noc-device-card{border:1px solid var(--border);border-top:4px solid var(--noc-state,#64748b);border-radius:14px;background:var(--card);overflow:hidden;cursor:pointer}.noc-device-card>header{padding:12px 13px;display:flex;align-items:flex-start;justify-content:space-between;gap:10px;border-bottom:1px solid var(--border)}
.noc-device-card>header>div{display:flex;gap:9px;align-items:center;min-width:0}.noc-device-card header svg{width:28px;height:28px;flex:none}.noc-device-card header b{display:block}.noc-device-card header span:not(.noc-device-state){display:block;color:var(--muted);font-size:11px;margin-top:2px;overflow-wrap:anywhere}.noc-device-state{font-size:10px;font-weight:900;color:var(--noc-state,#64748b);white-space:nowrap}
.noc-device-meta{display:flex;flex-wrap:wrap;gap:8px 16px;padding:9px 13px;background:var(--panel,#f7f9fa);font-size:11px;color:var(--muted)}
.noc-port-list{display:grid}.noc-port{display:grid;grid-template-columns:58px 12px minmax(0,1fr);gap:7px;align-items:center;padding:8px 13px;border-top:1px solid var(--border);font-size:11px}.noc-port:first-child{border-top:0}.noc-port-code{font-weight:900}.noc-link-dot{width:9px;height:9px;border-radius:50%}.noc-port strong{min-width:0;overflow-wrap:anywhere}.noc-port small{grid-column:3;color:var(--muted);font-size:10px}.noc-port-free{grid-column:2/4;color:var(--muted);font-weight:700}
.plant-link-status{fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.plant-node-status{font-size:9px;text-anchor:middle;font-weight:800}.plant-node rect{transition:stroke-width .15s}.plant-node:hover rect{stroke-width:4}

/* iconos de equipos NOC dentro de planta interna */
.rack-equipment button span{min-width:0}.rack-equipment button b{overflow-wrap:anywhere}

@media(max-width:900px){
  .noc-head{flex-direction:column}.noc-head-actions{width:100%;min-width:0}.noc-head-actions select,.noc-head-actions .btn{flex:1;min-width:0}.noc-summary{grid-template-columns:1fr 1fr;margin:0 12px 14px}.noc-content{margin:0 12px 20px}.noc-node-head{align-items:stretch;flex-direction:column}.noc-node-head .btn{width:100%}
}
@media(max-width:560px){
  .noc-summary{grid-template-columns:1fr 1fr}.noc-kpi{padding:12px}.noc-kpi strong{font-size:22px}.noc-head-actions{display:grid;grid-template-columns:1fr}.noc-device-grid{grid-template-columns:1fr}.noc-port{grid-template-columns:52px 12px minmax(0,1fr)}
}
@media(max-width:760px){
  #nocView.active-view{display:block!important;min-height:calc(100dvh - 96px)!important;overflow:visible!important;touch-action:pan-y!important}
}

/* v1.19.1 - estado alcanzable localmente pero sin salida por carrier */
.noc-kpi.isolated{border-color:color-mix(in srgb,#f59e0b 40%,var(--border));background:color-mix(in srgb,#f59e0b 8%,var(--card))}.noc-kpi.isolated strong{color:#f59e0b}

/* v1.20.0 · puertos físicos y edición de enlaces */
.noc-card-actions{display:flex;justify-content:flex-end;padding:7px 12px;border-top:1px solid var(--border)}
.mini-btn{border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:8px;padding:6px 10px;font-size:11px;font-weight:800;cursor:pointer}
.mini-btn:hover{border-color:var(--accent)}
.noc-port-code{display:flex;flex-direction:column;gap:1px}.noc-port-code em{font-style:normal;font-size:8px;color:var(--muted);font-weight:700}
.link-row-actions{display:flex;gap:7px;flex:0 0 auto}.port-type-inline{display:inline-flex;padding:2px 6px;border-radius:999px;background:var(--panel);color:var(--muted);font-size:9px;font-weight:800;margin-left:4px}
.internal-link-notes{grid-column:1/4}.internal-link-notes input{width:100%}.internal-connect-actions{grid-column:1/4;display:flex;justify-content:flex-end;gap:8px}.internal-connect-actions .hidden{display:none!important}
.equipment-port-config{margin:16px 0;padding:16px;border:1px solid var(--border);border-radius:16px;background:var(--card)}.equipment-port-config.hidden{display:none}
.port-config-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}.port-config-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:8px}.port-config-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr) auto;align-items:center;gap:8px;padding:10px;border:1px solid var(--border);border-radius:11px;background:var(--surface)}.port-config-row.occupied{border-color:color-mix(in srgb,#dc2626 38%,var(--border))}.port-config-row>div:first-child{display:flex;gap:7px;align-items:center;min-width:0}.port-type-badge{padding:3px 7px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:10px;font-weight:900}.port-group-form{display:grid;grid-template-columns:1fr 120px 1fr auto;gap:10px;align-items:end;margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}.port-group-form label{display:grid;gap:5px;font-size:11px;font-weight:800}.port-group-form select,.port-group-form input{width:100%}
@media(max-width:820px){.internal-link-notes,.internal-connect-actions{grid-column:1}.link-row-actions{width:100%;justify-content:flex-end}.port-group-form{grid-template-columns:1fr 1fr}.port-group-form label:nth-child(3){grid-column:1/3}.port-group-form button{grid-column:1/3}.port-config-row{grid-template-columns:1fr auto}.port-config-row>div:nth-child(2){grid-column:1/2}}

.detail-port-section{margin-top:14px;padding:13px;border:1px solid var(--border);border-radius:14px;background:var(--card)}.detail-port-list{display:grid;gap:7px}.detail-physical-port{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px;border:1px solid var(--border);border-radius:10px;background:var(--surface);font-size:11px}.detail-physical-port>div:first-child{display:flex;gap:6px;align-items:center}.detail-physical-port.occupied{border-color:color-mix(in srgb,#dc2626 35%,var(--border))}.detail-port-add{display:grid;grid-template-columns:1fr 80px 1fr auto;gap:7px;margin-top:10px}.detail-port-add select,.detail-port-add input{min-width:0;width:100%}
@media(max-width:620px){.detail-port-add{grid-template-columns:1fr 80px}.detail-port-add input:nth-child(3){grid-column:1/3}.detail-port-add button{grid-column:1/3}.detail-physical-port{grid-template-columns:1fr auto}.detail-physical-port>div:nth-child(2){grid-column:1/2}}
/* v1.21.0 - carriles paralelos para cables que comparten el mismo tramo */
.network-cable-overlay{pointer-events:none}
.cable-overlay-hit{stroke:transparent;stroke-width:14;fill:none;pointer-events:stroke;cursor:pointer}
.shared-cable-badge rect{fill:rgba(255,255,255,.95);stroke:rgba(55,72,78,.28);stroke-width:1}
.shared-cable-badge text{font:800 11px Inter,Segoe UI,Arial,sans-serif;fill:#26383f;text-anchor:middle;paint-order:stroke;stroke:#fff;stroke-width:2px}
html[data-theme="dark"] .shared-cable-badge rect{fill:rgba(17,24,28,.96);stroke:rgba(220,232,236,.24)}
html[data-theme="dark"] .shared-cable-badge text{fill:#f0f5f7;stroke:#11181c}
@media(max-width:700px){.shared-cable-badge text{font-size:10px}}

/* v1.22.0 · ocupación visual consistente */
.mufa-splitter-port.asignado,
.splitter-port.ocupado{
  background:#fff0f0 !important;
  border-color:#e57373 !important;
}
.mufa-splitter-port.asignado .spl-port-head strong,
.mufa-splitter-port.asignado .spl-port-destination,
.splitter-port.ocupado strong,
.splitter-port.ocupado span{
  color:#b71c1c !important;
}
html[data-theme="dark"] .mufa-splitter-port.asignado,
html[data-theme="dark"] .splitter-port.ocupado{
  background:#34191b !important;
  border-color:#8c3b40 !important;
}
html[data-theme="dark"] .mufa-splitter-port.asignado .spl-port-head strong,
html[data-theme="dark"] .mufa-splitter-port.asignado .spl-port-destination,
html[data-theme="dark"] .splitter-port.ocupado strong,
html[data-theme="dark"] .splitter-port.ocupado span{
  color:#ff8a80 !important;
}

/* v1.23.0 · Simplificación UX */
.ux-mode-switch{display:flex;align-items:center;gap:3px;padding:3px;background:#f1f5f3;border:1px solid var(--border);border-radius:11px;flex:none}
.ux-mode-btn{border:0;background:transparent;color:#667278;padding:7px 10px;border-radius:8px;font-size:12px;font-weight:800;cursor:pointer}
.ux-mode-btn.active{background:#fff;color:var(--green);box-shadow:0 1px 4px rgba(20,35,42,.08)}
.layers-button{white-space:nowrap}
.map-layers-panel{position:absolute;right:14px;top:14px;z-index:14;width:min(330px,calc(100% - 28px));background:rgba(255,255,255,.97);border:1px solid var(--border);border-radius:14px;padding:13px;box-shadow:0 10px 30px rgba(20,35,42,.16);backdrop-filter:blur(7px)}
.map-layers-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.map-layers-head>div{display:flex;flex-direction:column;gap:2px}.map-layers-head small{color:var(--muted);font-size:11px}
.map-layer-presets{display:flex;gap:6px;margin-bottom:10px}.map-layer-presets .mini-btn{flex:1}
.map-layer-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px 10px}.map-layer-grid label{display:flex;align-items:center;gap:7px;padding:7px 8px;border-radius:8px;font-size:12px;font-weight:700;color:#425057;cursor:pointer}.map-layer-grid label:hover{background:#f3f7f5}.map-layer-grid input{width:auto;margin:0;accent-color:var(--green)}
.simple-form-hint{background:#f4faf7;border:1px solid #d9ece2;color:#426054;border-radius:10px;padding:10px 11px;font-size:12px;line-height:1.45;margin:-2px 0 10px}
.advanced-toggle{width:100%;border:1px dashed #b9ccc2;background:#fbfdfc;color:#315446;padding:9px 11px;border-radius:10px;font-weight:800;text-align:left;cursor:pointer;margin-bottom:12px}
body:not(.asset-advanced-open) .asset-form .asset-advanced-field{display:none!important}
body[data-ux-mode="operation"] .design-control,
body[data-ux-mode="operation"] .tab[data-view="fiberView"],
body[data-ux-mode="operation"] .tab[data-view="settingsView"],
body[data-ux-mode="operation"] .tab[data-view="usersView"],
body[data-ux-mode="operation"] #newRackForm,
body[data-ux-mode="operation"] #internalLinkForm,
body[data-ux-mode="operation"] [data-delete-rack],
body[data-ux-mode="operation"] [data-edit-link],
body[data-ux-mode="operation"] [data-delete-link],
body[data-ux-mode="operation"] [data-config-ports]{display:none!important}
body[data-ux-mode="operation"] .toolbar{background:#fbfdfc}
body[data-ux-mode="operation"] .ux-mode-switch{background:#edf6f1}
body[data-ux-mode="operation"] .map-canvas{outline:2px solid rgba(0,130,67,.04);outline-offset:-2px}
html[data-theme="dark"] .ux-mode-switch{background:#182126;border-color:#34434a}
html[data-theme="dark"] .ux-mode-btn{color:#9eacb2}.ux-mode-btn.active{}
html[data-theme="dark"] .ux-mode-btn.active{background:#263239;color:#7ed3a9;box-shadow:none}
html[data-theme="dark"] .map-layers-panel{background:rgba(18,25,29,.97);border-color:#34434a;color:#e6edef}
html[data-theme="dark"] .map-layer-grid label{color:#d8e1e5}html[data-theme="dark"] .map-layer-grid label:hover{background:#202b30}
html[data-theme="dark"] .simple-form-hint{background:#17251f;border-color:#2b493b;color:#b8d8c8}
html[data-theme="dark"] .advanced-toggle{background:#151e22;border-color:#3d535c;color:#c9ddd4}
@media(max-width:1050px){.ux-mode-switch{order:2}.top-actions{order:2}.tabs{order:3}}
@media(max-width:760px){
  .ux-mode-switch{grid-column:1/-1;order:2;width:100%;display:grid;grid-template-columns:1fr 1fr;margin-top:2px}.ux-mode-btn{padding:7px 8px}
  #mapView>.toolbar .layers-button{min-width:0!important}
  .map-layers-panel{top:8px;right:8px;width:min(340px,calc(100% - 16px));max-height:calc(100% - 16px);overflow:auto}
  .map-layer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:430px){.map-layer-grid{grid-template-columns:1fr}.map-layer-presets{display:grid;grid-template-columns:1fr 1fr 1fr}}


/* v1.24 - Biblioteca visual y colocación drag & drop */
.equipment-palette{position:absolute;right:12px;top:12px;bottom:12px;width:min(330px,calc(100% - 24px));z-index:14;background:var(--card,#fff);border:1px solid var(--border);border-radius:18px;box-shadow:0 14px 38px rgba(20,35,42,.22);display:flex;flex-direction:column;overflow:hidden}
.equipment-palette.hidden{display:none!important}.equipment-palette-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 16px 10px;border-bottom:1px solid var(--border)}
.equipment-palette-head strong{font-size:16px;display:block}.equipment-palette-head small{display:block;color:var(--muted);line-height:1.35;margin-top:3px}.equipment-palette-search{padding:12px 14px 4px;font-size:10px;text-transform:uppercase;color:var(--muted);font-weight:800}.equipment-palette-search input{margin-top:5px;width:100%}
.equipment-palette-grid{padding:8px 12px 14px;overflow:auto;overscroll-behavior:contain;flex:1}.equipment-palette-group+.equipment-palette-group{margin-top:16px}.equipment-palette-group-title{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:800;margin:0 3px 7px}.equipment-palette-items{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.equipment-palette-item{border:1px solid var(--border);background:var(--card,#fff);border-radius:13px;padding:10px;display:grid;grid-template-columns:34px minmax(0,1fr) 10px;align-items:center;gap:8px;text-align:left;cursor:grab;color:var(--text,#172026);transition:border-color .15s,box-shadow .15s,transform .15s}.equipment-palette-item:hover,.equipment-palette-item.selected{border-color:var(--green);box-shadow:0 0 0 2px rgba(0,130,67,.10)}.equipment-palette-item:active,.equipment-palette-item.dragging{cursor:grabbing;transform:scale(.98);opacity:.72}.equipment-palette-item strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.equipment-palette-item small{display:block;color:var(--muted);font-size:9px;margin-top:2px}.equipment-palette-item>i{font-style:normal;color:var(--muted);font-size:13px}.equipment-palette-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:var(--soft,#f4f8f6)}.equipment-palette-icon svg{width:23px;height:23px}.equipment-palette-tip{margin:0 12px 12px;padding:10px 11px;border-radius:12px;background:rgba(0,130,67,.07);border:1px solid rgba(0,130,67,.15);font-size:11px}.equipment-palette-tip strong,.equipment-palette-tip span{display:block}.equipment-palette-tip span{color:var(--muted);margin-top:2px}.equipment-palette-empty{padding:20px;color:var(--muted);text-align:center}
#map.equipment-drop-ready:after,#map.placement-active:after{content:'Suelta o toca aquí para colocar el equipo';position:absolute;inset:12px;border:2px dashed var(--green);border-radius:18px;background:rgba(0,130,67,.05);display:grid;place-items:center;color:var(--green);font-weight:800;font-size:15px;pointer-events:none;z-index:12}#map.placement-active:after{content:'Toca la ubicación del nuevo equipo'}
body[data-ux-mode="design"] .asset-marker-wrap .asset-marker{cursor:grab}body[data-ux-mode="design"] .asset-marker-wrap.marker-dragging .asset-marker{cursor:grabbing;box-shadow:0 7px 22px rgba(0,0,0,.34);transform:scale(1.08)}
html[data-theme="dark"] .equipment-palette{background:#11191d}html[data-theme="dark"] .equipment-palette-item{background:#11191d;color:#edf5f2}html[data-theme="dark"] .equipment-palette-icon{background:#182328}
@media(max-width:760px){.equipment-palette{left:8px;right:8px;top:auto;bottom:8px;width:auto;max-height:min(62vh,560px);border-radius:18px}.equipment-palette-items{grid-template-columns:1fr 1fr}.equipment-palette-head{padding:13px}.equipment-palette-grid{padding-bottom:max(14px,env(safe-area-inset-bottom))}}
@media(max-width:420px){.equipment-palette-items{grid-template-columns:1fr}.equipment-palette-item{grid-template-columns:36px 1fr 10px;padding:9px 10px}}

/* v1.25 - editor visual de recorrido de cables */
body[data-ux-mode="design"] .cable-overlay-hit{cursor:grab;touch-action:none}
body[data-ux-mode="design"] #map.cable-route-dragging .cable-overlay-hit{cursor:grabbing}
#map.cable-route-dragging{cursor:grabbing!important}
#map.cable-route-pick-active{cursor:crosshair!important}
.asset-marker-wrap.route-drop-candidate .asset-marker{box-shadow:0 0 0 3px rgba(0,130,67,.22),0 4px 12px rgba(0,0,0,.2);transition:transform .12s,box-shadow .12s}
.asset-marker-wrap.route-drop-candidate .asset-map-label{outline:1px dashed rgba(0,130,67,.45);outline-offset:2px}
.asset-marker-wrap.route-drop-nearest .asset-marker{transform:scale(1.18);box-shadow:0 0 0 5px rgba(0,130,67,.25),0 7px 20px rgba(0,0,0,.28)}
.asset-marker-wrap.route-drop-nearest .asset-map-label{outline:2px solid var(--green);outline-offset:2px}
html[data-theme="dark"] .asset-marker-wrap.route-drop-candidate .asset-map-label{outline-color:rgba(72,210,142,.55)}


/* v1.25.1 - selección exclusiva en mapa */
#map.asset-interaction-active .cable-overlay-hit{pointer-events:none!important;cursor:default!important}
#map.asset-interaction-active .network-cable-overlay{pointer-events:none!important}
.asset-marker-wrap.marker-dragging{z-index:30!important}
body[data-ux-mode="design"] .asset-marker-wrap:hover{z-index:20!important}

/* v1.25.2 - detalle de equipos y edición reversible de recorrido */
.asset-marker-wrap.route-drop-used .asset-marker{box-shadow:0 0 0 4px rgba(211,47,47,.24),0 4px 12px rgba(0,0,0,.2)}
.asset-marker-wrap.route-drop-used .asset-map-label{outline:2px dashed rgba(211,47,47,.72);outline-offset:2px}
.asset-marker-wrap.route-drop-used.route-drop-nearest .asset-marker{box-shadow:0 0 0 6px rgba(211,47,47,.30),0 7px 20px rgba(0,0,0,.28)}

/* v1.26.0 · Conexión visual desde el mapa */
.map-context-menu{position:absolute;z-index:40;width:232px;background:rgba(255,255,255,.98);border:1px solid var(--border);border-radius:14px;box-shadow:0 14px 34px rgba(20,35,42,.24);padding:7px;backdrop-filter:blur(8px)}
.map-context-menu.hidden{display:none!important}.map-context-title{padding:9px 10px 8px;border-bottom:1px solid var(--border);margin-bottom:5px}.map-context-title strong,.map-context-title span{display:block}.map-context-title strong{font-size:13px}.map-context-title span{font-size:10px;color:var(--muted);margin-top:2px}.map-context-menu button{width:100%;border:0;background:transparent;color:var(--text);padding:10px 11px;border-radius:9px;text-align:left;font-size:12px;font-weight:750;cursor:pointer}.map-context-menu button:hover{background:#f1f7f4}.map-context-menu button:disabled{opacity:.42;cursor:not-allowed}
.visual-connect-wizard{position:absolute;z-index:35;right:14px;top:14px;width:min(470px,calc(100% - 28px));max-height:calc(100% - 28px);overflow:auto;background:rgba(255,255,255,.98);border:1px solid var(--border);border-radius:18px;box-shadow:0 18px 46px rgba(20,35,42,.26);padding:14px;backdrop-filter:blur(9px)}.visual-connect-wizard.hidden{display:none!important}
.visual-connect-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.visual-connect-head>div{min-width:0}.visual-connect-head small,.visual-connect-head strong,.visual-connect-head span{display:block}.visual-connect-head small{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--green);font-weight:900}.visual-connect-head strong{font-size:17px;margin-top:2px}.visual-connect-head span{font-size:11px;color:var(--muted);margin-top:3px;line-height:1.35}
.visual-connect-path{display:grid;grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr);align-items:center;gap:6px;margin:12px 0;background:#f5f9f7;border:1px solid #dfece6;border-radius:13px;padding:9px}.visual-connect-path>span{min-width:0}.visual-connect-path strong,.visual-connect-path small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.visual-connect-path strong{font-size:12px}.visual-connect-path small{font-size:9px;color:var(--muted)}.visual-connect-path>b{text-align:center;color:var(--green)}
.visual-mode-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-bottom:11px}.visual-mode-tabs button{border:1px solid var(--border);background:#fff;color:#526067;border-radius:10px;padding:9px 8px;font-size:11px;font-weight:850;cursor:pointer}.visual-mode-tabs button.active{border-color:var(--green);background:rgba(0,130,67,.08);color:var(--green)}
.visual-connect-form{display:flex;flex-direction:column;gap:10px}.visual-connect-form label{font-size:11px;font-weight:750}.visual-connect-form input,.visual-connect-form select{margin-top:4px}.visual-help{display:flex;flex-direction:column;gap:2px;padding:9px 10px;border-radius:10px;background:#f7faf8;border:1px solid var(--border)}.visual-help strong{font-size:12px}.visual-help span{font-size:10px;color:var(--muted);line-height:1.4}.visual-connect-actions{display:flex;justify-content:flex-end;gap:8px;padding-top:3px}.visual-fiber-preview{display:flex;flex-wrap:wrap;gap:5px;padding:8px;border:1px dashed #bfd0c7;border-radius:10px;background:#fbfdfc}.visual-fiber-preview span{font-size:10px;background:#fff;border:1px solid var(--border);border-radius:999px;padding:5px 7px}.visual-fiber-preview b{color:var(--green);margin:0 3px}.visual-fiber-preview small{width:100%;color:var(--muted)}
.asset-marker-wrap.visual-connect-source .asset-marker{box-shadow:0 0 0 6px rgba(0,130,67,.28),0 8px 22px rgba(0,0,0,.28)!important;transform:scale(1.11)}.asset-marker-wrap.visual-connect-source .asset-map-label{outline:2px solid var(--green);outline-offset:2px}.asset-marker-wrap.visual-connect-target .asset-marker{box-shadow:0 0 0 6px rgba(25,118,210,.25),0 8px 22px rgba(0,0,0,.28)!important;transform:scale(1.08)}.asset-marker-wrap.visual-connect-target .asset-map-label{outline:2px solid #1976d2;outline-offset:2px}
#map.visual-connect-picking{cursor:crosshair!important}#map.visual-connect-picking .asset-marker-wrap:not(.visual-connect-source) .asset-marker{animation:vcPulse 1.7s ease-in-out infinite}@keyframes vcPulse{50%{box-shadow:0 0 0 5px rgba(0,130,67,.15)}}
html[data-theme="dark"] .map-context-menu,html[data-theme="dark"] .visual-connect-wizard{background:rgba(17,25,29,.98);border-color:#34434a}html[data-theme="dark"] .map-context-menu button{color:#e8f0ed}html[data-theme="dark"] .map-context-menu button:hover{background:#202b30}html[data-theme="dark"] .visual-connect-path,html[data-theme="dark"] .visual-help{background:#172126;border-color:#304139}html[data-theme="dark"] .visual-mode-tabs button{background:#151e22;border-color:#34434a;color:#c4d0d4}html[data-theme="dark"] .visual-mode-tabs button.active{background:#173126;color:#7ed3a9;border-color:#397759}html[data-theme="dark"] .visual-fiber-preview{background:#131c20;border-color:#3a5146}html[data-theme="dark"] .visual-fiber-preview span{background:#1a252a;border-color:#34434a}
@media(max-width:760px){.visual-connect-wizard{left:8px;right:8px;top:auto;bottom:8px;width:auto;max-height:min(72%,640px);border-radius:18px}.map-context-menu{width:min(250px,calc(100% - 24px))}.visual-connect-actions .btn{min-height:44px}.visual-mode-tabs button{min-height:44px}.visual-connect-form input,.visual-connect-form select{font-size:16px}}

/* v1.26.1 · disponibilidad visual de puertos/hilos */
.visual-resource-summary{margin-top:7px;font-size:12px;color:var(--muted,#667085);line-height:1.35}
.visual-resource-status{display:flex;flex-direction:column;gap:2px;margin:8px 0;padding:9px 10px;border:1px solid rgba(127,127,127,.25);border-radius:10px;font-size:12px}
.visual-resource-status.resource-free{border-color:rgba(0,130,67,.4);background:rgba(0,130,67,.07)}
.visual-resource-status.resource-blocked{border-color:rgba(198,40,40,.45);background:rgba(198,40,40,.08)}
.visual-resource-status.resource-blocked strong{color:#c62828}
select option.resource-blocked{color:#c62828;font-weight:700}
select option.resource-free{color:#008243}

/* v1.26.2 · cabecera fija en panel de detalles */
#detailPanel>.detail-top{
  position:sticky;
  top:0;
  z-index:22;
  margin:-20px -20px 14px;
  padding:14px 20px 12px;
  background:var(--card,#fff);
  border-bottom:1px solid var(--border);
  box-shadow:0 5px 12px rgba(20,35,42,.07);
  align-items:center;
}
#detailPanel>.detail-top>div{min-width:0}
#detailPanel>.detail-top .detail-title{font-size:20px;margin:6px 0 1px;overflow-wrap:anywhere}
#detailPanel>.detail-top .icon-btn{flex:0 0 40px;width:40px;height:40px;position:relative;z-index:1}
@media(max-width:760px){
  #detailPanel>.detail-top{
    padding-top:max(12px,env(safe-area-inset-top));
  }
}
html[data-theme="dark"] #detailPanel>.detail-top{box-shadow:0 5px 14px rgba(0,0,0,.22)}

/* v1.27.0 · Trazador óptico visual */
.optical-trace-panel{position:absolute;z-index:34;left:14px;top:14px;width:min(500px,calc(100% - 28px));max-height:calc(100% - 28px);overflow:auto;background:rgba(255,255,255,.98);border:1px solid var(--border);border-radius:18px;box-shadow:0 18px 46px rgba(20,35,42,.24);padding:14px;backdrop-filter:blur(9px)}
.optical-trace-panel.hidden{display:none!important}.optical-trace-head{position:sticky;top:-14px;z-index:3;margin:-14px -14px 12px;padding:14px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;background:rgba(255,255,255,.98);border-bottom:1px solid var(--border);border-radius:18px 18px 0 0}.optical-trace-head strong,.optical-trace-head small{display:block}.optical-trace-head small{color:var(--muted);font-size:11px;margin-top:3px}.optical-mode-tabs{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:12px}.optical-mode-tabs button{border:1px solid var(--border);background:#fff;color:var(--text);border-radius:10px;padding:9px 10px;font-weight:800;cursor:pointer}.optical-mode-tabs button.active{border-color:#7eb99d;background:#eaf6f0;color:#12633d}.optical-controls{margin-bottom:10px}.optical-controls label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700}.optical-controls select{width:100%;min-height:38px}.optical-run-actions{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.optical-trace-status{padding:9px 10px;border:1px solid var(--border);border-radius:10px;background:#f8faf9;font-size:11px;line-height:1.4}.optical-trace-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:12px 0}.optical-trace-summary>div{border:1px solid var(--border);border-radius:11px;padding:9px;text-align:center;background:#fff}.optical-trace-summary strong,.optical-trace-summary span{display:block}.optical-trace-summary strong{font-size:18px}.optical-trace-summary span{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.optical-trace-summary .ok strong{color:#188038}.optical-trace-summary .warn strong{color:#c87900}.optical-trace-summary .err strong{color:#d93025}.optical-trace-results{display:flex;flex-direction:column;gap:7px;max-height:330px;overflow:auto;padding-right:2px}.optical-result-card{width:100%;display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:8px;align-items:flex-start;text-align:left;border:1px solid var(--border);background:#fff;border-radius:11px;padding:9px;cursor:pointer;color:var(--text)}.optical-result-card:hover{background:#f8fbf9}.optical-result-icon{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;font-weight:900;background:#e9f5ee;color:#188038}.optical-result-card.status-error .optical-result-icon{background:#fdecea;color:#d93025}.optical-result-card.status-warning .optical-result-icon{background:#fff5dd;color:#b66a00}.optical-result-main{min-width:0}.optical-result-main strong,.optical-result-main small,.optical-result-main em{display:block}.optical-result-main strong{font-size:12px}.optical-result-main small{font-size:10px;color:var(--muted);margin-top:2px;line-height:1.35}.optical-result-main em{font-style:normal;font-size:9px;color:var(--muted);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.optical-result-state{font-size:9px;font-weight:900;text-transform:uppercase;color:var(--muted);padding-top:3px}.optical-history-head{display:flex;align-items:center;justify-content:space-between;margin:14px 0 7px}.optical-trace-history{display:flex;flex-direction:column;gap:5px}.optical-history-item{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;border:1px solid var(--border);background:#fff;border-radius:9px;padding:8px;text-align:left;cursor:pointer;color:var(--text)}.optical-history-item span:first-child strong,.optical-history-item span:first-child small{display:block}.optical-history-item span:first-child strong{font-size:11px}.optical-history-item span:first-child small{font-size:9px;color:var(--muted);margin-top:2px}.optical-history-counts{display:flex;gap:5px;font-size:9px}.optical-history-counts b{color:#188038}.optical-history-counts i{color:#b66a00;font-style:normal}.optical-history-counts em{color:#d93025;font-style:normal}.optical-empty{padding:14px;border:1px dashed var(--border);border-radius:10px;color:var(--muted);font-size:11px;text-align:center}.optical-trace-button{white-space:nowrap}
html[data-theme="dark"] .optical-trace-panel,html[data-theme="dark"] .optical-trace-head{background:rgba(17,25,29,.98);border-color:#34434a}html[data-theme="dark"] .optical-mode-tabs button,html[data-theme="dark"] .optical-trace-summary>div,html[data-theme="dark"] .optical-result-card,html[data-theme="dark"] .optical-history-item{background:#151e22;border-color:#34434a;color:#e6edef}html[data-theme="dark"] .optical-mode-tabs button.active{background:#173126;color:#7ed3a9;border-color:#397759}html[data-theme="dark"] .optical-trace-status{background:#131c20;border-color:#34434a}
@media(max-width:760px){.optical-trace-panel{left:8px;right:8px;top:8px;width:auto;max-height:calc(100% - 16px);padding:12px}.optical-trace-head{top:-12px;margin:-12px -12px 10px;padding:12px}.optical-trace-summary{grid-template-columns:repeat(2,1fr)}.optical-mode-tabs button,.optical-run-actions .btn{min-height:44px}.optical-controls select{font-size:16px}.optical-trace-results{max-height:260px}}


/* v1.27.1 · señal óptica más visible, lenta y siempre sobre el cable */
.optical-pulse-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;overflow:visible}
.optical-test-guide-outline{fill:none;stroke:rgba(9,18,22,.86);stroke-width:10;stroke-linecap:round;stroke-linejoin:round;opacity:.78}
.optical-test-guide{fill:none;stroke:#B7FF00;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:10 7;opacity:.92}
.optical-test-pulse-halo{fill:#B7FF00;stroke:none;filter:drop-shadow(0 0 7px rgba(183,255,0,.9));transition:opacity .08s linear}
.optical-test-pulse-core{fill:#B7FF00;stroke:#0b1418;stroke-width:3.5;filter:drop-shadow(0 0 5px rgba(183,255,0,.95))}
.optical-test-pulse-center{fill:#fff;stroke:rgba(0,0,0,.35);stroke-width:1}
.optical-speed-control{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:9px 0 2px;padding:8px 9px;border:1px solid var(--border);border-radius:10px;background:#f8faf9}
.optical-speed-control label{display:flex;flex-direction:column;gap:4px;font-size:10px;font-weight:800;min-width:175px}.optical-speed-control select{min-height:34px}
.optical-speed-control span{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--muted);font-weight:750}.optical-speed-control i{width:12px;height:12px;border-radius:50%;background:#B7FF00;border:2px solid #0b1418;box-shadow:0 0 5px rgba(183,255,0,.75)}
html[data-theme="dark"] .optical-speed-control{background:#131c20;border-color:#34434a}
@media(max-width:760px){.optical-speed-control{align-items:stretch}.optical-speed-control label{width:100%}.optical-speed-control select{font-size:16px;min-height:44px}}

/* v1.27.2 · fallas de infraestructura en el trazador */
.optical-result-kind{display:inline-flex;align-items:center;margin-left:6px;padding:2px 6px;border:1px solid var(--border);border-radius:999px;font-size:10px;line-height:1.2;color:var(--muted);font-weight:700;vertical-align:1px}

/* v1.28.0 · sistema visual uniforme inspirado en iOS 18 */
:root{
  --ui-font-size:11px;
  --ui-font-small:10px;
  --ui-font-title:18px;
  --ui-font-heading:20px;
  --ui-control-h:34px;
  --ui-radius:12px;
  --ui-radius-lg:18px;
  --ui-icon:32px;
  --ui-gap:8px;
  --ios-blue:#0a84ff;
  --ios-surface:rgba(255,255,255,.88);
  --ios-surface-strong:rgba(255,255,255,.96);
  --ios-fill:rgba(118,118,128,.10);
  --ios-fill-strong:rgba(118,118,128,.16);
  --ios-separator:rgba(60,60,67,.16);
  --ios-shadow:0 10px 30px rgba(20,35,42,.10);
}
html[data-ui-size="11"]{--ui-font-size:11px;--ui-font-small:10px;--ui-font-title:18px;--ui-font-heading:20px;--ui-control-h:34px}
html[data-ui-size="12"]{--ui-font-size:12px;--ui-font-small:11px;--ui-font-title:19px;--ui-font-heading:21px;--ui-control-h:36px}
html[data-ui-size="13"]{--ui-font-size:13px;--ui-font-small:12px;--ui-font-title:20px;--ui-font-heading:22px;--ui-control-h:38px}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Segoe UI",Roboto,Arial,sans-serif;font-size:var(--ui-font-size);letter-spacing:-.005em}
button,input,select,textarea{font-family:inherit;font-size:var(--ui-font-size);letter-spacing:0}
label,p,td,th,.kv,.top-actions,.callout,.error-text,.visual-resource-summary,.visual-resource-status{font-size:var(--ui-font-size)!important}
small,.muted,.brand small,.panel-head small,.noc-device-card header span:not(.noc-device-state),.noc-device-meta,.noc-port,.optical-trace-head small,.optical-result-main small,.optical-history-item span:first-child small{font-size:var(--ui-font-small)!important}
h1,.section-head h1,.settings-card h1{font-size:var(--ui-font-heading)!important;line-height:1.12;letter-spacing:-.02em}
h2,.panel-head h2,.node-plant-head h2,.noc-node-head h2{font-size:var(--ui-font-title)!important;line-height:1.15;letter-spacing:-.018em}
.detail-title{font-size:var(--ui-font-title)!important}

/* Superficies y navegación */
.topbar{height:62px;padding:0 16px;gap:14px;background:var(--ios-surface);border-bottom:1px solid var(--ios-separator);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px)}
.brand{min-width:190px;gap:8px}.brand strong{font-size:13px;letter-spacing:-.01em}.brand-mark.small{width:32px;height:32px;border-radius:10px;font-size:16px}
.tabs{gap:3px}.tab{min-height:34px;padding:7px 11px;border-radius:10px;font-size:var(--ui-font-size)!important;font-weight:600;transition:background .15s ease,color .15s ease,transform .15s ease}.tab.active{font-weight:700;background:rgba(0,130,67,.10)}
.toolbar{min-height:50px;padding:8px 12px;gap:8px;background:var(--ios-surface-strong);border-bottom:1px solid var(--ios-separator);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.ux-mode-switch{border-radius:11px!important;padding:2px!important;gap:2px!important;background:var(--ios-fill)!important}.ux-mode-btn{min-height:30px!important;padding:5px 9px!important;border-radius:9px!important;font-size:var(--ui-font-size)!important;font-weight:650!important}.ux-mode-btn.active{box-shadow:0 1px 3px rgba(0,0,0,.10)!important}

/* Controles uniformes */
.btn,.mini-btn,.icon-btn,.link-btn,.map-panel-toggle,.optical-mode-tabs button,.visual-mode-tabs button,.ui-size-segmented button{font-size:var(--ui-font-size)!important;font-weight:650;line-height:1.1;transition:background .14s ease,border-color .14s ease,transform .08s ease,opacity .14s ease}
.btn{min-height:var(--ui-control-h);padding:6px 11px;border-radius:var(--ui-radius);border:1px solid var(--ios-separator);background:var(--ios-surface-strong);box-shadow:0 1px 1px rgba(0,0,0,.02)}
.btn:active,.mini-btn:active,.icon-btn:active,.tab:active,.ui-size-segmented button:active{transform:scale(.97)}
.btn.primary{box-shadow:0 2px 7px rgba(0,130,67,.16)}
.btn.danger{background:rgba(255,59,48,.05);border-color:rgba(255,59,48,.24)}
.mini-btn{min-height:30px;padding:5px 9px;border-radius:10px;font-weight:650}
.icon-btn{display:inline-grid;place-items:center;flex:0 0 var(--ui-icon);width:var(--ui-icon)!important;height:var(--ui-icon)!important;min-width:var(--ui-icon);padding:0!important;border:0;border-radius:50%;background:var(--ios-fill);font-size:18px!important;font-weight:500;line-height:1;color:var(--text)}
.icon-btn:hover{background:var(--ios-fill-strong)}
button svg,.btn svg,.mini-btn svg,.icon-btn svg{width:16px;height:16px;flex:none}
input,select,textarea{border:1px solid var(--ios-separator);background:var(--ios-surface-strong);border-radius:var(--ui-radius);padding:7px 10px;min-height:var(--ui-control-h);color:var(--text);box-shadow:none}
textarea{min-height:72px;line-height:1.35}
input:focus,select:focus,textarea:focus{border-color:rgba(0,130,67,.62);box-shadow:0 0 0 3px rgba(0,130,67,.10)}
.asset-form label,.settings-card label,.port-group-form label,.optical-controls label,.visual-connect-form label{gap:5px;font-size:var(--ui-font-size)!important;font-weight:650!important;color:var(--muted);margin-bottom:10px}
.form-grid{gap:8px}.form-actions{gap:8px;margin-top:12px}

/* Tarjetas y paneles con una sola gramática visual */
.settings-card,.table-wrap,.noc-kpi,.noc-device-card,.equipment-port-config,.detail-port-section,.conditional-card,.splitter-card,.olt-card,.cable-list-card,.fiber-main,.cable-route-card,.fiber-usage-card,.login-card{border:1px solid var(--ios-separator)!important;border-radius:var(--ui-radius-lg)!important;box-shadow:0 1px 2px rgba(0,0,0,.025);background:var(--ios-surface-strong)}
.settings-card{padding:20px;margin:20px auto}.settings-card form{margin-top:16px}
.section-head{padding:20px 24px}.table-wrap{margin:0 24px 24px}th,td{padding:10px 12px}th{font-size:var(--ui-font-small)!important;letter-spacing:.035em}
.side-panel{background:var(--ios-surface-strong)!important;border-left:1px solid var(--ios-separator)!important;box-shadow:-12px 0 30px rgba(20,35,42,.10)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
#detailPanel>.detail-top{background:var(--ios-surface-strong)!important;border-bottom:1px solid var(--ios-separator)!important;box-shadow:0 6px 16px rgba(20,35,42,.06)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.map-layers-panel,.equipment-palette,.visual-connect-wizard,.optical-trace-panel,.map-context-menu{border-radius:var(--ui-radius-lg)!important;border-color:var(--ios-separator)!important;box-shadow:var(--ios-shadow)!important;backdrop-filter:saturate(160%) blur(20px);-webkit-backdrop-filter:saturate(160%) blur(20px)}
.type-pill,.port-type-badge,.port-type-inline,.optical-result-kind{border-radius:999px;font-size:var(--ui-font-small)!important;padding:4px 7px}
.coords{font-size:var(--ui-font-size)!important;border-radius:10px;background:var(--ios-fill)}

/* Apariencia / tamaño del texto */
.settings-title-row{display:flex;align-items:center;justify-content:space-between;gap:18px}.settings-title-row p{margin:3px 0 0;color:var(--muted)}
.settings-eyebrow{display:block;color:var(--green);font-size:var(--ui-font-small);font-weight:750;text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}.appearance-glyph{display:grid;place-items:center;width:48px;height:48px;flex:none;border-radius:15px;background:linear-gradient(145deg,rgba(10,132,255,.14),rgba(0,130,67,.13));font-size:17px;font-weight:750;color:var(--text)}
.ios-setting-group{margin-top:16px;border-radius:15px;background:var(--ios-fill);padding:2px 12px}.ios-setting-row{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0}.ios-setting-row>div:first-child{min-width:0}.ios-setting-row strong,.ios-setting-row small{display:block}.ios-setting-row small{color:var(--muted);margin-top:3px;line-height:1.3}
.ui-size-segmented{display:grid;grid-template-columns:repeat(3,42px);gap:2px;padding:2px;border-radius:11px;background:rgba(118,118,128,.12);flex:none}.ui-size-segmented button{height:30px;border:0;background:transparent;color:var(--muted);border-radius:9px;cursor:pointer}.ui-size-segmented button.active{background:var(--card);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,.12);font-weight:750}
.ui-size-preview{border-top:1px solid var(--ios-separator);padding:11px 0 12px;display:grid;gap:3px}.ui-size-preview span{font-size:var(--ui-font-small);color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700}.ui-size-preview strong{font-size:var(--ui-font-size)}.ui-size-preview small{color:var(--muted)}

/* Login unificado */
.login-body{background:linear-gradient(145deg,#f3f6f8,#eef3f0)}.login-card{border-radius:24px!important;padding:28px!important}.login-card .brand-mark{width:48px;height:48px;border-radius:15px;font-size:23px}.login-card h1{font-size:22px!important;letter-spacing:-.025em}.login-theme-toggle{font-family:inherit!important;border-radius:999px!important;font-size:var(--ui-font-size)!important;min-height:34px!important}

/* Tema oscuro para el nuevo sistema visual */
html[data-theme="dark"]{--ios-surface:rgba(21,29,33,.88);--ios-surface-strong:rgba(21,29,33,.97);--ios-fill:rgba(118,118,128,.18);--ios-fill-strong:rgba(118,118,128,.26);--ios-separator:rgba(235,235,245,.14);--ios-shadow:0 14px 34px rgba(0,0,0,.32)}
html[data-theme="dark"] .topbar,html[data-theme="dark"] .toolbar,html[data-theme="dark"] .side-panel,html[data-theme="dark"] #detailPanel>.detail-top{background:var(--ios-surface)!important;border-color:var(--ios-separator)!important}
html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea,html[data-theme="dark"] .btn,html[data-theme="dark"] .settings-card,html[data-theme="dark"] .table-wrap,html[data-theme="dark"] .noc-kpi,html[data-theme="dark"] .noc-device-card{border-color:var(--ios-separator)!important}
html[data-theme="dark"] .ui-size-segmented button.active{background:#2c353a;color:#f2f5f6}html[data-theme="dark"] .ios-setting-group{background:rgba(118,118,128,.12)}

@media(max-width:900px){
  .topbar{padding:9px 10px;gap:8px}.toolbar{padding:7px 8px}.tab{padding:7px 9px}.settings-card{margin:12px;padding:16px}.section-head{padding:16px}.table-wrap{margin:0 10px 18px}
}
@media(max-width:760px){
  /* iOS evita el zoom automático en campos de formulario con texto menor a 16px. */
  input,select,textarea{font-size:16px!important}
  .btn,.tab,.mini-btn,.ux-mode-btn,.map-panel-toggle{min-height:38px}
  .icon-btn{--ui-icon:36px}
  .ios-setting-row{align-items:flex-start;flex-direction:column}.ui-size-segmented{grid-template-columns:repeat(3,minmax(48px,1fr));width:100%}.ui-size-segmented button{height:34px}
}
/* v1.28.0 · cierre de escala tipográfica para componentes heredados */
.top-actions,.top-actions .btn,.tabs .tab,#mapView>.toolbar select,#newAssetBtn,.live-status,.legend-toggle,.network-map-legend,
.map-context-title strong,.map-context-menu button,.visual-connect-head small,.visual-connect-head span,.visual-connect-path strong,
.visual-mode-tabs button,.visual-connect-form label,.visual-help strong,.optical-mode-tabs button,.optical-result-main strong,
.optical-history-item span:first-child strong,.noc-kpi span,.noc-device-state,.noc-device-card header b,.port-group-form label,
.photo-meta strong,.photo-upload-form label,.history-row strong,.check-row,.small-text{font-size:var(--ui-font-size)!important}
.map-context-title span,.visual-connect-path small,.visual-help span,.visual-fiber-preview span,.visual-fiber-preview small,
.optical-result-main small,.optical-result-main em,.optical-result-state,.optical-history-counts,.noc-port small,.noc-port-code em,
.photo-meta span,.photo-meta p,.history-row span,.history-row p{font-size:var(--ui-font-small)!important}
.asset-map-label strong,.asset-map-label span,.asset-marker-wrap.type-poste .asset-map-label strong,.asset-map-reserve,.asset-marker-wrap.type-poste .asset-map-reserve,
.cable-name-label{font-size:var(--ui-font-size)!important}
.cable-overlay-label,.segment-meter-label text{font:750 var(--ui-font-size) -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Arial,sans-serif!important}

@media(max-width:760px){
  .tabs .tab,.top-actions .btn,#mapView>.toolbar select,#newAssetBtn,.live-status{font-size:var(--ui-font-size)!important}
  .asset-map-label strong,.asset-map-label span,.asset-marker-wrap.type-poste .asset-map-label strong,.segment-meter-label text{font-size:var(--ui-font-size)!important}
}


/* v1.28.1 · interfaz móvil nativa/compacta + densidad inteligente del mapa */
.mobile-more-tab,.mobile-nav-menu{display:none}
@media(max-width:760px){
  /* Cabecera móvil: dos filas útiles, sin comprimir la vista de escritorio. */
  .topbar{grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:auto auto!important;padding:6px 8px!important;gap:4px 7px!important;min-height:0!important}
  .brand{grid-column:1!important;grid-row:1!important;gap:7px!important}.brand-mark.small{width:36px!important;height:36px!important;border-radius:11px!important;font-size:18px!important}.brand strong{font-size:14px!important;line-height:1.1}.brand small{font-size:9px!important;line-height:1.1;margin-top:2px}
  .top-actions{grid-column:2!important;grid-row:1!important;gap:5px!important}.top-actions #themeToggle{width:36px!important;min-width:36px!important;height:36px!important;padding:0!important;border-radius:12px!important}.top-actions #themeToggle .theme-label{display:none!important}.top-actions #logoutBtn{min-height:36px!important;height:36px!important;padding:0 10px!important;border-radius:12px!important}
  .tabs{grid-column:1!important;grid-row:2!important;width:auto!important;min-width:0!important;padding:0!important;gap:2px!important;overflow:visible!important}.tabs .tab{min-height:30px!important;padding:5px 9px!important;font-size:var(--ui-font-size)!important;border-radius:9px!important}.tabs .tab[data-view="listView"],.tabs .tab[data-view="fiberView"],.tabs .tab[data-view="settingsView"],.tabs .tab[data-view="usersView"]{display:none!important}.mobile-more-tab{display:inline-flex!important;align-items:center!important;justify-content:center!important}
  .ux-mode-switch{grid-column:2!important;grid-row:2!important;width:128px!important;margin:0!important;display:grid!important;grid-template-columns:1fr 1fr!important;align-self:center!important}.ux-mode-btn{min-height:30px!important;padding:4px 7px!important;font-size:var(--ui-font-size)!important}
  .mobile-nav-menu{display:grid;position:absolute;right:8px;top:calc(100% - 2px);z-index:80;width:min(230px,calc(100vw - 16px));padding:6px;background:var(--ios-surface-strong);border:1px solid var(--ios-separator);border-radius:14px;box-shadow:var(--ios-shadow);backdrop-filter:saturate(160%) blur(20px);-webkit-backdrop-filter:saturate(160%) blur(20px)}.mobile-nav-menu.hidden{display:none!important}.mobile-nav-menu button{min-height:42px;border:0;background:transparent;color:var(--text);border-radius:10px;text-align:left;padding:8px 11px;font:650 var(--ui-font-size) -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Arial,sans-serif}.mobile-nav-menu button:active{background:var(--ios-fill)}body[data-ux-mode="operation"] .mobile-design-nav{display:none!important}

  /* Toolbar: búsqueda limpia + filtros en una fila + cuatro acciones compactas. */
  #mapView>.toolbar{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;padding:6px 8px!important;align-items:center!important}
  #mapView>.toolbar .searchbox{grid-column:1/-1!important;height:36px!important;min-height:36px!important;display:flex!important;min-width:0!important}.searchbox input{height:36px!important;min-height:36px!important;padding:6px 9px!important;font-size:16px!important;overflow:hidden!important;text-overflow:ellipsis!important}.searchbox .btn{height:36px!important;min-height:36px!important;padding:0 10px!important;white-space:nowrap!important}
  #typeFilter{grid-column:1/3!important}#mapStyleSelect{grid-column:3/5!important}#mapView>.toolbar select{height:34px!important;min-height:34px!important;padding:4px 8px!important;border-radius:10px!important;font-size:16px!important}
  #newAssetBtn,#mapLayersBtn,#opticalTraceBtn,.live-status{grid-row:auto!important;width:auto!important;min-width:0!important;min-height:34px!important;height:34px!important;padding:0 5px!important;margin:0!important;border-radius:11px!important;justify-content:center!important;white-space:nowrap!important;font-size:var(--ui-font-size)!important;overflow:hidden!important}
  #newAssetBtn{grid-column:1!important}#mapLayersBtn{grid-column:2!important}#opticalTraceBtn{grid-column:3!important}.live-status{grid-column:4!important}.live-status i{width:7px!important;height:7px!important;flex:none!important}.live-status span{overflow:hidden;text-overflow:ellipsis}

  /* Más superficie útil de mapa y controles flotantes menos invasivos. */
  .map-panel-toggle{width:40px!important;height:40px!important;min-height:40px!important;padding:0!important;border-radius:50%!important;font-size:0!important;display:grid!important;place-items:center!important}.map-panel-toggle::before{content:'ⓘ';font-size:19px!important;line-height:1}.map-layout.panel-open .map-panel-toggle{display:none!important}
  .network-map-legend.legend-collapsed{min-width:0!important;width:40px!important;height:40px!important;padding:0!important;border-radius:50%!important;display:grid!important;place-items:center!important}.network-map-legend.legend-collapsed .legend-title{display:none!important}.network-map-legend.legend-collapsed .legend-head{display:block!important}.network-map-legend.legend-collapsed .legend-toggle{width:40px!important;height:40px!important;padding:0!important;border:0!important;border-radius:50%!important;font-size:17px!important;background:transparent!important}.network-map-legend:not(.legend-collapsed){max-width:260px!important}

  /* Densidad por zoom: el mapa deja de ser una nube de rótulos. */
  #map.mobile-density-low .asset-marker-wrap.type-poste:not(.selected-map-asset):not(.latest-created),
  #map.mobile-density-low .asset-marker-wrap.type-cliente_onu:not(.selected-map-asset):not(.latest-created),
  #map.mobile-density-low .asset-marker-wrap.type-olt:not(.selected-map-asset),#map.mobile-density-low .asset-marker-wrap.type-odf:not(.selected-map-asset),#map.mobile-density-low .asset-marker-wrap.type-edfa:not(.selected-map-asset),#map.mobile-density-low .asset-marker-wrap.type-carrier:not(.selected-map-asset),#map.mobile-density-low .asset-marker-wrap.type-router:not(.selected-map-asset),#map.mobile-density-low .asset-marker-wrap.type-firewall:not(.selected-map-asset),#map.mobile-density-low .asset-marker-wrap.type-switch:not(.selected-map-asset),#map.mobile-density-low .asset-marker-wrap.type-server:not(.selected-map-asset){display:none!important}
  #map.mobile-density-low .cable-name-label,#map.mobile-density-low .segment-meter-label,#map.mobile-density-low .shared-cable-badge,#map.mobile-density-low .asset-map-reserve{display:none!important}
  #map.mobile-density-medium .asset-marker-wrap.type-poste:not(.selected-map-asset) .asset-map-label,#map.mobile-density-medium .asset-marker-wrap.type-cliente_onu:not(.selected-map-asset) .asset-map-label{display:none!important}
  #map.mobile-density-medium .cable-name-label,#map.mobile-density-medium .segment-meter-label,#map.mobile-density-medium .asset-map-reserve{display:none!important}
  #map.mobile-density-low .asset-map-label strong,#map.mobile-density-medium .asset-map-label strong{font-size:10px!important}
  #map.mobile-density-low .asset-marker-wrap.type-mufa .asset-marker,#map.mobile-density-low .asset-marker-wrap.type-nap .asset-marker,#map.mobile-density-low .asset-marker-wrap.type-nodo .asset-marker{width:32px!important;height:32px!important}
  #map .selected-map-asset .asset-map-label,#map .latest-created .asset-map-label,#map .visual-connect-source .asset-map-label,#map .visual-connect-target .asset-map-label{display:block!important}
}
@media(max-width:420px){
  .brand small{display:none!important}.ux-mode-switch{width:118px!important}.tabs .tab{padding-left:8px!important;padding-right:8px!important}
  #newAssetBtn,#mapLayersBtn,#opticalTraceBtn,.live-status{font-size:10px!important}.live-status span{display:none!important}.live-status{width:34px!important;justify-self:stretch!important}
  .mobile-nav-menu{right:6px}
}


/* v1.28.2 · toolbar móvil de dos filas + filtros bajo demanda */
.map-filter-group{display:contents}.map-filter-field{display:contents}.map-filter-field>span,.mobile-map-options-head,.mobile-map-options-button{display:none}
@media(max-width:760px){
  /* Solo búsqueda + acciones. Tipo/estilo viven en un panel bajo demanda. */
  #mapView>.toolbar{position:relative!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;grid-template-rows:36px 34px!important;gap:5px!important;padding:6px 8px!important;z-index:19!important}
  #mapView>.toolbar .searchbox{grid-column:1/4!important;grid-row:1!important;width:100%!important;height:36px!important}
  #mapView>.toolbar .live-status{grid-column:4!important;grid-row:1!important;height:36px!important;min-height:36px!important;border-radius:11px!important;padding:0 6px!important;align-self:stretch!important}
  #newAssetBtn{grid-column:1!important;grid-row:2!important}
  #mobileMapOptionsBtn{display:flex!important;grid-column:2!important;grid-row:2!important;align-items:center!important;justify-content:center!important}
  #mapLayersBtn{grid-column:3!important;grid-row:2!important}
  #opticalTraceBtn{grid-column:4!important;grid-row:2!important}
  #newAssetBtn,#mobileMapOptionsBtn,#mapLayersBtn,#opticalTraceBtn{height:34px!important;min-height:34px!important;padding:0 6px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  body[data-ux-mode="operation"] #mobileMapOptionsBtn{grid-column:1!important}
  body[data-ux-mode="operation"] #mapLayersBtn{grid-column:2!important}
  body[data-ux-mode="operation"] #opticalTraceBtn{grid-column:3/5!important}

  /* Popover compacto de filtros. Usa los select reales para mantener toda la lógica existente. */
  #mapView>.toolbar .map-filter-group{display:none;position:absolute;left:8px;right:8px;top:calc(100% + 5px);z-index:95;grid-template-columns:1fr 1fr;gap:8px;padding:10px;background:var(--ios-surface-strong);border:1px solid var(--ios-separator);border-radius:15px;box-shadow:var(--ios-shadow);backdrop-filter:saturate(170%) blur(22px);-webkit-backdrop-filter:saturate(170%) blur(22px)}
  #mapView>.toolbar .map-filter-group.mobile-open{display:grid!important}
  .mobile-map-options-head{display:flex;grid-column:1/-1;align-items:flex-start;justify-content:space-between;gap:10px;padding:1px 1px 3px}.mobile-map-options-head strong,.mobile-map-options-head small{display:block}.mobile-map-options-head strong{font-size:var(--ui-font-size);color:var(--text)}.mobile-map-options-head small{font-size:var(--ui-font-small)!important;color:var(--muted);margin-top:2px;line-height:1.25}
  .map-filter-field{display:flex!important;min-width:0;flex-direction:column;gap:4px;margin:0!important;color:var(--muted);font-weight:650;font-size:var(--ui-font-small)!important}.map-filter-field>span{display:block!important}.map-filter-field select{width:100%!important;height:38px!important;min-height:38px!important;margin:0!important;padding:5px 8px!important;font-size:16px!important}

  /* Detalles a la izquierda; MapLibre conserva libre toda su columna derecha. */
  .map-panel-toggle{left:10px!important;right:auto!important;top:10px!important}
  .map-layout.panel-open .map-panel-toggle{left:10px!important;right:auto!important}
}
@media(max-width:420px){
  #mapView>.toolbar .live-status span{display:none!important}
  #mapView>.toolbar .live-status{padding:0!important;justify-content:center!important}
  #newAssetBtn,#mobileMapOptionsBtn,#mapLayersBtn,#opticalTraceBtn{font-size:10px!important}
  #mapView>.toolbar .map-filter-group{grid-template-columns:1fr;left:6px;right:6px}.mobile-map-options-head{grid-column:1}
}

@media(max-width:760px){
  #searchBtn{flex:0 0 38px!important;width:38px!important;min-width:38px!important;padding:0!important;font-size:0!important;display:grid!important;place-items:center!important}
  #searchBtn::before{content:'⌕';font-size:20px!important;font-weight:700;line-height:1;color:var(--text)}
}


/* v1.28.3 · cabecera móvil unificada + limpieza de controles de mapa en escritorio */
/* Escritorio: la leyenda conserva toda la información, pero ocupa menos mapa. */
@media(min-width:761px){
  .network-map-legend{padding:7px 8px!important;border-radius:13px!important;font-size:9.5px!important}
  .legend-head{gap:6px!important;margin-bottom:4px!important}.legend-title{font-size:10px!important}.legend-toggle{min-height:26px!important;padding:4px 7px!important;border-radius:8px!important;font-size:9px!important}
  .legend-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px 6px!important}.legend-item{gap:4px!important;font-size:9.5px!important}.legend-symbol{width:18px!important;height:18px!important;border-radius:5px!important;padding:1px!important}.legend-symbol svg{width:13px!important;height:13px!important}
  .legend-lines{margin-top:5px!important;padding-top:5px!important;gap:8px!important;font-size:9.5px!important}.line-demo{width:20px!important}
  .network-map-legend.legend-collapsed{min-width:88px!important;width:auto!important;padding:6px 7px!important}

  /* Detalles nunca comparte la columna de los controles de MapLibre. */
  .map-panel-toggle{left:12px!important;right:auto!important;top:12px!important}
  .map-layout.panel-open .map-panel-toggle{display:none!important}
}

@media(max-width:760px){
  /* En móvil el logotipo identifica la app: el nombre/subtítulo ceden su espacio a navegación. */
  .topbar{
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr) auto!important;
    grid-template-rows:32px 28px!important;
    align-items:center!important;
    column-gap:6px!important;
    row-gap:3px!important;
    padding:5px 7px!important;
    min-height:68px!important;
    overflow:visible!important;
  }
  .brand{grid-column:1!important;grid-row:1/3!important;min-width:38px!important;width:38px!important;height:100%!important;display:grid!important;place-items:center!important;margin:0!important;padding:0!important}
  .brand>div{display:none!important}
  .brand-mark.small{width:36px!important;height:36px!important;border-radius:11px!important;font-size:18px!important}

  /* Todas las secciones están disponibles directamente; se desplazan horizontalmente si hace falta. */
  .tabs{grid-column:2!important;grid-row:1!important;display:flex!important;width:100%!important;min-width:0!important;height:32px!important;align-items:center!important;gap:1px!important;padding:0!important;margin:0!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none!important;overscroll-behavior-x:contain!important;-webkit-overflow-scrolling:touch!important}
  .tabs::-webkit-scrollbar{display:none!important}
  .tabs .tab{display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;min-height:28px!important;height:28px!important;padding:4px 7px!important;border-radius:8px!important;font-size:10px!important;line-height:1!important;white-space:nowrap!important}
  .tabs .tab[data-view="listView"],.tabs .tab[data-view="fiberView"],.tabs .tab[data-view="settingsView"],.tabs .tab[data-view="usersView"]{display:inline-flex!important}
  body[data-ux-mode="operation"] .tabs .tab[data-view="fiberView"],body[data-ux-mode="operation"] .tabs .tab[data-view="settingsView"],body[data-ux-mode="operation"] .tabs .tab[data-view="usersView"]{display:none!important}
  .mobile-more-tab{display:none!important}
  .mobile-nav-menu{display:none!important}

  /* Diseño / Operación usa la segunda línea del espacio que antes ocupaba el nombre. */
  .ux-mode-switch{grid-column:2!important;grid-row:2!important;justify-self:start!important;align-self:center!important;width:146px!important;height:27px!important;margin:0!important;padding:2px!important;display:grid!important;grid-template-columns:1fr 1fr!important;border-radius:9px!important}
  .ux-mode-btn{height:23px!important;min-height:23px!important;padding:2px 6px!important;border-radius:7px!important;font-size:10px!important;line-height:1!important}

  .top-actions{grid-column:3!important;grid-row:1/3!important;display:flex!important;align-items:center!important;align-self:center!important;gap:4px!important;margin:0!important}
  .top-actions #themeToggle{width:32px!important;min-width:32px!important;height:32px!important;min-height:32px!important;padding:0!important;border-radius:10px!important}
  .top-actions #themeToggle .theme-label{display:none!important}.top-actions #themeToggle .theme-icon{font-size:16px!important}
  .top-actions #logoutBtn{height:32px!important;min-height:32px!important;padding:0 8px!important;border-radius:10px!important;font-size:10px!important}

  /* El botón de detalles conserva una zona propia a la izquierda, lejos del zoom. */
  .map-panel-toggle{left:9px!important;right:auto!important;top:9px!important}
  .map-layout.panel-open .map-panel-toggle{display:none!important}
}

@media(max-width:390px){
  .topbar{grid-template-columns:36px minmax(0,1fr) auto!important;padding-left:5px!important;padding-right:5px!important;column-gap:4px!important}
  .brand{min-width:36px!important;width:36px!important}.brand-mark.small{width:34px!important;height:34px!important}
  .tabs .tab{padding-left:6px!important;padding-right:6px!important;font-size:9.5px!important}
  .ux-mode-switch{width:132px!important}.ux-mode-btn{font-size:9.5px!important}
  .top-actions #themeToggle{width:30px!important;min-width:30px!important;height:30px!important}.top-actions #logoutBtn{padding:0 6px!important;font-size:9.5px!important}
}
@media(max-width:760px){
  /* Respeta visibilidad por rol incluso cuando la navegación móvil fuerza las pestañas directas. */
  .tabs .tab.hidden{display:none!important}
}


/* v1.28.4 · señal ligada a marcadores geográficos reales (sin píxeles de pantalla fijos) */
.optical-geo-pulse{position:absolute;width:35px;height:35px;pointer-events:none;display:grid;place-items:center;overflow:visible;z-index:10}
.optical-geo-pulse-single{width:52px;height:52px}
.optical-geo-pulse>span{position:absolute;display:block;pointer-events:none;border-radius:50%;box-sizing:border-box}
.optical-geo-halo{width:100%;height:100%;background:#B7FF00;opacity:.31;box-shadow:0 0 15px rgba(183,255,0,.75);animation:opticalGeoBreathe 1.1s ease-in-out infinite alternate}
.optical-geo-core{width:53%;height:53%;background:#B7FF00;border:3px solid #0b1418;box-shadow:0 0 7px rgba(183,255,0,.9)}
.optical-geo-center{width:15%;height:15%;background:white;border:1px solid #0b1418}
.optical-geo-final .optical-geo-halo{opacity:.42;animation:none}
@keyframes opticalGeoBreathe{from{transform:scale(.77);opacity:.23}to{transform:scale(1);opacity:.48}}
@media(prefers-reduced-motion:reduce){.optical-geo-halo{animation:none}}
#opticalTraceFollow.active{background:#e6f9e4;border-color:#83c67d;color:#245c1e}
html[data-theme="dark"] #opticalTraceFollow.active{background:#193b25;border-color:#367f49;color:#baf59f}

/* v1.28.5 · Resultado vacío de filtros, sin confundirlo con una pérdida de equipos */
.map-search-empty{position:absolute;z-index:8;top:64px;left:50%;transform:translateX(-50%);width:min(380px,calc(100% - 110px));max-width:100%;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--ios-separator,var(--border));border-radius:13px;background:var(--ios-surface-strong,var(--card));color:var(--text);box-shadow:0 4px 14px rgba(0,0,0,.1);text-align:center;font-size:var(--ui-font-size,12px);line-height:1.45}
.map-search-empty .btn{padding:6px 10px;min-height:32px;white-space:nowrap}
@media(max-width:760px){.map-search-empty{top:58px;width:min(340px,calc(100% - 78px));padding:8px 10px}}

/* v1.28.6 · Inventario por tipo. Controles propios: no modifican el filtro del mapa. */
.inventory-overview{margin:0 28px 16px;padding:17px;background:var(--card);border:1px solid var(--border);border-radius:14px;min-width:0}
.inventory-totals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:17px}
.inventory-total-card{display:flex;flex-direction:column;gap:5px;padding:14px 16px;border:1px solid var(--border);border-radius:12px;min-width:0;background:var(--bg)}
.inventory-total-card span{font-size:12px;font-weight:650;color:var(--muted)}
.inventory-total-card strong{font-size:27px;line-height:1.2;font-weight:800;font-variant-numeric:tabular-nums}
.inventory-total-card small{font-size:11px;color:var(--muted);overflow-wrap:anywhere}
.inventory-type-head{display:flex;flex-wrap:wrap;gap:5px 12px;align-items:center;margin-bottom:10px}
.inventory-type-head strong{font-size:13px}.inventory-type-head small{color:var(--muted);font-size:11px}
.inventory-type-counts{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:17px;min-width:0}
.inventory-type-chip{cursor:pointer;display:inline-flex;align-items:center;gap:10px;max-width:100%;min-width:0;padding:9px 11px;border:1px solid var(--border);border-radius:10px;background:var(--card);color:var(--text);font-size:12px}
.inventory-type-chip span{overflow-wrap:anywhere;text-align:left}
.inventory-type-chip strong{font-variant-numeric:tabular-nums;color:var(--green);font-size:13px}
.inventory-type-chip:hover,.inventory-type-chip.active{border-color:var(--green);background:color-mix(in srgb,var(--green) 9%,var(--card))}
.inventory-type-chip:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.inventory-toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:12px}
.inventory-toolbar label{display:flex;flex:1 1 220px;min-width:0;flex-direction:column;gap:6px;font-size:12px;font-weight:650;color:var(--muted)}
.inventory-toolbar label.inventory-search-field{flex:2 1 270px}
.inventory-toolbar input,.inventory-toolbar select{min-width:0;width:100%;color:var(--text)}
.inventory-toolbar .btn{min-height:39px}
.inventory-summary{margin:0;font-size:12px;color:var(--muted);overflow-wrap:anywhere}
html[data-theme="dark"] .inventory-overview,html[data-theme="dark"] .inventory-type-chip{background:var(--card);border-color:var(--border)}
html[data-theme="dark"] .inventory-total-card{background:var(--bg);border-color:var(--border)}
html[data-theme="dark"] .inventory-type-chip:hover,html[data-theme="dark"] .inventory-type-chip.active{border-color:var(--green);background:#173126}
@media(max-width:760px){.inventory-overview{margin:0 12px 14px;padding:12px}.inventory-totals{gap:8px}.inventory-total-card{padding:11px}.inventory-total-card strong{font-size:24px}.inventory-type-counts{gap:6px}.inventory-type-chip{padding:8px}.inventory-toolbar label{flex-basis:100%}.inventory-toolbar .btn{width:100%}}


/* v1.28.7 · Empalmes visuales por punto: sin alterar el modelo de fibra. */
.splice-overview{margin:15px 0 13px;padding:14px;border:1px solid var(--border);border-radius:13px;background:var(--card,#fff);min-width:0}
.splice-overview-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:11px}
.splice-overview-head>div{display:grid;gap:3px;min-width:0}
.splice-overview-head strong{font-size:14px;color:var(--text)}
.splice-overview-head span,.splice-overview-empty{font-size:12px;color:var(--muted)}
.splice-count{flex:0 0 auto;font-size:11px;font-weight:800;padding:6px 9px;border-radius:10px;background:#e6f5ec;color:#17623c}
.splice-overview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,315px),1fr));gap:9px}
.splice-overview-item{border:1px solid var(--border);border-radius:10px;padding:10px;min-width:0;background:#f9fbfa}
.splice-overview-empty{margin:0;padding:5px 0}
.splice-overview-missing{font-size:12px;color:var(--danger)}
.splice-preview{margin-top:8px;border:1px dashed #a9cfb7;border-radius:10px;padding:9px;background:#f6fbf8;min-width:0}
.splice-preview-head{display:flex;justify-content:space-between;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:8px;font-size:11px}
.splice-preview-head strong{color:var(--text)}
.splice-preview-status{font-size:10px;font-weight:800;letter-spacing:.015em;border-radius:8px;padding:3px 7px}
.splice-preview-status.is-saved{color:#16683c;background:#ddf2e5}
.splice-preview-status.is-pending{color:#80600c;background:#fff0bd}
.splice-preview-empty{display:block;font-size:11px;color:var(--muted);line-height:1.4}
.splice-pair{display:grid;grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr);gap:6px;align-items:center;min-width:0}
.splice-end{display:grid;min-width:0;gap:4px;align-self:stretch}
.splice-end-label{font-size:9px;letter-spacing:.025em;font-weight:800;color:var(--muted);overflow-wrap:anywhere}
.splice-fiber-pill{display:flex;align-items:center;align-content:center;gap:4px 5px;flex-wrap:wrap;min-width:0;min-height:54px;padding:8px 9px;border:2px solid var(--splice-fiber-outline,var(--border));background:var(--splice-fiber-bg,var(--card,#fff));border-radius:8px;font-size:11px;line-height:1.3;color:var(--splice-fiber-ink,var(--text));box-shadow:inset 0 0 0 1px rgba(255,255,255,.24);overflow-wrap:anywhere}
.splice-fiber-pill .fiber-swatch{flex:0 0 auto;margin-right:1px;width:13px;height:13px}
.splice-fiber-pill strong{overflow-wrap:anywhere;min-width:0}
.splice-fiber-pill small{width:100%;font-size:10px;color:inherit;opacity:.92;padding-left:19px}
.splice-arrow{font-size:19px;font-weight:900;text-align:center;color:#167b43}
.splice-pair-compact .splice-fiber-pill{padding:5px}
.fiber-table .splice-preview{width:100%;box-sizing:border-box}
html[data-theme="dark"] .splice-overview{background:#151d21;border-color:var(--border)}
html[data-theme="dark"] .splice-overview-item,html[data-theme="dark"] .splice-preview{background:#182a22;border-color:#355645}
html[data-theme="dark"] .splice-fiber-pill{background:var(--splice-fiber-bg,#152027);border-color:var(--splice-fiber-outline,#394d51);color:var(--splice-fiber-ink,var(--text))}
html[data-theme="dark"] .splice-count,html[data-theme="dark"] .splice-preview-status.is-saved{background:#183e2b;color:#97e6b6}
html[data-theme="dark"] .splice-preview-status.is-pending{background:#443615;color:#f5dc87}
html[data-theme="dark"] .splice-arrow{color:#80d5a3}
@media(max-width:520px){.splice-overview{padding:10px}.splice-overview-item{padding:7px}.splice-preview{padding:7px}.splice-pair{gap:3px;grid-template-columns:minmax(0,1fr) 16px minmax(0,1fr)}.splice-end-label{font-size:9px}.splice-fiber-pill{font-size:10px;padding:5px 4px;gap:3px}.splice-fiber-pill small{font-size:9px;padding-left:0}.splice-fiber-pill .fiber-swatch{width:12px;height:12px}.splice-arrow{font-size:16px}}

/* v1.28.8 · Bloque completo del color; los hilos blancos tienen borde contrastado. */
.splice-fiber-pill[data-fiber-color="BLANCO"]{box-shadow:inset 0 0 0 1px #c3cdd3,0 0 0 1px rgba(100,112,120,.15)}
.splice-fiber-pill[data-fiber-color="NEGRO"]{box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.splice-fiber-pill .fiber-swatch{border-color:currentColor;opacity:.85}
@media(max-width:520px){.splice-fiber-pill{min-height:52px;padding:7px 5px}}

/* v1.28.9 · Aro/tubo exterior + núcleo/hilo interior en TODO el módulo de fibra. */
.fiber-duo{--fiber-tube-color:#9da9b0;--fiber-core-color:#9da9b0;display:inline-flex;position:relative;align-items:center;justify-content:center;width:30px;height:30px;min-width:30px;flex:0 0 30px;border-radius:50%;background:var(--fiber-tube-color);border:2px solid rgba(25,39,45,.55);box-sizing:border-box;vertical-align:middle;margin:0 5px 0 0;box-shadow:0 0 0 1px rgba(255,255,255,.3);isolation:isolate}
.fiber-duo-core{display:block;width:15px;height:15px;min-width:15px;border-radius:50%;background:var(--fiber-core-color);border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.65);box-sizing:border-box}
.fiber-duo-label{display:inline-flex;align-items:center;gap:7px;min-width:0;vertical-align:middle;line-height:1.35}
.fiber-duo-label .fiber-duo{margin-right:0}
.fiber-duo-words{display:grid;gap:2px;min-width:0}
.fiber-duo-words strong{font-weight:800;white-space:normal}
.fiber-duo-words small{font-size:11px;color:var(--muted);white-space:normal}
.fiber-duo-legend{display:inline-flex;align-items:center;gap:6px;font-size:11px;line-height:1.35;color:var(--muted);font-weight:600;white-space:normal}
.fiber-duo-legend .fiber-duo{width:23px;height:23px;min-width:23px;flex-basis:23px;margin:0}
.fiber-duo-legend .fiber-duo-core{width:11px;height:11px;min-width:11px;border-width:1.5px}
.fiber-legend-row{margin-top:9px}
.fiber-usage-table td:nth-child(2){min-width:155px}
.fiber-table td:nth-child(2) .fiber-duo{margin-right:5px}
.mobile-fiber-option .fiber-duo{width:29px;height:29px;min-width:29px;flex-basis:29px;margin-right:0}
.mobile-fiber-legend{padding:3px 14px 9px}
.splice-fiber-pill .fiber-duo{width:25px;height:25px;min-width:25px;flex-basis:25px;margin:0 2px 0 0;border-color:rgba(0,0,0,.8)}
.splice-fiber-pill .fiber-duo-core{width:13px;height:13px;min-width:13px}
.splice-fiber-pill small{padding-left:0}
.splice-overview-head .fiber-duo-legend{font-size:10px}
.spl-port-destination .fiber-duo,.olt-internal-summary .fiber-duo,.olt-port-head .fiber-duo,.odf-port-head .fiber-duo{width:20px;height:20px;min-width:20px;flex-basis:20px;margin:0 3px}
.spl-port-destination .fiber-duo-core,.olt-internal-summary .fiber-duo-core,.olt-port-head .fiber-duo-core,.odf-port-head .fiber-duo-core{width:10px;height:10px;min-width:10px;border-width:1px}
html[data-theme="dark"] .fiber-duo{border-color:rgba(255,255,255,.75);box-shadow:0 0 0 1px rgba(0,0,0,.7)}
html[data-theme="dark"] .fiber-duo-core{box-shadow:0 0 0 1px rgba(0,0,0,.9)}
@media(max-width:520px){.fiber-duo{width:28px;height:28px;min-width:28px;flex-basis:28px}.fiber-duo-core{width:14px;height:14px;min-width:14px}.splice-fiber-pill .fiber-duo{width:23px;height:23px;min-width:23px;flex-basis:23px}.fiber-duo-words small{font-size:10px}.fiber-usage-table td:nth-child(2){min-width:136px}}

.fiber-tube-label{display:inline-flex;align-items:center;gap:6px;min-width:0;white-space:normal}.fiber-tube-label .fiber-duo{margin-right:0}

/* v1.29.0: condición física y ocupación independientes en las fichas de fibra. */
.fiber-status-stack{display:grid;gap:7px;min-width:120px}
.fiber-status-choice{display:grid;gap:3px;color:var(--muted);font-size:10px;font-weight:700}
.fiber-status-choice select{width:100%;max-width:100%;margin:0;color:var(--text)}
.fiber-status-choice select:has(option[value="AVERIADA"]:checked){border-color:#c62828;color:#c62828;font-weight:700}
.fiber-physical-warning{margin-top:5px;font-size:10px;font-weight:750;color:#c62828}
.visual-current-fiber{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:7px;padding:6px 8px;border:1px solid var(--border);border-radius:9px;background:var(--card,#fff)}
.visual-current-fiber .fiber-duo-label{min-width:0}
.visual-current-fiber small{font-size:11px;color:var(--muted)}
.visual-fiber-preview .visual-splice-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,295px),1fr));width:100%;gap:8px}
.visual-fiber-preview .splice-pair{padding:8px}
.visual-fiber-preview .splice-pair .splice-fiber-pill{border-radius:8px;padding:6px}
.visual-fiber-preview .splice-pair .splice-arrow{background:transparent;border:0;padding:0}
html[data-theme="dark"] .visual-current-fiber{background:#172126}
@media(max-width:520px){.visual-fiber-preview .visual-splice-cards{grid-template-columns:minmax(0,1fr)}.fiber-status-stack{min-width:0}}

/* Vista previa del asistente de mapa: usa las mismas tarjetas que Fibra. */
.visual-fiber-preview .splice-pair .splice-fiber-pill{
 background:var(--splice-fiber-bg,#fff);color:var(--splice-fiber-ink,#172027);border-color:var(--splice-fiber-outline,var(--border));
}
html[data-theme="dark"] .visual-fiber-preview .splice-pair .splice-fiber-pill{
 background:var(--splice-fiber-bg,#152027);color:var(--splice-fiber-ink,#fff);border-color:var(--splice-fiber-outline,#394d51);
}
.visual-fiber-preview .splice-pair .fiber-duo{background:var(--fiber-tube-color);border-radius:50%;padding:0}
.visual-fiber-preview .splice-pair .fiber-duo-core{background:var(--fiber-core-color);padding:0}
.visual-fiber-preview .splice-pair .splice-end-label{border:0;background:transparent}
.visual-new-fiber-preview{display:flex;flex-wrap:wrap;gap:7px;grid-column:1/-1}
.visual-new-thread{display:inline-flex;align-items:center;gap:5px;padding:6px 8px;border-radius:9px;border:1px solid var(--border);font-size:11px;background:var(--card,#fff);min-width:130px}
.visual-new-fiber-preview small{color:var(--muted);width:100%}

/* v1.29.3 · Plano NOC: un carril visible por conexión física, sin falsas lecturas
   del estado del ODF pasivo. Los trazos/etiquetas mantienen su identidad al cambiar de modo. */
.plant-graph-wrap{min-width:0;margin-bottom:14px}
.plant-graph-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 8px;font-size:12px;color:var(--muted);font-weight:700}
.plant-graph-modes{display:flex;gap:4px;padding:3px;background:var(--panel,#edf2f2);border:1px solid var(--border);border-radius:11px}
.plant-mode-btn{cursor:pointer;border:1px solid transparent;border-radius:8px;padding:6px 12px;background:transparent;color:var(--text);font-size:12px;font-weight:800}
.plant-mode-btn.active{background:var(--card);border-color:var(--border);box-shadow:0 1px 4px rgba(0,0,0,.09)}
.plant-diagram-scroll{max-width:100%;scrollbar-gutter:stable;overscroll-behavior-x:contain}
.plant-diagram{max-width:none}
.plant-link-lane .plant-link-status{stroke-width:2.6;opacity:.92;transition:stroke-width .12s,opacity .12s}
.plant-link-lane:hover .plant-link-status{stroke-width:4;opacity:1}
.plant-link-label-bg{fill:var(--card,#fff);stroke:var(--border,#d9e1e5);stroke-width:.8;opacity:.97}
.plant-link-label{font-size:11px;fill:var(--text);font-weight:750;text-anchor:middle;stroke:none;paint-order:normal}
.plant-link-lane:hover .plant-link-label-bg{stroke:#008243;stroke-width:1.5}
.plant-graph-legend{display:flex;gap:8px 18px;flex-wrap:wrap;color:var(--muted);font-size:11px;line-height:1.5;margin:-5px 0 12px}
.plant-graph-legend span{display:flex;align-items:center;gap:5px}
.plant-graph-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;flex:none}
.plant-node-code{font-size:12px}
@media(max-width:600px){.plant-graph-bar{align-items:flex-start}.plant-graph-modes{width:100%}.plant-mode-btn{flex:1}.plant-graph-legend{font-size:10px}}

/* CMS ISP Design v1.30.1 - redes de radio documentadas. */
.wireless-link-line{fill:none;stroke-width:3.3;stroke-dasharray:9 7;stroke-linecap:round;opacity:.96;pointer-events:none}
.wireless-link-hit{fill:none;stroke:transparent;stroke-width:20;pointer-events:stroke;cursor:pointer}
.wireless-waves{pointer-events:none;filter:drop-shadow(0 1px 2px rgba(255,255,255,.65))}
.wireless-link-label{font:700 11px Inter,Segoe UI,Arial,sans-serif;fill:#075985;stroke:#fff;stroke-width:4px;paint-order:stroke;text-anchor:middle;pointer-events:none}
.wireless-demo{width:38px;display:inline-block;border-top:3px dashed #0284c7;vertical-align:middle}
.wireless-detail{border:1px solid var(--border);border-radius:12px;padding:12px;margin:12px 0;background:var(--card,#fff)}
.wireless-detail-heading,.wireless-detail-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.wireless-detail-link{padding:10px 2px;border-top:1px solid var(--border);margin-top:8px;display:grid;gap:4px}
.wireless-detail-link small{color:var(--muted)}
.wireless-detail-actions{justify-content:flex-start;margin-top:4px}
.wireless-modal{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;padding:12px}
.wireless-modal.hidden{display:none}
.wireless-backdrop{position:absolute;inset:0;background:rgba(8,25,33,.67)}
.wireless-shell{position:relative;max-height:calc(100dvh - 24px);overflow:auto;width:min(650px,100%);background:var(--card,#fff);color:var(--text);border:1px solid var(--border);border-radius:16px;padding:18px;display:grid;gap:10px;box-shadow:0 16px 45px rgba(0,0,0,.3)}
.wireless-shell label{min-width:0}.wireless-shell input,.wireless-shell select,.wireless-shell textarea{width:100%;box-sizing:border-box}
@media(max-width:620px){.wireless-modal{padding:0;align-items:stretch}.wireless-shell{border-radius:0;max-height:100dvh;height:100dvh;width:100%;padding:14px;align-content:start;grid-template-columns:minmax(0,1fr)}.wireless-shell .form-grid.two{grid-template-columns:1fr}}

/* v1.30.4 · Controles de prueba masiva mixta. */
.optical-mass-wireless-toggle{display:flex;align-items:center;gap:9px;font-weight:600;margin:8px 0 4px;line-height:1.4}
.optical-mass-wireless-toggle input{width:17px;height:17px;flex:none;accent-color:#008243}

/* v1.30.5 · Editor físico de planta interna por racks (sin alterar tablas de conexiones). */
.rack-patch-editor{border:1px solid var(--border);background:var(--card);border-radius:15px;padding:12px;margin:12px 0 16px;min-width:0}
.rack-patch-top{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center}
.rack-patch-top strong,.rack-patch-top small{display:block}.rack-patch-top strong{font-size:14px}.rack-patch-top small{font-size:11px;color:var(--muted);margin-top:4px}
.rack-patch-feedback{font-size:12px;color:var(--muted);background:var(--panel,#edf3f1);border-radius:8px;margin:10px 0;padding:9px;line-height:1.4}
.rack-patch-scroll{max-width:100%;overflow:auto;padding:2px 0 12px;overscroll-behavior-x:contain}
.rack-patch-board{position:relative;width:max-content;min-width:100%;min-height:220px;padding:18px 12px 34px}
.rack-patch-zones{display:flex;align-items:flex-start;gap:64px;position:relative;z-index:2}
.rack-patch-rack{width:255px;flex:none;border:2px solid var(--border);background:var(--panel,#f3f7f6);border-radius:12px;padding:9px;box-shadow:0 2px 6px rgba(0,0,0,.04)}
.rack-patch-rack>header{display:flex;flex-direction:column;gap:3px;margin-bottom:12px;padding:6px 8px;border-bottom:1px solid var(--border)}
.rack-patch-rack>header strong{font-size:12px}.rack-patch-rack>header small{font-size:10px;color:var(--muted)}
.rack-patch-devices{display:flex;flex-direction:column;gap:14px}
.rack-patch-device{border:1px solid var(--border);background:var(--card,#fff);border-radius:10px;padding:9px;min-width:0}
.rack-patch-device-head{display:flex;align-items:center;gap:7px;margin-bottom:9px}.rack-patch-device-head svg{width:22px;height:22px;flex:none}
.rack-patch-device-head span{min-width:0}.rack-patch-device-head b,.rack-patch-device-head small{display:block;overflow-wrap:anywhere;font-size:11px}.rack-patch-device-head small{color:var(--muted);font-size:9px}
.rack-patch-port-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.rack-patch-port{position:relative;z-index:3;display:flex;align-items:center;justify-content:flex-start;gap:5px;flex-wrap:wrap;min-height:36px;border:1px solid var(--border);border-radius:7px;padding:5px;background:var(--card,#fff);color:var(--text);cursor:crosshair;text-align:left;touch-action:none;user-select:none}
.rack-patch-port b{font-size:10px}.rack-patch-port small{font-size:8px;color:var(--muted)}
.rack-patch-indicator{width:8px;height:8px;flex:none;border-radius:50%;background:#16a34a}
.rack-patch-port.is-used .rack-patch-indicator{background:#64748b}.rack-patch-port.is-rf .rack-patch-indicator{background:#0284c7}
.rack-patch-port.is-used{background:var(--panel,#eff3f5)}.rack-patch-port.selected{outline:3px solid #16a34a;outline-offset:1px}
.rack-patch-editor[data-rack-editor="view"] .rack-patch-port{cursor:default;touch-action:auto}
.rack-patch-wires{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible;pointer-events:none}
.rack-patch-wire{pointer-events:visibleStroke;cursor:pointer}.rack-patch-wire-line{fill:none;stroke:var(--patch-color,#2563eb);stroke-width:2.6;pointer-events:none}
.rack-patch-wire-hit{fill:none;stroke:transparent;stroke-width:11;pointer-events:stroke}
.rack-patch-wire:hover .rack-patch-wire-line{stroke-width:5}
.rack-patch-wire.rack-patch-rf .rack-patch-wire-line{stroke-dasharray:8 5;stroke-width:3}
.rack-patch-draft{fill:none;stroke:#008243;stroke-width:3;stroke-dasharray:6 5;pointer-events:none}
.rack-patch-selection{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px;border:1px solid var(--border);border-radius:9px;font-size:11px;margin-top:8px}
.rack-patch-selection.hidden{display:none}.rack-patch-selection span{color:var(--muted)}
.rack-legacy-diagram,.rack-classic-tools{margin:12px 0;border:1px solid var(--border);border-radius:12px;padding:10px;background:var(--card,#fff)}
.rack-legacy-diagram>summary,.rack-classic-tools>summary{cursor:pointer;font-weight:700;padding:6px;font-size:12px}
.rack-classic-tools>.plant-grid{margin-top:12px}
.optical-trace-summary{grid-template-columns:repeat(5,minmax(0,1fr))}
.optical-trace-summary .documented strong{color:#2563eb}
.optical-result-card.status-documented .optical-result-icon{color:#2563eb;background:#dbeafe}
.optical-result-card.status-documented{border-color:#bfdbfe}
html[data-theme="dark"] .optical-result-card.status-documented .optical-result-icon{color:#93c5fd;background:#173457}
@media(max-width:760px){.optical-trace-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.rack-patch-rack{width:218px}.rack-patch-zones{gap:40px}.rack-patch-board{padding:12px 8px 24px}}

/* Los huecos entre racks dejan seleccionar los cables SVG; solo los puertos capturan arrastre. */
.rack-patch-zones,.rack-patch-rack,.rack-patch-rack>header,.rack-patch-devices,.rack-patch-device,.rack-patch-device-head,.rack-patch-port-grid{pointer-events:none}
.rack-patch-port{pointer-events:auto}
.rack-patch-wire-line{stroke-linecap:round}
.rack-patch-port:focus-visible{outline:3px solid #008243;outline-offset:2px}

.rack-patch-port-cell.hidden{display:none!important}
.rack-patch-port-cell{min-width:0}.rack-patch-port-cell>.rack-patch-port{width:100%}
.rack-patch-expand{display:block;margin:8px 0 0;width:100%;background:transparent;border:1px dashed var(--border);color:var(--text);font-size:10px;padding:7px;cursor:pointer;border-radius:7px;pointer-events:auto}

/* CMS ISP Design v1.30.6 — vista frontal ilustrativa. Mismas conexiones e IDs que el NOC. */
.rack-patch-real{--rack-rail:#0d2744;--rack-chassis:#163653;--rack-face:#1e4265;--rack-ink:#f3f9ff}
.rack-patch-real .rack-patch-top{gap:12px}
.rack-patch-inspector{border:1px solid #b7d8e8;background:#edf7fd;color:#124365;border-radius:9px;padding:9px 12px;font-size:12px;line-height:1.5;min-height:38px;font-weight:600;margin:8px 0}
html[data-theme="dark"] .rack-patch-inspector{background:#112f43;color:#d7efff;border-color:#355d73}
.rack-patch-real .rack-patch-zones{gap:114px;z-index:auto}
.rack-patch-real .rack-patch-board{padding:25px 28px 44px;min-height:300px}
.rack-patch-real .rack-patch-rack{width:430px;padding:0;background:var(--rack-rail);color:var(--rack-ink);border:5px solid #102b4a;border-radius:14px;box-shadow:inset 0 0 0 2px #4a7094,0 9px 19px rgba(18,43,75,.18);overflow:visible}
.rack-patch-real .rack-patch-rack>header{padding:12px 18px;margin:0;border-bottom:2px solid #38577a;min-height:60px;gap:4px}
.rack-patch-real .rack-patch-rack>header strong{font-size:14px;color:#fff}
.rack-patch-real .rack-patch-rack>header small{color:#c3d9ee;font-size:11px}
.rack-patch-cabinet{display:grid;grid-template-columns:15px minmax(0,1fr) 15px;gap:7px;background:#0f263f;padding:10px 4px 14px;min-height:118px}
.rack-patch-rail{border:1px solid #3a6181;border-radius:4px;background:repeating-linear-gradient(to bottom,#375f81 0,#375f81 5px,#091f35 5px,#091f35 10px,#091f35 21px,#d0dfeb 21px,#d0dfeb 27px,#091f35 27px,#091f35 40px)}
.rack-patch-real .rack-patch-devices{gap:11px;padding:3px 0;min-width:0}
.rack-patch-real .rack-patch-device{border:2px solid #52708c;border-radius:5px;background:var(--rack-chassis);color:var(--rack-ink);padding:9px;position:relative;min-width:0;box-shadow:inset 0 -3px 0 #0b2840}
.rack-patch-real .rack-patch-device-head{display:flex;align-items:center;gap:7px;margin:0 0 8px;min-width:0}
.rack-patch-real .rack-patch-device-head svg{width:19px;height:19px;color:#7dc8ff}
.rack-patch-real .rack-patch-device-title{min-width:0;flex:1}
.rack-patch-real .rack-patch-device-title b{font-size:11px;color:#fff}
.rack-patch-real .rack-patch-device-title small{font-size:9px;color:#bcd0e0}
.rack-patch-mount{color:#a3b7c6;flex:none;font-size:11px}
.rack-patch-health{width:9px;height:9px;border-radius:50%;background:var(--rack-health,#8292a3);box-shadow:0 0 0 2px #09243e;flex:none}
.rack-patch-real .rack-patch-port-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.rack-patch-real .rack-patch-port{display:flex;align-items:center;justify-content:center;flex-direction:column;flex-wrap:nowrap;gap:2px;min-width:0;min-height:64px;padding:4px 3px 5px;background:#254969;border:1px solid #6c8ea7;border-radius:5px;color:#fff;box-shadow:0 1px 0 #071c33;position:relative;z-index:7;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease;pointer-events:auto}
.rack-patch-real .rack-patch-port b{font-size:10px;line-height:1.1;color:#fff;max-width:100%;overflow-wrap:anywhere;text-align:center}
.rack-patch-real .rack-patch-port small{font-size:8px;color:#c9dfef;line-height:1.1}
.rack-patch-jack{height:16px;width:25px;display:block;border:2px solid #eab84a;background:#0a1e35;border-radius:2px;position:relative;box-shadow:inset 0 0 0 2px #0d2a46}
.rack-patch-jack i{position:absolute;left:7px;right:7px;top:0;height:5px;background:#eab84a;border-radius:0 0 2px 2px}
.rack-patch-real .rack-patch-port[data-patch-type="FIBRA"] .rack-patch-jack,.rack-patch-real .rack-patch-port[data-patch-type="GPON"] .rack-patch-jack,.rack-patch-real .rack-patch-port[data-patch-type="SFP"] .rack-patch-jack,.rack-patch-real .rack-patch-port[data-patch-type="SFP+"] .rack-patch-jack{border-color:#66b8ed}
.rack-patch-real .rack-patch-port.is-rf .rack-patch-jack{border-radius:50%;width:19px;border-color:#73d4fa}
.rack-patch-real .rack-patch-port .rack-patch-indicator{position:absolute;top:5px;right:6px;width:6px;height:6px;background:#2fda8f}
.rack-patch-real .rack-patch-port.is-used .rack-patch-indicator{background:#f0d55b}
.rack-patch-real .rack-patch-port.is-used{background:#2c526f}
.rack-patch-real .rack-patch-port.selected{outline:3px solid #39d4a1;outline-offset:1px}
.rack-patch-real .rack-patch-port.rack-patch-lit{border-color:#ffdf60;background:#3c6382;box-shadow:0 0 0 2px #ffdf60,0 0 17px rgba(255,221,95,.65);transform:translateY(-1px);z-index:8}
.rack-patch-real .rack-patch-port.rack-patch-muted{opacity:.55}
.rack-patch-real .rack-patch-rack .rack-patch-foot{color:#aec2d3;font-size:10px;text-align:center;padding:7px 3px 9px}
.rack-patch-real .rack-patch-empty{font-size:12px;text-align:center;color:#bbd0de;padding:20px 6px}
.rack-patch-real .rack-patch-expand{color:#eef8ff;border-color:#567998;background:#284967;font-size:11px}
.rack-patch-real .rack-patch-wires{z-index:4;pointer-events:none;overflow:visible}
.rack-patch-real .rack-patch-wire{pointer-events:visibleStroke}
.rack-patch-real .rack-patch-wire-line{stroke-width:3.5;opacity:.79;transition:opacity .13s ease,stroke-width .13s ease;pointer-events:none}
.rack-patch-real .rack-patch-wire-hit{stroke-width:15;pointer-events:stroke}
.rack-patch-real .rack-patch-wire.rack-patch-highlight .rack-patch-wire-line{stroke:#f4c542;stroke-width:7;opacity:1;filter:drop-shadow(0 0 4px #f4c542)}
.rack-patch-real .rack-patch-wire.rack-patch-muted .rack-patch-wire-line{opacity:.12;stroke-width:2}
.rack-patch-real .rack-patch-wire:hover .rack-patch-wire-line{stroke-width:6;opacity:1}
.rack-patch-real .rack-patch-port:focus-visible{outline:3px solid #ffda58;outline-offset:2px}
@media(max-width:760px){.rack-patch-real .rack-patch-board{padding:16px 12px 25px}.rack-patch-real .rack-patch-zones{gap:65px}.rack-patch-real .rack-patch-rack{width:336px}.rack-patch-real .rack-patch-port-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.rack-patch-real .rack-patch-port{min-height:66px}.rack-patch-real .rack-patch-inspector{font-size:11px}}

/* v1.30.7: topología técnica separada del editor físico de racks */
.noc-view-switch{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border:1px solid var(--border);border-radius:15px;background:var(--card);margin:12px 0}
.noc-view-switch>div:first-child{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.noc-view-btn{font-size:12px;font-weight:750;cursor:pointer;border:1px solid transparent;border-radius:10px;padding:9px 14px;color:var(--muted);background:transparent}
.noc-view-btn.active{background:#e6f5ed;color:#00713d;border-color:#b5dbc9}
.noc-view-switch small{color:var(--muted);font-size:11px}
.noc-topology{margin:9px 0 16px;border-radius:18px;border:1px solid var(--border);background:var(--card);min-width:0;overflow:hidden;box-shadow:0 8px 29px rgba(20,39,54,.045)}
.noc-top-toolbar{min-height:74px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:13px 18px;border-bottom:1px solid var(--border)}
.noc-top-toolbar-title{display:grid;gap:4px}.noc-top-toolbar-title strong{font-size:15px;color:var(--text)}.noc-top-toolbar-title span{font-size:12px;color:var(--muted)}
.noc-top-actions{display:flex;align-items:center;gap:6px}.noc-top-actions button{border:1px solid var(--border);min-height:36px;min-width:37px;border-radius:10px;background:var(--card);color:var(--text);font-size:14px;font-weight:750;cursor:pointer}
.noc-top-actions button:hover{border-color:#008243;background:#eaf6ee;color:#006e38}.noc-top-actions [data-top-zoom="fit"]{padding:0 12px;font-size:12px}
.noc-top-actions [data-top-zoom="reset"]{font-size:12px;padding:0 10px}.noc-top-actions [data-top-zoom-level]{min-width:44px;text-align:center;color:var(--muted);font-size:11px;font-weight:700}
.noc-top-viewport{height:540px;position:relative;overflow:hidden;touch-action:none;user-select:none;cursor:grab;background:radial-gradient(circle at 50% 0%,#f5fbfd 0%,#f8fbfd 57%,#f1f7f9 100%);outline:0}
.noc-top-viewport:focus-visible{outline:2px solid var(--green);outline-offset:-2px}.noc-top-viewport.panning{cursor:grabbing}
.noc-top-svg{position:absolute;left:0;top:0;max-width:none;overflow:visible;transform-origin:0 0;will-change:transform}
.noc-top-card-shadow{fill:#1d4664;opacity:.07}.noc-top-card{fill:#fff;stroke:#d8e4ed;stroke-width:1.2;transition:stroke .15s,filter .15s}
.noc-top-node{cursor:pointer;outline:none}.noc-top-node:hover .noc-top-card,.noc-top-node.is-active .noc-top-card,.noc-top-node:focus-visible .noc-top-card{stroke:#008243;stroke-width:2.5;filter:drop-shadow(0 5px 9px rgba(0,115,63,.17))}
.noc-top-type{font-size:9.7px;font-weight:800;letter-spacing:.65px;fill:#6b7c8b}.noc-top-code{font-size:13px;font-weight:800;fill:#1e3345}.noc-top-divider{stroke:#e7edf2;stroke-width:1}
.noc-top-status{font-size:9.4px;font-weight:750;fill:#53697c}.noc-top-count{font-size:11px;font-weight:750;fill:#a3b4c0}
.noc-top-edge{cursor:pointer;outline:none}.noc-top-edge-hit{fill:none;stroke:transparent;stroke-width:19;pointer-events:stroke}
.noc-top-edge-path{fill:none;stroke-width:2.8;stroke-linecap:round;opacity:.84;pointer-events:none;transition:opacity .15s,stroke-width .15s}
.noc-top-edge-path.rf{stroke-dasharray:8 7}.noc-top-edge:hover .noc-top-edge-path,.noc-top-edge.is-active .noc-top-edge-path,.noc-top-edge:focus-visible .noc-top-edge-path{stroke-width:5.4;opacity:1;filter:drop-shadow(0 0 4px rgba(0,116,215,.3))}
.noc-top-edge-badge{fill:#fff;stroke:#dce6ed;stroke-width:1;pointer-events:none}.noc-top-edge-text{fill:#334e64;text-anchor:middle;font-size:10.2px;font-weight:800;pointer-events:none}
.noc-top-edge.is-active .noc-top-edge-badge,.noc-top-edge:hover .noc-top-edge-badge{stroke:#38a17d;stroke-width:1.8}
.noc-top-hint{position:absolute;left:15px;bottom:12px;border-radius:9px;padding:6px 9px;font-size:10px;color:#73869a;background:rgba(255,255,255,.91);border:1px solid #e4edf2;pointer-events:none}
.noc-top-inspector{margin:12px 15px;padding:13px 15px;min-height:63px;border-radius:12px;border:1px solid #d9e6eb;background:#f6fbfc;color:#526778;font-size:12px;line-height:1.5;overflow:auto;max-height:240px}
.noc-top-detail{display:flex;align-items:center;flex-wrap:wrap;gap:20px}.noc-top-detail>div{display:grid;gap:3px;min-width:105px}.noc-top-detail strong{color:#163f50;font-size:13px}.noc-top-detail span,.noc-top-detail small{color:#607688;font-size:11px}
.noc-top-detail b{font-size:14px;color:#285775}.noc-top-link-info{display:flex;gap:13px;align-items:center;flex-wrap:wrap;margin-bottom:7px}.noc-top-link-info strong{color:#203f54}
.noc-top-link-table{display:grid;gap:5px;max-height:165px;overflow:auto}.noc-top-link-table>div{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--card);border:1px solid var(--border);padding:7px 10px;border-radius:8px;color:var(--text)}
.noc-top-link-table b{color:#285b80}.noc-top-link-table em{font-size:10px;font-weight:700;font-style:normal;color:var(--muted)}.noc-top-disclaimer{display:block;margin-top:8px;color:var(--muted)}
.noc-top-legend{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:5px 17px 16px;font-size:11px;color:var(--muted)}.noc-top-legend span{display:flex;gap:6px;align-items:center}.noc-top-legend i{width:13px;height:4px;border-radius:2px;display:inline-block}.noc-top-legend small{flex-basis:100%;font-size:10px}
.noc-top-empty{border:1px dashed var(--border);border-radius:14px;padding:40px 14px;text-align:center;color:var(--muted)}
html[data-theme="dark"] .noc-top-viewport{background:radial-gradient(circle at 50% 0%,#122b34,#0e2028)}
html[data-theme="dark"] .noc-top-card{fill:#1b323f;stroke:#4a6574}
html[data-theme="dark"] .noc-top-type,html[data-theme="dark"] .noc-top-status{fill:#a6c2cf}
html[data-theme="dark"] .noc-top-code{fill:#eef7f8}html[data-theme="dark"] .noc-top-divider{stroke:#3b5361}
html[data-theme="dark"] .noc-top-edge-badge{fill:#19303b;stroke:#456172}html[data-theme="dark"] .noc-top-edge-text{fill:#e0f0f5}
html[data-theme="dark"] .noc-top-inspector{background:#19303b;border-color:#435c68;color:#d7e8ef}html[data-theme="dark"] .noc-top-detail strong{color:#ebf8ff}
html[data-theme="dark"] .noc-top-hint{background:#172b35;color:#c1d1da;border-color:#36505a}html[data-theme="dark"] .noc-view-btn.active{background:#133c31;color:#b2e9ce;border-color:#2a6e4b}
@media(max-width:760px){.noc-top-viewport{height:470px}.noc-top-toolbar{padding:11px}.noc-top-actions{width:100%;justify-content:flex-start}.noc-view-switch{padding:9px}.noc-view-switch small{flex-basis:100%}.noc-top-legend{gap:9px}.noc-top-hint{font-size:9px}}
/* El técnico también puede seleccionar la etiqueta del enlace, además de la línea. */
.noc-top-edge-badge,.noc-top-edge-text{pointer-events:all;cursor:pointer}

/* CMS ISP Design v1.30.8 — rack frontal compacto y legible.
   Hasta 8 puertos por fila en escritorio; el panel mantiene desplazamiento
   horizontal para no comprimir nombres ni cambiar conexiones existentes. */
.rack-patch-real .rack-patch-rack{width:640px}
.rack-patch-real .rack-patch-zones{gap:98px}
.rack-patch-real .rack-patch-rack>header{padding:13px 17px 12px;min-height:62px}
.rack-patch-real .rack-patch-rack>header strong{font-size:15px;letter-spacing:.01em;line-height:1.25}
.rack-patch-real .rack-patch-rack>header small{font-size:11px;line-height:1.4}
.rack-patch-real .rack-patch-device{padding:11px 12px 12px}
.rack-patch-real .rack-patch-device-head{gap:9px;margin-bottom:10px;align-items:center}
.rack-patch-real .rack-patch-device-head svg{width:20px;height:20px}
.rack-patch-real .rack-patch-device-title b{font-size:12px;line-height:1.4;letter-spacing:.015em;overflow-wrap:normal;word-break:normal}
.rack-patch-real .rack-patch-device-title small{font-size:10px;line-height:1.45;overflow-wrap:anywhere}
.rack-patch-real .rack-patch-port-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:7px}
.rack-patch-real .rack-patch-port-cell{min-width:0}
.rack-patch-real .rack-patch-port{
  min-width:0;min-height:69px;padding:8px 2px 7px;gap:4px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;line-height:1.15;border-radius:6px;
}
.rack-patch-real .rack-patch-port .rack-patch-jack{flex:none}
.rack-patch-real .rack-patch-port b{
  display:block;width:100%;min-width:0;padding:0 1px;
  font-size:10.5px;line-height:1.17;font-weight:800;letter-spacing:-.015em;
  white-space:nowrap;overflow:hidden;text-overflow:clip;overflow-wrap:normal;word-break:normal;
}
.rack-patch-real .rack-patch-port small{
  display:block;max-width:100%;font-size:9px;line-height:1.15;
  font-weight:500;letter-spacing:.02em;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;
}
.rack-patch-real .rack-patch-port .rack-patch-indicator{top:5px;right:5px;width:6px;height:6px}
.rack-patch-real .rack-patch-devices{gap:12px}
.rack-patch-real .rack-patch-inspector{line-height:1.5;overflow-wrap:anywhere}
.rack-patch-real .rack-patch-wire-line{stroke-linecap:round;stroke-linejoin:round;opacity:.82}
.rack-patch-real .rack-patch-wire.rack-patch-highlight .rack-patch-wire-line{
  stroke-width:6;opacity:1;filter:drop-shadow(0 0 3px #f4c542)
}
.rack-patch-real .rack-patch-port.rack-patch-lit{transform:none}
/* El ancho de cada puerto se mantiene utilizable aun en pantalla estrecha;
   el desplazamiento horizontal existente permite ver los racks completos. */
@media(max-width:760px){
  .rack-patch-real .rack-patch-rack{width:398px}
  .rack-patch-real .rack-patch-zones{gap:58px}
  .rack-patch-real .rack-patch-port-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
  .rack-patch-real .rack-patch-port{min-height:69px}
}

/* CMS ISP Design v1.30.9 — edición integrada en NOC y zoom independiente del rack. */
#nocView > .node-plant-modal.node-plant-inline{
  position:relative;inset:auto;z-index:auto;width:auto;margin:0 28px 28px;
  padding:0;display:block;overflow:visible;background:transparent;
}
#nocView > .node-plant-modal.node-plant-inline.hidden{display:none}
.node-plant-inline .node-plant-backdrop{display:none}
.node-plant-inline .node-plant-shell{
  width:100%;max-height:none;height:auto;min-width:0;overflow:visible;
  border-radius:15px;box-shadow:none;border:1px solid var(--border);
}
.node-plant-inline .node-plant-head{position:relative;top:auto;border-radius:15px 15px 0 0}
.node-plant-inline .node-plant-content{min-width:0}
.node-plant-inline .rack-patch-scroll{min-height:360px;max-height:min(76vh,950px)}
.rack-patch-zoom-controls{display:flex;align-items:center;flex-wrap:wrap;gap:5px;padding:4px;
  border:1px solid var(--border);border-radius:9px;background:var(--panel,#f3f7f6)}
.rack-patch-zoom-controls [data-rack-zoom-label]{display:inline-block;min-width:50px;text-align:center;font-size:12px;font-weight:700;color:var(--text)}
.rack-patch-real .rack-patch-scroll{min-height:340px;max-height:75vh;cursor:grab;touch-action:pan-x pan-y}
.rack-patch-real .rack-patch-scroll.rack-patch-panning{cursor:grabbing;user-select:none}
.rack-patch-zoom-surface{position:relative;min-width:0;min-height:0}
.rack-patch-zoom-surface>.rack-patch-board{
  width:max-content;min-width:0;transform-origin:top left;will-change:transform;
}
.rack-patch-real .rack-patch-focus-wires{
  position:absolute;inset:0;width:100%;height:100%;z-index:25;pointer-events:none;overflow:visible;
}
.rack-patch-focus-halo{fill:none;stroke:rgba(9,24,37,.86);stroke-width:11px;stroke-linecap:round;stroke-linejoin:round}
.rack-patch-focus-line{fill:none;stroke:#ffe169;stroke-width:6px;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgba(255,220,74,.92))}
.rack-patch-real .rack-patch-wires{z-index:4}
.rack-patch-real .rack-patch-wire-hit{stroke-width:18}
.rack-patch-real .rack-patch-port.rack-patch-lit{outline:2px solid #ffe169;outline-offset:1px}
@media(max-width:760px){
  #nocView > .node-plant-modal.node-plant-inline{margin:0 12px 20px}
  .node-plant-inline .node-plant-content{padding:10px}
  .rack-patch-zoom-controls{gap:3px}
  .rack-patch-zoom-controls .mini-btn{min-height:36px;padding:5px 9px}
  .rack-patch-real .rack-patch-scroll{max-height:70vh;min-height:300px}
}

/* v1.31.0 · Inspección de planta externa por poste / mufa / NAP. */
.external-point-modal{position:fixed;inset:0;z-index:9100;display:flex;align-items:center;justify-content:center;padding:18px}
.external-point-modal.hidden{display:none!important}.external-point-backdrop{position:absolute;inset:0;background:rgba(12,25,35,.60)}
.external-point-shell{position:relative;display:flex;flex-direction:column;width:min(1020px,100%);max-height:min(90dvh,940px);background:var(--card,#fff);color:var(--text);border:1px solid var(--border);border-radius:17px;box-shadow:0 22px 90px rgba(0,0,0,.25);overflow:hidden}
.external-point-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid var(--border)}
.external-point-head strong,.external-point-head small{display:block}.external-point-head strong{font-size:17px}.external-point-head small{font-size:12px;color:var(--muted);margin-top:4px}
.external-point-body{padding:16px 20px;min-height:0;overflow:auto}.external-point-note{font-size:12px;color:var(--muted);line-height:1.55;margin:0 0 13px}
.external-point-cable-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:10px}.external-point-cable-btn{display:flex;flex-direction:column;gap:6px;text-align:left;border:1px solid var(--border);border-radius:12px;padding:12px;background:var(--card,#fff);color:var(--text);cursor:pointer}
.external-point-cable-btn:hover,.external-point-cable-btn:focus-visible{outline:2px solid #008243;outline-offset:1px}.external-point-cable-btn strong{font-size:14px}.external-point-cable-btn span{font-size:12px}.external-point-cable-btn small{font-size:11px;color:var(--muted)}
.external-point-toolbar{display:flex;justify-content:space-between;gap:8px;margin-bottom:10px}.external-point-cable-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.external-point-cable-title h3{margin:0;font-size:17px}.external-point-cable-title span{color:var(--muted);font-size:12px}
.external-point-route,.external-point-counts{font-size:12px;color:var(--muted);line-height:1.5;margin:7px 0}.external-point-table-wrap{max-height:55dvh;overflow:auto;border:1px solid var(--border);border-radius:12px;margin:12px 0}.external-point-table{width:100%;min-width:540px;border-collapse:separate;border-spacing:0}.external-point-table th{position:sticky;top:0;z-index:2;background:var(--card,#fff);font-size:11px;color:var(--muted);text-align:left;padding:11px;border-bottom:1px solid var(--border)}
.external-point-table td{padding:9px 11px;font-size:12px;vertical-align:middle;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--point-hilo) 22%,var(--card,#fff))}.external-point-table tr:not(.no-reach) td:first-child{box-shadow:inset 4px 0 var(--point-hilo)}
.external-point-table td small{display:block;font-size:11px;margin-top:4px;color:inherit}.external-point-table tr.no-reach td{background:color-mix(in srgb,var(--point-hilo) 5%,var(--card,#fff));opacity:.72}.external-point-dest{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px;padding-top:5px;border-top:1px dashed var(--border)}.external-point-dest .fiber-duo-label{font-size:11px}.external-point-dest small{color:var(--muted)}.external-point-fault{font-weight:750;color:#ba1e2d!important}
.fiber-usage-table tr.fiber-usage-colored-row td{background:color-mix(in srgb,var(--point-hilo) 22%,var(--card,#fff))}.fiber-usage-table tr.fiber-usage-colored-row td:first-child{box-shadow:inset 4px 0 var(--point-hilo)}
@media(max-width:650px){.external-point-modal{padding:0}.external-point-shell{width:100%;max-height:100dvh;height:100dvh;border-radius:0}.external-point-head,.external-point-body{padding:12px}.external-point-cable-list{grid-template-columns:1fr}.external-point-table-wrap{max-height:68dvh}}

.fiber-table tr.fiber-row-colored td{background:color-mix(in srgb,var(--point-hilo) 13%,var(--card,#fff))}
.fiber-table tr.fiber-row-colored td:first-child{box-shadow:inset 4px 0 var(--point-hilo)}
.fiber-table tr.fiber-row-colored:hover td{background:color-mix(in srgb,var(--point-hilo) 23%,var(--card,#fff))}

.map-context-menu{max-height:calc(100% - 16px);overflow-y:auto}

/* v1.31.1 · Puertos ocultos hasta expandir la tarjeta, también en planta interna. */
.noc-port-list[hidden]{display:none!important}
.noc-card-actions{align-items:center;gap:7px;flex-wrap:wrap}
.noc-port-count{font-size:11px;color:var(--muted);margin-right:auto;white-space:nowrap}
.noc-toggle-ports{border-color:var(--accent);color:var(--accent)}
.noc-toggle-ports[aria-expanded="true"]{background:var(--panel,#f4f7f8)}
.noc-ports-empty{padding:12px 13px}
@media(max-width:520px){.noc-card-actions{gap:6px}.noc-port-count{width:100%;margin-right:0}.noc-card-actions .mini-btn{flex:1 1 auto}}

/* ==========================================================================\n   CMS ISP Design v1.31.6 · UI moderna + leyenda escritorio auto\n   --------------------------------------------------------------------------\n   Esta capa visual conserva los IDs/eventos del programa y sólo reorganiza\n   la navegación. El mapa gana altura útil y el menú lateral puede reducirse.\n   ========================================================================== */
:root{
  --cms-topbar-h:56px;
  --cms-sidebar-w:236px;
  --cms-sidebar-mini:68px;
  --cms-sidebar-current:var(--cms-sidebar-w);
  --cms-shell-bg:#f4f7f6;
  --cms-surface:rgba(255,255,255,.96);
  --cms-surface-solid:#fff;
  --cms-soft:#f5f8f7;
  --cms-soft-green:#eef8f3;
  --cms-line:rgba(24,47,38,.10);
  --cms-text:#18211d;
  --cms-muted:#75807b;
  --cms-radius:14px;
  --cms-shadow:0 10px 32px rgba(17,43,32,.08);
}
html[data-theme="dark"]{
  --cms-shell-bg:#0d1411;
  --cms-surface:rgba(18,27,23,.96);
  --cms-surface-solid:#121b17;
  --cms-soft:#17211d;
  --cms-soft-green:#14271d;
  --cms-line:rgba(218,236,227,.10);
  --cms-text:#edf4f0;
  --cms-muted:#97a49e;
  --cms-shadow:0 14px 36px rgba(0,0,0,.32);
}
body{
  --cms-sidebar-current:var(--cms-sidebar-w);
  padding-top:var(--cms-topbar-h)!important;
  padding-left:var(--cms-sidebar-current)!important;
  min-height:100dvh;
  background:var(--cms-shell-bg)!important;
  transition:padding-left .22s cubic-bezier(.2,.8,.2,1);
}
body.sidebar-collapsed{--cms-sidebar-current:var(--cms-sidebar-mini)}
main{min-width:0;width:100%;}

/* Topbar */
.topbar.modern-topbar{
  position:fixed!important;inset:0 0 auto 0!important;z-index:70!important;
  height:var(--cms-topbar-h)!important;min-height:var(--cms-topbar-h)!important;
  display:flex!important;flex-wrap:nowrap!important;align-items:center!important;
  gap:10px!important;padding:0 14px!important;
  background:var(--cms-surface)!important;border-bottom:1px solid var(--cms-line)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.5);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);
}
.sidebar-toggle{
  width:38px;height:38px;flex:0 0 38px;border:1px solid var(--cms-line);border-radius:11px;
  display:grid;place-items:center;background:var(--cms-soft);color:var(--cms-text);font-size:18px;cursor:pointer;
  transition:background .16s ease,transform .16s ease,border-color .16s ease;
}
.sidebar-toggle:hover{background:var(--cms-soft-green);border-color:rgba(0,130,67,.25)}
.sidebar-toggle:active{transform:scale(.96)}
.modern-topbar .brand{min-width:0!important;gap:9px!important;flex:0 1 auto}
.modern-topbar .brand-mark.small{width:34px!important;height:34px!important;border-radius:11px!important;box-shadow:0 5px 14px rgba(0,130,67,.20)}
.modern-topbar .brand strong{font-size:13px!important;line-height:1.15;white-space:nowrap;max-width:260px;overflow:hidden;text-overflow:ellipsis}
.modern-topbar .brand small{font-size:9px!important;letter-spacing:.01em}
.topbar-current-view{margin-left:8px;display:flex;align-items:center;gap:7px;color:var(--cms-muted);font-size:11px;font-weight:700;padding:6px 9px;border-radius:999px;background:var(--cms-soft)}
.topbar-current-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(0,130,67,.10)}
.modern-topbar .top-actions{margin-left:auto!important;gap:6px!important;white-space:nowrap}
.modern-topbar .top-actions .btn{min-height:36px!important;padding:7px 10px!important;border-radius:10px!important}
.modern-topbar #userBadge{max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Sidebar */
.app-sidebar{
  position:fixed;left:0;top:var(--cms-topbar-h);bottom:0;width:var(--cms-sidebar-current);z-index:60;
  display:flex;flex-direction:column;background:var(--cms-surface);border-right:1px solid var(--cms-line);
  transition:width .22s cubic-bezier(.2,.8,.2,1),transform .22s cubic-bezier(.2,.8,.2,1);
  backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);
  overflow:hidden;
}
.sidebar-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:15px 10px 10px;scrollbar-width:thin}
.sidebar-section-title{padding:0 10px 8px;color:var(--cms-muted);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.10em;white-space:nowrap;overflow:hidden}
.sidebar-section-inline{padding-top:3px}
.sidebar-divider{height:1px;background:var(--cms-line);margin:9px 8px 12px}
.app-sidebar .tabs.sidebar-tabs{display:flex!important;flex-direction:column!important;width:100%!important;gap:4px!important;overflow:visible!important;padding:0!important;margin:0!important;order:initial!important}
.app-sidebar .sidebar-tabs .tab{
  width:100%;min-height:42px;display:flex;align-items:center;gap:11px;padding:7px 11px!important;margin:0!important;
  border:1px solid transparent!important;border-radius:12px!important;text-align:left!important;color:var(--cms-muted)!important;
  font-size:11px!important;font-weight:700!important;white-space:nowrap!important;overflow:hidden!important;
  transition:background .16s ease,color .16s ease,border-color .16s ease,transform .16s ease;
}
.app-sidebar .sidebar-tabs .tab::before{
  content:attr(data-icon);width:28px;height:28px;flex:0 0 28px;display:grid;place-items:center;
  border-radius:9px;background:var(--cms-soft);color:var(--cms-muted);font-size:16px;font-weight:500;
  transition:background .16s ease,color .16s ease,transform .16s ease;
}
.app-sidebar .sidebar-tabs .tab:hover{background:var(--cms-soft)!important;color:var(--cms-text)!important;transform:translateX(1px)}
.app-sidebar .sidebar-tabs .tab.active{background:var(--cms-soft-green)!important;border-color:rgba(0,130,67,.12)!important;color:var(--green)!important}
.app-sidebar .sidebar-tabs .tab.active::before{background:var(--green)!important;color:#fff!important;box-shadow:0 4px 12px rgba(0,130,67,.20)}
.app-sidebar .sidebar-tabs .tab.hidden{display:none!important}
.tab-label{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sidebar-footer{flex:none;border-top:1px solid var(--cms-line);padding:11px 10px 12px;background:linear-gradient(180deg,transparent,rgba(0,130,67,.018))}
.sidebar-mode-label{display:block;padding:0 8px 7px;color:var(--cms-muted);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}
.app-sidebar .ux-mode-switch{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important;padding:3px!important;border:1px solid var(--cms-line)!important;border-radius:12px!important;background:var(--cms-soft)!important;gap:3px!important}
.app-sidebar .ux-mode-btn{min-width:0!important;min-height:34px!important;padding:6px 7px!important;border-radius:9px!important;font-size:10px!important;white-space:nowrap!important}
.sidebar-version{display:flex;align-items:center;gap:7px;margin:10px 8px 0;color:var(--cms-muted);font-size:9px;font-weight:650;white-space:nowrap;overflow:hidden}
.sidebar-version-dot{width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:#22a663;box-shadow:0 0 0 3px rgba(34,166,99,.10)}
.sidebar-backdrop{display:none;border:0;padding:0}

/* Collapsed desktop */
body.sidebar-collapsed .sidebar-section-title,body.sidebar-collapsed .sidebar-mode-label,body.sidebar-collapsed .sidebar-version-text,body.sidebar-collapsed .tab-label{display:none!important}
body.sidebar-collapsed .sidebar-divider{margin-left:6px;margin-right:6px}
body.sidebar-collapsed .sidebar-scroll{padding-left:8px;padding-right:8px}
body.sidebar-collapsed .sidebar-tabs .tab{justify-content:center!important;padding:6px!important;gap:0!important}
body.sidebar-collapsed .sidebar-tabs .tab::before{width:34px;height:34px;flex-basis:34px}
body.sidebar-collapsed .sidebar-footer{padding-left:8px;padding-right:8px}
body.sidebar-collapsed .app-sidebar .ux-mode-switch{grid-template-columns:1fr!important}
body.sidebar-collapsed .app-sidebar .ux-mode-btn{font-size:0!important;padding:0!important}
body.sidebar-collapsed .app-sidebar .ux-mode-btn[data-ux-mode="design"]::before{content:"D";font-size:10px;font-weight:850}
body.sidebar-collapsed .app-sidebar .ux-mode-btn[data-ux-mode="operation"]::before{content:"O";font-size:10px;font-weight:850}
body.sidebar-collapsed .sidebar-version{justify-content:center;margin-left:0;margin-right:0}

/* Main canvas + controls */
#mapView>.toolbar{
  min-height:51px!important;padding:7px 10px!important;gap:7px!important;
  background:var(--cms-surface-solid)!important;border-bottom:1px solid var(--cms-line)!important;
  box-shadow:0 4px 18px rgba(19,45,34,.035);position:relative;z-index:12;
}
#mapView>.toolbar .searchbox{max-width:460px!important}
#mapView>.toolbar .searchbox input{height:37px!important;border-radius:11px 0 0 11px!important;background:var(--cms-soft)!important}
#mapView>.toolbar .searchbox .btn{height:37px!important;border-radius:0 11px 11px 0!important}
#mapView>.toolbar>.btn,#mapView>.toolbar .map-filter-field select{min-height:37px!important;border-radius:11px!important}
#mapView>.toolbar>.btn{box-shadow:none!important}
#mapView>.toolbar #newAssetBtn{box-shadow:0 5px 14px rgba(0,130,67,.16)!important}
#mapView .map-layout{height:calc(100dvh - var(--cms-topbar-h) - 51px)!important;min-height:460px!important}
.map-canvas{border-radius:0!important}
.side-panel{border-radius:16px 0 0 16px!important;margin:8px 0 8px 8px!important;top:0!important;bottom:0!important;height:calc(100% - 16px)!important;border:1px solid var(--cms-line)!important;box-shadow:-12px 0 34px rgba(16,40,30,.13)!important}
.map-layers-panel,.optical-trace-panel,.equipment-palette,.visual-connect-wizard,.map-context-menu{border:1px solid var(--cms-line)!important;box-shadow:var(--cms-shadow)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}

/* Modern cards across non-map views */
.section-head{padding:22px 26px 16px!important}
.section-head h1,.settings-card h1{letter-spacing:-.025em}
.table-wrap,.settings-card,.cable-list-card,.fiber-main,.inventory-overview{border-color:var(--cms-line)!important;box-shadow:0 5px 22px rgba(18,44,33,.035);border-radius:16px!important}
.btn{border-radius:11px!important;transition:background .15s ease,border-color .15s ease,transform .12s ease,box-shadow .15s ease}
.btn:active{transform:translateY(1px)}
.btn.primary{box-shadow:0 4px 13px rgba(0,130,67,.13)}
input,select,textarea{border-radius:11px!important}

/* Dark shell */
html[data-theme="dark"] .app-sidebar,html[data-theme="dark"] .topbar.modern-topbar{background:var(--cms-surface)!important;border-color:var(--cms-line)!important}
html[data-theme="dark"] .sidebar-toggle,html[data-theme="dark"] .topbar-current-view,html[data-theme="dark"] .app-sidebar .sidebar-tabs .tab::before,html[data-theme="dark"] .app-sidebar .ux-mode-switch{background:var(--cms-soft)!important;border-color:var(--cms-line)!important;color:var(--cms-text)}
html[data-theme="dark"] #mapView>.toolbar{background:var(--cms-surface-solid)!important;border-color:var(--cms-line)!important}
html[data-theme="dark"] #mapView>.toolbar .searchbox input{background:var(--cms-soft)!important}

/* Mobile drawer */
@media(max-width:760px){
  :root{--cms-topbar-h:54px}
  body,body.sidebar-collapsed{padding-left:0!important;padding-top:var(--cms-topbar-h)!important}
  .topbar.modern-topbar{height:var(--cms-topbar-h)!important;min-height:var(--cms-topbar-h)!important;padding:0 8px!important;grid-template-columns:none!important;display:flex!important;gap:7px!important}
  .modern-topbar .brand{grid-column:auto!important;min-width:0!important;flex:0 0 auto}
  .modern-topbar .brand>div{display:none!important}
  .modern-topbar .brand-mark.small{width:34px!important;height:34px!important}
  .topbar-current-view{margin-left:0!important;padding:5px 8px!important;max-width:108px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .modern-topbar .top-actions{grid-column:auto!important;grid-row:auto!important;margin-left:auto!important;gap:3px!important}
  .modern-topbar #userBadge{display:none!important}
  .modern-topbar .top-actions .btn{min-width:36px!important;min-height:36px!important;padding:7px 8px!important}
  .modern-topbar #logoutBtn{font-size:0!important}.modern-topbar #logoutBtn::before{content:"↗";font-size:16px}
  .app-sidebar{top:var(--cms-topbar-h);width:min(82vw,292px)!important;transform:translateX(-104%);box-shadow:18px 0 44px rgba(0,0,0,.18);z-index:82}
  body.sidebar-mobile-open .app-sidebar{transform:translateX(0)}
  body.sidebar-mobile-open .sidebar-backdrop{display:block;position:fixed;inset:var(--cms-topbar-h) 0 0 0;z-index:81;background:rgba(7,17,13,.36);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
  body.sidebar-collapsed .sidebar-section-title,body.sidebar-collapsed .sidebar-mode-label,body.sidebar-collapsed .sidebar-version-text,body.sidebar-collapsed .tab-label{display:block!important}
  body.sidebar-collapsed .sidebar-tabs .tab{justify-content:flex-start!important;padding:7px 11px!important;gap:11px!important}
  body.sidebar-collapsed .sidebar-tabs .tab::before{width:28px;height:28px;flex-basis:28px}
  body.sidebar-collapsed .app-sidebar .ux-mode-switch{grid-template-columns:1fr 1fr!important}
  body.sidebar-collapsed .app-sidebar .ux-mode-btn{font-size:10px!important;padding:6px 7px!important}
  body.sidebar-collapsed .app-sidebar .ux-mode-btn::before{content:none!important}
  body.sidebar-collapsed .sidebar-version{justify-content:flex-start;margin-left:8px;margin-right:8px}
  #mapView>.toolbar{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;padding:7px 8px!important;gap:6px!important;min-height:auto!important}
  #mapView>.toolbar .searchbox{grid-column:1/-1!important;max-width:none!important}
  #mapView .map-layout{height:var(--cms-map-mobile-height,calc(100dvh - 142px))!important;min-height:320px!important}
  .side-panel{margin:0!important;border-radius:0!important;height:100%!important;border:0!important}
}
@media(max-width:430px){
  .topbar-current-view{display:none}
  .modern-topbar .theme-toggle .theme-label{display:none!important}
}

/* =========================================================
   CMS ISP Design v1.31.7 - Login centrado
   El layout principal aplica espacio para topbar/sidebar al body.
   El login no usa esos elementos, por lo que debe ocupar el viewport
   completo sin offsets de la aplicación.
   ========================================================= */
body.login-body{
  --cms-sidebar-current:0px!important;
  padding:0!important;
  margin:0!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  width:100%!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(145deg,#f3f6f8,#eef3f0)!important;
  transition:none!important;
}
html[data-theme="dark"] body.login-body{
  background:linear-gradient(145deg,#0c1215,#131c20)!important;
}
@media(max-width:760px){
  body.login-body,body.login-body.sidebar-collapsed{
    padding:0!important;
    min-height:100vh!important;
    min-height:100dvh!important;
  }
}


/* ==========================================================================\n   CMS ISP Design v1.31.9 · Glass UI + responsive intermedio + tema Claro\n   --------------------------------------------------------------------------\n   Capa visual acumulativa. No cambia IDs, eventos, topología ni datos.\n   ========================================================================== */
:root{
  --cms-glass:rgba(255,255,255,.76);
  --cms-glass-strong:rgba(255,255,255,.86);
  --cms-glass-soft:rgba(255,255,255,.62);
  --cms-glass-line:rgba(39,64,54,.14);
  --cms-glass-shadow:0 10px 30px rgba(17,43,32,.11);
  --cms-glass-blur:18px;
}
html[data-theme="dark"]{
  --cms-glass:rgba(18,27,23,.78);
  --cms-glass-strong:rgba(18,27,23,.88);
  --cms-glass-soft:rgba(18,27,23,.66);
  --cms-glass-line:rgba(218,236,227,.14);
  --cms-glass-shadow:0 13px 34px rgba(0,0,0,.34);
}

/* El mapa queda visualmente por delante; la interfaz flota sobre él. */
.topbar.modern-topbar,.app-sidebar,#mapView>.toolbar{
  background:var(--cms-glass)!important;
  border-color:var(--cms-glass-line)!important;
  backdrop-filter:saturate(155%) blur(var(--cms-glass-blur))!important;
  -webkit-backdrop-filter:saturate(155%) blur(var(--cms-glass-blur))!important;
}
.topbar.modern-topbar{box-shadow:0 5px 24px rgba(18,45,34,.055)!important}
.app-sidebar{box-shadow:7px 0 25px rgba(18,45,34,.045)!important}
#mapView>.toolbar{box-shadow:0 6px 20px rgba(18,45,34,.07)!important}

.side-panel,.map-layers-panel,.optical-trace-panel,.equipment-palette,.visual-connect-wizard,.map-context-menu,
.settings-card,.table-wrap,.cable-list-card,.fiber-main,.inventory-overview,.noc-topology,.noc-view-switch{
  background:var(--cms-glass-strong)!important;
  border-color:var(--cms-glass-line)!important;
  backdrop-filter:saturate(150%) blur(var(--cms-glass-blur))!important;
  -webkit-backdrop-filter:saturate(150%) blur(var(--cms-glass-blur))!important;
}
#detailPanel>.detail-top,.optical-trace-head{
  background:var(--cms-glass-strong)!important;
  backdrop-filter:saturate(150%) blur(var(--cms-glass-blur))!important;
  -webkit-backdrop-filter:saturate(150%) blur(var(--cms-glass-blur))!important;
}

/* Leyenda: ancho natural. No vuelve a imponer 330/278 px. */
.network-map-legend{
  width:max-content!important;
  max-width:calc(100% - 24px)!important;
  background:var(--cms-glass-soft)!important;
  border-color:var(--cms-glass-line)!important;
  box-shadow:var(--cms-glass-shadow)!important;
  backdrop-filter:saturate(160%) blur(16px)!important;
  -webkit-backdrop-filter:saturate(160%) blur(16px)!important;
}
.network-map-legend .legend-toggle,.network-map-legend .legend-symbol{
  background:rgba(255,255,255,.72)!important;
  border-color:var(--cms-glass-line)!important;
}
html[data-theme="dark"] .network-map-legend .legend-toggle,
html[data-theme="dark"] .network-map-legend .legend-symbol{background:rgba(29,40,35,.76)!important}

/* Controles MapLibre coherentes con la nueva capa de vidrio. */
.maplibregl-ctrl-group{
  background:var(--cms-glass-strong)!important;
  border:1px solid var(--cms-glass-line)!important;
  box-shadow:0 5px 18px rgba(20,35,42,.12)!important;
  backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important;
}
.maplibregl-ctrl-group button{background-color:transparent!important}
.maplibregl-ctrl-group button+button{border-top-color:var(--cms-glass-line)!important}

/* Componentes de edición: transparentes pero con contraste suficiente. */
#mapView>.toolbar input,#mapView>.toolbar select,.app-sidebar .ux-mode-switch,.sidebar-toggle,.topbar-current-view,
.btn.ghost,.icon-btn{
  background:rgba(255,255,255,.68)!important;
  border-color:var(--cms-glass-line)!important;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
html[data-theme="dark"] #mapView>.toolbar input,html[data-theme="dark"] #mapView>.toolbar select,
html[data-theme="dark"] .app-sidebar .ux-mode-switch,html[data-theme="dark"] .sidebar-toggle,
html[data-theme="dark"] .topbar-current-view,html[data-theme="dark"] .btn.ghost,html[data-theme="dark"] .icon-btn{
  background:rgba(24,36,31,.72)!important;
}

/* Ventanas de ancho medio (Mac/Windows con DevTools, split-screen, 1024/1280).\n   En lugar de cortar controles, filtros pasan al mismo popover que móvil. */
@media (min-width:761px) and (max-width:1280px){
  #mapView>.toolbar{
    display:grid!important;
    grid-template-columns:minmax(210px,1fr) repeat(5,minmax(72px,auto))!important;
    grid-template-rows:38px!important;
    align-items:center!important;
    gap:6px!important;
    padding:6px 8px!important;
  }
  #mapView>.toolbar .searchbox{grid-column:1!important;max-width:none!important;min-width:0!important;width:100%!important}
  #mapView>.toolbar #newWirelessBtn{grid-column:2!important;min-width:0!important;padding-left:8px!important;padding-right:8px!important}
  #mapView>.toolbar #newAssetBtn{grid-column:3!important;min-width:0!important;padding-left:8px!important;padding-right:8px!important}
  #mapView>.toolbar #mobileMapOptionsBtn{display:flex!important;grid-column:4!important;align-items:center!important;justify-content:center!important;min-width:0!important}
  #mapView>.toolbar #mapLayersBtn{grid-column:5!important;min-width:0!important}
  #mapView>.toolbar #opticalTraceBtn{grid-column:6!important;min-width:0!important}
  #mapView>.toolbar .live-status{position:absolute!important;right:8px!important;top:calc(100% + 7px)!important;width:28px!important;height:28px!important;min-width:28px!important;padding:0!important;justify-content:center!important;z-index:4!important}
  #mapView>.toolbar .live-status span{display:none!important}
  #mapView>.toolbar .map-filter-group{
    display:none!important;position:absolute!important;left:8px!important;right:8px!important;top:calc(100% + 5px)!important;z-index:95!important;
    grid-template-columns:1fr 1fr!important;gap:8px!important;padding:10px!important;background:var(--cms-glass-strong)!important;
    border:1px solid var(--cms-glass-line)!important;border-radius:15px!important;box-shadow:var(--cms-glass-shadow)!important;
    backdrop-filter:saturate(170%) blur(22px)!important;-webkit-backdrop-filter:saturate(170%) blur(22px)!important;
  }
  #mapView>.toolbar .map-filter-group.mobile-open{display:grid!important}
  .mobile-map-options-head{display:flex!important;grid-column:1/-1!important;align-items:flex-start!important;justify-content:space-between!important;gap:10px!important}
  .map-filter-field{display:flex!important;min-width:0!important;flex-direction:column!important;gap:4px!important;margin:0!important}
  .map-filter-field>span{display:block!important}
  .map-filter-field select{width:100%!important;max-width:none!important;min-width:0!important}
  #mapView .map-layout{height:calc(100dvh - var(--cms-topbar-h) - 50px)!important}
  body[data-ux-mode="operation"] #mapView>.toolbar{grid-template-columns:minmax(240px,1fr) repeat(3,minmax(80px,auto))!important}
  body[data-ux-mode="operation"] #mobileMapOptionsBtn{grid-column:2!important}
  body[data-ux-mode="operation"] #mapLayersBtn{grid-column:3!important}
  body[data-ux-mode="operation"] #opticalTraceBtn{grid-column:4!important}
}

/* Tablet y móvil: leyenda se adapta por contenido, no por ancho fijo. */
@media(max-width:760px){
  .network-map-legend:not(.legend-collapsed){
    width:max-content!important;
    max-width:calc(100% - 18px)!important;
    padding:11px!important;
  }
  .network-map-legend:not(.legend-collapsed) .legend-grid{
    grid-template-columns:repeat(2,minmax(105px,1fr))!important;
    gap:7px 12px!important;
  }
  #mapView>.toolbar{background:var(--cms-glass)!important}
}
@media(max-width:360px){
  .network-map-legend:not(.legend-collapsed){left:7px!important;max-width:calc(100% - 14px)!important}
  .network-map-legend:not(.legend-collapsed) .legend-grid{grid-template-columns:repeat(2,minmax(92px,1fr))!important;gap:6px 8px!important}
}

/* Login también usa glass y mantiene el centrado de v1.31.7. */
.login-card{
  background:var(--cms-glass-strong)!important;border-color:var(--cms-glass-line)!important;
  backdrop-filter:saturate(155%) blur(22px)!important;-webkit-backdrop-filter:saturate(155%) blur(22px)!important;
  box-shadow:0 18px 55px rgba(18,45,34,.12)!important;
}

/* Tablet / ventana estrecha: sidebar compacto automático para devolver ancho al mapa. */
@media (min-width:761px) and (max-width:980px){
  body,body.sidebar-collapsed{--cms-sidebar-current:var(--cms-sidebar-mini)!important}
  .app-sidebar{width:var(--cms-sidebar-mini)!important}
  .app-sidebar .sidebar-section-title,.app-sidebar .sidebar-mode-label,.app-sidebar .sidebar-version-text,.app-sidebar .tab-label{display:none!important}
  .app-sidebar .sidebar-divider{margin-left:6px!important;margin-right:6px!important}
  .app-sidebar .sidebar-scroll{padding-left:8px!important;padding-right:8px!important}
  .app-sidebar .sidebar-tabs .tab{justify-content:center!important;padding:6px!important;gap:0!important}
  .app-sidebar .sidebar-tabs .tab::before{width:34px!important;height:34px!important;flex-basis:34px!important}
  .app-sidebar .sidebar-footer{padding-left:8px!important;padding-right:8px!important}
  .app-sidebar .ux-mode-switch{grid-template-columns:1fr!important}
  .app-sidebar .ux-mode-btn{font-size:0!important;padding:0!important}
  .app-sidebar .ux-mode-btn[data-ux-mode="design"]::before{content:"D";font-size:10px;font-weight:850}
  .app-sidebar .ux-mode-btn[data-ux-mode="operation"]::before{content:"O";font-size:10px;font-weight:850}
  .app-sidebar .sidebar-version{justify-content:center!important;margin-left:0!important;margin-right:0!important}
  #mapView>.toolbar{grid-template-columns:minmax(190px,1fr) repeat(5,minmax(58px,auto))!important}
  #mapView>.toolbar>.btn{padding-left:6px!important;padding-right:6px!important;font-size:10px!important}
}

/* v1.32.0 · trazabilidad óptica operacional */
.route-glow-btn{font-weight:800!important;border-color:rgba(129,181,0,.45)!important;background:linear-gradient(180deg,rgba(231,255,170,.92),rgba(204,255,66,.78))!important;color:#233000!important;box-shadow:0 0 0 1px rgba(190,255,0,.18),0 4px 14px rgba(120,180,0,.18)!important}
html[data-theme="dark"] .route-glow-btn{background:linear-gradient(180deg,rgba(78,103,0,.95),rgba(56,78,0,.95))!important;color:#eaff9b!important;border-color:rgba(196,255,71,.42)!important}
.external-point-toolbar-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.external-point-logical-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.external-point-logical-summary>div,.external-point-optical{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:color-mix(in srgb,var(--card,#fff) 82%,transparent)}
.external-point-logical-summary strong,.external-point-optical strong{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.external-point-logical-summary span,.external-point-optical span{font-size:12px;font-weight:700}.external-point-optical small{font-size:11px;color:var(--muted)}
.external-point-optical{margin:0 0 12px;border-color:rgba(0,130,67,.20);background:color-mix(in srgb,var(--green,#008243) 5%,var(--card,#fff))}
.external-point-cable-btn small b{color:var(--text);font-weight:800}
.external-point-route-action{white-space:nowrap}.external-point-route-action .btn{min-height:30px}
.onu-optical-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 0;padding:12px;border:1px solid rgba(0,130,67,.24);border-radius:13px;background:color-mix(in srgb,var(--green,#008243) 5%,var(--card,#fff))}
.onu-optical-summary>div{display:flex;flex-direction:column;gap:3px}.onu-optical-summary strong{font-size:12px}.onu-optical-summary span{font-size:13px;font-weight:800}.onu-optical-summary small{font-size:11px;color:var(--muted)}.onu-optical-summary.has-error{border-color:rgba(196,44,62,.30);background:color-mix(in srgb,#c42c3e 5%,var(--card,#fff))}
.route-focus-card{position:absolute;right:14px;top:14px;z-index:40;width:min(430px,calc(100% - 28px));max-height:min(50dvh,430px);overflow:auto;padding:12px;border-radius:16px;border:1px solid rgba(255,255,255,.55);background:rgba(250,253,248,.78);box-shadow:0 14px 45px rgba(18,38,22,.22);backdrop-filter:saturate(170%) blur(18px);-webkit-backdrop-filter:saturate(170%) blur(18px)}
.route-focus-card.hidden{display:none!important}.route-focus-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:9px}.route-focus-head strong,.route-focus-head small{display:block}.route-focus-head strong{font-size:13px}.route-focus-head small{font-size:10px;color:var(--muted);margin-top:2px}.route-focus-headend{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:11px;background:rgba(198,255,55,.22);border:1px solid rgba(140,190,0,.22);margin-bottom:8px}.route-focus-headend strong{font-size:12px}.route-focus-headend span{font-size:11px;color:var(--muted)}
.route-focus-chain{display:flex;align-items:center;gap:5px;flex-wrap:wrap;font-size:11px;line-height:1.35}.route-focus-chain span{font-weight:750}.route-focus-chain b{color:#83a900}.route-focus-fibers{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}.route-focus-fibers small{font-size:9px;padding:3px 6px;border-radius:999px;background:rgba(0,0,0,.055)}.route-focus-branches{display:flex;flex-direction:column;gap:3px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}.route-focus-branches strong{font-size:10px;text-transform:uppercase;color:var(--muted)}.route-focus-branches span{font-size:10px}.route-focus-actions{margin-top:9px;display:flex;justify-content:flex-end}
html[data-theme="dark"] .route-focus-card{background:rgba(17,25,20,.80);border-color:rgba(220,255,220,.14);box-shadow:0 16px 55px rgba(0,0,0,.46)}html[data-theme="dark"] .route-focus-headend{background:rgba(141,190,0,.16);border-color:rgba(202,255,70,.18)}
.route-focus-glow,.route-focus-line{pointer-events:none;stroke-linejoin:round;stroke-linecap:round}.route-focus-glow{stroke:#ecff94;stroke-width:16px;opacity:.70;filter:drop-shadow(0 0 5px #d8ff00) drop-shadow(0 0 12px #b7ff00)}.route-focus-line{stroke:#b7ff00;stroke-width:7px;opacity:.98;stroke-dasharray:14 5;animation:cmsRouteDash 1.1s linear infinite;filter:drop-shadow(0 0 4px #dfff4a)}
@keyframes cmsRouteDash{to{stroke-dashoffset:-38}}
.asset-marker-wrap.route-focus-asset{z-index:29!important}.asset-marker-wrap.route-focus-asset .asset-marker{box-shadow:0 0 0 5px rgba(196,255,0,.48),0 0 18px rgba(183,255,0,.95),0 7px 20px rgba(0,0,0,.24)!important;transform:scale(1.10)}.asset-marker-wrap.route-focus-asset .asset-map-label{outline:2px solid #b7ff00;outline-offset:3px}
@media(max-width:760px){.route-focus-card{top:8px;left:8px;right:8px;width:auto;max-height:38dvh;padding:10px;border-radius:14px}.route-focus-chain{font-size:10px}.route-focus-fibers{display:none}.external-point-logical-summary{grid-template-columns:1fr}.external-point-toolbar{align-items:flex-start;flex-wrap:wrap}.external-point-toolbar-actions{width:100%;justify-content:stretch}.external-point-toolbar-actions .btn{flex:1}.onu-optical-summary{align-items:flex-start;flex-direction:column}.external-point-table{min-width:690px}}


/* v1.32.1 · bloqueo persistente de posición de equipos */
.asset-marker-wrap.position-locked .asset-marker{cursor:not-allowed!important;position:relative}
.asset-marker-wrap.position-locked .asset-marker::after{content:"🔒";position:absolute;right:-8px;top:-9px;width:18px;height:18px;display:grid;place-items:center;border-radius:999px;background:rgba(255,255,255,.96);border:1px solid rgba(70,82,88,.18);box-shadow:0 2px 7px rgba(20,35,42,.22);font-size:10px;line-height:1;z-index:4}
.asset-marker-wrap.position-locked .asset-map-label{outline:1px solid rgba(70,82,88,.22);outline-offset:2px}
html[data-theme="dark"] .asset-marker-wrap.position-locked .asset-marker::after{background:rgba(24,31,35,.96);border-color:rgba(230,240,244,.2)}

/* =========================================================
   CMS ISP Design v1.32.2 - JERARQUIA DE CAPAS / MOBILE
   Ningun marcador o etiqueta del mapa debe dibujarse encima
   de paneles, popovers o ventanas de trabajo.
   ========================================================= */
#mapView{
  position:relative;
  z-index:1;
  isolation:isolate;
}
#mapView .map-layout{
  isolation:isolate;
}
#mapView .map-canvas{
  z-index:1!important;
}

/* Controles del mapa: por encima de equipos, debajo de ventanas. */
#mapView .maplibregl-ctrl-top-right,
#mapView .maplibregl-ctrl-bottom-right,
#mapView .maplibregl-ctrl-bottom-left,
#mapView .maplibregl-ctrl-top-left{
  z-index:90!important;
}

/* Información flotante del mapa. */
#mapView .network-map-legend,
#mapView .map-search-empty,
#mapView .map-notice{
  z-index:110!important;
}

/* Ventanas flotantes de herramientas. */
#mapView .map-layers-panel,
#mapView .equipment-palette,
#mapView .optical-trace-panel,
#mapView .visual-connect-wizard,
#mapView .route-focus-card{
  z-index:150!important;
}

/* Menú contextual siempre sobre las herramientas del mapa. */
#mapView .map-context-menu{
  z-index:180!important;
}

/* El panel de detalles/edición es la capa superior dentro del mapa. */
#mapView .side-panel,
#mapView #sidePanel{
  z-index:240!important;
}
#mapView .map-layout.panel-open .map-panel-toggle{
  z-index:241!important;
}

/* Evita que un equipo seleccionado/hover/recorrido atraviese una ventana. */
@media(max-width:760px){
  #mapView .side-panel,
  #mapView #sidePanel{
    z-index:240!important;
    position:absolute!important;
    isolation:isolate;
  }

  /* Cuando detalles ocupa la pantalla, el mapa queda visual y táctilmente detrás. */
  #mapView .map-layout.panel-open .map-canvas{
    pointer-events:none!important;
  }
  #mapView .map-layout.panel-open .maplibregl-marker,
  #mapView .map-layout.panel-open .asset-marker-wrap,
  #mapView .map-layout.panel-open .network-cable-overlay,
  #mapView .map-layout.panel-open .maplibregl-control-container{
    pointer-events:none!important;
  }
}
