/* =====================================================================
   Vigilancia Contractual — hoja de estilos única
   Mobile first. Puntos de cambio orientativos: 640 · 768 · 1024 · 1280.
   Índice: 1 tokens · 2 base · 3 accesibilidad · 4 estructura y cabecera ·
   5 encabezado de página · 6 componentes · 7 tablas · 8 formularios ·
   9 utilidades · 10 movimiento · 11 impresión
   ===================================================================== */

/* ----------------------------------------------------------- 1 tokens */
:root{
  color-scheme:light;
  /* superficies y texto */
  --c-fondo:#f0f4f7; --c-superficie:#ffffff; --c-superficie-2:#f7f9fb;
  --c-borde:#dce5eb; --c-borde-control:#8797a6;
  --c-texto:#172130; --c-texto-2:#475467; --c-texto-3:#5b6676;
  /* acento institucional */
  --c-acento:#126477; --c-acento-hover:#0b4b5a; --c-acento-suave:#e5f2f4; --c-sobre-acento:#ffffff;
  /* semánticos: severidad y estado */
  --c-alta:#b42318;  --c-alta-suave:#fef1ef;
  --c-media:#8a5300; --c-media-suave:#fff5e0;
  --c-baja:#475467;  --c-baja-suave:#eef1f5;
  --c-ok:#146c3a;    --c-ok-suave:#e9f7ef;
  --c-marca-texto:#ffec99; --c-sombra:16 24 40;

  /* tipografía */
  --fuente:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --fuente-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --t-xs:.8125rem; --t-sm:.875rem; --t-base:1rem; --t-md:1.125rem; --t-lg:1.25rem;
  --t-xl:clamp(1.5rem,1.1rem + 1.2vw,2.125rem); --t-cifra:clamp(1.375rem,1.15rem + .9vw,1.75rem);
  /* espacios (base 4 px) */
  --e-1:.25rem; --e-2:.5rem; --e-3:.75rem; --e-4:1rem; --e-5:1.5rem; --e-6:2rem; --e-7:3rem;
  /* forma */
  --r-1:6px; --r-2:10px; --r-3:16px; --r-pill:999px;
  --sombra-1:0 1px 2px rgb(var(--c-sombra) / .06),0 1px 3px rgb(var(--c-sombra) / .08);
  --sombra-2:0 4px 12px rgb(var(--c-sombra) / .10),0 2px 4px rgb(var(--c-sombra) / .06);
  /* anchos, alturas y capas */
  --ancho-max:85rem; --ancho-texto:70ch; --margen:clamp(1rem,3.5vw,2rem);
  --toque:2.75rem; --altura-cabecera:0px;
  --z-cabecera:50; --z-saltar:100;
}
/* Oscuro: por preferencia del sistema, salvo que se haya elegido claro; o elegido a mano. */
@media (prefers-color-scheme:dark){
  :root:not([data-tema="claro"]){
    color-scheme:dark;
    --c-fondo:#0e1319; --c-superficie:#161c24; --c-superficie-2:#1b222c;
    --c-borde:#2d3744; --c-borde-control:#66768a;
    --c-texto:#e7ecf2; --c-texto-2:#b8c2ce; --c-texto-3:#a3aebb;
    --c-acento:#8fb8f6; --c-acento-hover:#b3cff9; --c-acento-suave:#1a2a42; --c-sobre-acento:#0b1422;
    --c-alta:#ff9b8f; --c-alta-suave:#3b1f1c; --c-media:#f2b45a; --c-media-suave:#3a2c14;
    --c-baja:#b8c2ce; --c-baja-suave:#232c37; --c-ok:#79d9a2; --c-ok-suave:#15301f; --c-sombra:0 0 0;
  }
}
:root[data-tema="oscuro"]{
  color-scheme:dark;
  --c-fondo:#0e1319; --c-superficie:#161c24; --c-superficie-2:#1b222c;
  --c-borde:#2d3744; --c-borde-control:#66768a;
  --c-texto:#e7ecf2; --c-texto-2:#b8c2ce; --c-texto-3:#a3aebb;
  --c-acento:#8fb8f6; --c-acento-hover:#b3cff9; --c-acento-suave:#1a2a42; --c-sobre-acento:#0b1422;
  --c-alta:#ff9b8f; --c-alta-suave:#3b1f1c; --c-media:#f2b45a; --c-media-suave:#3a2c14;
  --c-baja:#b8c2ce; --c-baja-suave:#232c37; --c-ok:#79d9a2; --c-ok-suave:#15301f; --c-sombra:0 0 0;
}

