:root{
  --bg:#f4f6f9;--card:#fff;--tx:#18212f;--mut:#667085;--line:#e3e8ef;
  --pri:#0b63b6;--pri-tx:#fff;--head:#0b4f91;
  --ok-bg:#d3f2d9;--ok-tx:#0a5c1f;--wa-bg:#fff0b3;--wa-tx:#7a5600;--er-bg:#ffd6d9;--er-tx:#9b1c1c;
  --in-bg:#dbeafe;--in-tx:#1e4fa0;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#10151c;--card:#19212c;--tx:#e8edf3;--mut:#9aa6b6;--line:#2a3544;
  --pri:#4a9be8;--pri-tx:#06121f;--head:#0b2a4a;
  --ok-bg:#12351d;--ok-tx:#8de0a2;--wa-bg:#3d3210;--wa-tx:#f2cf6b;--er-bg:#431a1d;--er-tx:#ffa3a8;
  --in-bg:#15294a;--in-tx:#9cc3ff;
}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--tx);font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--pri);text-decoration:none}a:hover{text-decoration:underline}
.top{background:var(--head);color:#fff;display:flex;align-items:center;gap:14px;padding:0 16px;flex-wrap:wrap;position:sticky;top:0;z-index:20}
.top .marca{font-weight:700;padding:12px 0;color:#fff}
.top nav{display:flex;gap:2px;flex-wrap:wrap;flex:1}
.top nav a{color:#dbe8f7;padding:12px 10px;font-size:14px;display:block}
.top nav a.act,.top nav a:hover{background:rgba(255,255,255,.15);color:#fff;text-decoration:none}
.top .quien{font-size:13px;color:#dbe8f7;display:flex;gap:10px;align-items:center}
.top .quien button{background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff;border-radius:6px;padding:4px 10px;cursor:pointer}
.wrap{max-width:1250px;margin:0 auto;padding:18px 16px 60px}
h1{font-size:22px;margin:4px 0 14px}h2{font-size:17px;margin:22px 0 10px}h3{font-size:15px;margin:0 0 8px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:16px}
.grid{display:grid;gap:12px}.g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:16px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;display:block;color:var(--tx)}
.kpi:hover{text-decoration:none;border-color:var(--pri)}
.kpi b{display:block;font-size:30px;line-height:1.1}.kpi span{color:var(--mut);font-size:13px}
.kpi.rojo b{color:var(--er-tx)}.kpi.amar b{color:var(--wa-tx)}.kpi.verde b{color:var(--ok-tx)}
.flash{padding:10px 14px;border-radius:10px;margin-bottom:12px}
.flash.ok{background:var(--ok-bg);color:var(--ok-tx)}.flash.error{background:var(--er-bg);color:var(--er-tx)}
table{width:100%;border-collapse:collapse;background:var(--card)}
th,td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
th{background:var(--head);color:#fff;font-size:13px;white-space:nowrap}
tr:hover td{background:rgba(11,99,182,.05)}
.tabla{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.tabla table{min-width:760px}.tabla th:first-child{border-top-left-radius:11px}.tabla th:last-child{border-top-right-radius:11px}
.num{text-align:right;white-space:nowrap}
.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}
.b-vig,.b-activa{background:var(--ok-bg);color:var(--ok-tx)}
.b-por,.b-sin_codigo{background:var(--wa-bg);color:var(--wa-tx)}
.b-venc,.b-caida,.b-otro{background:var(--er-bg);color:var(--er-tx)}
.b-info{background:var(--in-bg);color:var(--in-tx)}.b-gris{background:var(--line);color:var(--mut)}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}
.chip{padding:5px 12px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--tx);font-size:13px}
.chip.act{background:var(--pri);color:var(--pri-tx);border-color:var(--pri)}.chip:hover{text-decoration:none;border-color:var(--pri)}
.app-chip{display:inline-block;background:var(--in-bg);color:var(--in-tx);border-radius:6px;padding:0 6px;font-size:12px;margin:1px 2px 1px 0}
.app-chip.sin{background:var(--er-bg);color:var(--er-tx)}.app-chip.nuevo{background:var(--ok-bg);color:var(--ok-tx)}.app-chip.leg{background:var(--line);color:var(--mut)}
form.fila{display:flex;gap:8px;flex-wrap:wrap;align-items:end;margin-bottom:12px}
label{display:block;font-size:13px;color:var(--mut);margin-bottom:3px}
input,select,textarea{font:inherit;color:var(--tx);background:var(--card);border:1px solid var(--line);border-radius:8px;padding:8px 10px;max-width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--pri);outline-offset:-1px}
textarea{width:100%;min-height:90px}
.btn{display:inline-block;background:var(--pri);color:var(--pri-tx);border:0;border-radius:8px;padding:8px 14px;font:inherit;font-weight:600;cursor:pointer}
.btn:hover{filter:brightness(1.08);text-decoration:none}
.btn.sec{background:transparent;color:var(--pri);border:1px solid var(--pri)}
.btn.rojo{background:var(--er-tx);color:#fff}.btn.sm{padding:4px 10px;font-size:13px}
.mut{color:var(--mut)}.peq{font-size:13px}
.msg{white-space:pre-wrap;background:var(--bg);border:1px dashed var(--line);border-radius:10px;padding:12px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.venta-item{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;align-items:start;margin-bottom:10px;padding:10px;border:1px solid var(--line);border-radius:10px}
.venta-item .c-x{align-self:end}
.venta-item .c-plat{grid-column:span 2}
@media(max-width:560px){.venta-item{grid-template-columns:1fr}}
.aviso{border-left:4px solid var(--wa-tx);background:var(--wa-bg);color:var(--wa-tx);padding:10px 14px;border-radius:8px;margin-bottom:12px}
.aviso.rojo{border-color:var(--er-tx);background:var(--er-bg);color:var(--er-tx)}
.login{max-width:360px;margin:12vh auto}
.pie{color:var(--mut);font-size:12px;text-align:center;margin-top:30px}
#banner{display:none;position:fixed;bottom:14px;left:50%;transform:translateX(-50%);background:var(--pri);color:var(--pri-tx);padding:10px 16px;border-radius:999px;box-shadow:0 4px 18px rgba(0,0,0,.25);cursor:pointer;z-index:50}

details.rep{display:inline-block;position:relative}
details.rep>summary{list-style:none;cursor:pointer}
details.rep>summary::-webkit-details-marker{display:none}
details.rep[open]>.rep-box{position:fixed;top:18%;left:50%;transform:translateX(-50%);z-index:50;width:min(380px,92vw);background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px;box-shadow:0 8px 24px rgba(0,0,0,.25);text-align:left}
.rep-box label{display:block;margin-top:6px}