:root{--fondo:#F4F5F7;--tinta:#14181F;--suave:#4A5468;--linea:#DDE1E8;--linea2:#EEF0F4;--azul:#1F4FD8;--azul-osc:#163A9E;--azul-claro:#EEF3FF;--panel:#FFFFFF;--noche:#14181F;--ambar-f:#FFF3E6;--ambar-t:#7A3A06;--rojo-f:#FDECEC;--rojo-t:#8C1D18;--verde-f:#E1F0E7;--verde-t:#14532D}
*{box-sizing:border-box}
body{margin:0;background:var(--fondo);color:var(--tinta);font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
h1,h2{font-family:"Space Grotesk",system-ui,sans-serif;margin:0;font-weight:600}
h1{font-size:28px}h2{font-size:18px}
p{margin:0}
a{color:var(--azul)}
button,input,select{font:inherit}
.marco{display:flex;flex-wrap:wrap;min-height:100vh}
.nav{flex:1 1 220px;max-width:100%;background:var(--noche);padding:28px 20px;display:flex;flex-direction:column;gap:6px}
.nav .marca{color:#fff;font:600 20px "Space Grotesk",system-ui,sans-serif;padding:0 12px}
.nav .sub{color:#A9B2C3;font-size:12px;padding:0 12px 18px}
.nav a{display:block;padding:12px;border-radius:8px;color:#D5DAE3;text-decoration:none}
.nav a[aria-current=page]{background:#2A3242;color:#fff;font-weight:600}
.nav .salir{margin-top:auto;background:none;border:1px solid #5B6579;color:#D5DAE3;border-radius:8px;min-height:44px;cursor:pointer}
.main{flex:999 1 560px;min-width:0;padding:32px 36px 56px;display:flex;flex-direction:column;gap:20px}
.cab{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px}
.suave{color:var(--suave)}.chico{font-size:13px}
.caja{background:var(--panel);border:1px solid var(--linea);border-radius:12px;padding:22px;display:flex;flex-direction:column;gap:14px}
.caja.ajustada{padding:0;gap:0;overflow:hidden}
.g4{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}
.g2{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px;align-items:start}
.g3{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.num{font:600 32px "Space Grotesk",system-ui,sans-serif;margin-top:4px}
.barras{display:grid;grid-template-columns:minmax(110px,170px) 1fr 52px;align-items:center;gap:9px 12px}
.barra{height:12px;border-radius:6px;background:#E9ECF1;overflow:hidden}
.barra i{display:block;height:12px;border-radius:6px;background:var(--azul)}
.barra.b i{background:#B4530A}
.der{text-align:right;font-weight:600}
.btn{min-height:44px;padding:0 16px;border:1px solid #C5CBD6;border-radius:8px;background:#fff;color:var(--tinta);cursor:pointer}
.btn.pri{background:var(--azul);border-color:var(--azul);color:#fff;font-weight:600}
.btn.osc{background:var(--noche);border-color:#5B6579;color:#fff}
.btn[disabled]{opacity:.5;cursor:default}
.btn:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #8FB0FF;outline-offset:2px}
.campo{display:flex;flex-direction:column;gap:6px;flex:1 1 160px;min-width:0}
.caja>.campo{flex:none}
.campo label,.leyenda{font-size:13px;color:var(--suave)}
input[type=text],input[type=search],input[type=email],input[type=tel],input[type=password],select{min-height:44px;padding:0 12px;border:1px solid #C5CBD6;border-radius:8px;background:#fff;color:var(--tinta);width:100%}
input[readonly]{background:#F4F5F7;color:var(--suave)}
.fila{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.fin{justify-content:flex-end}
.check{display:flex;align-items:center;gap:10px;min-height:44px}
.check input{width:20px;height:20px;flex:none}
.check.marco-c{padding:0 12px;border:1px solid #C5CBD6;border-radius:8px}
.check.marco-c.on{border-color:var(--azul);background:var(--azul-claro)}
fieldset{border:0;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}
legend{padding:0;margin-bottom:6px}
.scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;text-align:left;min-width:760px}
th{padding:13px 12px;font-weight:500;font-size:13px;color:var(--suave);border-bottom:1px solid var(--linea);white-space:nowrap}
td{padding:13px 12px;border-bottom:1px solid var(--linea2);vertical-align:middle}
tr.sel td{background:var(--azul-claro)}
td:first-child,th:first-child{padding-left:20px}td:last-child,th:last-child{padding-right:20px}
.fuerte{font-weight:600}
.pil{display:inline-block;padding:4px 10px;border-radius:999px;font-size:13px;font-weight:500;white-space:nowrap;background:#E3E8F2;color:#2A3242}
.pil.ok{background:var(--verde-f);color:var(--verde-t)}.pil.gris{background:#F0F1F4;color:var(--suave)}
.pil.ambar{background:var(--ambar-f);color:var(--ambar-t)}.pil.rojo{background:var(--rojo-f);color:var(--rojo-t)}
.nota{border-radius:10px;padding:14px 16px;background:#F4F5F7;display:flex;flex-direction:column;gap:6px}
.nota.ambar{background:var(--ambar-f);color:var(--ambar-t)}.nota.rojo{background:var(--rojo-f);color:var(--rojo-t)}
.barra-sel{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;background:var(--noche);color:#fff;border-radius:12px;padding:12px 18px}
.pie{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 20px}
.pie select{width:auto}
.cmp{display:grid;grid-template-columns:minmax(100px,150px) 1fr 1fr;gap:9px 12px;align-items:start}
.antes{color:var(--suave)}.despues{font-weight:600;color:var(--azul-osc)}
.login{min-height:100vh;display:grid;place-items:center;padding:24px}
.login form{width:min(380px,100%)}
#aviso{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:9;max-width:min(560px,92vw)}
#aviso div{background:var(--noche);color:#fff;padding:14px 18px;border-radius:10px;box-shadow:0 6px 24px rgba(0,0,0,.25)}
#aviso div.mal{background:var(--rojo-t)}
.oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (max-width:640px){.main{padding:20px 16px 40px}.barras{grid-template-columns:110px 1fr 44px}}
