/* Argos · estilo compartido de las páginas de sector (hacienda, interior, educacion…).
   Rediseño 2026-07: sistema visual ejecutivo — IBM Plex Sans/Mono, dark refinado,
   ranking protagonista, más aire, disclaimers como tooltip, cifras en mono tabular.
   Fuente única: editar aquí, no en web/public/. Lo copia web/scripts/copy-legacy.mjs. */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap');

:root{
  /* superficies */
  --bg:#0a0c0f; --panel:#101318; --panel2:#171b22; --raise:#12161c;
  --line:#242a33; --line2:#1e242c;
  /* texto */
  --txt:#eef1f5; --mut:#aab3bf; --mut2:#8b95a3; --faint:#5c6470;
  /* semáforo de riesgo */
  --ok:#4fce9a; --warn:#e7c14a; --naranja:#f2984f; --bad:#f0616d;
  /* barras / acentos */
  --bar:#4f7fb8; --barpgn:#5a8f6b; --dep:#f2984f;
  --accent:#6ea8fe; --accent2:#a9cbff; --accent-soft:rgba(110,168,254,.13);
  --sans:'IBM Plex Sans',system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono','SFMono-Regular',ui-monospace,monospace;
  --head-h:60px; /* alto aprox del header sticky, para scroll-margin de anclas */
  --pad:24px;    /* padding lateral base de secciones */
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--txt);font-family:var(--sans);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--accent);text-decoration:none} a:hover{color:var(--accent2)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.num,.money,.v,.pv,.val,.dv,.dlab,.slabel,.stat .v{font-variant-numeric:tabular-nums}

/* ===================== Header / hero ===================== */
header{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px var(--pad);
  border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(10,12,15,.86);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:6}
header h1{font-size:17px;margin:0;font-weight:700;letter-spacing:-.01em;color:var(--txt)}
.tag{font:600 10.5px/1 var(--mono);color:var(--accent2);background:var(--accent-soft);
  border:1px solid #2b405a;border-radius:20px;padding:6px 10px;letter-spacing:.02em}
.nav{margin-left:auto;display:flex;flex-wrap:wrap;gap:6px}
.nav a{font-size:12px;color:var(--mut2);border:1px solid var(--line);border-radius:999px;
  padding:5px 12px;transition:border-color .15s,color .15s}
.nav a:hover{color:var(--txt);border-color:#39424f}
.nav a.home{color:var(--accent2);border-color:#2b405a}
.nav a.active{color:var(--txt);border-color:var(--txt);font-weight:600}
.sub{padding:14px var(--pad) 0;font-size:12px;color:var(--mut2)} .sub b{color:var(--mut)}
.vb{display:inline-block;font:600 11px/1 var(--sans);border-radius:999px;padding:2px 9px;border:1px solid var(--line)}
.vb-ok{color:var(--ok);border-color:rgba(79,206,154,.4)} .vb-bad{color:var(--bad);border-color:rgba(240,97,109,.4)}
.vb-warn{color:var(--warn);border-color:rgba(231,193,74,.4)} .vb-gris{color:var(--mut2)}
.wrap{max-width:1200px}

/* Resumen ejecutivo = hero narrativo (card con gradiente) */
.resumen{margin:16px var(--pad) 4px;background:linear-gradient(180deg,var(--raise),var(--panel));
  border:1px solid #232932;border-radius:20px;padding:24px 26px;font:400 15px/1.65 var(--sans);
  color:var(--mut);max-width:1000px;text-wrap:pretty}
.resumen b{color:var(--txt);font-weight:600}
.resumen .rtag{font:600 10.5px/1 var(--mono);color:var(--accent2);background:var(--accent-soft);
  border:1px solid #2b405a;border-radius:20px;padding:6px 10px;letter-spacing:.04em;text-transform:uppercase;
  display:inline-block;margin-bottom:14px}
.resumen .rnote{font-size:11.5px;color:var(--mut2);margin-top:14px;padding-top:12px;border-top:1px solid var(--line2)}
.resumen:empty,.legendbar:empty,.scalebar:empty,.toc:empty,.ranktools:empty{display:none}

/* Glosario de etiquetas + escala (compactos) */
.legendbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:12px var(--pad) 2px;font-size:11px;color:var(--mut2)}
.legendbar .lgl{font-weight:700;letter-spacing:.5px;text-transform:uppercase;font-size:10px;color:var(--faint)}
.legchip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:999px;padding:2px 9px;cursor:help}
.legchip .lk{font:700 9.5px/1.6 var(--mono);letter-spacing:.4px;border-radius:999px;padding:0 6px;border:1px solid currentColor}
.legchip.H .lk{color:var(--ok)} .legchip.INF .lk{color:var(--accent)} .legchip.HIP .lk{color:var(--warn)}
.legchip.RISK .lk{color:var(--bad)} .legchip.REC .lk{color:var(--txt)} .legchip.TODO .lk{color:var(--mut2);border-style:dashed}
.legchip .ld{color:var(--mut2)}
.scalebar{padding:2px var(--pad) 0;font-size:11px;color:var(--mut2)} .scalebar b{color:var(--mut)}

/* TOC · navegación interna sticky */
.toc{position:sticky;top:var(--head-h);z-index:4;display:flex;flex-wrap:wrap;gap:6px;padding:10px var(--pad);
  background:rgba(10,12,15,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line2)}
.toc a{font-size:11.5px;color:var(--mut2);border:1px solid var(--line);border-radius:999px;padding:4px 11px}
.toc a:hover{color:var(--txt);border-color:#39424f}

/* KPI band */
.summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;padding:14px var(--pad) 2px;max-width:1200px}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.stat .k{font:500 10px/1.3 var(--sans);letter-spacing:.05em;text-transform:uppercase;color:var(--faint)}
.stat .v{font:600 24px/1.1 var(--mono);color:var(--txt);margin-top:9px}
.stat .s{font-size:11px;color:var(--mut2);margin-top:5px;line-height:1.35}

/* Títulos de sección */
h2.sec{font-size:15px;font-weight:700;letter-spacing:-.01em;padding:26px var(--pad) 0;margin:0;
  scroll-margin-top:calc(var(--head-h) + 48px)}
.sechint{padding:4px var(--pad) 0;font-size:11.5px;color:var(--mut2);line-height:1.5;max-width:1000px}

/* Acordeones 1B — secciones colapsables (baja la carga visual, progressive disclosure).
   El <h2 class="sec"> se mueve dentro del <summary>; contador a la derecha + icono +/−. */
details.acc{border-top:1px solid var(--line);margin-top:6px}
details.acc>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;
  padding:15px var(--pad);user-select:none;transition:background .1s}
details.acc>summary::-webkit-details-marker{display:none}
details.acc>summary:hover{background:var(--raise)}
details.acc>summary h2.sec{padding:0;margin:0;flex:1;scroll-margin-top:calc(var(--head-h) + 48px)}
.acc-n{font:600 11px/1 var(--mono);color:var(--mut2);background:var(--panel);border:1px solid var(--line);
  border-radius:999px;padding:4px 9px;min-width:26px;text-align:center}
.acc-x{width:11px;height:11px;flex:0 0 auto;position:relative;color:var(--faint)}
.acc-x::before,.acc-x::after{content:"";position:absolute;background:currentColor;border-radius:2px}
.acc-x::before{left:0;top:4.5px;width:11px;height:2px}
.acc-x::after{left:4.5px;top:0;width:2px;height:11px;transition:opacity .18s}
details.acc[open]>summary .acc-x{color:var(--accent)}
details.acc[open]>summary .acc-x::after{opacity:0}   /* + → − al abrir */
details.acc[open]>summary h2.sec{color:var(--txt)}
details.acc>summary+.sechint{padding-top:2px}
details.acc[open]{padding-bottom:10px}

/* Pilares */
.pilares{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;padding:12px var(--pad) 2px;max-width:1200px}
.pilar{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;display:block;transition:border-color .15s,transform .15s}
.pilar:hover{border-color:#39424f}
.pilar .pt{font-size:12px;font-weight:600;color:var(--mut)} .pilar .pv{font:600 24px/1.1 var(--mono);color:var(--txt);margin:6px 0}
.pilar .ps{font-size:11px;color:var(--mut2);line-height:1.4} .pilar .go{font-size:11px;font-weight:600;color:var(--accent2);margin-top:8px;display:inline-block}

/* Hallazgos */
.hall{padding:8px var(--pad) 2px;max-width:1000px}
.halli{display:flex;gap:11px;align-items:flex-start;font-size:13px;line-height:1.55;padding:11px 0;border-bottom:1px solid var(--line2)}
.halli .lab{font:600 9.5px/1.6 var(--mono);letter-spacing:.4px;border-radius:6px;padding:3px 8px;white-space:nowrap;margin-top:1px;cursor:help;height:fit-content}
.lab.H{color:var(--ok);background:rgba(79,206,154,.11)} .lab.INF{color:var(--accent2);background:var(--accent-soft)}
.lab.HIP{color:var(--warn);background:rgba(231,193,74,.11)} .lab.RISK{color:var(--bad);background:rgba(240,97,109,.11)}
.lab.REC{color:var(--txt);background:#1c2128} .lab.TODO{color:var(--mut2);background:transparent;border:1px dashed var(--line)}
.halli span:not(.lab):not(.pill){color:var(--mut)} .halli b{color:var(--txt);font-weight:600}
.halli .s{color:var(--mut2)}
.halli code{font:400 11.5px/1.5 var(--mono);color:var(--mut2)}
.halli details{margin-top:4px} .halli summary{cursor:pointer;font-size:11px;color:var(--accent);width:fit-content}
.halli details[open] summary{margin-bottom:4px}
.money{cursor:help;border-bottom:1px dotted transparent} .money:hover{border-bottom-color:var(--mut2)}

/* Ranking entidades — protagonista */
.ranktools{display:flex;align-items:center;gap:8px;padding:10px var(--pad) 4px;font-size:11px;color:var(--mut2);flex-wrap:wrap}
.ranktools button{font-size:11px;color:var(--mut2);background:transparent;border:1px solid var(--line);border-radius:999px;padding:4px 12px;cursor:pointer;transition:border-color .15s,color .15s}
.ranktools button:hover{color:var(--txt);border-color:#39424f}
.ranktools button.on{color:var(--accent2);border-color:#2b405a;background:var(--accent-soft);font-weight:600}
.erow{display:flex;align-items:center;gap:14px;padding:13px var(--pad);border-bottom:1px solid var(--line2);font-size:13px}
.erow:hover{background:var(--panel)}
.erow .rank{font:600 12px/1 var(--mono);color:var(--faint);width:24px;text-align:right}
.erow .en{flex:1 1 200px;min-width:120px}
.erow .en .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;font-weight:600;color:var(--txt)}
.erow .en .nm a{color:var(--txt)} .erow .en .nm a:hover{color:var(--accent2)}
.erow .en .nat{color:var(--mut2);font-size:10.5px;display:block;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Score 0-100 con eje visible */
.scoreblk{flex:0 0 176px;display:flex;flex-direction:column;gap:5px}
.scoreblk .strack{position:relative;height:11px;border-radius:6px;background:#1b2230;overflow:hidden}
.scoreblk .strack > i{display:block;height:100%;border-radius:6px}
.scoreblk .strack .sax{position:absolute;top:0;bottom:0;width:1px;background:#39424f}
.scoreblk .slabel{display:flex;justify-content:space-between;font-size:9px;color:var(--mut2);letter-spacing:.04em;text-transform:uppercase}
.scoreblk .slabel b{font:600 11px/1 var(--mono)}
/* Dependencia del top proveedor */
.depblk{flex:0 0 120px;display:flex;flex-direction:column;gap:4px}
.depblk .dbar{height:6px;border-radius:4px;background:#1b2230;overflow:hidden}
.depblk .dbar > i{display:block;height:100%;border-radius:4px;background:var(--dep)}
.depblk .dlab{font:500 9.5px/1.3 var(--sans);color:var(--mut2)}
.erow .val{color:var(--mut);white-space:nowrap;font:600 12px/1 var(--mono);flex:0 0 auto}
.pill{font:600 9px/1.5 var(--mono);padding:2px 8px;border-radius:999px;text-transform:uppercase;letter-spacing:.03em}
.go2{font-size:11px;font-weight:600;color:var(--accent2);white-space:nowrap}

/* Anomaly cards */
.arow{display:flex;gap:12px;overflow-x:auto;padding:12px var(--pad) 8px;scroll-snap-type:x proximity}
.acard{flex:0 0 268px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;scroll-snap-align:start}
.acard .at{font-size:12px;font-weight:600;line-height:1.3;margin-bottom:8px;color:var(--txt)}
.acard .ai{font-size:12px;color:var(--mut);line-height:1.5;margin:3px 0}
.acard .ai b{color:var(--txt);font-family:var(--mono);font-weight:600} .acard .amut{color:var(--mut2)}
.acard .ago{font-size:11px;font-weight:600;color:var(--accent2);margin-top:10px;display:inline-block}

/* Distribución (modalidad / tipo / año / PGN) */
.dist{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px;padding:12px var(--pad) 2px;max-width:1200px}
.dcard{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.dcard .dt{font-size:12px;font-weight:600;margin-bottom:12px;color:var(--txt)}
.drow{display:flex;align-items:center;gap:10px;font-size:11.5px;margin:6px 0}
.drow .dl{flex:0 0 132px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.drow .dbar{flex:1;height:6px;background:#1b2230;border-radius:4px;overflow:hidden}
.drow .dbar > i{display:block;height:100%;background:var(--bar);border-radius:4px}
.drow .dv{flex:0 0 auto;color:var(--mut2);white-space:nowrap;font:500 11px/1 var(--mono)}
.dcard .dhint{font-size:10.5px;color:var(--mut2);margin-top:10px;line-height:1.4}
@media(max-width:640px){ .drow .dl{flex-basis:96px} }
.foot{padding:20px var(--pad) 30px;font-size:11.5px;color:var(--mut2);line-height:1.6;max-width:1000px}
.foot b{color:var(--mut)} .foot code{font-family:var(--mono);color:var(--mut2)}
.err{padding:20px var(--pad);color:var(--bad);font-size:13px}
.err code{font-family:var(--mono);color:var(--mut2)}

@media(max-width:640px){
  :root{--pad:14px}
  header h1{font-size:15px}
  .resumen{margin-left:14px;margin-right:14px;padding:18px 18px;font-size:14px}
  .stat{padding:13px 14px} .stat .v{font-size:21px}
  .erow{flex-wrap:wrap;gap:10px 14px}
  .depblk{flex-basis:calc(50% - 7px)} .scoreblk{flex-basis:calc(50% - 7px)}
  .acard{flex-basis:82vw;max-width:300px}
  .toc{overflow-x:auto;flex-wrap:nowrap}
}
@media(prefers-reduced-motion:reduce){ *{scroll-behavior:auto !important;transition:none !important} .arow{scroll-snap-type:none} }
@media print{
  :root{--bg:#fff;--panel:#fff;--panel2:#fff;--raise:#fff;--txt:#111;--mut:#333;--mut2:#333;--faint:#555;--line:#bbb;--line2:#ddd}
  header,.toc{position:static;border-bottom:1px solid #bbb;background:#fff;backdrop-filter:none} .nav,.ranktools{display:none}
  .resumen{background:#fff}
  a{color:#111;text-decoration:underline} .arow{overflow:visible;flex-wrap:wrap}
  .acard,.erow,.stat,.dcard,.resumen{break-inside:avoid} details{open:open}
  .halli details{display:block} .halli summary{display:none} .halli details > *:not(summary){display:block !important}
}

/* --- Detalle navegable: tablas buscables + filtro + export CSV (universo completo) --- */
.tblbox{max-width:1040px;margin:0 var(--pad) 14px}
.tctrl{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.tsearch{flex:1;min-width:220px;background:var(--panel);border:1px solid var(--line);color:var(--txt);
  border-radius:10px;padding:9px 12px;font-size:13px;font-family:var(--sans);outline:none}
.tsearch:focus{border-color:var(--accent)}
.tcount{font-size:11.5px;color:var(--mut2);white-space:nowrap;margin-left:auto}
.tchip{background:var(--panel);border:1px solid var(--line);color:var(--mut2);border-radius:999px;
  padding:7px 13px;font-size:11.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.tchip:hover{border-color:#39424f;color:var(--txt)}
.tchip.on{background:var(--accent-soft);border-color:#2b405a;color:var(--accent2)}
.tbtn{background:var(--panel);border:1px solid var(--line);color:var(--mut);border-radius:10px;
  padding:7px 13px;font-size:11.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.tbtn:hover{border-color:#39424f;color:var(--txt)}
.twrap{border:1px solid var(--line);border-radius:12px;overflow:auto;max-height:min(60vh,560px)}
table.htbl{border-collapse:collapse;width:100%;font-size:12.5px}
.htbl thead th{position:sticky;top:0;background:var(--panel2);z-index:2;text-align:left;padding:10px 12px;
  color:var(--faint);font-weight:600;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;
  border-bottom:1px solid var(--line);cursor:pointer;white-space:nowrap}
.htbl thead th .ar{color:var(--accent);margin-left:3px}
.htbl tbody td{padding:9px 12px;border-bottom:1px solid var(--line2);vertical-align:top}
.htbl tbody tr.clik{cursor:pointer} .htbl tbody tr.clik:hover{background:var(--panel)}
.htbl td.num{text-align:right;font-family:var(--mono);white-space:nowrap;color:var(--mut)}
.htbl .mut{color:var(--mut2)} .htbl .nm{color:var(--txt);font-weight:600}
.htbl tr.exp td{background:var(--panel)}
.entlist{display:flex;flex-wrap:wrap;gap:6px;padding:2px 0}
.entchip{display:inline-flex;gap:6px;align-items:center;background:var(--bg);border:1px solid var(--line);
  border-radius:999px;padding:4px 10px;font-size:11px;color:var(--mut);text-decoration:none}
.entchip:hover{border-color:#39424f} .entchip b{color:var(--accent2);font-family:var(--mono)}
.flag{display:inline-block;font:600 9px/1.5 var(--mono);padding:2px 7px;border-radius:999px;
  background:rgba(242,152,79,.14);color:var(--naranja);margin-left:6px;vertical-align:middle}
@media(max-width:640px){ .tblbox{margin-left:14px;margin-right:14px} }