:root{--fg:#1c2430;--mut:#667085;--bg:#f6f7f9;--panel:#fff;--line:#e3e6eb;--azul:#1f3a5f;--ok:#17794a;--bad:#b42318;
--c0:#1f3a5f;--c1:#3b82c4;--c2:#7fb7e6;--c3:#b9c4d0;--c4:#e08a2c;--c5:#f2c078}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--fg);background:var(--bg);font-size:14px;line-height:1.45}
a{color:var(--c1);text-decoration:none}a:hover{text-decoration:underline}
header{background:var(--azul);color:#fff}
.barra{max-width:1180px;margin:0 auto;padding:10px 16px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px}
.marca{font-weight:600;font-size:16px;color:#fff;margin-right:8px}
nav{display:flex;flex-wrap:wrap;gap:4px 14px;flex:1}nav a{color:#dbe6f3}nav a.on{color:#fff;font-weight:600;border-bottom:2px solid #fff}
.quien{display:flex;align-items:center;gap:10px;color:#dbe6f3;font-size:13px}.quien a{color:#dbe6f3}
.quien button{background:none;border:1px solid #7f95b1;color:#fff;border-radius:6px;padding:3px 9px;cursor:pointer}
main{max-width:1180px;margin:0 auto;padding:18px 16px 48px}
h1{font-size:22px;margin:0 0 4px;font-weight:600}h2{font-size:16px;margin:26px 0 6px;font-weight:600}
.sub{color:var(--mut);margin:0 0 10px;max-width:90ch}
.tarjetas{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:14px 0}
.tarjeta{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px}
.tarjeta .l{color:var(--mut);font-size:12px}.tarjeta .v{font-size:24px;font-weight:600;margin-top:2px;font-variant-numeric:tabular-nums}.tarjeta .n{color:var(--mut);font-size:12px;margin-top:2px}
.caja{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px}
.tabla-w{overflow-x:auto;background:var(--panel);border:1px solid var(--line);border-radius:10px}
.alto{max-height:520px;overflow-y:auto}
table{border-collapse:collapse;width:100%;font-size:13px}
th{position:sticky;top:0;background:#f0f2f5;text-align:left;font-weight:600;color:#475467;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:7px 10px;border-bottom:1px solid var(--line);white-space:nowrap}tr:last-child td{border-bottom:0}
.num{text-align:right;font-variant-numeric:tabular-nums}.neg{color:var(--bad)}.tot td{font-weight:600;background:#fafbfc}
.leyenda{display:flex;flex-wrap:wrap;gap:4px 14px;color:var(--mut);font-size:12px;margin:6px 0}
.leyenda i,.seg{display:inline-block}.leyenda i{width:10px;height:10px;border-radius:2px;margin-right:5px}
.k0{background:var(--c0)}.k1{background:var(--c1)}.k2{background:var(--c2)}.k3{background:var(--c3)}.k4{background:var(--c4)}.k5{background:var(--c5)}
.meses{display:flex;align-items:flex-end;gap:3px;height:240px;padding-top:6px;overflow-x:auto}
.mescol{flex:1;min-width:14px;display:flex;flex-direction:column;justify-content:flex-end;height:100%}
.mescol .pila{display:flex;flex-direction:column-reverse;border-radius:3px 3px 0 0;overflow:hidden}
.mescol .seg{width:100%}
.ejex{display:flex;gap:3px;color:var(--mut);font-size:10px;margin-top:4px;overflow:hidden}.ejex span{flex:1;min-width:14px;text-align:center;white-space:nowrap}
.hb{display:grid;grid-template-columns:1fr auto;gap:2px 10px;margin:9px 0}.hb .nom{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hb .val{font-variant-numeric:tabular-nums}.hb .pista{grid-column:1/3;display:flex;height:9px}.hb .pista span{height:9px}
.aviso{padding:10px 12px;border-radius:8px;margin:10px 0;border:1px solid}
.aviso.ok{background:#ecfdf3;border-color:#abefc6;color:var(--ok)}.aviso.error{background:#fef3f2;border-color:#fecdca;color:var(--bad)}
.aviso.info{background:#eff6ff;border-color:#bfdbfe;color:#1e4b8f}
form.linea{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end}
label{display:block;font-size:12px;color:var(--mut);margin-bottom:3px}
input[type=text],input[type=password],select,input[type=file]{padding:7px 9px;border:1px solid #cfd4dc;border-radius:7px;font:inherit;background:#fff;max-width:100%}
button.b{background:var(--azul);color:#fff;border:0;border-radius:7px;padding:8px 14px;font:inherit;cursor:pointer}
button.b2{background:#fff;color:var(--fg);border:1px solid #cfd4dc;border-radius:7px;padding:5px 10px;font:inherit;cursor:pointer}
button.pel{color:var(--bad);border-color:#fecdca}
.login{max-width:340px;margin:60px auto}.login .caja{padding:22px}.login input{width:100%;margin-bottom:12px}
.pie{color:var(--mut);font-size:12px;margin-top:28px}
.etq{display:inline-block;padding:1px 7px;border-radius:10px;font-size:11px;background:#eef2f6;color:#475467}
.etq.curso{background:#fff4e5;color:#9a5b00}
code{background:#eef2f6;padding:1px 5px;border-radius:4px}