/* ------------------------------------------------------------- 2 base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--altura-cabecera) + var(--e-4))}
body{margin:0;min-height:100vh;background:var(--c-fondo);color:var(--c-texto);
  font:400 var(--t-base)/1.55 var(--fuente);font-variant-numeric:tabular-nums lining-nums;
  padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
h1,h2,h3{line-height:1.25;margin:0;color:var(--c-texto);text-wrap:balance}
h1{font-size:var(--t-xl);font-weight:700;letter-spacing:-.015em}
h2{font-size:var(--t-lg);font-weight:650}
h3{font-size:var(--t-md);font-weight:650}
p{margin:0 0 var(--e-3)}
a{color:var(--c-acento);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--c-acento-hover)}
img,svg{max-width:100%}
mark{background:var(--c-marca-texto);color:#172130;padding:0 .15em;border-radius:2px}
hr{border:0;border-top:1px solid var(--c-borde);margin:var(--e-5) 0}
ul,ol{padding-left:1.25rem}
code,.mono{font-family:var(--fuente-mono);font-size:.9em;overflow-wrap:anywhere}
.icono{width:1.25em;height:1.25em;flex:none;vertical-align:-.25em}

/* ---------------------------------------------------- 3 accesibilidad */
.visualmente-oculto{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
.saltar{position:absolute;left:var(--e-3);top:-10rem;z-index:var(--z-saltar);background:var(--c-acento);
  color:var(--c-sobre-acento);padding:var(--e-3) var(--e-4);border-radius:var(--r-2);font-weight:600}
.saltar:focus{top:var(--e-3)}
:focus-visible{outline:3px solid var(--c-acento);outline-offset:2px;border-radius:var(--r-1)}
:focus:not(:focus-visible){outline:none}

/* ------------------------------------------ 4 estructura y cabecera */
.contenedor{width:100%;max-width:var(--ancho-max);margin-inline:auto;padding-inline:var(--margen)}
.contenido{padding-block:var(--e-6) var(--e-7);min-width:0}
.contenido > * + *{margin-top:var(--e-5)}
.contenido:focus{outline:none}
.cabecera{background:var(--c-superficie);border-bottom:1px solid var(--c-borde)}
.cabecera__barra{display:grid;grid-template-columns:1fr auto;grid-template-areas:"marca menu" "buscar buscar";align-items:center;gap:.75rem;padding-block:1rem}
.marca{grid-area:marca;display:inline-flex;align-items:center;gap:.75rem;min-height:var(--toque);color:var(--c-texto);text-decoration:none;font-weight:600;font-size:1rem;letter-spacing:-.02em}
.marca .icono{width:2.5rem;height:2.5rem;padding:.5rem;border-radius:12px;background:var(--c-acento);color:var(--c-sobre-acento)}
.marca strong{color:var(--c-acento);font-weight:750}
.marca:hover{color:var(--c-texto)}
.contexto-barra{display:none}
.busqueda-global{grid-area:buscar;display:flex;min-width:0;position:relative}
.busqueda-global input{flex:1;min-width:0;background:var(--c-superficie-2);padding-right:3rem;border-color:var(--c-borde)}
.busqueda-global .btn{position:absolute;right:3px;top:3px;min-height:calc(var(--toque) - 6px);width:2.4rem;background:transparent;color:var(--c-acento);border:0}
.menu-boton{grid-area:menu;display:none;align-items:center;gap:.5rem;min-height:var(--toque);padding:0 .75rem;border:1px solid var(--c-borde);border-radius:var(--r-2);background:var(--c-superficie);color:var(--c-texto);font:600 var(--t-sm)/1 var(--fuente);cursor:pointer}
.menu-boton .icono-cerrar{display:none}
.menu-boton[aria-expanded="true"] .icono-abrir{display:none}
.menu-boton[aria-expanded="true"] .icono-cerrar{display:inline}
.menu{border-top:1px solid var(--c-borde)}
.menu__interior{display:flex;flex-direction:column;gap:.5rem;padding-block:1rem}
.menu__rotulo{font-size:.6875rem;text-transform:uppercase;letter-spacing:.14em;font-weight:700;color:var(--c-texto-3);margin:.5rem .75rem}
.menu__lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3rem}
.menu__lista a{display:flex;align-items:center;gap:.8rem;min-height:3rem;padding:.65rem .85rem;border-radius:10px;color:var(--c-texto-2);font-weight:550;font-size:.875rem;text-decoration:none}
.menu__lista a .icono{width:1.25rem;height:1.25rem;opacity:.8}
.menu__lista a:hover{background:var(--c-superficie-2);color:var(--c-texto)}
.menu__lista a[aria-current="page"]{background:var(--c-acento-suave);color:var(--c-acento);font-weight:700}
.menu__usuario{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding:1rem .75rem 0;border-top:1px solid var(--c-borde);margin-top:1rem;color:var(--c-texto-2);font-size:var(--t-sm)}
.menu__nombre{margin-right:auto;font-weight:600;color:var(--c-texto);overflow-wrap:anywhere}
.contador{display:inline-flex;align-items:center;justify-content:center;min-width:1.5rem;padding:.05rem .45rem;border-radius:6px;background:var(--c-alta-suave);color:var(--c-alta);font-size:var(--t-xs);font-weight:700;margin-left:auto}
@media(max-width:1023.98px){.js .menu-boton{display:inline-flex}.js .menu:not(.menu--abierto){display:none}}
@media(min-width:640px){.cabecera__barra{grid-template-columns:auto 1fr auto;grid-template-areas:"marca buscar menu"}.busqueda-global{max-width:27rem;justify-self:end;width:100%}}
@media screen and (min-width:1024px){
  :root{--ancho-lateral:15.5rem;--altura-cabecera:5rem}
  .aplicacion{padding-left:var(--ancho-lateral)}
  .cabecera{position:sticky;top:0;z-index:var(--z-cabecera);background:var(--c-superficie)}
  .cabecera__barra{height:5rem;grid-template-columns:1fr minmax(16rem,27rem);grid-template-areas:"contexto buscar";padding-block:.75rem}
  .contexto-barra{grid-area:contexto;display:flex;flex-direction:column;gap:.1rem;font-size:.6875rem;color:var(--c-texto-3)}
  .contexto-barra strong{font-size:.9375rem;color:var(--c-texto);font-weight:650}
  .cabecera .marca{position:fixed;left:0;top:0;width:var(--ancho-lateral);height:6rem;padding:1.5rem;z-index:2;color:#eef6fa;font-size:.9375rem}
  .cabecera .marca > span{display:flex;flex-direction:column;line-height:1.35}
  .cabecera .marca strong{color:#8ed9db}
  .cabecera .marca .icono{background:#254651;color:#9ee3e1}
  .menu{position:fixed;inset:0 auto 0 0;width:var(--ancho-lateral);background:#142e3b;border:0;color:#c2d4dd;padding-top:6rem;overflow-y:auto}
  .menu__interior{height:100%;padding:1rem;gap:.75rem;max-width:none}
  .menu__rotulo{color:#92adb9}
  .menu__lista a{color:#c2d4dd;min-height:3.1rem}
  .menu__lista a:hover{background:#203e4c;color:#fff}
  .menu__lista a[aria-current="page"]{background:#29515e;color:#b8f2ed;box-shadow:inset 3px 0 #78d4cc}
  .menu__usuario{margin-top:auto;border-color:#35505e;padding:1.25rem .25rem .25rem}
  .menu__nombre{width:100%;color:#edf4f7;font-size:.875rem;margin-bottom:.4rem}
  .menu__usuario .btn{color:#c2d4dd;border-color:#48616f;background:transparent;min-height:2.75rem;font-size:.75rem}
  .menu__usuario .btn:hover{background:#203e4c;color:#fff}
  .menu__usuario .btn--fantasma{border-color:transparent}
  .contenido{padding-top:2.25rem}
  .rejilla--2,.r2{grid-template-columns:minmax(0,1fr)}
}
@media screen and (min-width:1280px){.rejilla--2,.r2{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ------------------------------------------ 5 encabezado de página */
.migas{font-size:var(--t-sm);color:var(--c-texto-3)}
.migas ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:var(--e-1) var(--e-2)}
.migas li{display:inline-flex;align-items:center;gap:var(--e-2);min-width:0}
.migas li + li::before{content:"/";color:var(--c-texto-3)}
.migas a{display:inline-flex;align-items:center;min-height:2rem}
.migas [aria-current]{color:var(--c-texto-2);overflow-wrap:anywhere}
.encabezado{display:flex;flex-direction:column;gap:var(--e-3);padding-bottom:var(--e-5);border-bottom:1px solid var(--c-borde)}
.encabezado__fila{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--e-4)}
.encabezado__texto{flex:1 1 32rem;min-width:0}
.encabezado__texto h1{overflow-wrap:anywhere}
.antetitulo{font-size:.75rem;letter-spacing:.06em;font-weight:700;color:var(--c-acento);margin:0 0 var(--e-1);
  display:flex;flex-wrap:wrap;gap:var(--e-1) var(--e-2);align-items:center}
.descripcion,.sub{color:var(--c-texto-2);margin:var(--e-2) 0 0;max-width:var(--ancho-texto)}
.encabezado__acciones,.acciones{display:flex;flex-wrap:wrap;gap:var(--e-2);align-items:center}
@media (max-width:639.98px){
  /* En teléfonos: la acción principal a todo el ancho y las demás en dos columnas */
  .encabezado__acciones{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,9.5rem),1fr));width:100%}
  .encabezado__acciones > *,.encabezado__acciones > form .btn{width:100%}
  .encabezado__acciones > :first-child{grid-column:1 / -1}
}
.meta{color:var(--c-texto-3);font-size:var(--t-sm)}
.meta a{font-weight:600}
.nota{color:var(--c-texto-3);font-size:var(--t-sm);margin-top:var(--e-2);max-width:var(--ancho-texto)}

/* ------------------------------------------------------ 6 componentes */
.panel{background:var(--c-superficie);border:1px solid var(--c-borde);border-radius:var(--r-3);
  padding:var(--e-4);box-shadow:var(--sombra-1);min-width:0;container-type:inline-size}
@media (min-width:768px){.panel{padding:var(--e-5)}}
.panel > * + *{margin-top:var(--e-3)}
.panel__titulo{font-size:var(--t-md);padding-bottom:.85rem;border-bottom:1px solid var(--c-borde);display:flex;flex-wrap:wrap;align-items:center;gap:var(--e-2)}
.panel > h2:not(:first-child),.panel > h3:not(:first-child),.panel > .cabeza-tabla:not(:first-child){margin-top:var(--e-5)}
.panel--plano{box-shadow:none;background:var(--c-superficie-2)}
.seccion > * + *{margin-top:var(--e-3)}
.seccion__cabeza,.cabeza-tabla{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--e-2) var(--e-4)}
.seccion__cabeza h2,.cabeza-tabla h2{font-size:var(--t-lg)}
.seccion + .seccion{margin-top:var(--e-6)}

.rejilla{display:grid;gap:var(--e-4);grid-template-columns:minmax(0,1fr)}
@media (min-width:1280px){.rejilla--2,.r2{grid-template-columns:repeat(2,minmax(0,1fr))}}
.rejilla--2 > *,.r2 > *{min-width:0}

/* Métricas */
.metricas,.r4{display:grid;gap:var(--e-3);grid-template-columns:repeat(auto-fit,minmax(min(100%,13.5rem),1fr))}
.metrica{container-type:inline-size;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:.65rem;background:var(--c-superficie);border:1px solid var(--c-borde);
  border-radius:var(--r-3);padding:1.35rem;box-shadow:var(--sombra-1);min-width:0;color:inherit;text-decoration:none}
.metrica::before{content:"";position:absolute;left:0;top:1.4rem;height:1.6rem;width:3px;background:var(--c-acento);border-radius:0 3px 3px 0}
.metrica:first-child{background:var(--c-acento-suave);border-color:var(--c-acento-suave)}
.metrica .metrica__valor{padding-block:.25rem;font-weight:750;font-size:clamp(1.15rem,9cqi,1.75rem)}
a.metrica{transition:border-color .15s,box-shadow .15s}
a.metrica:hover{border-color:var(--c-acento);color:inherit}
.metrica[aria-current="true"]{border-color:var(--c-acento);box-shadow:0 0 0 1px var(--c-acento)}
.metrica__etiqueta,.etiqueta{font-size:var(--t-sm);font-weight:600;color:var(--c-texto-2)}
.metrica__valor,.cifra{font-size:var(--t-cifra);font-weight:700;letter-spacing:-.015em;line-height:1.2;overflow-wrap:anywhere}
.metrica__detalle{font-size:var(--t-sm);color:var(--c-texto-3)}
.metrica__enlace{margin-top:auto;font-size:var(--t-sm);font-weight:600;color:var(--c-acento);text-decoration:underline;text-underline-offset:.18em}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--e-2);min-height:var(--toque);
  padding:0 var(--e-4);border:1px solid var(--c-acento);border-radius:var(--r-2);background:var(--c-acento);
  color:var(--c-sobre-acento);font:600 var(--t-sm)/1.2 var(--fuente);text-align:center;text-decoration:none;
  cursor:pointer;transition:background-color .15s,border-color .15s,color .15s}
.btn:hover{background:var(--c-acento-hover);border-color:var(--c-acento-hover);color:var(--c-sobre-acento)}
.btn.sec,.btn--secundario{background:var(--c-superficie);color:var(--c-acento);border-color:var(--c-borde-control)}
.btn.sec:hover,.btn--secundario:hover{background:var(--c-acento-suave);color:var(--c-acento-hover);border-color:var(--c-acento)}
.btn--fantasma{background:transparent;border-color:transparent;color:var(--c-acento)}
.btn--fantasma:hover{background:var(--c-acento-suave);border-color:transparent;color:var(--c-acento-hover)}
.btn--peligro{background:var(--c-superficie);color:var(--c-alta);border-color:var(--c-borde-control)}
.btn--peligro:hover{background:var(--c-alta-suave);color:var(--c-alta);border-color:var(--c-alta)}
.btn--compacto{min-height:2.25rem;padding:0 var(--e-3);font-size:var(--t-sm)}
@media (pointer:coarse),(max-width:1023.98px){.btn--compacto{min-height:var(--toque)}}
.btn--icono{width:var(--toque);padding:0}
.btn--bloque{width:100%}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.65;cursor:not-allowed}
.btn[aria-busy="true"]::before{content:"";width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;
  border-radius:50%;animation:giro .8s linear infinite}
@keyframes giro{to{transform:rotate(360deg)}}

/* Chips: siempre con texto; el color solo refuerza */
.chip{display:inline-flex;align-items:center;gap:.3em;padding:.125rem .55rem;border-radius:var(--r-pill);
  font-size:var(--t-xs);font-weight:650;line-height:1.4;border:1px solid var(--c-borde);background:var(--c-superficie-2);
  color:var(--c-texto-2);max-width:100%;text-decoration:none;vertical-align:baseline;overflow-wrap:anywhere}
.chip.alta{background:var(--c-alta-suave);color:var(--c-alta);border-color:transparent}
.chip.media{background:var(--c-media-suave);color:var(--c-media);border-color:transparent}
.chip.baja{background:var(--c-baja-suave);color:var(--c-baja);border-color:transparent}
.chip.ok{background:var(--c-ok-suave);color:var(--c-ok);border-color:transparent}
.chip.info{background:var(--c-acento-suave);color:var(--c-acento);border-color:transparent}
a.chip{min-height:2rem;padding-inline:.75rem}
a.chip:hover{border-color:currentColor}
a.chip[aria-current="true"]{background:var(--c-acento);color:var(--c-sobre-acento);border-color:var(--c-acento)}
.chips{display:flex;flex-wrap:wrap;gap:var(--e-2);align-items:center}
ul.chips{list-style:none;margin:0;padding:0}

/* Avisos del sistema */
.aviso{display:flex;gap:var(--e-3);align-items:flex-start;padding:var(--e-3) var(--e-4);border-radius:var(--r-2);
  border:1px solid var(--c-borde);border-left-width:4px;background:var(--c-acento-suave);border-left-color:var(--c-acento);
  color:var(--c-texto)}
.aviso > .icono{margin-top:.15rem;color:var(--c-acento)}
.aviso__texto{min-width:0;overflow-wrap:anywhere}
.aviso__texto > :last-child{margin-bottom:0}
.aviso--error{background:var(--c-alta-suave);border-left-color:var(--c-alta)}
.aviso--error > .icono{color:var(--c-alta)}
.aviso--advertencia{background:var(--c-media-suave);border-left-color:var(--c-media)}
.aviso--advertencia > .icono{color:var(--c-media)}
.aviso--exito{background:var(--c-ok-suave);border-left-color:var(--c-ok)}
.aviso--exito > .icono{color:var(--c-ok)}

/* Señales y hallazgos: hechos por verificar, con la severidad dicha en texto */
.alertas{display:flex;flex-direction:column;gap:var(--e-3)}
.alerta{background:var(--c-superficie);border:1px solid var(--c-borde);border-left:4px solid var(--c-baja);
  border-radius:var(--r-2);padding:var(--e-3) var(--e-4);box-shadow:var(--sombra-1);min-width:0}
.alerta.alta{border-left-color:var(--c-alta)}
.alerta.media{border-left-color:var(--c-media)}
.alerta .titulo{font-weight:650;margin:0 0 var(--e-1);overflow-wrap:anywhere}
.alerta .cuerpo{white-space:pre-line;color:var(--c-texto-2);font-size:var(--t-sm);overflow-wrap:anywhere}
.alerta .pie{margin-top:var(--e-3);display:flex;flex-wrap:wrap;gap:var(--e-2) var(--e-3);align-items:center;
  font-size:var(--t-sm);color:var(--c-texto-3)}
.alerta .pie a{display:inline-flex;align-items:center;min-height:2rem;font-weight:600}
.alerta .pie form{display:flex;flex-wrap:wrap;gap:var(--e-2);margin-left:auto}

/* Pestañas de navegación (enlaces): desplazables en horizontal si no caben */
.pestanas{border:1px solid var(--c-borde);background:var(--c-superficie);border-radius:var(--r-3);padding:.4rem;position:relative}
.pestanas ul{position:relative;list-style:none;margin:0;padding:0;display:flex;gap:var(--e-1);overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x proximity;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.pestanas li{flex:none;scroll-snap-align:start}
.pestanas--desplazable ul{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 3rem),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 3rem),transparent)}
.pestanas--al-final ul{-webkit-mask-image:none;mask-image:none}
.pestanas a{display:inline-flex;align-items:center;gap:var(--e-2);min-height:var(--toque);padding:0 var(--e-3);
  color:var(--c-texto-2);font-weight:600;font-size:var(--t-sm);text-decoration:none;white-space:nowrap;
  border-bottom:3px solid transparent;margin-bottom:-1px}
.pestanas a:hover{color:var(--c-texto)}
.pestanas a[aria-current="page"]{color:var(--c-acento);background:var(--c-acento-suave);border-bottom-color:transparent;border-radius:var(--r-2)}
.pestanas .n{display:inline-flex;justify-content:center;min-width:1.5rem;padding:0 .4rem;border-radius:var(--r-pill);
  background:var(--c-superficie-2);border:1px solid var(--c-borde);color:var(--c-texto-2);font-size:var(--t-xs)}
.pestanas .n.alta{background:var(--c-alta-suave);border-color:transparent;color:var(--c-alta)}

/* Pares dato–valor */
.datos{margin:0;display:flex;flex-direction:column}
.datos__fila{display:grid;gap:var(--e-1);padding:var(--e-2) 0;border-bottom:1px solid var(--c-borde);min-width:0}
.datos__fila:last-child{border-bottom:0}
.datos dt{font-size:var(--t-sm);font-weight:600;color:var(--c-texto-2);display:flex;flex-wrap:wrap;gap:var(--e-1) var(--e-2);align-items:center}
.datos dd{margin:0;min-width:0;overflow-wrap:anywhere}
.datos__fuente{font-weight:500}
@container (min-width:34rem){
  .datos__fila{grid-template-columns:minmax(9rem,13rem) minmax(0,1fr);gap:var(--e-4)}
}

/* Barras horizontales: el texto es el dato; la barra solo lo ilustra */
.barras{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--e-3)}
.barra{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--e-1) var(--e-3);align-items:baseline}
.barra__nombre{min-width:0;overflow-wrap:anywhere;font-size:var(--t-sm)}
.barra__nombre .meta{white-space:nowrap}
.barra__valor{font-size:var(--t-sm);font-weight:600;white-space:nowrap;text-align:right}
.barra__pista{grid-column:1 / -1;height:.65rem;border-radius:var(--r-pill);background:var(--c-acento-suave);overflow:hidden}
.barra__relleno{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--c-acento),#3b929c);min-width:2px}

/* Línea de tiempo */
.linea-tiempo{list-style:none;margin:0;padding:0 0 0 var(--e-4);border-left:2px solid var(--c-borde)}
.linea-tiempo li{position:relative;padding:0 0 var(--e-4)}
.linea-tiempo li::before{content:"";position:absolute;left:calc(-1 * var(--e-4) - 6px);top:.45rem;width:10px;height:10px;
  border-radius:50%;background:var(--c-acento);border:2px solid var(--c-superficie)}
.linea-tiempo li:last-child{padding-bottom:0}

/* Paginación */
.paginacion ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--e-2);align-items:center}
.paginacion a,.paginacion span{display:inline-flex;align-items:center;justify-content:center;min-width:var(--toque);
  min-height:var(--toque);padding:0 var(--e-3);border:1px solid var(--c-borde);border-radius:var(--r-2);
  background:var(--c-superficie);font-weight:600;text-decoration:none}
