:root{
  --azul:#005597; --azul-osc:#0a3540; --teal:#0f4c5c; --rojo:#AF0D1E; --verde:#1f8a4c; --ambar:#b7791f;
  --fondo:#f4f6f9; --tarjeta:#fff; --linea:#e2e8f0; --texto:#172126; --suave:#5b6773;
  --radio:10px; --sombra:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.08);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;font:15px/1.45 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--fondo);color:var(--texto)}
a{color:var(--azul);text-decoration:none}
h1{font-size:22px;margin:0 0 4px} h2{font-size:17px;margin:0 0 12px} h3{font-size:15px;margin:0 0 8px}
.top{background:var(--azul-osc);color:#fff;display:flex;align-items:center;gap:22px;padding:10px 20px;position:sticky;top:0;z-index:20}
.top img{height:30px}
.top nav{display:flex;gap:4px;flex:1;flex-wrap:wrap}
.top nav a{color:#cfe3ee;padding:7px 12px;border-radius:8px;font-weight:500}
.top nav a.act,.top nav a:hover{background:rgba(255,255,255,.12);color:#fff}
.top .yo{font-size:13px;color:#cfe3ee;text-align:right}
.top .yo a{color:#fff;opacity:.8}
.demo{background:#fff4d6;color:#7a5a00;text-align:center;font-size:13px;padding:5px}
main{max-width:1240px;margin:0 auto;padding:22px 18px 60px}
.tarjeta{background:var(--tarjeta);border:1px solid var(--linea);border-radius:var(--radio);box-shadow:var(--sombra);padding:18px;margin-bottom:16px}
.fila{display:flex;gap:16px;flex-wrap:wrap}
.fila>*{flex:1;min-width:220px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:16px 0}
.kpi{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:14px 16px;box-shadow:var(--sombra)}
.kpi b{display:block;font-size:22px;margin-top:2px}
.kpi span{color:var(--suave);font-size:13px}
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--linea);background:#fff;color:var(--texto);padding:8px 14px;border-radius:8px;font:inherit;font-weight:600;cursor:pointer;white-space:nowrap}
.btn:hover{border-color:#b9c4d0}
.btn.pri{background:var(--azul);border-color:var(--azul);color:#fff}
.btn.pri:hover{background:#00467d}
.btn.rojo{color:var(--rojo)}
.btn.chico{padding:5px 10px;font-size:13px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
label{display:block;font-size:13px;font-weight:600;color:var(--suave);margin-bottom:4px}
input,select,textarea{width:100%;font:inherit;padding:8px 10px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:var(--texto)}
input:focus,select:focus,textarea:focus{outline:2px solid #9cc3e4;border-color:var(--azul)}
.campos{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.campos .ancho{grid-column:span 2}
table{width:100%;border-collapse:collapse}
th{font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--suave);text-align:left;padding:8px;border-bottom:2px solid var(--linea);background:#f8fafc}
td{padding:8px;border-bottom:1px solid var(--linea);vertical-align:middle}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
tr.cap td{background:#eef4fa;font-weight:700;color:var(--azul-osc)}
.chip{display:inline-block;padding:2px 9px;border-radius:99px;font-size:12px;font-weight:600}
.e-borrador{background:#eef2f7;color:#475569}.e-enviado{background:#e0efff;color:#00467d}
.e-aprobado{background:#dcf5e6;color:#14663a}.e-perdido{background:#fde4e6;color:#8f0a18}
.filtros{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.filtros a{padding:6px 12px;border-radius:99px;border:1px solid var(--linea);background:#fff;color:var(--texto);font-size:13px}
.filtros a.act{background:var(--azul);color:#fff;border-color:var(--azul)}
.filtros form{margin-left:auto;display:flex;gap:6px}
.filtros input{width:240px}
.flash{background:#e8f3ff;border:1px solid #b6d6f5;color:#0b3f6b;padding:10px 14px;border-radius:8px;margin-bottom:14px}
.alerta{border-radius:8px;padding:10px 14px;margin-bottom:8px;font-size:14px}
.alerta.err{background:#fdecee;border:1px solid #f5c2c7;color:#8f0a18}
.alerta.av{background:#fff7e6;border:1px solid #f6d79a;color:#7a5200}
.alerta.ok{background:#e9f8ef;border:1px solid #b5e3c6;color:#14663a}
.alerta ul{margin:6px 0 0 18px;padding:0}
.grid-ed{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
.lateral{position:sticky;top:70px}
.tot div{display:flex;justify-content:space-between;padding:5px 0;font-variant-numeric:tabular-nums}
.tot .grande{border-top:2px solid var(--texto);margin-top:6px;padding-top:9px;font-size:20px;font-weight:800;color:var(--azul)}
.tot .gris{color:var(--suave);font-size:13px}
.ed input.num{width:84px;text-align:right;padding:5px 7px}
.ed input.num::placeholder{color:var(--texto);opacity:.8}
.ed input.desc{border-color:transparent;background:transparent;padding:5px 6px}
.ed input.desc:hover,.ed input.desc:focus{border-color:#cbd5e1;background:#fff}
.ed .manual{background:#fff7e6;border-color:#f6d79a}
.ed .dif{background:#fff7e6;border-color:#e3a33c}
.ed .calc{font-size:11px;color:var(--suave);display:block;text-align:right}
.ed td.x{width:30px;text-align:center}
.ed td.x button{border:0;background:none;color:#94a3b8;cursor:pointer;font-size:18px}
.ed td.x button:hover{color:var(--rojo)}
.buscador{position:relative}
.sugerencias{position:absolute;left:0;right:0;top:100%;background:#fff;border:1px solid var(--linea);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.12);max-height:320px;overflow:auto;z-index:30;display:none}
.sugerencias div{padding:8px 12px;cursor:pointer;border-bottom:1px solid #f1f5f9;font-size:14px}
.sugerencias div:hover,.sugerencias div.sel{background:#eef4fa}
.sugerencias small{color:var(--suave)}
.plantillas{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.plantillas label{border:2px solid var(--linea);border-radius:10px;padding:14px;cursor:pointer;color:var(--texto);font-size:15px;margin:0;background:#fff}
.plantillas input{display:none}
.plantillas label:has(input:checked){border-color:var(--azul);background:#eef4fa}
.plantillas small{display:block;color:var(--suave);font-weight:400;margin-top:3px}
.medidas{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.unidad{display:flex;align-items:center;gap:6px}
.unidad span{color:var(--suave);font-size:13px;min-width:28px}
.sino{display:flex;gap:8px}
.sino label{flex:1;border:1px solid #cbd5e1;border-radius:8px;padding:8px;text-align:center;cursor:pointer;margin:0;color:var(--texto)}
.sino input{display:none}
.sino label:has(input:checked){background:var(--azul);color:#fff;border-color:var(--azul)}
.acciones{display:flex;gap:8px;flex-wrap:wrap}
.muted{color:var(--suave);font-size:13px}
.vacia{text-align:center;color:var(--suave);padding:30px}
.login{max-width:380px;margin:9vh auto;background:#fff;border-radius:14px;box-shadow:0 10px 40px rgba(10,53,64,.15);overflow:hidden}
.login .cab{background:var(--azul-osc);padding:26px;text-align:center}
.login .cab img{height:42px}
.login form{padding:24px;display:grid;gap:14px}
.guardando{font-size:13px;color:var(--suave)}
@media (max-width:900px){
  .grid-ed{grid-template-columns:minmax(0,1fr)}.lateral{position:static}
  .campos{grid-template-columns:minmax(0,1fr)}
  main{padding:16px 12px 50px}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .campos .ancho{grid-column:auto}
  .filtros form{margin-left:0;width:100%}.filtros input{flex:1;width:auto}
  .top{flex-wrap:wrap;gap:8px}
  .tabla-scroll{overflow-x:auto}
}