:root{--f-display:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;--f-body:"IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;
--brand:#1f5fbf;--brand-d:#174a96;--brand-l:#e8f0fc;--orange:#f08a24;--orange-l:#fff1e3;--navy:#13213c;--ink:#14213d;--muted:#5d6678;--line:#e1e5ee;--bg:#f4f6fa;--ok:#15803d;--ok-l:#e7f6ec;--bad:#b91c1c}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;font:15px/1.5 var(--f-body);background:var(--bg);color:var(--ink);padding-bottom:env(safe-area-inset-bottom)}
header{background:var(--navy);color:#fff;border-bottom:4px solid var(--orange);position:sticky;top:0;z-index:5}
header .in{max-width:900px;margin:0 auto;padding:12px 16px 0;padding-top:max(12px,env(safe-area-inset-top))}
.logo{font:800 20px var(--f-display)}.logo span{color:var(--orange)}
.lema{color:#b9c4d8;font-size:13px}
nav{display:flex;gap:4px;margin-top:8px}
nav button{flex:1;background:none;border:0;color:#b9c4d8;font:600 14px var(--f-body);padding:8px 3px 10px;border-bottom:3px solid transparent;cursor:pointer}
nav button.on{color:#fff;border-bottom-color:var(--orange)}
nav b{background:var(--orange);color:#fff;border-radius:999px;font-size:11px;padding:1px 6px;margin-left:3px}
main{max-width:900px;margin:0 auto;padding:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:14px;box-shadow:0 1px 3px rgba(19,33,60,.05)}
h2{font:800 19px var(--f-display);margin:0 0 6px}h3{font:700 17px var(--f-display);margin:0 0 8px}
.sub{color:var(--muted);font-size:13.5px;margin:4px 0}
label{display:block;font-weight:600;font-size:13px;margin:10px 0 0}
input,select,textarea{display:block;width:100%;margin-top:4px;font:15px var(--f-body);padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--brand);border-color:var(--brand)}
.chk{display:flex;gap:8px;align-items:center}.chk input{width:auto;margin:0}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.btn{display:inline-block;border:0;border-radius:10px;background:var(--brand);color:#fff;font:600 14px var(--f-body);padding:9px 14px;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn:hover{background:var(--brand-d)}.btn:disabled{opacity:.6}
.btn.grande{display:block;width:100%;margin-top:14px;padding:14px;font-size:16px;background:var(--orange)}
.btn.grande:hover{background:#d97716}
.btn.sec{background:var(--brand-l);color:var(--brand-d);margin-top:10px}
code{background:var(--brand-l);padding:1px 5px;border-radius:5px;font-size:13px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:12px}
.kpi{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px}
.kpi b{display:block;font:800 22px var(--f-display);color:var(--navy)}.kpi span{font-size:12.5px;color:var(--muted)}
.kpi.warn{background:var(--orange-l);border-color:#f6cf9f}.kpi.bad{background:#fdecec;border-color:#f5c2c2}.kpi.bad b{color:var(--bad)}
.filtros{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}.filtros select{width:auto;margin:0}
.chips{display:flex;gap:6px;overflow-x:auto}.chips button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;font:600 13px var(--f-body);color:var(--muted);cursor:pointer;white-space:nowrap}
.chips button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.vacio{text-align:center;color:var(--muted);padding:40px 16px;background:#fff;border:1px dashed var(--line);border-radius:16px}
.fac{background:#fff;border:1px solid var(--line);border-left:4px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:10px;cursor:pointer}
.fac:hover{border-color:var(--brand)}.fac.recue{border-left-color:var(--orange)}.fac.validee{border-left-color:var(--brand)}.fac.payee{border-left-color:var(--ok)}.fac.litige{border-left-color:var(--bad)}
.fila{display:flex;justify-content:space-between;align-items:center;gap:10px}
.prov{font:700 16px var(--f-display)}.mt{text-align:right}.mt b{font:700 16px var(--f-display);white-space:nowrap}
.pie2{margin-top:8px;justify-content:flex-start;flex-wrap:wrap;font-size:13px}.st{font-weight:600}.src{color:var(--muted)}
.ech{color:var(--muted)}.ech.urg{color:var(--bad);font-weight:600}
.btn.grande.alt{background:var(--brand);text-align:center}.btn.grande.alt:hover{background:var(--brand-d)}
.leyendo{margin-top:10px;padding:10px;border-radius:10px;background:var(--brand-l);color:var(--brand-d);font-weight:600;animation:lat 1s infinite alternate}
@keyframes lat{from{opacity:.6}to{opacity:1}}
.dlist{padding-left:18px;margin:8px 0}.dlist li{margin:4px 0}
table{width:100%;border-collapse:collapse;margin:10px 0;font-size:14px}td,th{padding:7px 6px;border-bottom:1px solid var(--line);text-align:left}td:last-child,th:last-child{text-align:right}
th{color:var(--muted);font-weight:600;font-size:12.5px}.tot td{font-weight:700}
.cuenta{font-size:15px;background:var(--orange-l);border-color:#f6cf9f}.cuenta b{font:800 28px var(--f-display);color:var(--navy)}
.crono{padding-left:20px}.crono li{margin:8px 0}.crono li.hecho{color:var(--muted)}
.tit{margin:18px 0 10px}
.pill{background:var(--orange-l);color:#a35a0c;border-radius:999px;padding:2px 10px;font-weight:700;font-size:13px}.pill.ok{background:var(--ok-l);color:var(--ok)}
.tres{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.modal{position:fixed;inset:0;background:rgba(19,33,60,.45);z-index:20;display:flex;align-items:flex-end;justify-content:center}
.modal .caja{background:#fff;width:100%;max-width:560px;max-height:92vh;overflow:auto;border-radius:20px 20px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom))}
@media(min-width:700px){.modal{align-items:center}.modal .caja{border-radius:20px}}
.x{border:0;background:var(--bg);border-radius:50%;width:34px;height:34px;font-size:16px;cursor:pointer}
.sts{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}.sts button{flex:1 1 40%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px;font:600 14px var(--f-body);cursor:pointer}
.sts button.on{background:var(--navy);color:#fff;border-color:var(--navy)}
#aviso{position:fixed;left:50%;bottom:24px;transform:translate(-50%,80px);background:var(--navy);color:#fff;padding:10px 16px;border-radius:999px;font-weight:600;transition:.3s;z-index:30;max-width:90vw}
#aviso.on{transform:translate(-50%,0)}
@media(max-width:700px){.kpis{grid-template-columns:1fr 1fr}.kpi b{font-size:19px}}