.paginacion [aria-current="page"]{background:var(--c-acento);color:var(--c-sobre-acento);border-color:var(--c-acento)}
.paginacion .paginacion__total{border:0;background:none;color:var(--c-texto-3);font-weight:500}

/* Estado vacío */
.vacio{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--e-2);padding:var(--e-6) var(--e-4)}
.vacio > .icono{width:3rem;height:3rem;color:var(--c-texto-3)}
.vacio h1,.vacio h2{font-size:var(--t-lg)}
.vacio p{color:var(--c-texto-2);max-width:48ch;margin:0}
.vacio .acciones{justify-content:center;margin-top:var(--e-2)}

/* Listas de enlaces y notas */
.lista-enlaces{margin:0;padding:0;list-style:none;display:grid;gap:var(--e-1)}
.lista-enlaces a{display:inline-flex;align-items:center;gap:var(--e-2);min-height:var(--toque);font-weight:600}
.notas{list-style:none;margin:0;padding:0}
.notas li{border-top:1px solid var(--c-borde);padding-top:var(--e-3);margin-top:var(--e-3);overflow-wrap:anywhere}

/* Acceso: presentación institucional y formulario */
.entrar__presentacion{display:none}
.pagina-acceso .contenido{padding:0}
.pagina-acceso .entrar{min-height:100svh;background:radial-gradient(ellipse at top left,var(--c-acento-suave),transparent 65%)}
.entrar__tarjeta .panel{padding:clamp(1.5rem,4vw,2.5rem)}
.entrar__tarjeta .panel h1{font-size:1.65rem}
.entrar__tarjeta .descripcion{margin-bottom:1.75rem}
.entrar__tarjeta .pila > * + *{margin-top:1.25rem}
@media screen and (min-width:960px){
  .pagina-acceso .entrar{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);padding:0;gap:0}
  .entrar__presentacion{display:flex;flex-direction:column;justify-content:space-between;align-self:stretch;min-height:100svh;padding:clamp(2.5rem,5vw,5rem);color:#d2e6eb;background:radial-gradient(ellipse at bottom right,#246475,transparent 65%),#142e3b;position:relative;overflow:hidden}
  .entrar__presentacion::before{content:"";position:absolute;width:26rem;height:26rem;border:1px solid #42636e;border-radius:50%;right:-14rem;bottom:-10rem;box-shadow:0 0 0 4rem #ffffff03,0 0 0 8rem #ffffff03;pointer-events:none}
  .entrar__sello{display:flex;align-items:center;gap:.75rem;font-weight:650;font-size:1rem}
  .entrar__sello .icono{width:2rem;height:2rem;color:#8ed9db}
  .entrar__presentacion h2{font-size:clamp(2.5rem,3.4vw,4.25rem);line-height:1.1;letter-spacing:-.045em;color:#f0f7fa;margin:1rem 0 1.5rem}
  .entrar__presentacion .antetitulo{color:#8ed9db}
  .entrar__presentacion p{max-width:38ch;line-height:1.8}
  .entrar__capacidades{display:grid;gap:.9rem;font-size:.8125rem;z-index:1}
  .entrar__capacidades span{display:flex;align-items:center;gap:.75rem}
  .entrar__capacidades .icono{color:#8ed9db}
  .entrar__tarjeta{margin:3rem;max-width:29rem;width:calc(100% - 6rem)}
}

/* Tarjeta de entrada */
.entrar{min-height:100vh;display:grid;place-items:center;padding:var(--e-5) var(--margen)}
.entrar__tarjeta{width:100%;max-width:26rem}
.entrar__marca{display:flex;align-items:center;gap:var(--e-2);margin-bottom:var(--e-4)}
.entrar__marca .icono{width:2.25rem;height:2.25rem;color:var(--c-acento)}

/* ------------------------------------------------------------ 7 tablas */
.tabla-contenedor{position:relative;overflow-x:auto;overscroll-behavior-x:contain;max-width:100%;border:1px solid var(--c-borde);
  border-radius:var(--r-3);background:var(--c-superficie);box-shadow:var(--sombra-1)}
.panel .tabla-contenedor{border:0;border-radius:0;box-shadow:none;margin-inline:calc(-1 * var(--e-4))}
@media (min-width:768px){.panel .tabla-contenedor{margin-inline:calc(-1 * var(--e-5))}}
.tabla-contenedor:focus-visible{outline-offset:-3px}
table{width:100%;border-collapse:collapse;font-size:var(--t-sm)}
th,td{padding:var(--e-3) var(--e-3);text-align:left;vertical-align:top;border-bottom:1px solid var(--c-borde)}
th:first-child,td:first-child{padding-left:var(--e-4)}
th:last-child,td:last-child{padding-right:var(--e-4)}
th{font-size:.6875rem;letter-spacing:.045em;text-transform:uppercase;font-weight:700;color:var(--c-texto-2);background:var(--c-superficie-2);white-space:nowrap;
  vertical-align:bottom}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover td{background:var(--c-superficie-2)}
td{overflow-wrap:break-word}
caption{caption-side:top;text-align:left;padding:var(--e-3) var(--e-4) 0;font-weight:650}
.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
th.num{text-align:right}
.tabla-vacia{color:var(--c-texto-2);padding:var(--e-5) var(--e-4)}
.tachado{text-decoration:line-through;color:var(--c-texto-3)}

/* Tablas apilables: en teléfonos cada fila es una tarjeta con sus etiquetas */
@media (max-width:639.98px){
  .tabla--apilable thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tabla--apilable,.tabla--apilable tbody,.tabla--apilable tr,.tabla--apilable td{display:block;width:100%}
  .tabla--apilable tr{padding:var(--e-3) var(--e-4);border-bottom:1px solid var(--c-borde)}
  .tabla--apilable tbody tr:last-child{border-bottom:0}
  .tabla--apilable tbody tr:hover td{background:none}
  .tabla--apilable td{display:grid;grid-template-columns:minmax(6.5rem,38%) minmax(0,1fr);gap:var(--e-2);
    padding:var(--e-1) 0;border:0;text-align:left;white-space:normal}
  .tabla--apilable td::before{content:attr(data-etiqueta);font-size:var(--t-xs);font-weight:650;color:var(--c-texto-2);padding-top:.1rem}
  .tabla--apilable td:not([data-etiqueta]),.tabla--apilable td[data-etiqueta=""]{grid-template-columns:minmax(0,1fr)}
  .tabla--apilable td:not([data-etiqueta])::before,.tabla--apilable td[data-etiqueta=""]::before{content:none}
  .tabla--apilable td.num{text-align:left}
  .tabla--apilable td:empty{display:none}
  .tabla--apilable td.tabla-vacia{display:block}
  .tabla-contenedor:has(.tabla--apilable){overflow-x:visible}
}

/* ----------------------------------------------------- 8 formularios */
input,select,textarea,button{font:inherit;color:inherit}
label,.rotulo{display:block;font-size:var(--t-sm);font-weight:600;color:var(--c-texto-2);margin-bottom:var(--e-1)}
input[type=text],input[type=search],input[type=date],input[type=number],input[type=password],input[type=email],select,textarea{
  width:100%;min-height:var(--toque);padding:.5rem .75rem;border:1px solid var(--c-borde-control);border-radius:var(--r-2);
  background:var(--c-superficie);color:var(--c-texto);font-size:var(--t-base)}
textarea{min-height:6rem;resize:vertical}
input::placeholder,textarea::placeholder{color:var(--c-texto-3);opacity:1}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--c-acento);outline-offset:0;border-color:var(--c-acento)}
input[aria-invalid="true"]{border-color:var(--c-alta)}
.campo{min-width:0}
.ayuda{font-size:var(--t-sm);color:var(--c-texto-3);margin:var(--e-1) 0 0}
.filtros{display:grid;gap:var(--e-3) var(--e-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));align-items:start}
.campo--ancho{grid-column:1 / -1}
@media (min-width:768px){.campo--ancho{grid-column:span 2}}
.opciones{border:0;margin:0;padding:0;min-width:0;grid-column:1 / -1}
.opciones legend{padding:0;margin-bottom:var(--e-1)}
.opciones__lista{display:flex;flex-wrap:wrap;gap:0 var(--e-4)}
.casilla{display:inline-flex;align-items:center;gap:var(--e-2);min-height:var(--toque);margin:0;font-weight:500;color:var(--c-texto);cursor:pointer}
.casilla input{width:1.15rem;height:1.15rem;margin:0;accent-color:var(--c-acento)}
.acciones-form{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:var(--e-2);align-items:center}
@media (max-width:479.98px){.acciones-form > .btn{flex:1 1 auto}}
.plegable{grid-column:1 / -1;border-top:1px solid var(--c-borde);padding-top:var(--e-2)}
.plegable > summary{display:flex;align-items:center;gap:var(--e-2);min-height:var(--toque);cursor:pointer;font-weight:600;
  color:var(--c-acento);list-style:none;width:fit-content}
.plegable > summary::-webkit-details-marker{display:none}
.plegable > summary::before{content:"";width:.5rem;height:.5rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(-45deg);transition:transform .15s}
.plegable[open] > summary::before{transform:rotate(45deg)}
.plegable__cuerpo{padding-top:var(--e-3)}
.formulario-linea{display:flex;flex-wrap:wrap;gap:var(--e-2);align-items:flex-end}
.formulario-linea .campo{flex:1 1 14rem}

/* ------------------------------------------------------- 9 utilidades */
.nowrap{white-space:nowrap}
.romper{overflow-wrap:anywhere;word-break:normal}
.texto-2{color:var(--c-texto-2)}
.fuerte{font-weight:700}
.pila > * + *{margin-top:var(--e-3)}
.fila{display:flex;flex-wrap:wrap;gap:var(--e-2);align-items:center}
.separado{justify-content:space-between}
.sin-margen{margin:0}

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

/* -------------------------------------------------------- 11 impresión */
@media print{
  :root{color-scheme:light;--c-fondo:#fff;--c-superficie:#fff;--c-superficie-2:#f3f4f6;--c-borde:#c9ced6;--c-texto:#000;
    --c-texto-2:#333;--c-texto-3:#444;--c-acento:#000;--c-alta:#8b0000;--c-media:#5c3b00;--c-ok:#0b4d26}
  body{background:#fff;font-size:11pt}
  .entrar__presentacion,.contexto-barra,.cabecera,.saltar,.pestanas,.encabezado__acciones,.acciones-form,.paginacion,.menu-boton,form,.no-imprimir{display:none!important}
  .contenedor{max-width:none;padding:0}
  .panel,.metrica,.alerta,.tabla-contenedor{box-shadow:none;break-inside:avoid}
  .tabla-contenedor{overflow:visible;border:0}
  thead{display:table-header-group}
  tr{break-inside:avoid}
  a{color:#000;text-decoration:none}
}