
:root{
  --rojo:#A6192E; --rojo-osc:#7E1322; --negro:#1A1A1A; --gris:#5C6470;
  --linea:#E3E6EA; --fondo:#F4F6F8; --blanco:#fff;
  --frio:#5B8DEF; --templado:#00A0A8; --caliente:#F0A202; --muy:#E8590C;
  --oport:#A6192E; --ganado:#2E7D32; --perdido:#8A8A8A;
  --ok:#2E7D32; --aviso:#C77700; --alerta:#C62828;
}
*{box-sizing:border-box}
body{margin:0;background:var(--fondo);color:var(--negro);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:14px;line-height:1.45}
header{background:var(--negro);color:#fff;padding:16px 22px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
header .marca{font-weight:800;font-size:20px;letter-spacing:.14em}
header .marca span{color:var(--rojo)}
header .sub{color:#B9BFC7;font-size:13px}
header .hoy{margin-left:auto;color:#B9BFC7;font-size:13px}
header .estado{display:flex;align-items:center;gap:7px;color:#B9BFC7;font-size:13px;
  background:#2A2D33;border-radius:20px;padding:6px 13px;cursor:pointer}
header .estado:hover{background:#34383F}
header .estado .foco{width:9px;height:9px;border-radius:50%;background:#8A8A8A;flex:0 0 9px}
header .estado.ok .foco{background:#4CAF50}
header .estado.trabajando .foco{background:#F0A202;animation:lat 1s infinite}
header .estado.error .foco{background:#E53935}
@keyframes lat{50%{opacity:.25}}
nav{background:var(--blanco);border-bottom:1px solid var(--linea);padding:0 14px;display:flex;gap:2px;overflow-x:auto}
nav button{background:none;border:0;border-bottom:3px solid transparent;padding:13px 16px;font-size:14px;
  font-weight:600;color:var(--gris);cursor:pointer;white-space:nowrap;font-family:inherit}
nav button.act{color:var(--rojo);border-bottom-color:var(--rojo)}
main{padding:20px;max-width:1400px;margin:0 auto}
section{display:none}
section.act{display:block}
h2{font-size:17px;margin:0 0 12px}
h3{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--gris);margin:26px 0 10px}
.card{background:var(--blanco);border:1px solid var(--linea);border-radius:10px;padding:16px;margin-bottom:16px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:12px;margin-bottom:18px}
.kpi{background:var(--blanco);border:1px solid var(--linea);border-radius:10px;padding:14px 16px;border-top:3px solid var(--rojo)}
.kpi .n{font-size:26px;font-weight:800;line-height:1.1}
.kpi .t{color:var(--gris);font-size:12px;text-transform:uppercase;letter-spacing:.05em;margin-top:4px}
.kpi .d{color:var(--gris);font-size:12px;margin-top:6px}
.kpi.rojo{border-top-color:var(--alerta)} .kpi.rojo .n{color:var(--alerta)}
.kpi.verde{border-top-color:var(--ganado)}
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;padding:9px 10px;border-bottom:2px solid var(--linea);color:var(--gris);
  font-size:11px;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}
th.ord{cursor:pointer;user-select:none}
th.ord:hover{color:var(--rojo)}
td{padding:9px 10px;border-bottom:1px solid var(--linea);vertical-align:top}
tr:hover td{background:#FAFBFC}
.num{text-align:right;font-variant-numeric:tabular-nums}
.tabla-wrap{overflow-x:auto}
.pill{display:inline-block;padding:2px 9px;border-radius:11px;color:#fff;font-size:11px;font-weight:700;white-space:nowrap}
.tag{display:inline-block;padding:1px 7px;border-radius:4px;background:#EEF1F4;color:var(--gris);
  font-size:11px;margin:1px 3px 1px 0;white-space:nowrap}
.tag-on{background:var(--rojo);color:#fff;font-weight:700}
.dias{font-weight:700;font-variant-numeric:tabular-nums}
.d-ok{color:var(--ok)} .d-aviso{color:var(--aviso)} .d-alerta{color:var(--alerta)}
.barra{height:26px;border-radius:4px;min-width:3px;display:flex;align-items:center;
  padding:0 8px;color:#fff;font-weight:700;font-size:12px}
.emb{display:grid;grid-template-columns:150px 1fr 120px;gap:10px;align-items:center;margin-bottom:7px}
.emb .et{font-weight:700;font-size:13px}
.emb .et small{display:block;font-weight:400;color:var(--gris);font-size:11px;line-height:1.3}
.emb .u{color:var(--gris);font-size:12px;text-align:right}
button.b{background:var(--rojo);color:#fff;border:0;border-radius:6px;padding:9px 16px;
  font-weight:700;font-size:13px;cursor:pointer;font-family:inherit}
button.b:hover{background:var(--rojo-osc)}
button.b.sec{background:#fff;color:var(--negro);border:1px solid var(--linea)}
button.b.sec:hover{background:#F0F2F5}
button.b.chico{padding:5px 10px;font-size:12px;font-weight:600}
button.link{background:none;border:0;color:var(--rojo);cursor:pointer;font-size:12px;
  font-weight:600;padding:2px 5px;font-family:inherit}
button.link:hover{text-decoration:underline}
label{display:block;font-size:12px;font-weight:600;color:var(--gris);margin-bottom:4px}
input[type=text],input[type=number],input[type=date],select,textarea{
  width:100%;padding:8px 10px;border:1px solid var(--linea);border-radius:6px;
  font-size:13px;font-family:inherit;background:#fff;color:var(--negro)}
textarea{resize:vertical;min-height:70px}
input:focus,select:focus,textarea:focus{outline:2px solid var(--rojo);outline-offset:-1px;border-color:var(--rojo)}
.grid{display:grid;gap:13px}
.g2{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.chks{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:5px;
  border:1px solid var(--linea);border-radius:6px;padding:10px;background:#FAFBFC}
.chks label{display:flex;align-items:flex-start;gap:7px;font-weight:400;color:var(--negro);
  font-size:13px;margin:0;cursor:pointer;padding:3px}
.chks input{margin:2px 0 0;width:auto}
.filtros{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px}
.filtros>div{min-width:150px}
.barra-bot{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.modal{position:fixed;inset:0;background:rgba(20,22,26,.55);display:none;z-index:50;
  padding:20px;overflow-y:auto}
.modal.abierto{display:block}
.modal .caja{background:#fff;border-radius:12px;max-width:820px;margin:20px auto;padding:22px}
.modal h2{display:flex;align-items:center}
.modal h2 button{margin-left:auto;background:none;border:0;font-size:24px;
  cursor:pointer;color:var(--gris);line-height:1;font-family:inherit}
.aviso{background:#FFF8E6;border:1px solid #F0D48A;border-radius:8px;padding:11px 14px;
  font-size:13px;margin-bottom:14px}
.vacio{text-align:center;color:var(--gris);padding:34px 14px;font-size:14px}
.hist{font-size:12px;color:var(--gris)}
.hist b{color:var(--negro)}
.det{border-left:3px solid var(--linea);padding-left:12px;margin:10px 0}
.semaforo{background:#F7F9FB;border:1px solid var(--linea);border-radius:8px;
  padding:11px 14px;font-size:13px;margin-top:16px;color:var(--negro)}
.semaforo summary{cursor:pointer;color:var(--gris)}
.semaforo summary:hover{color:var(--rojo)}
.filtro-fuerte{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px;
  background:#FAFBFC;border:1px solid var(--linea);border-radius:8px;padding:12px 14px}
.filtro-fuerte .conteo{flex:1 1 100%;color:var(--gris);font-size:13px;
  border-top:1px solid var(--linea);margin-top:2px;padding-top:9px}
.filtro-fuerte .conteo b{color:var(--negro)}
.ayuda{font-size:12px;color:var(--gris);margin-top:4px}
@media(max-width:700px){.emb{grid-template-columns:1fr}.emb .u{text-align:left}main{padding:14px}}

.legacy-1{margin-top:-6px;margin-bottom:12px}
.legacy-2{flex:1 1 230px;min-width:200px}
.legacy-3{flex:1 1 180px;min-width:160px}
.legacy-4{flex:1 1 200px;min-width:175px}
.legacy-5{flex:0 1 150px;min-width:130px}
.legacy-6{color:var(--aviso)}
.legacy-7{color:var(--alerta)}
.legacy-8{margin-top:-6px;margin-bottom:14px}
.legacy-9{flex:1 1 220px;min-width:190px}
.legacy-10{flex:1 1 200px;min-width:170px}
.legacy-11{flex:0 1 160px;min-width:150px}
.legacy-12{min-width:240px}
.legacy-13{display:none}
.legacy-14{margin-bottom:13px}
.legacy-15{margin-top:12px}
.legacy-16{margin-bottom:16px}
.legacy-17{margin-left:auto;color:var(--alerta)}
[hidden]{display:none!important}
.session-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.session-actions form{margin:0}
.session-actions a{text-decoration:none}.session-actions span{color:inherit}
.server-message{margin:12px auto;max-width:1320px;white-space:pre-line}
.access-card{max-width:480px;margin:48px auto}.account-wrap{max-width:1000px;margin:24px auto}
.access-card h1{font-size:22px}.access-card form p{margin:14px 0}
.errorlist{color:var(--alerta);padding-left:20px}.helptext{display:block;font-size:12px;color:var(--gris)}
.account-form{max-width:500px}.account-wrap form{margin:0}.account-wrap a{color:var(--rojo)}
body.busy{cursor:progress}button:disabled{opacity:.6;cursor:wait}
@media(max-width:600px){.access-card,.account-wrap{margin:20px 12px}.session-actions{width:100%}}
.session-actions a.b{display:inline-block;background:#fff;color:var(--negro);border:1px solid var(--linea);border-radius:6px;padding:9px 16px;font-size:14px;font-weight:600;text-decoration:none}
