:root{--sdd:#0b6b43;--bank:#21a067;--other:#8fd1aa;--doc:#13877c;--grey:#8a99a8;--ink:#142b45;--muted:#5c7187;--border:#dce6f1;--red:#bf304a;--amber:#b66b00;--blue:#2774b5;--green:#18895d}*{box-sizing:border-box}[hidden]{display:none!important}.short{display:none}body{margin:0;background:#eef3f9;color:var(--ink);font:13px/1.4 system-ui,sans-serif}header{background:linear-gradient(115deg,#0e2e54,#1d5793 76%,#2878a6);color:white;padding:20px 14px}.wrap{max-width:1200px;margin:auto}main.wrap{padding:12px}h1{font-size:27px;margin:4px 0}h2{font-size:15px;margin:7px 0}.head{display:flex;align-items:center;justify-content:space-between;gap:15px}button,.button{border:1px solid #becddd;background:white;color:#143e68;padding:9px 12px;border-radius:7px;cursor:pointer;font:inherit;font-weight:650}button:disabled{opacity:.5;cursor:wait}#refresh{background:#fff;color:#133d68;font-size:14px}.banner{border-left:4px solid #d38a1b;background:#fff1d6;padding:9px 12px;border-radius:7px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}.stat{color:white;padding:10px 14px;border-radius:9px;display:flex;align-items:center;gap:10px}.stat strong{font-size:28px}.red{--accent:var(--red)}.amber{--accent:var(--amber)}.blue{--accent:var(--blue)}.green{--accent:var(--green)}.stat{background:var(--accent)}.panel{background:white;padding:10px 13px;margin:10px 0;border:1px solid var(--border);border-radius:9px}pre{font:inherit;white-space:pre-wrap;margin:5px 0}.controls{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0;align-items:center}input,select{font:inherit;padding:8px;border:1px solid #bacddd;border-radius:6px;max-width:100%}#q{flex:1;min-width:200px}.person>h2{border-bottom:2px solid #c8d9e8;padding:10px 0 6px;text-transform:uppercase;letter-spacing:1px}.title{font-weight:700}.meta{font-size:11px;color:var(--muted);display:block}.badge{color:var(--accent);font-weight:750;font-size:11px}.amount{font-weight:750;text-align:right}.detail{padding:10px 14px;border-top:1px solid var(--border);background:#f9fbfd}.detail p{margin:5px 0}.detail form{display:flex;flex-wrap:wrap;gap:8px}.detail input{flex:1;min-width:160px}a{color:#185d99}summary{cursor:pointer}#accounts>div{display:flex;gap:10px;align-items:center;flex-wrap:wrap;border-top:1px solid var(--border);padding:9px 0}footer{color:var(--muted);padding:15px 0}.login{max-width:420px;margin:10vh auto;padding:30px;background:white;border-radius:12px}.login input{display:block;width:100%;margin:10px 0}#utility{display:flex;gap:7px;flex-wrap:wrap;margin:14px 0}.utility{padding:6px;border-top:1px solid var(--border)}@media(max-width:700px){.head{align-items:flex-start;flex-direction:column}h1{font-size:23px}.stats{grid-template-columns:repeat(2,1fr)}.amount{grid-column:2;grid-row:1}.due{grid-column:2;grid-row:2;text-align:right}.badge{grid-column:1/-1}.controls>*{flex:1;min-width:130px}.controls label{font-size:11px}#refresh{width:100%}}
.payment-tabs{display:flex;gap:8px;margin:8px 0 10px}.payment-tabs a{padding:10px 18px;border:1px solid #bacddd;border-radius:8px;text-decoration:none;background:white;font-weight:700}.payment-tabs a.selected{background:#174e79;color:white}
.grey{--accent:var(--grey)}.new{--accent:#6b3fb5}.paid-sdd{--accent:var(--sdd)}.paid-bank{--accent:var(--bank)}.paid-other{--accent:var(--other)}.paid-doc{--accent:var(--doc)}.ignored{--accent:var(--grey)}
.toolbar{display:flex;flex-direction:column;gap:6px;margin:4px 0 2px}.chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.chip-label{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);min-width:62px}
.chip{border-radius:999px;padding:7px 12px;font-weight:600;display:inline-flex;gap:7px;align-items:center;min-height:36px}.chip b{background:#e3ecf6;border-radius:999px;padding:1px 7px;font-size:11px}.chip.on{background:#174e79;color:white;border-color:#174e79}.chip.on b{background:rgba(255,255,255,.25);color:white}
.stats{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;color:var(--muted);margin:4px 0 10px}.dot{display:inline-block;width:12px;height:12px;border-radius:3px;background:var(--accent);margin-right:-8px}
.filters>summary{font-weight:650}.filters .controls{margin:10px 0 2px}
.person>h2{margin-top:14px}.empty{color:var(--muted);margin:6px 2px}
.payment{border:1px solid var(--border);border-left:6px solid var(--accent);border-radius:8px;background:white;margin:6px 0;overflow:hidden;transition:opacity .35s,transform .35s,height .35s,margin .35s}
.payment.paid-sdd,.payment.paid-bank,.payment.paid-other,.payment.paid-doc{background:color-mix(in srgb,var(--accent) 9%,white)}.payment.ignored{background:#f4f6f8;color:#55636f}
.row-main{display:grid;grid-template-columns:minmax(200px,1fr) 110px 120px 150px 92px;gap:10px;align-items:center;padding:9px 11px 4px}
.title>span:first-child{font-weight:700;overflow-wrap:anywhere}.new-badge{display:inline-block;margin-left:6px;background:#6b3fb5;color:white;border-radius:4px;padding:1px 5px;font-size:10px;font-weight:800;vertical-align:1px}
.meta{font-size:11px;color:var(--muted);display:block}.amount{font-weight:750;text-align:right}.due{color:var(--muted);font-size:12px}.badge{color:var(--accent);font-weight:750;font-size:11.5px}.paid-other .badge{color:#2d7a50}.toggle{padding:6px 8px;font-size:12px}
.quick-actions{display:flex;flex-wrap:wrap;gap:5px;padding:4px 11px 9px}.quick-actions button{font-size:12px;padding:7px 10px;min-height:36px}
.quick-actions .paid-sdd{background:var(--sdd);border-color:var(--sdd);color:white}.quick-actions .paid-bank{background:var(--bank);border-color:var(--bank);color:white}.quick-actions .paid-other{background:var(--other);border-color:#6cbf8f;color:#0d4a2c}
.quick-actions .verify{background:#fff3d8;border-color:#e7c57a;color:#7b4c00}.quick-actions .domiciled{background:#edf4fc;color:#174e79}.quick-actions .ignore{background:#f1f3f5;color:#55636f;border-color:#cfd6dd}
.payment.leaving{opacity:.55;transform:translateX(18px)}.payment.collapse{opacity:0;margin:0;border-width:0}
.detail{padding:10px 14px;border-top:1px solid var(--border);background:#f9fbfd}.detail p{margin:5px 0}.detail .note{white-space:pre-wrap;max-height:220px;overflow:auto;background:white;border:1px solid var(--border);border-radius:6px;padding:7px}.detail form{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}.detail input{flex:1;min-width:160px}
#action-status:empty{display:none}#action-status:not(:empty){position:sticky;top:6px;z-index:5;background:#e7f5ed;padding:10px;border-radius:7px;border-left:4px solid var(--sdd);box-shadow:0 2px 8px rgba(0,0,0,.08)}#action-status.bad{background:#fde8ec;border-left-color:var(--red)}
#accounts small{display:block;color:#5c7187}
@media(max-width:760px){.row-main{grid-template-columns:1fr auto;gap:3px 10px;padding:9px 10px 4px}.title{grid-column:1;grid-row:1/3}.amount{grid-column:2;grid-row:1}.due{grid-column:2;grid-row:2;text-align:right}.badge{grid-column:1;grid-row:3}.toggle{grid-column:2;grid-row:3;justify-self:end}
.quick-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:4px 10px 10px}.quick-actions button{min-height:44px;font-size:12.5px;padding:6px 4px}.quick-actions .full{display:none}.quick-actions .short{display:inline}.quick-actions .paid-other{grid-column:auto}.chip{min-height:40px}.chip-label{min-width:100%}.stats{grid-template-columns:repeat(2,1fr)}}

.teal{--accent:var(--doc)}.receipt{--accent:var(--doc)}
.payment.verified{border:2px solid var(--doc);border-left:6px solid var(--doc);box-shadow:0 0 0 3px color-mix(in srgb,var(--doc) 14%,transparent)}
.ok-badge{display:inline-block;margin-left:6px;background:var(--doc);color:white;border-radius:4px;padding:1px 6px;font-size:10px;font-weight:800;vertical-align:1px}
.evidence{margin:2px 11px 4px;padding:8px 10px;background:color-mix(in srgb,var(--doc) 10%,white);border-radius:7px;border:1px solid color-mix(in srgb,var(--doc) 35%,white)}.evidence p{margin:0 0 6px}
.evidence-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.evidence-actions .paid-doc{background:var(--doc);border-color:var(--doc);color:white;min-height:38px}.evidence-actions .ignore{background:#f1f3f5;color:#55636f}
.payment-tabs{flex-wrap:wrap}
@media(max-width:760px){.payment-tabs a{padding:10px 12px;flex:1;text-align:center}.evidence-actions{display:grid;grid-template-columns:1fr 1fr}.evidence-actions .paid-doc{grid-column:1/-1;min-height:46px}.evidence-actions button{min-height:44px}.evidence-actions a{text-align:center;align-self:center}}