/* ServikarCRM — Tablero de proyecto.
   Paleta y lenguaje visual originales del tablero; se conservan tal cual. */

:root{
  --bg:#f3f7fc; --bg2:#ffffff; --bg3:#eef5fb;
  --card:#ffffff; --card2:#f7fbff;
  --border:#dce7f3; --border2:#c7d9eb;
  --txt:#16304c; --txt2:#52708f; --txt3:#7b8da3;
  --accent:#274b73; --accent-2:#16304c; --green:#2f9e65; --green2:#2b8a3e;
  --yellow:#f2b84b; --red:#e85757; --purple:#6f62d6; --orange:#eb8b2b;
  --contpaq:#2c8fcf; --sdk:#6f62d6; --laravel:#d95f5f; --android:#47a96d; --api:#f0a540;
  --accent-gradient:linear-gradient(135deg, #274b73 0%, #16304c 100%);
  --r:16px;
}
*{margin:0;padding:0;box-sizing:border-box}
body{background:linear-gradient(135deg,#eef5fb 0%,#f7fbff 100%);color:var(--txt);font-family:'Inter',system-ui,-apple-system,sans-serif;min-height:100vh;overflow-x:hidden}
code{background:rgba(23,48,76,.07);padding:1px 5px;border-radius:4px;font-size:12px;font-family:ui-monospace,Consolas,monospace}
a{color:var(--accent)}

/* ---------- encabezado ---------- */
.header{background:var(--accent-gradient);border-bottom:1px solid rgba(255,255,255,.14);padding:0 32px;display:flex;align-items:center;justify-content:space-between;min-height:72px;position:sticky;top:0;z-index:100;flex-wrap:wrap;gap:10px;box-shadow:0 10px 30px rgba(22,48,76,.16)}
.logo{display:flex;align-items:center;gap:12px}
.logo-mark{height:42px;width:auto;display:block;filter:drop-shadow(0 6px 12px rgba(0,0,0,.16))}
.logo-text{font-family:'Manrope',sans-serif;font-weight:800;font-size:18px;color:#fff;letter-spacing:.01em}
.logo-sub{font-size:11px;color:rgba(255,255,255,.78)}
.header-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.chip{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);padding:6px 14px;border-radius:999px;font-size:12px;color:#fff}
.chip-pct{background:rgba(255,255,255,.18);border:none;font-weight:700;color:#fff}
.tablero-global-score{display:flex;align-items:baseline;gap:14px;margin-top:20px}.tablero-global-score strong{font-size:52px;color:#16304c}.tablero-global-score span{font-size:14px;color:var(--txt2)}.tablero-global-barra{height:14px;background:#dce7f3;border-radius:999px;overflow:hidden;margin:10px 0 14px}.tablero-global-barra i{display:block;height:100%;background:linear-gradient(90deg,#16a34a,#34d399);border-radius:inherit}.tablero-estados-resumen{display:flex;gap:8px;flex-wrap:wrap}.tg-estado{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.tg-planeada{background:#e5e7eb;color:#4b5563}.tg-tomada{background:#dbeafe;color:#1d4ed8}.tg-en_proceso{background:#fef3c7;color:#b45309}.tg-terminada{background:#dcfce7;color:#15803d}.tablero-etapas-resumen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}.tablero-etapa-card{font:inherit;color:inherit;text-align:left;cursor:pointer;background:var(--card);border:1px solid var(--border);border-top:4px solid #2563eb;border-radius:16px;padding:20px;box-shadow:0 10px 24px rgba(22,48,76,.06);transition:.2s}.tablero-etapa-card:hover,.tablero-etapa-card.seleccionada{transform:translateY(-3px);box-shadow:0 16px 34px rgba(22,48,76,.14);outline:3px solid rgba(37,99,235,.16)}.tablero-etapa-card.etapa-planeacion{border-top-color:#16a34a}.tablero-etapa-card.etapa-implementacion{border-top-color:#f59e0b}.tablero-etapa-card.etapa-migracion{border-top-color:#7c3aed}.tablero-etapa-card small{font-weight:800;color:var(--txt3)}.tablero-etapa-card h2{font-size:18px;margin:5px 0}.tablero-etapa-card>strong{font-size:36px}.tablero-etapa-card p{min-height:42px;color:var(--txt2);font-size:12px;margin:8px 0}.tablero-etapa-card>span{display:block;margin-top:8px;font-size:11px;color:var(--txt3)}.tablero-etapa-bloque{margin:28px 0;padding:22px;background:rgba(255,255,255,.55);border:1px solid var(--border);border-radius:18px}.tablero-etapa-bloque[hidden]{display:none}.tablero-etapa-bloque>header{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:16px}.tablero-etapa-bloque h2{margin:3px 0;font-size:21px}.tablero-etapa-bloque header p{color:var(--txt2);font-size:13px}.tablero-areas-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.tablero-area{background:var(--card);border:1px solid var(--border);border-left:4px solid var(--area-color);border-radius:13px;padding:14px}.tablero-area-resumen{display:flex;width:100%;justify-content:space-between;align-items:center;gap:12px;border:0;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer}.tablero-area-resumen:hover b{text-decoration:underline}.tablero-area-resumen div{display:flex;flex-direction:column;gap:3px}.tablero-area-resumen small{color:var(--txt3)}.tablero-area-resumen>strong{color:var(--area-color);font-size:22px}.tablero-area>.barra{margin:10px 0}.tablero-grupo-tareas{border-top:1px solid var(--border);padding-top:9px}.tablero-grupo-tareas>summary{cursor:pointer;color:var(--txt2);font-size:11px;font-weight:700}.tablero-tareas{display:flex;flex-direction:column;gap:7px;margin-top:10px}.tablero-tarea{border:1px solid var(--border);border-left:3px solid #9ca3af;border-radius:9px;padding:10px;background:#fff}.tablero-tarea.estado-tomada{border-left-color:#2563eb}.tablero-tarea.estado-en_proceso{border-left-color:#f59e0b}.tablero-tarea.estado-terminada{border-left-color:#16a34a}.tablero-tarea-cab{display:flex;justify-content:space-between;gap:8px}.tablero-tarea p{font-size:12px;line-height:1.45;margin:7px 0}.tablero-tarea small{display:block;color:var(--txt3);line-height:1.4;max-height:58px;overflow:auto}.tablero-pushup{position:fixed;inset:auto 0 0 0;width:min(920px,calc(100% - 24px));max-height:82vh;margin:0 auto;border:0;border-radius:22px 22px 0 0;padding:18px 24px 26px;background:#fff;color:var(--txt);box-shadow:0 -20px 60px rgba(15,30,53,.28)}.tablero-pushup::backdrop{background:rgba(15,30,53,.55);backdrop-filter:blur(3px)}.tablero-pushup-handle{width:54px;height:5px;border-radius:99px;background:#cbd5e1;margin:0 auto 15px}.tablero-pushup header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.tablero-pushup header h2{font-size:23px;margin:3px 0}.tablero-pushup header p{color:var(--txt2)}.tablero-modal-cerrar{border:0;background:#eef2f7;color:#334155;width:38px;height:38px;border-radius:50%;font-size:26px;cursor:pointer}.tablero-modal-estado{display:flex;gap:10px;align-items:center;margin:18px 0 10px}.tablero-modal-objetivo{font-size:17px;font-weight:700;line-height:1.55}.tablero-modal-detalles{display:grid;grid-template-columns:160px 1fr;gap:0;margin-top:18px;border:1px solid var(--border);border-radius:12px;overflow:auto;max-height:42vh}.tablero-modal-detalles dt,.tablero-modal-detalles dd{padding:10px 12px;border-bottom:1px solid var(--border);margin:0}.tablero-modal-detalles dt{background:var(--card2);font-size:11px;font-weight:800;text-transform:uppercase;color:var(--txt3)}.tablero-modal-detalles dd{font-size:13px;line-height:1.5}
.chip-alerta{background:rgba(247,95,95,.16);border-color:rgba(247,95,95,.35);color:#ffd7d7}
.btn-accion{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:999px;background:linear-gradient(135deg,var(--accent),#1d4ed8);color:#fff;font-weight:700;border:1px solid rgba(255,255,255,.16);box-shadow:0 10px 20px rgba(37,99,235,.2)}

/* ---------- navegación lateral ---------- */
.app-shell{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:calc(100vh - 72px)}
.sidebar-nav{position:sticky;top:72px;height:calc(100vh - 72px);padding:18px 14px 18px 18px;border-right:1px solid rgba(39,75,115,.12);background:linear-gradient(180deg,#0f1e35 0%,#122644 100%);box-shadow:12px 0 28px rgba(5,13,29,.08)}
.sidebar-brand{display:flex;align-items:center;gap:12px;padding:10px 10px 16px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:14px}
.sidebar-brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,#4d8ff9,#274b73);color:#fff;font-weight:800;box-shadow:0 10px 20px rgba(39,75,115,.16)}
.sidebar-brand-title{font-size:14px;font-weight:800;color:#fff}
.sidebar-brand-sub{font-size:11px;color:#b8c9e7}
.sidebar-title{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:#8ba9d4;margin:0 8px 8px}
.main-nav{display:flex;flex-direction:column;gap:8px;background:transparent;padding:0;border:none;border-radius:0;overflow:visible;box-shadow:none;backdrop-filter:none}
.main-btn{display:inline-flex;align-items:center;justify-content:flex-start;gap:10px;width:100%;padding:11px 12px;text-align:left;font-size:13px;font-weight:600;color:#dfe9f8;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:12px;cursor:pointer;transition:all .2s ease;white-space:nowrap;font-family:inherit}
.main-btn:hover{color:#fff;background:rgba(255,255,255,.08);transform:translateY(-1px)}
.main-btn.active{color:#fff;background:linear-gradient(135deg,#2d6cdf,#274b73);box-shadow:0 10px 20px rgba(39,75,115,.16)}
.main-btn-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:8px;background:rgba(255,255,255,.12);font-size:12px;color:#fff}
.content-area{padding:0 32px 40px 24px;min-width:0}
.vista{display:none}
.vista.activa{display:block}

@media (max-width: 1024px){
  .app-shell{grid-template-columns:1fr}
  .sidebar-nav{position:relative;top:auto;height:auto;padding:16px 16px 10px;border-right:none;border-bottom:1px solid rgba(39,75,115,.12)}
  .main-nav{flex-direction:row;flex-wrap:wrap;overflow-x:auto;padding-bottom:4px}
  .main-btn{width:auto;flex:0 0 auto}
  .content-area{padding:0 20px 32px}
}
@media(max-width:850px){.tablero-etapas-resumen,.tablero-areas-grid{grid-template-columns:1fr}.tablero-etapa-bloque>header{flex-direction:column}.tablero-global-score{align-items:flex-start;flex-direction:column;gap:2px}}

/* ---------- hero y tarjetas ---------- */
.hero{padding:28px 32px 24px;border:1px solid rgba(39,75,115,.08);border-radius:24px;background:linear-gradient(135deg,rgba(39,75,115,.04),rgba(44,143,207,.06));box-shadow:0 16px 40px rgba(22,48,76,.06);margin:24px 32px 0}
.hero-title{font-family:'Manrope',sans-serif;font-size:26px;font-weight:800;margin-bottom:6px;color:var(--accent-2)}
.hero-sub{color:var(--txt2);font-size:14px;margin-bottom:0;line-height:1.6}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-bottom:28px}
.stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:20px;position:relative;overflow:hidden;box-shadow:0 10px 24px rgba(22,48,76,.06)}
.stat-card:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(22,48,76,.1)}
.stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent),var(--contpaq))}
.stat-card.ok::before{background:var(--green)}
.stat-card.alerta::before{background:var(--yellow)}
.stat-card.grave::before{background:var(--red)}
.stat-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--txt2);margin-bottom:8px}
.stat-val{font-size:34px;font-weight:800;line-height:1;color:var(--accent-2)}
.stat-desc{font-size:12px;color:var(--txt3);margin-top:6px;line-height:1.5}

/* ---------- secciones ---------- */
.seccion{padding:0 32px 40px}
.section-title{font-family:'Manrope',sans-serif;font-size:16px;font-weight:700;margin:8px 0 16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.section-title .tag{font-size:11px;font-weight:600;padding:3px 10px;border-radius:20px;background:var(--card2);color:var(--txt2)}

/* ---------- cola de tareas ---------- */
.grupo{margin-bottom:22px}
.grupo-cab{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:13px;font-weight:700;color:var(--txt)}
.punto{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.rojo{background:var(--red)} .amarillo{background:var(--yellow)} .verde{background:var(--green)} .gris{background:var(--txt3)}
.tarea{display:flex;gap:12px;align-items:flex-start;background:var(--card);border:1px solid var(--border);border-left:3px solid var(--border2);border-radius:10px;padding:12px 16px;margin-bottom:7px}
.tarea.p-rojo{border-left-color:var(--red)}
.tarea.p-amarillo{border-left-color:var(--yellow)}
.tarea.p-verde{border-left-color:var(--green)}
.tarea.p-gris{border-left-color:var(--txt3);opacity:.72}
.tarea-id{font-weight:700;font-size:13px;color:var(--txt2);min-width:46px;font-variant-numeric:tabular-nums}
.tarea-cuerpo{flex:1;min-width:0}
.tarea-txt{font-size:13.5px;line-height:1.55}
.tarea-meta{font-size:11px;color:var(--txt3);margin-top:5px;display:flex;gap:12px;flex-wrap:wrap}
.badge{font-size:10px;font-weight:700;padding:3px 9px;border-radius:20px;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;align-self:flex-start}
.b-pendiente{background:rgba(90,100,128,.25);color:var(--txt2)}
.b-en_curso{background:rgba(245,197,66,.15);color:var(--yellow)}
.b-terminado{background:rgba(45,217,142,.15);color:var(--green)}
.b-fallido{background:rgba(247,95,95,.15);color:var(--red)}
.b-cancelado{background:rgba(90,100,128,.18);color:var(--txt3)}

/* ---------- avisos de procedencia del dato ---------- */
.aviso{display:flex;gap:10px;border-radius:12px;padding:12px 14px;font-size:13px;line-height:1.6;margin-bottom:16px;box-shadow:0 8px 20px rgba(22,48,76,.05)}
.aviso strong{color:var(--accent-2)}
.a-ok{background:rgba(47,158,101,.10);border:1px solid rgba(47,158,101,.24);color:#2f7a51}
.a-mal{background:rgba(232,87,87,.10);border:1px solid rgba(232,87,87,.24);color:#b34343}
.a-info{background:rgba(39,75,115,.08);border:1px solid rgba(39,75,115,.18);color:var(--accent)}
.sello{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;padding:3px 9px;border-radius:20px}
.s-diseno{background:rgba(165,123,248,.18);color:#c9b0ff}
.s-real{background:rgba(45,217,142,.18);color:#8ff0c4}
.s-falso{background:rgba(247,95,95,.18);color:#ffb3b3}

/* ---------- tablas de evidencia ---------- */
.tabla-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:14px;background:var(--card);box-shadow:0 8px 20px rgba(22,48,76,.04)}
table.datos{width:100%;border-collapse:collapse;font-size:13px}
table.datos th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--txt3);border-bottom:1px solid var(--border);padding:10px 8px;background:var(--card2)}
table.datos td{padding:10px 8px;border-bottom:1px solid var(--border);color:var(--txt2);vertical-align:top}
table.datos td.num{text-align:right;font-variant-numeric:tabular-nums;color:var(--txt);font-weight:600}
.fuente{font-size:11px;color:var(--txt3);font-style:italic;margin-top:10px;line-height:1.6}

/* ---------- modelo de negocio ---------- */
.plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:20px}
.modelo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

/* ---------- operación productiva / topología ---------- */
.topologia{display:grid;grid-template-columns:minmax(190px,1fr) 110px minmax(230px,1.15fr) 120px minmax(220px,1fr) 110px minmax(220px,1fr);align-items:stretch;gap:10px;margin:18px 0 28px}
.topologia-cisco{margin:16px 0 30px;background:radial-gradient(circle at 50% 0,rgba(79,142,247,.12),transparent 42%),#0d1422;border:1px solid var(--border);border-radius:18px;padding:12px;overflow-x:auto}
.topologia-cisco svg{display:block;width:100%;min-width:900px;height:auto}.nube-red{fill:#e8f5ff;stroke:#69b7dc;stroke-width:5}.etiqueta-principal{fill:#17334d;font-size:17px;font-weight:800}.zona-red{fill:url(#fondoRed);stroke-width:3}.zona-nlanube{stroke:#a57bf8}.zona-hostinger{stroke:#2dd98e}.titulo-zona{fill:#f2f5ff;font-size:17px;font-weight:800}.subtitulo-zona{fill:#8fa3c6;font-size:13px}.linea-red{fill:none;stroke:#56b4ff;stroke-width:4}.etiqueta-linea{fill:#91a4c4;font-size:12px;font-weight:700}.servidor{fill:url(#fondoServidor);stroke:#53b8ea;stroke-width:2}.servidor-frente{fill:#143f61;stroke:#75c9ef;stroke-width:1.5}.led{fill:#39e69d}.ranura{stroke:#91daf8;stroke-width:3}.nombre-nodo{fill:#fff;font-size:13px;font-weight:800}.servicios-nlanube rect{fill:#2a2252;stroke:#a57bf8;stroke-width:2}.servicios-vps rect{fill:#123f3a;stroke:#2dd98e;stroke-width:2}.servicios-nlanube text,.servicios-vps text{fill:#f7f9ff;font-size:14px;font-weight:800}.servicios-nlanube .detalle-nodo,.servicios-vps .detalle-nodo{fill:#aab6cf;font-size:11px;font-weight:500}.linea-interna{fill:none;stroke:#7c91b5;stroke-width:3}.tunel-vpn{fill:none;stroke:#34d399;stroke-width:5;stroke-dasharray:10 7}.tunel-vpn.retorno{stroke:#22b8cf}.etiqueta-vpn-fondo{fill:#132b3b;stroke:#34d399;stroke-width:2}.etiqueta-vpn{fill:#59e6b1;font-size:16px;font-weight:900}.detalle-vpn{fill:#b8c7dc;font-size:10px}.leyenda-red{fill:#111c2e;stroke:#33435e}.texto-leyenda{fill:#b7c3d8;font-size:11px}
.api-ausente rect{fill:#4b2027;stroke:#f75f5f;stroke-width:2}.api-ausente text{fill:#fff;font-size:12px;font-weight:800}.api-ausente .detalle-nodo{fill:#ffb4b4;font-size:10px}
.zona-oficina{stroke:#f6c344}.servidor-oficina{stroke:#f6c344}.detalle-proxmox{fill:#f6d77b;font-size:11px;font-weight:700}.servicios-proxmox rect{fill:#443718;stroke:#f6c344;stroke-width:2}.servicios-proxmox text{fill:#fff;font-size:13px;font-weight:800}.servicios-proxmox .detalle-nodo{fill:#e8d69d;font-size:10px;font-weight:500}.equipo-local rect{fill:#21334b;stroke:#6d8eb8;stroke-width:2}.equipo-local text{fill:#fff;font-size:12px;font-weight:800}.equipo-local .detalle-nodo{fill:#afc3df;font-size:10px;font-weight:500}.linea-lan{fill:none;stroke:#f6c344;stroke-width:3;stroke-dasharray:7 5}
.nodo{background:linear-gradient(145deg,var(--card),var(--bg2));border:1px solid var(--border);border-radius:14px;padding:18px;min-height:175px;box-shadow:0 12px 30px rgba(0,0,0,.16)}
.titulo-seccion{font-size:18px;margin:24px 0 12px;color:var(--txt)}
.nodo h3{margin:7px 0 12px;color:var(--txt);font-size:17px}.nodo p{margin:6px 0;color:var(--txt2);font-size:13px}.nodo code{overflow-wrap:anywhere}
.nodo-tipo{display:inline-flex;padding:4px 8px;border-radius:999px;background:rgba(80,145,245,.14);color:var(--accent);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.07em}
.nodo-usuarios{border-top:3px solid #4f8df7}.nodo-windows{border-top:3px solid #9b6df5}.nodo-vps{border-top:3px solid #11b5d8}.nodo-laravel{border-top:3px solid #31d695}
.nodo-puertos{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.nodo-puertos span{font-size:11px;padding:5px 7px;border-radius:7px;background:rgba(255,255,255,.06);color:var(--txt)}
.enlace{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--txt2);gap:5px}.enlace b{font-size:30px;color:var(--accent)}.enlace span,.enlace small{font-size:10px;font-weight:700}.enlace-vpn b{color:#31d695}
.produccion-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:0}
.tabla-infra{width:100%;border-collapse:collapse;margin-top:12px;font-size:12px}.tabla-infra th,.tabla-infra td{padding:9px 8px;border-bottom:1px solid var(--border);vertical-align:top}.tabla-infra th{width:34%;text-align:left;color:var(--txt2);font-weight:600}.tabla-infra td{color:var(--txt)}
.timeline-operacion{display:grid;gap:10px}.timeline-operacion>div{display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:center;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:11px 14px}.timeline-operacion b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--accent);color:white}.timeline-operacion span{color:var(--txt);font-size:13px}

/* ---------- mapa del modelo de implementación ---------- */
.diagrama-ccna-implementacion{margin:16px 0 28px;background:radial-gradient(circle at 50% 0,rgba(79,142,247,.13),transparent 44%),#0d1422;border:1px solid var(--border);border-radius:18px;padding:10px;overflow-x:auto}.diagrama-ccna-implementacion svg{display:block;width:100%;min-width:980px;height:auto}.ccna-nube{fill:#e8f5ff;stroke:#69b7dc;stroke-width:5}.ccna-titulo-nube{fill:#17334d;font-size:17px;font-weight:900}.ccna-zona{fill:url(#ccnaZona);stroke-width:3}.ccna-zona-local{stroke:#f6c344}.ccna-zona-prod{stroke:#2dd98e}.ccna-titulo-zona{fill:#f3f6ff;font-size:17px;font-weight:900}.ccna-subtitulo{fill:#91a4c4;font-size:12px}.ccna-equipo rect{fill:#243a55;stroke:#6d9bc9;stroke-width:2}.ccna-equipo .ccna-pantalla{fill:#102237}.ccna-equipo line{stroke:#8ab6dc;stroke-width:3}.ccna-equipo text,.ccna-servidor text,.ccna-switch text,.ccna-servicio-local text,.ccna-router text{fill:#fff;font-size:12px;font-weight:800}.ccna-detalle{fill:#aebed2!important;font-size:10px!important;font-weight:600!important}.ccna-switch path{fill:#2176a9;stroke:#70c4ed;stroke-width:2}.ccna-switch circle{fill:#54e5a1}.ccna-servidor>rect:first-child{fill:#17649c;stroke:#75c9ef;stroke-width:2}.ccna-servidor>rect:not(:first-child){fill:#143f61;stroke:#75c9ef}.ccna-servidor circle{fill:#39e69d}.ccna-servidor line{stroke:#91daf8;stroke-width:3}.ccna-servicio-local rect{fill:#443718;stroke:#f6c344;stroke-width:2}.ccna-linea{fill:none;stroke:#58b9ef;stroke-width:3}.ccna-vpn{fill:none;stroke:#34d399;stroke-width:5;stroke-dasharray:10 7}.ccna-despliegue{fill:none;stroke:#a57bf8;stroke-width:4;stroke-dasharray:8 6}.ccna-puerto{fill:#aebed2;font-size:10px;font-weight:700}.ccna-puerta path{fill:#2a2541;stroke:#a57bf8;stroke-width:3}.ccna-puerta>text{fill:#fff;font-size:13px;font-weight:900}.ccna-puerta circle{fill:#143d31;stroke:#2dd98e;stroke-width:3}.ccna-check{fill:#2dd98e!important;font-size:22px!important}.ccna-puerta-det{fill:#c7b8ef!important;font-size:11px!important}.ccna-puerta-no{fill:#ff9e9e!important;font-size:10px!important}.ccna-router ellipse{fill:#123f3a;stroke:#2dd98e;stroke-width:3}.ccna-router path{stroke:#77e8bc;stroke-width:3}.ccna-hostinger>rect:first-child{stroke:#2dd98e}.ccna-nlanube>rect:first-child{stroke:#a57bf8}.ccna-leyenda rect{fill:#111c2e;stroke:#33435e}.ccna-leyenda text{fill:#b7c3d8;font-size:11px}
.mapa-implementacion{display:grid;grid-template-columns:minmax(190px,1fr) 58px minmax(190px,1fr) 58px minmax(190px,1fr) 58px minmax(190px,1fr);gap:10px;align-items:stretch;margin:18px 0 30px}
.etapa-implementacion{position:relative;background:linear-gradient(145deg,var(--card),var(--bg2));border:1px solid var(--border);border-top:4px solid var(--accent);border-radius:14px;padding:20px 16px 16px;min-height:250px}.etapa-implementacion h3{font-size:17px;margin:10px 0;color:var(--txt)}.etapa-implementacion>strong{display:block;color:#fff;font-size:14px;margin-bottom:5px}.etapa-implementacion p{font-size:12px;color:var(--txt2);margin:4px 0}.etapa-implementacion ul{padding-left:18px;margin:14px 0 0;color:var(--txt2);font-size:12px;line-height:1.7}.etapa-numero{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;font-weight:800}.etapa-implementacion .sello{position:absolute;right:12px;top:18px}.etapa-local{border-top-color:var(--contpaq)}.etapa-pruebas{border-top-color:var(--yellow)}.etapa-replica{border-top-color:var(--sdk)}.etapa-produccion{border-top-color:var(--green)}
.flecha-implementacion{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--txt3)}.flecha-implementacion b{font-size:34px;color:var(--accent)}.flecha-implementacion small{font-size:10px;line-height:1.35;font-weight:700}
.rutas-implementacion{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ruta-implementacion{background:var(--card);border:1px solid var(--border);border-left:4px solid var(--accent);border-radius:12px;padding:17px}.ruta-implementacion h3{margin:0 0 14px;color:var(--txt);font-size:16px}.ruta-implementacion p{margin:13px 0 0;color:var(--txt2);font-size:12px;line-height:1.55}.ruta-fallback{grid-column:1/-1;border-left-color:var(--yellow)}.ruta-cadena{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.ruta-cadena span{padding:7px 9px;border-radius:7px;background:var(--bg3);color:var(--txt);font-size:11px;font-weight:700}.ruta-cadena b{color:var(--accent)}
.puertas-implementacion{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:10px}.puertas-implementacion>div{display:flex;gap:10px;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:13px}.puertas-implementacion b{display:grid;place-items:center;flex:0 0 26px;height:26px;border-radius:50%;background:var(--green);color:#082016}.puertas-implementacion span{font-size:12px;color:var(--txt)}.puertas-implementacion small{display:block;color:var(--txt3);line-height:1.4;margin-top:4px}

/* ---------- propuesta de nueva implementación ---------- */
.ccna-propuesta{margin:16px 0 28px;background:radial-gradient(circle at 48% 0,rgba(79,142,247,.14),transparent 42%),#0d1422;border:1px solid var(--border);border-radius:18px;padding:10px;overflow-x:auto}.ccna-propuesta svg{display:block;width:100%;min-width:1050px;height:auto}.ccnap-nube{fill:#e8f5ff;stroke:#69b7dc;stroke-width:5}.ccnap-nube-txt{fill:#17334d;font-size:17px;font-weight:900}.ccnap-zona{fill:url(#ccnaPropZona);stroke-width:3}.ccnap-canales{stroke:#6d8eb8}.ccnap-hostinger{stroke:#2dd98e}.ccnap-nlanube{stroke:#a57bf8}.ccnap-pruebas{stroke:#f6c344}.ccnap-zona-titulo{fill:#f3f6ff;font-size:16px;font-weight:900}.ccnap-nodo rect,.ccnap-servicio rect{fill:#21334b;stroke:#6d9bc9;stroke-width:2}.ccnap-nodo text,.ccnap-servicio text,.ccnap-servidor text,.ccnap-router text,.ccnap-erp text,.ccnap-prueba-nodos text{fill:#fff;font-size:12px;font-weight:800}.ccnap-det{fill:#adbed3!important;font-size:10px!important;font-weight:600!important}.ccnap-ui rect{stroke:#f6c344}.ccnap-servidor>rect:first-child{fill:#17649c;stroke:#75c9ef;stroke-width:2}.ccnap-servidor>rect:not(:first-child){fill:#143f61;stroke:#75c9ef}.ccnap-servidor circle{fill:#39e69d}.ccnap-servidor line{stroke:#91daf8;stroke-width:3}.ccnap-identidad rect{stroke:#a57bf8}.ccnap-cola rect{stroke:#f6c344}.ccnap-log rect{stroke:#ef7186}.ccnap-cache rect,.ccnap-read rect{stroke:#11b5d8}.ccnap-sdk rect{stroke:#2dd98e}.ccnap-router ellipse{fill:#123f3a;stroke:#2dd98e;stroke-width:3}.ccnap-router path{stroke:#77e8bc;stroke-width:3}.ccnap-erp rect{fill:#2a2252;stroke:#a57bf8;stroke-width:3}.ccnap-linea,.ccnap-linea-publica{fill:none;stroke:#58b9ef;stroke-width:3}.ccnap-vpn{fill:none;stroke:#34d399;stroke-width:5;stroke-dasharray:10 7}.ccnap-sdkline{fill:none;stroke:#2dd98e;stroke-width:4}.ccnap-ui-line{fill:none;stroke:#f6c344;stroke-width:4;stroke-dasharray:9 6}.ccnap-label-ui{fill:#f6d77b;font-size:11px;font-weight:800}.ccnap-prueba-nodos rect{fill:#443718;stroke:#f6c344;stroke-width:2}.ccnap-leyenda rect{fill:#111c2e;stroke:#33435e}.ccnap-leyenda text{fill:#b7c3d8;font-size:11px}
.diagnostico-propuesta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.diagnostico-propuesta article{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:17px}.diagnostico-propuesta h3{margin:12px 0 8px;color:var(--txt);font-size:16px}.diagnostico-propuesta p{margin:0;color:var(--txt2);font-size:12px;line-height:1.6}
.arquitectura-propuesta{background:#0d1422;border:1px solid var(--border);border-radius:16px;padding:18px}.capa-propuesta{display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap;border:1px solid var(--border2);border-left:5px solid var(--accent);background:var(--card);border-radius:11px;padding:14px}.capa-propuesta h3{margin:0 16px 0 0;color:var(--txt);font-size:14px}.capa-propuesta span{background:var(--bg3);border-radius:7px;padding:6px 8px;color:var(--txt2);font-size:11px}.capa-api{border-left-color:var(--sdk)}.capa-lectura{border-left-color:var(--contpaq)}.capa-escritura{border-left-color:var(--yellow)}.capa-erp{border-left-color:var(--green)}.flecha-propuesta{text-align:center;color:var(--accent);font-size:24px;line-height:1.2}.division-propuesta{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tabla-propuesta td{line-height:1.5}.estados-operacion-propuesta{display:flex;gap:8px;flex-wrap:wrap}.estados-operacion-propuesta span{position:relative;background:var(--card);border:1px solid var(--border2);border-radius:20px;padding:7px 12px;color:var(--txt);font-size:11px;font-weight:800}.estados-operacion-propuesta span:not(:last-child)::after{content:'→';position:absolute;right:-13px;color:var(--accent)}
.fases-propuesta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.fases-propuesta article{position:relative;background:var(--card);border:1px solid var(--border);border-top:4px solid var(--accent);border-radius:12px;padding:18px}.fases-propuesta b{position:absolute;right:12px;top:12px;color:var(--accent)}.fases-propuesta h3{margin:0 0 8px;color:var(--txt);font-size:16px}.fases-propuesta p{margin:0;color:var(--txt2);font-size:12px;line-height:1.55}
.indicadores-propuesta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.indicadores-propuesta>div{display:flex;align-items:center;gap:13px;background:var(--card);border:1px solid var(--border);border-radius:11px;padding:15px}.indicadores-propuesta strong{font-size:24px;color:var(--green)}.indicadores-propuesta span{font-size:12px;color:var(--txt2)}
.flujo-enrutamiento-operacion{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:10px;margin-bottom:16px}.flujo-enrutamiento-operacion>div{display:flex;gap:10px;background:var(--card);border:1px solid var(--border);border-radius:11px;padding:13px}.flujo-enrutamiento-operacion b{display:grid;place-items:center;flex:0 0 30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;font-size:11px}.flujo-enrutamiento-operacion span{font-size:12px;color:var(--txt)}.flujo-enrutamiento-operacion small{display:block;color:var(--txt3);line-height:1.45;margin-top:4px}.canal-sdk,.canal-ui,.canal-revision,.canal-bloqueado{display:inline-block;border-radius:14px;padding:4px 8px;font-size:10px;font-weight:800;white-space:nowrap}.canal-sdk{background:rgba(45,217,142,.15);color:var(--green)}.canal-ui{background:rgba(246,195,68,.16);color:var(--yellow)}.canal-revision{background:rgba(165,123,248,.16);color:#c9b0ff}.canal-bloqueado{background:rgba(247,95,95,.16);color:#ff9e9e}
.plan-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:0 10px 28px rgba(22,48,76,.06)}
.plan-card h3{margin-top:0;font-size:18px;border-bottom:1px solid var(--border);padding-bottom:12px;margin-bottom:16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--accent-2)}
ul.plan-list{margin:0;padding-left:20px;color:var(--txt2);font-size:14px;line-height:1.65}
ul.plan-list li{margin-bottom:10px}
ul.plan-list li strong{color:var(--txt)}
.tag-bx{display:inline-block;padding:4px 8px;border-radius:6px;font-size:12px;font-weight:700;background:rgba(255,255,255,.1);margin-right:4px}
.tag-nx{color:#4ade80;background:rgba(74,222,128,.15);border:1px solid rgba(74,222,128,.3)}
.tag-rx{color:#60a5fa;background:rgba(96,165,250,.15);border:1px solid rgba(96,165,250,.3)}
.tag-cx{color:#f472b6;background:rgba(244,114,182,.15);border:1px solid rgba(244,114,182,.3)}
.tag-clx{color:#facc15;background:rgba(250,204,21,.15);border:1px solid rgba(250,204,21,.3)}
.flow-step{background:var(--card);border:1px solid var(--border);padding:14px 16px;border-radius:12px;margin-bottom:10px;border-left:3px solid var(--accent);font-size:13.5px;color:var(--txt2);box-shadow:0 8px 20px rgba(22,48,76,.04)}
.flow-step strong{color:var(--accent-2)}
.alert-box{background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.22);border-radius:8px;padding:16px;color:#b34343;font-size:14px;margin-top:16px;line-height:1.6}
.alert-box strong{color:#ef4444}

/* ---------- plan integral de pruebas ---------- */
.pruebas-resumen{grid-template-columns:repeat(5,minmax(160px,1fr))}
.historial-resumen{grid-template-columns:repeat(6,minmax(140px,1fr))}
.prueba-regla{margin-bottom:24px}
.matriz-sucursales{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-bottom:8px}
.prueba-grupo{background:var(--card);border:1px solid var(--border);border-radius:14px;margin-bottom:12px;overflow:hidden;box-shadow:0 8px 22px rgba(22,48,76,.04)}
.prueba-grupo summary{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;padding:16px 18px;font-weight:700;list-style:none;color:var(--accent-2)}
.prueba-grupo summary::-webkit-details-marker{display:none}
.prueba-grupo summary::before{content:'▶';color:var(--txt3);font-size:11px;transition:.2s}
.prueba-grupo[open] summary::before{transform:rotate(90deg)}
.prueba-grupo summary .tag{margin-left:auto;font-size:11px;font-weight:600;padding:3px 10px;border-radius:20px;background:rgba(39,75,115,.08);color:var(--accent)}
.prueba-descripcion{padding:0 18px 14px;color:var(--txt2);font-size:13px;line-height:1.5}
.tabla-pruebas-contenedor{padding:14px 18px}
.tabla-pruebas{min-width:1050px}
.tabla-pruebas td{line-height:1.45}
.tabla-pruebas td:first-child{white-space:nowrap}
.estado-prueba{display:inline-block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:3px 8px;border-radius:20px;white-space:nowrap}
.e-verificado{background:rgba(45,217,142,.15);color:var(--green)}
.e-en_curso{background:rgba(255,196,61,.16);color:#ffd66b}
.e-pendiente{background:rgba(165,123,248,.15);color:#c9b0ff}
.e-bloqueado{background:rgba(247,95,95,.15);color:#ff9e9e}
.evidencia-prueba{font-size:11px;color:var(--txt3);margin-top:6px;line-height:1.4}
.tag-mini{display:inline-block;font-size:10px;color:var(--txt3);margin-top:4px}

/* ---------- reglas de operación ---------- */
.regla-principal{margin-bottom:24px}
.flujo-reglas{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:12px;align-items:center;margin-bottom:20px}
.regla-paso{display:flex;gap:12px;align-items:flex-start;background:var(--card);border:1px solid var(--border);border-top:3px solid var(--sdk);border-radius:12px;padding:16px;min-height:112px;color:var(--txt2);font-size:13px;line-height:1.5}
.regla-paso.ui{border-top-color:var(--contpaq)}
.regla-paso.evidencia{border-top-color:var(--green)}
.regla-paso strong{color:var(--txt);font-size:15px}
.regla-num{display:flex;align-items:center;justify-content:center;width:28px;height:28px;flex:0 0 28px;border-radius:50%;background:var(--accent);color:#fff;font-weight:800}
.regla-flecha{color:var(--txt3);font-size:24px;font-weight:800}
.reglas-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:20px}
.regla-card{height:100%}
.lista-evidencia li{padding-bottom:2px}
.lista-evidencia .estado-prueba{margin-right:6px}
.regla-alerta-bridge{margin-top:20px}

/* ---------- graficas (SVG + CSS, sin librerias) ---------- */
.graficas{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-bottom:8px}
.grafica{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:20px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}
.grafica.ancha{grid-column:span 2;text-align:left;align-items:stretch}
.grafica-tit{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--txt2);margin-bottom:14px}
.grafica-pie{font-size:12px;color:var(--txt3);margin-top:10px;line-height:1.5}
.dona{display:block;margin:0 auto}
.dona-txt{fill:var(--txt);font-size:24px;font-weight:800;font-family:'Inter',sans-serif}

.barras{display:flex;flex-direction:column;gap:10px;width:100%}
.barra-fila{display:flex;align-items:center;gap:12px}
.barra-fila.fuerte .barra-etq{color:var(--txt);font-weight:700}
.barra-etq{font-size:12px;color:var(--txt2);width:190px;flex-shrink:0}
.barra-etq.sub{font-size:11px;color:var(--txt3);padding-left:12px}
.barra{flex:1;height:9px;background:var(--bg3);border-radius:5px;overflow:hidden;margin-top:10px}
.barra-fila .barra{margin-top:0}
.barra-fill{height:100%;border-radius:5px;transition:width .8s ease;background:var(--accent)}
.barra-fill.rojo{background:var(--red)} .barra-fill.amarillo{background:var(--yellow)}
.barra-fill.verde{background:var(--green)} .barra-fill.gris{background:var(--txt3)}
.barra-num{font-size:13px;font-weight:700;width:44px;text-align:right;font-variant-numeric:tabular-nums}
.barra-num.pequeno{font-size:11px;color:var(--txt3);font-weight:600}

/* ---------- procesos vivos ---------- */
.proceso{background:var(--card);border:1px solid var(--border);border-left:3px solid var(--green);border-radius:10px;padding:14px 16px;margin-bottom:8px}
.proceso.sub{margin-left:26px;border-left-color:var(--border2)}
.proceso.malo{border-left-color:var(--red)}
.proceso-cab{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px}
.proceso-meta{display:flex;gap:16px;flex-wrap:wrap;font-size:11.5px;color:var(--txt3);margin:7px 0}
.proceso-fase{font-size:12px;color:var(--txt2);font-style:italic;margin-bottom:8px}
.proceso-pct{font-size:11px;color:var(--txt3);margin-top:5px}

/* ---------- tarea tomada ---------- */
.tomada{background:var(--card2);border:1px solid var(--border2);border-left:3px solid var(--green);border-radius:10px;padding:14px 16px;margin-bottom:8px}
.tomada.huerfana{border-left-color:var(--yellow)}
.tomada-cab{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px;margin-bottom:6px}
.tomada-p{font-size:11px;color:var(--txt3);margin-left:auto}
.tomada-txt{font-size:13px;color:var(--txt2);line-height:1.55}

/* ---------- flota ---------- */
.flota{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-top:16px}
.flota>div{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:16px}
.flota-tit{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--txt2);margin-bottom:10px}
.flota-item{display:flex;align-items:center;gap:9px;padding:6px 0;font-size:13px;border-top:1px solid var(--border);flex-wrap:wrap}
.flota-item:first-of-type{border-top:none}
.flota-det{font-size:11px;color:var(--txt3);margin-left:auto}

/* ---------- roadmap ---------- */
.area-bloque{margin-bottom:20px}
.modulo{margin:4px 0}
.modulo summary{cursor:pointer;list-style:none;padding:8px 10px;border-radius:12px;transition:all .2s ease}
.modulo summary::-webkit-details-marker{display:none}
.modulo summary:hover{background:rgba(39,75,115,.04)}
.modulo summary:hover .barra-etq{color:var(--accent)}
.modulo-cuerpo{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px 16px;margin:6px 0 10px 32px;box-shadow:0 8px 20px rgba(22,48,76,.04)}
.modulo-desc{font-size:12.5px;color:var(--txt2);margin-bottom:12px;line-height:1.6}
.punto-fila{display:flex;gap:11px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--border);font-size:13px}
.punto-fila:first-of-type{border-top:none}
.marca{width:18px;height:18px;border-radius:4px;border:1.5px solid var(--border2);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:11px;color:#fff;margin-top:1px}
.marca.si{background:var(--green);border-color:var(--green)}
.tachado{text-decoration:line-through;color:var(--txt3)}
.punto-nota{font-size:11px;color:var(--txt3);font-style:italic;margin-top:3px;line-height:1.5}

/* ---------- faltantes y completadas automáticas ---------- */
.avance-global-card{margin-top:22px;background:var(--card);border:1px solid var(--border);border-left:4px solid var(--green);border-radius:var(--r);padding:18px 20px;display:grid;grid-template-columns:minmax(220px,340px) 1fr;gap:24px;align-items:center}
.avance-global-etq{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--txt2);font-weight:700}
.avance-global-num{font-size:38px;line-height:1.1;font-weight:800;color:var(--green);margin:4px 0}
.avance-global-det{font-size:12px;color:var(--txt3)}
.avance-global-barra{height:16px;background:var(--bg3);border-radius:9px;overflow:hidden}
.avance-global-barra>div{height:100%;background:linear-gradient(90deg,var(--contpaq),var(--green));border-radius:9px;transition:width .6s ease}
.tablero-faltantes{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.columna-tareas{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden}
.columna-tareas-cab{position:sticky;top:0;z-index:1;background:var(--card2);border-bottom:1px solid var(--border);padding:15px 17px;display:flex;justify-content:space-between;align-items:center}
.columna-tareas-cab>div{display:flex;align-items:center;gap:9px}
.estado-punto{width:10px;height:10px;border-radius:50%;display:inline-block;background:var(--yellow)}
.estado-punto.completada{background:var(--green)}
.contador-tareas{min-width:32px;text-align:center;border-radius:12px;background:var(--bg3);color:var(--txt2);font-size:12px;font-weight:700;padding:3px 8px}
.lista-tareas-auto{max-height:70vh;overflow:auto;padding:10px}
.tarea-auto{border:1px solid var(--border);border-left:3px solid var(--area-color);border-radius:9px;padding:12px 13px;margin-bottom:8px;background:var(--bg2)}
.tarea-auto.completada{opacity:.76}
.tarea-auto-meta{font-size:10px;color:var(--txt3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px}
.tarea-auto-meta span{color:var(--area-color);font-weight:700}
.tarea-auto-titulo{font-size:13px;color:var(--txt);font-weight:600;line-height:1.4}
.tarea-auto.completada .tarea-auto-titulo{text-decoration:line-through;color:var(--txt2)}
.tarea-auto-nota{font-size:11px;color:var(--txt3);line-height:1.45;margin-top:6px}
.lista-vacia{padding:30px;text-align:center;color:var(--txt3);font-size:13px}

::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}

@media(max-width:900px){
  .hero,.seccion{padding-left:16px;padding-right:16px}
  .header{padding:0 16px}
  .main-nav{margin:20px 16px 0}
  .plan-grid{grid-template-columns:1fr}
  .modelo-grid{grid-template-columns:1fr}
  .topologia{grid-template-columns:1fr}.enlace{min-height:56px}.enlace b{transform:rotate(90deg)}.produccion-grid{grid-template-columns:1fr}.topologia-cisco{padding:6px}
  .pruebas-resumen{grid-template-columns:repeat(2,minmax(150px,1fr))}
  .historial-resumen{grid-template-columns:repeat(2,minmax(150px,1fr))}
  .flujo-reglas{grid-template-columns:1fr}
  .regla-flecha{transform:rotate(90deg);text-align:center;line-height:1}
  .reglas-grid{grid-template-columns:1fr}
  .tablero-faltantes{grid-template-columns:1fr}
  .avance-global-card{grid-template-columns:1fr}
  .mapa-implementacion{grid-template-columns:1fr}.flecha-implementacion{min-height:38px}.flecha-implementacion b{transform:rotate(90deg)}
  .rutas-implementacion{grid-template-columns:1fr}.ruta-fallback{grid-column:auto}.puertas-implementacion{grid-template-columns:1fr 1fr}
  .diagnostico-propuesta{grid-template-columns:1fr 1fr}.division-propuesta{grid-template-columns:1fr}.fases-propuesta{grid-template-columns:1fr 1fr}.indicadores-propuesta{grid-template-columns:1fr 1fr}
  .flujo-enrutamiento-operacion{grid-template-columns:1fr 1fr}
}

@media(max-width:520px){
  .pruebas-resumen{grid-template-columns:1fr}
  .puertas-implementacion{grid-template-columns:1fr}
  .diagnostico-propuesta,.fases-propuesta,.indicadores-propuesta{grid-template-columns:1fr}
  .flujo-enrutamiento-operacion{grid-template-columns:1fr}
}

/* ---------- roadmaps planeacion + implementacion ---------- */
.roadmap-sheet{margin:0 0 24px;background:#fff;border:1px solid #dbe4ea;border-radius:16px;padding:22px;box-shadow:0 12px 30px rgba(22,48,76,.07);overflow:hidden}
.roadmap-sheet-plan{border-top:5px solid #d6a81e}.roadmap-sheet:not(.roadmap-sheet-plan){border-top:5px solid #e23b19}
.roadmap-sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}.roadmap-sheet-head h2{margin:2px 0 4px;color:#19324d;font:800 28px/1.1 'Manrope',sans-serif}.roadmap-sheet-head p{margin:0;color:#64748b;font-size:13px}.roadmap-kicker{color:#e23b19;font-size:10px;font-weight:900;letter-spacing:.12em}.roadmap-sheet-plan .roadmap-kicker{color:#b27b00}.roadmap-state-pill,.roadmap-legend span{display:inline-flex;padding:7px 11px;border-radius:999px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}
.roadmap-axis{display:grid;grid-template-columns:minmax(175px,1.25fr) repeat(7,minmax(92px,1fr));gap:2px;margin-bottom:3px;min-width:920px}.roadmap-axis b{padding:8px 5px;border-radius:4px;background:#5c5a59;color:#fff;text-align:center;font-size:10px;text-transform:uppercase}.roadmap-axis b:nth-child(n+2):nth-child(-n+4){background:#685fb0}.roadmap-axis b:nth-child(n+5){background:#565f9e}
.roadmap-grid{display:grid;grid-template-columns:minmax(175px,1.25fr) minmax(740px,7fr);gap:3px;min-width:920px}.roadmap-row-label{padding:9px 12px;background:#eaf2f5;border-left:5px solid #48abc8;min-height:52px}.roadmap-row-label strong{display:block;color:#17324c;font-size:12px;text-transform:uppercase}.roadmap-row-label small{display:block;margin-top:3px;color:#64748b;font-size:10px;line-height:1.3}.roadmap-track{display:grid;grid-template-columns:repeat(7,1fr);align-items:center;position:relative;min-height:52px;background:repeating-linear-gradient(90deg,#edf3f5 0,calc(14.2857% - 2px),#fff calc(14.2857% - 2px),#fff 14.2857%)}.roadmap-bar{grid-column:var(--start)/span var(--span);z-index:1;margin:0 3px;padding:7px 9px;border-radius:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;font-weight:800;border:1px solid transparent}.roadmap-bar.estado-verificado{background:#29aa70;color:#fff;border-color:#178455}.roadmap-bar.estado-en_curso{background:#f4c542;color:#493700;border-color:#d6a81e}.roadmap-bar.estado-pendiente{background:#9fc8d4;color:#17324c;border-color:#68a6b7}.roadmap-bar.estado-bloqueado{background:#d8444f;color:#fff;border-color:#af2631}.roadmap-legend{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:14px}.roadmap-legend .estado-verificado{background:#29aa70;color:#fff}.roadmap-legend .estado-en_curso{background:#f4c542;color:#493700}.roadmap-legend .estado-pendiente{background:#9fc8d4;color:#17324c}.roadmap-legend .estado-bloqueado{background:#d8444f;color:#fff}
@media (max-width:980px){.roadmap-sheet{overflow-x:auto}.roadmap-sheet-head{position:sticky;left:0;min-width:min(86vw,720px)}.roadmap-axis,.roadmap-grid{min-width:900px}}
@media (max-width:640px){.roadmap-sheet{padding:15px}.roadmap-sheet-head{flex-direction:column}.roadmap-sheet-head h2{font-size:23px}}

/* ---------- acceso privado ---------- */
.mapa-cobertura{padding-top:12px}.cobertura-grid{display:grid;gap:10px}.cobertura-card{border:1px solid var(--border);border-radius:12px;background:var(--bg2);overflow:hidden}.cobertura-card summary{display:flex;justify-content:space-between;gap:12px;padding:15px 17px;cursor:pointer;color:var(--txt);font-weight:800}.cobertura-card summary span{color:var(--txt3);font-size:11px}.cobertura-card .tabla-wrap{padding:0 12px 12px}.cobertura-card table{margin:0}.cobertura-card td:first-child{font-weight:600}.cobertura-card code{white-space:normal}
.login-body{min-height:100vh;margin:0;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at top left,#173b59 0,#0c1d2b 48%,#07131d 100%);font-family:Inter,Arial,sans-serif}
.login-card{width:min(420px,100%);box-sizing:border-box;padding:36px;border:1px solid rgba(255,255,255,.13);border-radius:20px;background:rgba(255,255,255,.97);box-shadow:0 24px 70px rgba(0,0,0,.35)}
.login-logo{width:48px;height:48px}.login-kicker{margin-top:20px;color:#e23b19;font-size:11px;font-weight:800;letter-spacing:.14em}.login-card h1{margin:7px 0;color:#17324c;font:800 32px/1.1 Manrope,Inter,sans-serif}.login-card p{margin:0 0 24px;color:#64748b;font-size:14px;line-height:1.5}
.login-card label{display:block;margin:15px 0;color:#334155;font-size:12px;font-weight:700}.login-card input{display:block;width:100%;box-sizing:border-box;margin-top:7px;padding:12px 13px;border:1px solid #cbd5e1;border-radius:9px;background:#fff;color:#0f172a;font:inherit}.login-card input:focus{outline:3px solid rgba(226,59,25,.16);border-color:#e23b19}.login-card button{width:100%;margin-top:8px;padding:13px;border:0;border-radius:9px;background:#e23b19;color:#fff;font-weight:800;cursor:pointer}.login-error{margin:0 0 14px;padding:10px 12px;border-radius:8px;background:#fee2e2;color:#991b1b;font-size:12px}.logout-form{margin:0}.logout-btn{font:inherit;cursor:pointer;border-color:#64748b;background:transparent;color:inherit}