/* ============================================================
   SIMCE · hoja de estilos institucional
   Sin frameworks. Paleta navy + verde. Tema claro único,
   pensado para lectura densa y tableros.
   ============================================================ */
:root {
    --navy: #1e3a5f;
    --navy-osc: #16324f;
    --navy-claro: #2b527d;
    --verde: #2e9e5b;
    --verde-osc: #24814a;
    --tinta: #1b2433;
    --tinta-suave: #48546a;
    --muted: #6b7686;
    --linea: #e4e8ef;
    --linea-fuerte: #d3dae4;
    --fondo: #f2f5f8;
    --panel: #ffffff;
    --panel-alt: #f8fafc;
    --sombra: 0 1px 2px rgba(16, 24, 40, .04), 0 2px 6px rgba(16, 24, 40, .06);
    --sombra-fuerte: 0 6px 16px rgba(16, 24, 40, .12), 0 2px 6px rgba(16, 24, 40, .08);
    --sombra-lift: 0 4px 12px rgba(16, 24, 40, .1), 0 1px 3px rgba(16, 24, 40, .07);
    --radio: 12px;
    --radio-sm: 8px;

    --verde-sem: #16a34a;
    --amarillo-sem: #d97706;
    --rojo-sem: #dc2626;
    --critico-sem: #6d28d9;
    --neutro-sem: #9ca3af;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
    font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    background: var(--fondo);
    color: var(--tinta);
    font-size: 14px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
img { max-width: 100%; }
a { color: var(--navy-claro); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { margin: 0 0 .4em; color: var(--tinta); font-weight: 650; letter-spacing: -.01em; }
h1, h2 { text-wrap: balance; }
code, .mono {
    font-family: "Cascadia Code", "Consolas", ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: .92em;
}
::selection { background: rgba(46, 158, 91, .22); }
:focus-visible { outline: 2px solid var(--verde); outline-offset: 2px; border-radius: 4px; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ---------- estructura ---------- */
.app { display: flex; min-height: 100vh; }

.barra-lateral {
    width: 264px;
    flex-shrink: 0;
    background: var(--navy);
    background: linear-gradient(180deg, #22416a 0%, var(--navy) 22%, var(--navy-osc) 100%);
    color: #cdd8e6;
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, .22) transparent;
}
.barra-lateral::-webkit-scrollbar { width: 8px; }
.barra-lateral::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .18); border-radius: 8px; }
.marca {
    display: flex; align-items: center; gap: 10px;
    padding: 18px 18px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
}
.marca-logo {
    width: 34px; height: 34px; border-radius: 8px;
    background: var(--verde); color: #fff;
    display: grid; place-items: center; font-weight: 700; font-size: 18px;
}
.marca-logo--img {
    width: 42px; height: 42px; border-radius: 9px;
    background: #fff; padding: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .25);
}
.marca-logo--img img { display: block; width: 100%; height: 100%; object-fit: contain; }
.login-cab .marca-logo--img { width: 60px; height: 60px; }
.marca-texto { display: flex; flex-direction: column; line-height: 1.15; }
.marca-texto strong { color: #fff; font-size: 16px; letter-spacing: .5px; }
.marca-texto small { color: #9fb1c6; font-size: 11px; }

.menu { flex: 1; padding: 10px 0; }
.menu-grupo { border-bottom: 1px solid rgba(255, 255, 255, .05); }
.menu-grupo-titulo {
    width: 100%; text-align: left; background: none; border: 0; cursor: pointer;
    color: #e2eaf3; font: inherit; font-weight: 600; font-size: 13px;
    letter-spacing: .01em;
    padding: 11px 16px; display: flex; align-items: center; gap: 8px;
    transition: background .14s;
}
.menu-grupo-titulo:hover { background: rgba(255, 255, 255, .06); }
.menu-chevron { margin-left: auto; transition: transform .18s ease; opacity: .55; }
.menu-grupo.abierto .menu-grupo-titulo { color: #fff; }
.menu-grupo.abierto .menu-chevron { transform: rotate(90deg); }
.menu-items { display: none; padding: 2px 0 8px; }
.menu-grupo.abierto .menu-items { display: block; }
.menu-item {
    display: block; padding: 8px 16px 8px 40px;
    color: #a9b8ca; font-size: 13px;
    border-left: 3px solid transparent;
    transition: background .14s, color .14s;
}
.menu-item:hover { color: #fff; background: rgba(255, 255, 255, .05); text-decoration: none; }
.menu-item.activo {
    color: #fff; background: rgba(46, 158, 91, .16);
    border-left-color: var(--verde); font-weight: 600;
}
.menu-n {
    display: inline-block; min-width: 26px; color: #8298b0;
    font-variant-numeric: tabular-nums; font-size: 12px;
}
.menu-item.activo .menu-n { color: #74d29b; }
.barra-lateral-pie {
    padding: 14px 18px; font-size: 11px; color: #97a9c0;
    border-top: 1px solid rgba(255, 255, 255, .1);
    display: flex; flex-direction: column; gap: 3px;
}
.barra-lateral-pie strong { color: #dbe6f2; }

.contenido { flex: 1; min-width: 0; display: flex; flex-direction: column; }

.barra-superior {
    display: flex; align-items: center; gap: 16px;
    background: rgba(255, 255, 255, .92);
    backdrop-filter: saturate(1.6) blur(6px);
    border-bottom: 1px solid var(--linea);
    padding: 10px 22px; position: sticky; top: 0; z-index: 20;
    transition: box-shadow .16s;
}
.barra-superior.scrolled { box-shadow: 0 6px 18px -12px rgba(16, 24, 40, .35); }
.boton-menu { display: none; background: none; border: 0; font-size: 22px; cursor: pointer; color: var(--navy); }
.titulo-pagina { flex: 1; min-width: 0; }
.titulo-pagina h1 { font-size: 18px; margin: 0; letter-spacing: -.015em; }
.titulo-pagina p { margin: 2px 0 0; color: var(--muted); font-size: 12.5px; }

.barra-superior-derecha { display: flex; align-items: center; gap: 14px; }

.selector-corte { display: flex; align-items: center; gap: 6px; }
.selector-corte label { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .4px; }
.selector-corte select {
    border: 1px solid var(--linea-fuerte); border-radius: var(--radio-sm); padding: 6px 8px;
    font: inherit; font-size: 13px; background: #fff; color: var(--tinta); max-width: 230px;
}
.corte-reset {
    border: 1px solid var(--linea-fuerte); border-radius: var(--radio-sm); width: 30px; height: 30px;
    display: grid; place-items: center; color: var(--muted); text-decoration: none;
    transition: background .14s, color .14s;
}
.corte-reset:hover { background: var(--fondo); color: var(--tinta); text-decoration: none; }

.chip-alertas {
    background: #fff4f2; color: var(--rojo-sem); border: 1px solid #f6c9c0;
    border-radius: 999px; padding: 5px 11px; font-weight: 600; font-size: 12.5px;
    transition: background .14s;
}
.chip-alertas:hover { text-decoration: none; background: #ffe4de; }

.menu-usuario { position: relative; }
.menu-usuario > button {
    display: flex; align-items: center; gap: 8px;
    background: none; border: 0; cursor: pointer; font: inherit; color: var(--tinta);
    padding: 4px 6px; border-radius: var(--radio-sm);
    transition: background .14s;
}
.menu-usuario > button:hover { background: var(--fondo); }
.avatar {
    width: 32px; height: 32px; border-radius: 50%;
    background: linear-gradient(145deg, var(--navy-claro), var(--navy));
    color: #fff; display: grid; place-items: center; font-weight: 600; text-transform: uppercase;
}
.menu-usuario-nombre { display: flex; flex-direction: column; text-align: left; line-height: 1.15; font-size: 13px; }
.menu-usuario-nombre small { color: var(--muted); font-size: 11px; }
.menu-usuario-desplegable {
    display: none; position: absolute; right: 0; top: 48px;
    background: #fff; border: 1px solid var(--linea); border-radius: var(--radio);
    box-shadow: var(--sombra-fuerte); min-width: 230px; overflow: hidden; z-index: 30;
}
.menu-usuario-desplegable.abierto { display: block; }
.menu-usuario-cab { padding: 12px 14px; border-bottom: 1px solid var(--linea); font-size: 12.5px; color: var(--tinta-suave); }
.btn-salir { width: 100%; text-align: left; background: none; border: 0; padding: 11px 14px; cursor: pointer; font: inherit; color: var(--rojo-sem); transition: background .14s; }
.btn-salir:hover { background: #fef2f2; }

.aviso-corte {
    background: #fff8e6; border-bottom: 1px solid #f3e2b3; color: #7a5a12;
    padding: 8px 22px; font-size: 12.5px;
}

.area-trabajo { flex: 1; padding: 24px 22px; max-width: 1500px; width: 100%; }
.pie-pagina { padding: 16px 22px; color: var(--muted); font-size: 11.5px; border-top: 1px solid var(--linea); }

/* ---------- flashes ---------- */
.flash {
    border-radius: var(--radio-sm); padding: 12px 15px; margin-bottom: 16px; font-size: 13px;
    border: 1px solid transparent; border-left-width: 4px;
}
.flash ul { margin: 0; padding-left: 18px; }
.flash-exito { background: #ecfdf3; border-color: #abefc6; border-left-color: var(--verde-sem); color: #067647; }
.flash-error { background: #fef3f2; border-color: #fda29b; border-left-color: var(--rojo-sem); color: #b42318; }
.flash-aviso { background: #fffaeb; border-color: #fedf89; border-left-color: var(--amarillo-sem); color: #b54708; }

/* ---------- paneles / tarjetas ---------- */
.panel {
    background: var(--panel); border: 1px solid var(--linea);
    border-radius: var(--radio); box-shadow: var(--sombra); margin-bottom: 20px;
}
.panel-cab {
    padding: 14px 18px; border-bottom: 1px solid var(--linea);
    background: var(--panel-alt);
    border-radius: var(--radio) var(--radio) 0 0;
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.panel-cab h2 { margin: 0; font-size: 15px; font-weight: 650; }
.panel-cab .sub { color: var(--muted); font-size: 12.5px; }
.panel-cab .acciones { margin-left: auto; display: flex; gap: 8px; }
.panel-cuerpo { padding: 18px; }
.panel-cuerpo.sin-relleno { padding: 0; }
.panel-cuerpo.sin-relleno > .tabla-wrap > table.tabla tbody tr:last-child td { border-bottom: 0; }

.rejilla { display: grid; gap: 16px; }
.rejilla.cols-2 { grid-template-columns: repeat(2, 1fr); }
.rejilla.cols-3 { grid-template-columns: repeat(3, 1fr); }
.rejilla.cols-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1100px) { .rejilla.cols-3, .rejilla.cols-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 720px) { .rejilla.cols-2, .rejilla.cols-3, .rejilla.cols-4 { grid-template-columns: 1fr; } }

/* ---------- tarjetas KPI ---------- */
.kpi {
    background: var(--panel); border: 1px solid var(--linea); border-radius: var(--radio);
    box-shadow: var(--sombra); padding: 16px 18px;
    transition: box-shadow .16s, transform .16s;
}
.kpi:hover { box-shadow: var(--sombra-lift); transform: translateY(-1px); }
.kpi .etq { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .5px; font-weight: 600; }
.kpi .val { font-size: 28px; font-weight: 700; margin: 6px 0 2px; line-height: 1.1; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.kpi .pie { font-size: 12px; color: var(--tinta-suave); }
.kpi.borde-verde { border-left: 4px solid var(--verde-sem); }
.kpi.borde-amarillo { border-left: 4px solid var(--amarillo-sem); }
.kpi.borde-rojo { border-left: 4px solid var(--rojo-sem); }
.kpi.borde-navy { border-left: 4px solid var(--navy); }

/* ---------- tablas ---------- */
.tabla-wrap { overflow-x: auto; scrollbar-width: thin; }
.tabla-wrap::-webkit-scrollbar { height: 9px; }
.tabla-wrap::-webkit-scrollbar-thumb { background: var(--linea-fuerte); border-radius: 8px; }
table.tabla { width: 100%; border-collapse: collapse; font-size: 13px; }
table.tabla th, table.tabla td { padding: 10px 13px; text-align: left; border-bottom: 1px solid var(--linea); vertical-align: top; }
table.tabla thead th {
    background: var(--panel-alt); color: var(--tinta-suave); font-weight: 600;
    font-size: 11.5px; text-transform: uppercase; letter-spacing: .3px; white-space: nowrap;
    border-bottom: 2px solid var(--linea-fuerte);
}
table.tabla tbody tr { transition: background .12s; }
table.tabla tbody tr:hover { background: #f4f8fd; }
table.tabla td.num, table.tabla th.num { text-align: right; font-variant-numeric: tabular-nums; }
table.tabla .tenue { color: var(--muted); }
table.tabla.zebra tbody tr:nth-child(even) { background: #fbfcfe; }
table.tabla.zebra tbody tr:nth-child(even):hover { background: #f4f8fd; }

/* ---------- semaforo ---------- */
.sem {
    display: inline-block; padding: 2px 9px; border-radius: 999px;
    font-size: 11.5px; font-weight: 600; white-space: nowrap;
    border: 1px solid transparent;
}
.sem-verde { background: #dcfce7; color: #15803d; border-color: #b3e9c6; }
.sem-amarillo { background: #fef3c7; color: #b45309; border-color: #f6df9c; }
.sem-rojo { background: #fee2e2; color: #b91c1c; border-color: #f7c4c4; }
.sem-critico { background: #ede9fe; color: #6d28d9; border-color: #d6ccf8; }
.sem-neutro { background: #f1f3f5; color: #6b7280; border-color: #e2e5e9; }
.sem-punto { display: inline-block; width: 10px; height: 10px; border-radius: 50%; border: 0; }
.sem-punto.sem-verde { background: var(--verde-sem); }
.sem-punto.sem-amarillo { background: var(--amarillo-sem); }
.sem-punto.sem-rojo { background: var(--rojo-sem); }
.sem-punto.sem-critico { background: var(--critico-sem); }
.sem-punto.sem-neutro { background: var(--neutro-sem); }

/* ---------- barras de avance ---------- */
.barra-prog { background: #eef1f4; border-radius: 999px; height: 8px; overflow: hidden; min-width: 90px; }
.barra-prog > span { display: block; height: 100%; background: var(--verde-sem); border-radius: inherit; }
.barra-prog.amarillo > span { background: var(--amarillo-sem); }
.barra-prog.rojo > span { background: var(--rojo-sem); }

/* ---------- formularios ---------- */
.campo { margin-bottom: 14px; }
.campo label { display: block; font-weight: 600; font-size: 12.5px; margin-bottom: 5px; color: var(--tinta-suave); }
.campo .ayuda { font-size: 11.5px; color: var(--muted); margin-top: 4px; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=date],
select, textarea {
    width: 100%; border: 1px solid var(--linea-fuerte); border-radius: var(--radio-sm); padding: 9px 12px;
    font: inherit; font-size: 13.5px; background: #fff; color: var(--tinta);
    transition: border-color .14s, box-shadow .14s;
}
input::placeholder, textarea::placeholder { color: #9aa4b2; }
select {
    appearance: none; -webkit-appearance: none;
    padding-right: 34px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7686' d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
}
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--verde);
    box-shadow: 0 0 0 3px rgba(46, 158, 91, .16);
}
input:disabled, select:disabled, textarea:disabled { background: var(--panel-alt); color: var(--muted); cursor: not-allowed; }
textarea { min-height: 78px; resize: vertical; }
.campos-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 640px) { .campos-2 { grid-template-columns: 1fr; } }

/* ---------- botones ---------- */
.btn {
    display: inline-flex; align-items: center; gap: 6px;
    border: 1px solid transparent; border-radius: var(--radio-sm); padding: 8px 14px;
    font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none;
    transition: background .14s, box-shadow .14s, border-color .14s, transform .06s;
}
.btn:hover { text-decoration: none; }
.btn:active { transform: translateY(1px); }
.btn-primario { background: var(--verde); color: #fff; box-shadow: 0 1px 2px rgba(36, 129, 74, .3); }
.btn-primario:hover { background: var(--verde-osc); color: #fff; }
.btn-navy { background: var(--navy); color: #fff; box-shadow: 0 1px 2px rgba(22, 50, 79, .3); }
.btn-navy:hover { background: var(--navy-osc); color: #fff; }
.btn-plano { background: #fff; border-color: var(--linea-fuerte); color: var(--tinta); }
.btn-plano:hover { background: var(--fondo); border-color: #c3ccd8; }
.btn-peligro { background: #fff; border-color: #f6c9c0; color: var(--rojo-sem); }
.btn-peligro:hover { background: #fef2f2; border-color: #eeb3a8; }
.btn-sm { padding: 5px 10px; font-size: 12px; }
.btn-bloque { width: 100%; justify-content: center; }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
.btn[disabled]:active { transform: none; }

/* ---------- etiquetas varias ---------- */
.tag { display: inline-block; padding: 2px 8px; border-radius: 6px; background: #eef2f7; color: var(--tinta-suave); font-size: 11.5px; font-weight: 600; }
.tag-plan { background: #e8f0fe; color: #1e40af; }
.pill-corte { background: var(--navy); color: #fff; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }

.dato-lista { display: grid; grid-template-columns: 190px 1fr; gap: 6px 16px; font-size: 13px; }
.dato-lista dt { color: var(--muted); }
.dato-lista dd { margin: 0; }

.vacio {
    text-align: center; color: var(--muted); padding: 40px 20px;
    border: 1px dashed var(--linea-fuerte); border-radius: var(--radio); background: var(--panel-alt);
}

.seccion-titulo {
    display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
    margin: 26px 0 12px; font-size: 15px; font-weight: 650; color: var(--tinta);
}
.seccion-titulo .sub { font-size: 12.5px; font-weight: 400; color: var(--muted); }

/* ---------- login ---------- */
.login-pantalla {
    min-height: 100vh; display: grid; place-items: center;
    background: radial-gradient(1200px 600px at 15% -10%, #2b527d 0%, transparent 60%),
                linear-gradient(135deg, var(--navy) 0%, #0f2138 100%);
    padding: 20px;
}
.login-caja { background: #fff; border-radius: 16px; box-shadow: 0 24px 60px rgba(0, 0, 0, .35); width: 100%; max-width: 400px; overflow: hidden; }
.login-cab { background: linear-gradient(160deg, var(--navy-claro), var(--navy)); color: #fff; padding: 26px 28px; }
.login-cab .marca-logo { margin-bottom: 12px; }
.login-cab h1 { color: #fff; font-size: 20px; margin: 0; }
.login-cab p { margin: 4px 0 0; color: #9fb1c6; font-size: 12.5px; }
.login-cuerpo { padding: 26px 28px; }
.login-cuerpo .btn { width: 100%; justify-content: center; margin-top: 6px; }
.login-pie { text-align: center; padding: 0 28px 24px; color: var(--muted); font-size: 11.5px; }

/* ---------- composición del POA ---------- */
.comp { display: flex; gap: 32px; align-items: center; flex-wrap: wrap; }
.comp-donut { position: relative; flex: 0 0 200px; width: 200px; height: 200px; max-width: 100%; }
.comp-donut canvas { display: block; }
.comp-donut-center {
    position: absolute; inset: 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    pointer-events: none; text-align: center;
}
.comp-donut-center .n { font-size: 34px; font-weight: 700; line-height: 1; color: var(--tinta); font-variant-numeric: tabular-nums; }
.comp-donut-center .t { font-size: 10.5px; color: var(--muted); text-transform: uppercase; letter-spacing: .07em; margin-top: 3px; }
.comp-list { flex: 1; min-width: 280px; }
.comp-row {
    display: grid; grid-template-columns: 44px 1fr auto; gap: 14px; align-items: center;
    padding: 9px 0; border-bottom: 1px solid var(--linea);
}
.comp-row:last-child { border-bottom: 0; }
.comp-row > .c { font-size: 21px; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.comp-row .m { min-width: 0; }
.comp-row .m .l { font-size: 13.5px; font-weight: 600; color: var(--tinta); display: flex; align-items: center; gap: 8px; }
.comp-row .m .l .dot { width: 11px; height: 11px; border-radius: 3px; flex-shrink: 0; }
.comp-row .m .d { font-size: 11.5px; color: var(--muted); margin-top: 1px; }
.comp-row > .p { font-size: 13px; color: var(--tinta-suave); font-variant-numeric: tabular-nums; white-space: nowrap; }
.comp-foot { margin-top: 16px; padding-top: 13px; border-top: 1px solid var(--linea); font-size: 12px; color: var(--tinta-suave); }
@media (max-width: 560px) {
    .comp { gap: 20px; }
    .comp-donut { margin: 0 auto; }
}

/* ---------- ejecución física vs financiera (proyectos) ---------- */
.pf-list { display: flex; flex-direction: column; }
.pf-row {
    display: grid; grid-template-columns: minmax(170px, 230px) 1fr 130px; gap: 18px;
    align-items: center; padding: 11px 0; border-bottom: 1px solid var(--linea);
}
.pf-row:last-child { border-bottom: 0; }
.pf-row.pf-head { padding: 4px 0 10px; border-bottom: 2px solid var(--linea); }
.pf-row.pf-head > div { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 600; }
.pf-legend { display: flex; gap: 16px; }
.pf-legend .pf-sw { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.pf-name { min-width: 0; }
.pf-name strong { display: block; font-size: 14px; }
.pf-name .sub { font-size: 11px; color: var(--muted); line-height: 1.35; }
.pf-bars { display: flex; flex-direction: column; gap: 6px; }
.pf-bar { display: flex; align-items: center; gap: 9px; }
.pf-bar .lb { font-size: 10px; color: var(--muted); width: 52px; flex-shrink: 0; text-transform: uppercase; letter-spacing: .03em; }
.pf-bar .tk { position: relative; flex: 1; height: 12px; background: var(--fondo); border-radius: 4px; overflow: hidden; }
.pf-bar .tk > span { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 4px; }
.pf-bar .vv { font-size: 12px; font-variant-numeric: tabular-nums; width: 40px; text-align: right; flex-shrink: 0; color: var(--tinta-suave); }
.pf-fis .tk > span { background: var(--verde-sem); }
.pf-fin .tk > span { background: var(--navy); }
.pf-meta { text-align: right; line-height: 1.7; }
.pf-gap { font-size: 11.5px; font-variant-numeric: tabular-nums; }
.pf-gap-rojo { color: var(--rojo-sem); font-weight: 600; }
.pf-gap-amarillo { color: var(--amarillo-sem); font-weight: 600; }
@media (max-width: 720px) {
    .pf-row { grid-template-columns: 1fr; gap: 8px; }
    .pf-row.pf-head { display: none; }
    .pf-meta { text-align: left; }
}

/* ---------- semáforo de indicadores de salud ---------- */
.ss-mix { display: flex; height: 24px; border-radius: 6px; overflow: hidden; background: var(--linea); }
.ss-mix > span {
    display: flex; align-items: center; justify-content: center; min-width: 0;
    color: #fff; font-size: 11.5px; font-weight: 700; font-variant-numeric: tabular-nums;
}
.ss-leg { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 12px 0 4px; }
.ss-leg .it { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--tinta-suave); }
.ss-leg .sw { width: 11px; height: 11px; border-radius: 3px; flex-shrink: 0; }
.ss-leg .it b { font-variant-numeric: tabular-nums; }
.ss-leg .pc { color: var(--muted); font-size: 11.5px; }

.ss-board {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px; margin-top: 16px;
}
.ss-tile {
    border: 1px solid var(--linea); border-left: 4px solid var(--c, var(--linea));
    border-radius: 10px; padding: 10px 12px; background: var(--panel);
    transition: box-shadow .16s;
}
.ss-tile:hover { box-shadow: var(--sombra-lift); }
.ss-tile .top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ss-tile .cod { font-weight: 700; font-size: 12.5px; color: var(--tinta); letter-spacing: .01em; }
.ss-tile .est { font-size: 9.5px; padding: 2px 7px; }
.ss-tile .nm {
    font-size: 11.5px; color: var(--muted); line-height: 1.32; margin: 5px 0 8px;
    min-height: 2.6em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ss-tile .bar { height: 6px; background: #eef1f4; border-radius: 999px; overflow: hidden; margin-top: 8px; }
.ss-tile .bar > span { display: block; height: 100%; border-radius: 999px; }
.ss-tile .foot {
    display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
    font-size: 11px; color: var(--tinta-suave); font-variant-numeric: tabular-nums;
}
.ss-tile .foot .rm { min-width: 0; line-height: 1.35; }
.ss-tile .foot .rm b { color: var(--tinta); font-size: 12px; }
.ss-tile .foot .u { color: var(--muted); font-size: 10px; white-space: nowrap; }
.ss-tile .foot .cp { font-weight: 700; color: var(--tinta); font-size: 13px; white-space: nowrap; flex-shrink: 0; }
.ss-foot {
    margin-top: 16px; padding-top: 13px; border-top: 1px solid var(--linea);
    font-size: 12px; color: var(--tinta-suave);
}
@media (max-width: 560px) {
    .ss-board { grid-template-columns: 1fr; }
}
@media print {
    .ss-board { grid-template-columns: repeat(3, 1fr); }
    .ss-tile { break-inside: avoid; }
}

/* ---------- cumplimiento de metas por plan ---------- */
.mpp-h { margin: 24px 0 10px; font-size: 15px; color: var(--tinta); }

/* -- panorama: composición global + comparativo por plan -- */
.mpp-pano-t { margin: 0 0 8px; font-size: 12.5px; font-weight: 600; color: var(--tinta); }
.mpp-pano-t2 { margin-top: 22px; }
.mpp-pano-t .tenue { font-weight: 400; }

.mpp-strip { display: flex; height: 26px; border-radius: 6px; overflow: hidden; background: var(--linea); }
.mpp-strip > span {
    display: flex; align-items: center; justify-content: center; min-width: 0;
    color: #fff; font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums;
}
.mpp-strip-leg { display: flex; flex-wrap: wrap; gap: 6px 24px; margin-top: 10px; }
.mpp-strip-leg .it {
    display: flex; align-items: baseline; gap: 7px; font-size: 12px; color: var(--tinta-suave);
}
.mpp-strip-leg .sw { width: 11px; height: 11px; border-radius: 3px; flex-shrink: 0; align-self: center; }
.mpp-strip-leg .lb { font-weight: 600; color: var(--tinta); }
.mpp-strip-leg b { font-variant-numeric: tabular-nums; }
.mpp-strip-leg .pc { color: var(--muted); font-size: 11.5px; }
.mpp-strip-leg .dd { color: var(--muted); font-size: 11px; }

.mpp-cmp { display: flex; flex-direction: column; gap: 7px; }
.mpp-cmp-row {
    display: grid; grid-template-columns: minmax(150px, 230px) 1fr 92px;
    gap: 14px; align-items: center;
}
.mpp-cmp-plan {
    display: flex; align-items: center; gap: 7px; min-width: 0;
    font-size: 12.5px; color: var(--tinta); white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis;
}
.mpp-cmp-plan .sem-punto { flex-shrink: 0; }
.mpp-cmp-plan .nm { overflow: hidden; text-overflow: ellipsis; }
.mpp-cmp-track { background: var(--fondo); border-radius: 5px; height: 22px; }
.mpp-cmp-bar { display: flex; height: 100%; border-radius: 5px; overflow: hidden; min-width: 3px; }
.mpp-cmp-bar > span {
    display: flex; align-items: center; justify-content: center; min-width: 0;
    color: #fff; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums;
}
.mpp-cmp-val {
    text-align: right; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums;
    line-height: 1.15;
}
.mpp-cmp-val .sep { color: var(--muted); font-weight: 400; margin: 0 1px; }
.mpp-cmp-val small { display: block; font-size: 10.5px; font-weight: 500; color: var(--muted); }
@media (max-width: 640px) {
    .mpp-cmp-row { grid-template-columns: 1fr 64px; }
    .mpp-cmp-track { grid-column: 1 / -1; order: 3; }
    .mpp-strip-leg .dd { display: none; }
}

/* -- mini barra de composición en el resumen del acordeón -- */
.mpp-sum-bar {
    display: flex; width: 92px; height: 9px; border-radius: 3px;
    overflow: hidden; background: var(--linea); flex-shrink: 0;
}
.mpp-sum-bar > span { display: block; min-width: 0; }
.mpp-det {
    border: 1px solid var(--linea); border-radius: var(--radio);
    background: var(--panel); margin-bottom: 10px; overflow: hidden;
}
.mpp-det > summary {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    padding: 12px 16px; cursor: pointer; list-style: none; user-select: none;
}
.mpp-det > summary::-webkit-details-marker { display: none; }
.mpp-det > summary::before {
    content: '▸'; color: var(--muted); font-size: 12px; flex-shrink: 0;
    transition: transform .15s;
}
.mpp-det[open] > summary::before { transform: rotate(90deg); }
.mpp-det[open] > summary { border-bottom: 1px solid var(--linea); }
.mpp-sum-cod { font-weight: 700; color: var(--tinta); }
.mpp-sum-nom { font-weight: 600; color: var(--tinta); }
.mpp-sum-meta { font-size: 12px; color: var(--muted); margin-left: auto; font-variant-numeric: tabular-nums; }
.mpp-det .tabla-wrap { border-top: 0; }
@media (max-width: 640px) {
    .mpp-sum-meta { margin-left: 0; width: 100%; }
}
@media print {
    .mpp-det, .mpp-det[open] > summary { break-inside: avoid; }
    .mpp-det > summary { list-style: none; }
}

/* ---------- mapa de riesgos por proceso (DAFP) ---------- */
.rp-matriz-wrap { display: inline-block; }
.rp-matriz-t { font-size: 12.5px; font-weight: 600; margin-bottom: 8px; color: var(--tinta); }
.rp-matriz { border-collapse: separate; border-spacing: 3px; }
.rp-matriz .rp-cel {
    width: 76px; height: 52px; border-radius: 6px; vertical-align: middle; text-align: center;
    color: #fff; padding: 2px;
}
.rp-matriz .rp-cel .rp-n { display: block; font-size: 15px; font-weight: 700; line-height: 1.1; }
.rp-matriz .rp-cel .rp-cods { display: block; font-size: 9px; opacity: .9; word-spacing: 2px; }
.rp-matriz .rp-eje-y { font-size: 10.5px; color: var(--muted); text-align: right; padding-right: 6px; white-space: nowrap; font-weight: 600; }
.rp-matriz .rp-eje-x { font-size: 10.5px; color: var(--muted); text-align: center; font-weight: 600; padding-top: 4px; }
.z-baj { background: #16a34a; } .z-mod { background: #d97706; }
.z-alt { background: #dc2626; } .z-ext { background: #6d28d9; }
.z-sin { background: var(--neutro-sem); }
.rp-leyenda { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 10px; font-size: 11.5px; color: var(--tinta-suave); align-items: center; }
.rp-leyenda i { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }

.rp-mix { display: flex; height: 20px; border-radius: 5px; overflow: hidden; background: var(--linea); }
.rp-mix > span {
    display: flex; align-items: center; justify-content: center; min-width: 0;
    color: #fff; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums;
}

/* ---------- proyectos de inversión (PMIDS) ---------- */
.pmi-chip {
    display: inline-grid; place-items: center; width: 20px; height: 20px; flex-shrink: 0;
    border-radius: 5px; background: var(--navy); color: #fff; font-size: 11px; font-weight: 700;
    margin-right: 3px;
}
.pmi-comps { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 12px; margin-bottom: 8px; }
.pmi-card {
    border: 1px solid var(--linea); border-radius: var(--radio); background: var(--panel);
    padding: 14px 16px; display: flex; flex-direction: column; gap: 8px;
    transition: box-shadow .16s;
}
.pmi-card:hover { box-shadow: var(--sombra-lift); }
.pmi-card--vacio { background: var(--fondo); border-style: dashed; }
.pmi-card--vacio:hover { box-shadow: none; }
.pmi-card-cab { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.pmi-card-desc { margin: 0; font-size: 12px; color: var(--muted); line-height: 1.4; }
.pmi-card .dato-lista { font-size: 12px; gap: 4px 12px; }
.pmi-card-pie { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; padding-top: 6px; }
@media (max-width: 560px) { .pmi-comps { grid-template-columns: 1fr; } }
@media print { .pmi-card { break-inside: avoid; } }

/* ---------- responsive sidebar / barra superior ---------- */
@media (max-width: 960px) {
    .barra-lateral { position: fixed; z-index: 50; left: -280px; transition: left .2s; box-shadow: 4px 0 24px rgba(0, 0, 0, .2); }
    .barra-lateral.visible { left: 0; }
    .boton-menu { display: block; }
    .selector-corte label { display: none; }
}
@media (max-width: 760px) {
    .barra-superior { flex-wrap: wrap; row-gap: 10px; padding: 10px 16px; }
    .titulo-pagina { order: 5; flex-basis: 100%; }
    .titulo-pagina h1 { font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .titulo-pagina p { display: none; }
    .barra-superior-derecha { margin-left: auto; gap: 10px; }
    .selector-corte select { max-width: 148px; font-size: 12px; }
    .menu-usuario-nombre { display: none; }
    .area-trabajo { padding: 16px 14px; }
    .panel-cuerpo { padding: 14px; }
}

@media print {
    .barra-lateral, .barra-superior, .pie-pagina, .aviso-corte, .no-imprimir { display: none !important; }
    .area-trabajo { padding: 0; }
    .panel { box-shadow: none; border-color: #ccc; }
    .panel-cab { background: none; }
    body { background: #fff; }
}

/* ---------- 1.9 Indicadores Fénix ---------- */
.fx-cod {
    display: inline-block; padding: 3px 9px; border-radius: 6px;
    background: #1f3a5f; color: #fff; font-weight: 700; font-size: 12px;
    letter-spacing: .3px; font-variant-numeric: tabular-nums;
}
.fx-reg {
    display: inline-block; margin-top: 6px; font-size: 11.5px; font-weight: 600;
    color: var(--verde); text-decoration: none;
}
.fx-reg:hover { text-decoration: underline; }

.fx-minibar {
    display: inline-block; width: 120px; height: 8px; border-radius: 999px;
    background: #e2e8f0; overflow: hidden; vertical-align: middle;
}
.fx-minibar > span { display: block; height: 100%; background: #2563eb; }

.fx-chips { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }

.fx-tabla td { vertical-align: top; }
.fx-tabla .fx-res {
    font-size: 20px; font-weight: 700; color: var(--tinta);
    font-variant-numeric: tabular-nums; line-height: 1.1;
}
.fx-tabla .fx-res small { font-size: 12px; font-weight: 600; color: var(--muted); }
.fx-res-sub {
    display: flex; align-items: center; gap: 8px; margin-top: 4px;
    font-size: 11px; color: var(--muted);
}
.fx-spark { width: 96px; height: 26px; flex-shrink: 0; display: block; }
.fx-spark-na { font-size: 11px; color: var(--muted); font-style: italic; }

.fx-meta { padding: 5px 0; border-bottom: 1px dashed var(--linea); }
.fx-meta:last-child { border-bottom: 0; }
.fx-meta-id {
    font-weight: 700; font-size: 12px; color: var(--tinta);
    font-variant-numeric: tabular-nums; margin-right: 4px;
}
.fx-meta .tenue { margin-top: 2px; font-size: 11.5px; }

.fx-metas-grid { display: flex; flex-wrap: wrap; gap: 5px; }
.fx-meta-chip {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 7px; border-radius: 6px; font-size: 11px; font-weight: 600;
    background: #f1f3f5; color: #9aa4b1; border: 1px solid transparent;
    font-variant-numeric: tabular-nums;
}
.fx-meta-chip.on { background: #e8f0fe; color: #1e40af; border-color: #c7d7f7; }
.fx-meta-chip b {
    background: #1e40af; color: #fff; border-radius: 999px;
    min-width: 15px; height: 15px; display: inline-flex; align-items: center;
    justify-content: center; font-size: 10px;
}
.fx-res-txt { font-size: 13px; font-weight: 700; color: var(--tinta); line-height: 1.25; }
.fx-tag-alt { background: #eef2ff; color: #4338ca; }
.fx-formula {
    margin: 4px 0 8px; padding: 7px 10px;
    background: #f8fafc; border: 1px solid var(--linea); border-left: 3px solid #64748b;
    border-radius: 6px;
}
.fx-formula-lbl {
    display: block; font-size: 10px; font-weight: 700; letter-spacing: .5px;
    text-transform: uppercase; color: var(--muted); margin-bottom: 2px;
}
.fx-formula-txt {
    display: block; font-size: 12px; color: var(--tinta); line-height: 1.4;
    font-family: "Cascadia Code", "Consolas", ui-monospace, monospace;
}
.fx-formula-calc {
    display: block; margin-top: 3px; font-size: 11px; color: var(--tinta-suave); font-weight: 600;
}
.fx-coment {
    width: 100%; min-width: 240px; min-height: 40px;
    font-size: 12.5px; line-height: 1.35; padding: 7px 9px; resize: vertical;
}

/* ---------- patrones de configuración (módulo 1) ---------- */
.intro-callout {
    display: flex; gap: 12px; align-items: flex-start;
    background: #eff5ff; border: 1px solid #cfe0fb; border-left: 4px solid var(--navy-claro);
    border-radius: var(--radio-sm); padding: 12px 14px; margin-bottom: 20px;
    font-size: 12.5px; color: #29456b; line-height: 1.5;
}
.intro-callout .ico { font-size: 16px; line-height: 1.2; flex-shrink: 0; }
.intro-callout strong { color: #1c3559; }

.mini-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px; margin-bottom: 20px; }
.mini-card {
    border: 1px solid var(--linea); border-radius: var(--radio); background: var(--panel);
    box-shadow: var(--sombra); padding: 14px 16px; display: flex; flex-direction: column; gap: 6px;
    transition: box-shadow .16s;
}
.mini-card:hover { box-shadow: var(--sombra-lift); }
.mini-card .mc-cod {
    align-self: flex-start;
    font-family: "Cascadia Code", Consolas, ui-monospace, monospace;
    font-size: 11px; font-weight: 700; color: #fff; background: var(--navy);
    border-radius: 6px; padding: 2px 8px; letter-spacing: .02em;
}
.mini-card .mc-titulo { font-weight: 650; font-size: 13.5px; color: var(--tinta); }
.mini-card .mc-linea { font-size: 12px; color: var(--muted); line-height: 1.45; }
.mini-card .mc-linea b { color: var(--tinta-suave); font-weight: 600; }
.mini-card .mc-pie {
    margin-top: auto; padding-top: 8px; border-top: 1px solid var(--linea);
    font-size: 11.5px; color: var(--tinta-suave); display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}

.acordeon {
    border: 1px solid var(--linea); border-radius: var(--radio); background: var(--panel);
    box-shadow: var(--sombra); margin-bottom: 12px; overflow: hidden;
}
.acordeon > summary {
    list-style: none; cursor: pointer; user-select: none;
    padding: 14px 18px; display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap;
}
.acordeon > summary::-webkit-details-marker { display: none; }
.acordeon > summary::before {
    content: '▸'; color: var(--muted); font-size: 12px; flex-shrink: 0; align-self: center;
    transition: transform .15s;
}
.acordeon[open] > summary::before { transform: rotate(90deg); }
.acordeon[open] > summary { border-bottom: 1px solid var(--linea); background: var(--panel-alt); }
.acordeon > summary .ac-cod {
    font-family: "Cascadia Code", Consolas, ui-monospace, monospace;
    font-size: 11px; font-weight: 700; color: #fff; background: var(--navy);
    border-radius: 6px; padding: 2px 8px;
}
.acordeon > summary .ac-titulo { font-weight: 650; font-size: 14px; color: var(--tinta); }
.acordeon > summary .ac-meta { margin-left: auto; font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.acordeon-cuerpo { padding: 18px; }

table.tabla tbody tr.fila-grupo td {
    background: var(--panel-alt); font-weight: 650; color: var(--tinta);
    border-top: 2px solid var(--linea-fuerte); border-bottom: 1px solid var(--linea-fuerte);
    font-size: 12px; letter-spacing: .02em;
}
table.tabla tbody tr.fila-grupo:hover td { background: var(--panel-alt); }

.kpi .val.sm { font-size: 21px; }

/* cadena de alineación estratégica (1.8) */
.chain-persp { margin: 22px 0 12px; }
.chain-persp:first-child { margin-top: 4px; }
.chain-persp > .cp-h {
    display: flex; align-items: center; gap: 10px;
    font-size: 14px; font-weight: 650; color: var(--tinta);
    padding-bottom: 8px; border-bottom: 2px solid var(--linea-fuerte);
}
.chain-persp > .cp-h .cp-tag {
    font-size: 11px; font-weight: 700; color: #fff; background: var(--navy-claro);
    border-radius: 999px; padding: 2px 10px;
}
.chain-obj {
    border: 1px solid var(--linea); border-left: 3px solid var(--navy-claro);
    border-radius: var(--radio-sm); background: var(--panel); box-shadow: var(--sombra);
    margin: 10px 0; padding: 12px 14px;
}
.chain-obj > .co-h { font-size: 13px; color: var(--tinta); margin-bottom: 8px; }
.chain-obj > .co-h b { font-family: "Cascadia Code", Consolas, ui-monospace, monospace; font-size: 11.5px; color: var(--navy-claro); margin-right: 6px; }
.chain-meta {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px;
    padding: 9px 0; border-top: 1px dashed var(--linea);
}
.chain-meta:first-of-type { border-top: 0; }
.chain-meta .cm-desc { font-size: 12.5px; color: var(--tinta); }
.chain-meta .cm-desc b { color: var(--navy); margin-right: 5px; font-variant-numeric: tabular-nums; }
.chain-meta .cm-tags { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.chain-meta .cm-sub { grid-column: 1 / -1; font-size: 11px; color: var(--muted); }
.chain-riesgo { background: #fef2f2; color: #b42318; border: 1px solid #f7c4c4; border-radius: 6px; padding: 1px 7px; font-size: 11px; font-weight: 600; }

/* barra de filtro / contexto reutilizable */
.barra-filtro {
    display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
    background: var(--panel); border: 1px solid var(--linea);
    border-radius: var(--radio); box-shadow: var(--sombra);
    padding: 12px 16px; margin-bottom: 16px;
}
.barra-filtro .bf-campo { display: flex; gap: 8px; align-items: center; }
.barra-filtro label { font-size: 12px; color: var(--muted); white-space: nowrap; }
.barra-filtro .bf-info { flex: 1; font-size: 12px; color: var(--tinta-suave); }
.barra-filtro .bf-info b { color: var(--tinta); font-weight: 600; }
.barra-filtro .bf-der { margin-left: auto; display: flex; gap: 8px; }

/* zona de arrastrar-soltar archivos */
.dropzone {
    border: 2px dashed var(--linea-fuerte); border-radius: var(--radio);
    padding: 24px; text-align: center; cursor: pointer; color: var(--muted);
    transition: border-color .15s, background .15s;
}
.dropzone:hover { border-color: var(--navy-claro); background: var(--panel-alt); }
.dropzone.sobre { border-color: var(--verde); background: #eefaf1; color: var(--verde-osc); }
.dropzone-texto { font-size: 13px; }

/* panel de acción urgente / peligro (3.5) */
.alerta-panel { border: 1px solid #f2b8ab; border-radius: var(--radio); box-shadow: var(--sombra); background: var(--panel); margin-bottom: 20px; overflow: hidden; }
.alerta-panel > .ap-cab { background: #fdecea; border-bottom: 1px solid #f2b8ab; padding: 14px 18px; }
.alerta-panel > .ap-cab h2 { margin: 0; color: var(--rojo-sem); font-size: 15px; }
.alerta-panel > .ap-cab .sub { color: #9a3a2c; font-size: 12.5px; }
.alerta-panel > .ap-cuerpo { padding: 18px; }
.btn-alerta { background: var(--rojo-sem); color: #fff; border-color: var(--rojo-sem); }
.btn-alerta:hover { background: #b91c1c; color: #fff; }

.pasos-lista { margin: 0; padding-left: 20px; font-size: 12.5px; color: var(--tinta-suave); line-height: 1.6; }
.pasos-lista li { margin-bottom: 3px; }

/* cadena de firmas como pasos (6.2) */
.stepper { display: flex; flex-direction: column; }
.stepper-paso {
    display: grid; grid-template-columns: 34px 1fr auto; gap: 14px;
    padding: 14px 0; border-bottom: 1px solid var(--linea); align-items: start;
}
.stepper-paso:last-child { border-bottom: 0; }
.stepper-marca {
    width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
    font-size: 13px; font-weight: 700; border: 2px solid var(--linea-fuerte);
    color: var(--muted); background: var(--panel); flex-shrink: 0;
}
.stepper-paso.hecho .stepper-marca { background: var(--verde-sem); border-color: var(--verde-sem); color: #fff; }
.stepper-paso.activo .stepper-marca { border-color: var(--navy-claro); color: var(--navy-claro); }
.stepper-cuerpo .st-titulo { font-weight: 650; font-size: 13.5px; color: var(--tinta); }
.stepper-cuerpo .st-rol { font-size: 12px; color: var(--muted); }
.stepper-cuerpo .st-firma { font-size: 12px; color: var(--tinta-suave); margin-top: 3px; }
.stepper-cuerpo .st-firma code { font-size: 10.5px; }
.stepper-accion { align-self: center; }

/* aviso "vista pública" del portal de transparencia (6.4) */
.publico-aviso {
    display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
    background: #eef6ee; border: 1px solid #b9e0c4; border-left: 4px solid var(--verde-sem);
    border-radius: var(--radio-sm); padding: 12px 14px; margin-bottom: 20px;
    font-size: 12.5px; color: #1f5133;
}
.publico-aviso .ico { font-size: 16px; }
.publico-aviso .pa-der { margin-left: auto; }

/* bloque de firmas (informe 5.7) */
.firmas { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; margin-top: 28px; }
.firmas > div {
    border-top: 1.5px solid var(--tinta); padding-top: 6px; text-align: center;
    font-size: 12px; font-weight: 600; color: var(--tinta-suave);
}
@media (max-width: 640px) { .firmas { grid-template-columns: repeat(2, 1fr); } }

.doc-barra {
    display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
    background: var(--panel); border: 1px solid var(--linea); border-radius: var(--radio);
    box-shadow: var(--sombra); padding: 12px 16px; margin-bottom: 16px;
}
.doc-barra .db-info { flex: 1; font-size: 12.5px; color: var(--tinta-suave); }
.doc-barra .db-info b { color: var(--tinta); }

/* navegación de anclas (glosario 4.4) */
.jump-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.jump-nav a {
    font-size: 12px; font-weight: 600; color: var(--navy-claro);
    background: var(--panel); border: 1px solid var(--linea); border-radius: 999px;
    padding: 5px 12px; text-decoration: none; transition: background .14s, border-color .14s;
}
.jump-nav a:hover { background: var(--panel-alt); border-color: var(--linea-fuerte); text-decoration: none; }

/* celdas de métrica con color (EVM 4.3) */
table.tabla td.m-ok { color: var(--verde-osc); font-weight: 600; }
table.tabla td.m-warn { color: var(--amarillo-sem); font-weight: 600; }
table.tabla td.m-bad { color: var(--rojo-sem); font-weight: 700; }

/* fila resaltada (corte vigente, banda de calificación activa) */
table.tabla tbody tr.fila-activa td { background: #eaf5ee; font-weight: 600; }
table.tabla tbody tr.fila-activa:hover td { background: #e2f1e8; }

/* ladder de calificación en modo lectura (4.2) */
.calif-row.ro { grid-template-columns: 66px 150px 1fr; }
.calif-row.ro .calif-concepto { font-size: 13px; color: var(--tinta); }
.calif-row.ro.calif-sel { background: #eaf5ee; border-radius: var(--radio-sm); }
.calif-row.ro.calif-sel .calif-concepto { font-weight: 650; }

/* estado de período (1.2) */
.per-legend { display: flex; gap: 14px; flex-wrap: wrap; font-size: 11.5px; color: var(--tinta-suave); margin-top: 10px; }
.per-legend span { display: inline-flex; align-items: center; gap: 6px; }
.per-legend i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }

/* ---------- 1.1 Reglas de Evaluación ---------- */
.reg-intro {
    display: flex; gap: 12px; align-items: flex-start;
    background: #eff5ff; border: 1px solid #cfe0fb; border-left: 4px solid var(--navy-claro);
    border-radius: var(--radio-sm); padding: 12px 14px; margin-bottom: 20px;
    font-size: 12.5px; color: #29456b; line-height: 1.5;
}
.reg-intro .ico { font-size: 16px; line-height: 1.2; flex-shrink: 0; }
.reg-intro strong { color: #1c3559; }

.reg-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)); gap: 2px 26px; }
.reg-item {
    display: flex; flex-direction: column; gap: 7px;
    padding: 15px 0; border-bottom: 1px solid var(--linea);
}
.reg-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.reg-lbl { font-weight: 600; font-size: 13px; color: var(--tinta); }
.reg-clave {
    font-family: "Cascadia Code", Consolas, ui-monospace, monospace;
    font-size: 10.5px; color: var(--muted); background: var(--panel-alt);
    border: 1px solid var(--linea); border-radius: 5px; padding: 1px 6px;
}
.reg-field { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.reg-field input[type=text], .reg-field input[type=number] { max-width: 160px; }
.reg-suf { color: var(--muted); font-size: 12px; }
.reg-hint {
    color: var(--verde-osc); font-weight: 700; font-size: 12px;
    background: #e9f7ef; border-radius: 999px; padding: 2px 9px; font-variant-numeric: tabular-nums;
}
.reg-desc { font-size: 12px; color: var(--muted); line-height: 1.45; }
.reg-quien { font-size: 11px; color: var(--tinta-suave); }
.reg-quien b { color: var(--tinta); font-weight: 600; }

.barra-guardar {
    position: sticky; bottom: 0; z-index: 5;
    display: flex; align-items: center; gap: 12px; justify-content: flex-end;
    background: rgba(255, 255, 255, .92); backdrop-filter: saturate(1.6) blur(6px);
    border: 1px solid var(--linea); border-radius: var(--radio);
    box-shadow: 0 -4px 16px -12px rgba(16, 24, 40, .3);
    padding: 12px 16px; margin: 6px 0 22px;
}
.barra-guardar .nota { margin-right: auto; font-size: 12px; color: var(--muted); }

.calif-ladder { display: flex; flex-direction: column; }
.calif-row {
    display: grid; grid-template-columns: 66px 140px 1fr; gap: 18px; align-items: center;
    padding: 13px 0; border-bottom: 1px solid var(--linea);
}
.calif-row:last-child { border-bottom: 0; }
.calif-pts {
    display: grid; place-items: center; width: 46px; height: 46px; border-radius: 12px;
    font-size: 19px; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums;
}
.calif-pts.p0 { background: var(--rojo-sem); }
.calif-pts.p1, .calif-pts.p2 { background: var(--amarillo-sem); }
.calif-pts.p3 { background: #0ea5e9; }
.calif-pts.p4 { background: #22a559; }
.calif-pts.p5 { background: var(--verde-osc); }
.calif-rango { font-size: 13px; font-weight: 600; color: var(--tinta); font-variant-numeric: tabular-nums; }
.calif-rango small { display: block; font-weight: 400; color: var(--muted); font-size: 11px; }
.calif-campos { display: flex; gap: 10px; align-items: center; }
.calif-campos label { font-size: 11px; color: var(--muted); }
.calif-campos input[type=number] { max-width: 90px; }
@media (max-width: 620px) {
    .calif-row { grid-template-columns: 52px 1fr; }
    .calif-campos { grid-column: 1 / -1; flex-wrap: wrap; }
}

/* ---------- 1.14 Hospitales de la plataforma ---------- */
details.fx-del > summary { list-style: none; cursor: pointer; display: inline-flex; }
details.fx-del > summary::-webkit-details-marker { display: none; }
.fx-del-form {
    margin-top: 8px; padding: 10px 12px; border: 1px solid #f6c9c0;
    border-radius: var(--radio-sm); background: #fef6f5; max-width: 380px;
}
