:root{--azul:#1A3A8C;--azul2:#1A3A5C;--rojo:#E8192C;--gris:#f3f5f9;--borde:#d7dce6;--txt:#1d2433;--verde:#1b7f4b;--ambar:#b7791f;--naranja:#c2570c}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Calibri,sans-serif;color:var(--txt);background:var(--gris);font-size:14px}
.wrap{max-width:1280px;margin:0 auto;padding:0 16px}
.top{background:var(--azul);color:#fff;border-bottom:4px solid var(--rojo)}
.bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;padding-top:10px;padding-bottom:10px}
.brand strong{display:block;font-size:17px}.brand span{font-size:11px;opacity:.8}
nav{display:flex;flex-wrap:wrap;gap:4px;flex:1}
nav a{color:#fff;text-decoration:none;padding:6px 12px;border-radius:4px;font-size:13px}
nav a:hover{background:rgba(255,255,255,.15)}nav a.on{background:#fff;color:var(--azul);font-weight:bold}
.who{font-size:12px}.who a{color:#fff;margin-left:10px}
h1{color:var(--azul2);font-size:22px;margin:20px 0 14px}
h2{color:var(--azul2);font-size:16px;margin:22px 0 8px}
.card{background:#fff;border:1px solid var(--borde);border-radius:6px;padding:14px;margin-bottom:14px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:16px}
.kpi{background:#fff;border:1px solid var(--borde);border-left:5px solid var(--azul);border-radius:6px;padding:12px}
.kpi b{display:block;font-size:28px;color:var(--azul2)}.kpi span{font-size:12px;color:#556}
.kpi.rojo{border-left-color:var(--rojo)}.kpi.rojo b{color:var(--rojo)}.kpi.ambar{border-left-color:var(--ambar)}
.kpi a{color:inherit;text-decoration:none;display:block}
table{border-collapse:collapse;width:100%;background:#fff}
th,td{padding:7px 9px;border-bottom:1px solid var(--borde);text-align:left;vertical-align:top}
th{background:var(--azul2);color:#fff;font-size:12px;white-space:nowrap}th a{color:#fff;text-decoration:none}
tr:hover td{background:#f7f9fd}td.num,th.num{text-align:right;white-space:nowrap}
.scroll{overflow-x:auto;border:1px solid var(--borde);border-radius:6px}
.badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:bold;white-space:nowrap;color:#fff}
.b-rojo{background:var(--rojo)}.b-ambar{background:var(--ambar)}.b-verde{background:var(--verde)}.b-naranja{background:var(--naranja)}
.b-azul{background:var(--azul)}.b-celeste{background:#2b7fb8}.b-gris{background:#7b8494}
form.filtros{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:12px}
label{display:block;font-size:12px;color:#445;margin-bottom:3px}
input,select,textarea{font:inherit;padding:6px 8px;border:1px solid #b9c1d1;border-radius:4px;background:#fff;max-width:100%}
input:disabled,select:disabled,textarea:disabled{background:#eceff4;color:#667}
textarea{width:100%;min-height:70px}
button,.btn{font:inherit;background:var(--azul);color:#fff;border:0;border-radius:4px;padding:7px 14px;cursor:pointer;text-decoration:none;display:inline-block}
button:hover,.btn:hover{background:var(--azul2)}.btn.sec{background:#fff;color:var(--azul);border:1px solid var(--azul)}
.btn.rojo{background:var(--rojo)}.btn.chico,button.chico{padding:3px 9px;font-size:12px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
fieldset{border:1px solid var(--borde);border-radius:6px;background:#fff;margin:0 0 14px;padding:12px}
legend{color:var(--azul);font-weight:bold;padding:0 6px}
.flash{padding:10px 14px;border-radius:4px;margin:12px 0}.f-ok{background:#e2f4ea;border:1px solid #9fd5b6}
.f-error{background:#fde8ea;border:1px solid #f0a3ab}.f-aviso{background:#fff4dc;border:1px solid #e8c77a}
.pager{display:flex;gap:16px;justify-content:center;align-items:center;margin:12px 0}
.bar-pct{background:#e4e8f0;border-radius:3px;height:14px;min-width:120px;position:relative}
.bar-pct i{display:block;height:100%;border-radius:3px;background:var(--verde)}
.muted{color:#6b7385;font-size:12px}.pie{padding:24px 16px;color:#6b7385;font-size:12px}
.login{max-width:360px;margin:60px auto}.login .card{padding:22px}.login input{width:100%;margin-bottom:12px}
.err{color:var(--rojo);font-size:12px;margin-top:2px}
@media(max-width:700px){.who{width:100%}}