:root{--bg:#f4f5f7;--card:#fff;--ink:#111827;--muted:#6b7280;--line:#e5e7eb;--brand:#111827;--ok:#047857;--warn:#b45309;--bad:#b91c1c;--cash:#9d174d;--exp:#d97706}
*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-size:14px;color:var(--ink);background:var(--bg)}
a{color:inherit}header.top{background:var(--brand);color:#fff;display:flex;align-items:center;gap:18px;padding:0 16px;position:sticky;top:0;z-index:10;overflow-x:auto}
.brand{font-weight:800;letter-spacing:.3px;text-decoration:none;padding:12px 0;white-space:nowrap}.brand span{color:#9ca3af;font-weight:500;margin-left:3px}
header.top nav{display:flex;gap:2px;flex:1}header.top nav a{color:#d1d5db;text-decoration:none;padding:14px 10px;font-weight:600;border-bottom:2px solid transparent;white-space:nowrap;position:relative}
header.top nav a.on,header.top nav a:hover{color:#fff;border-bottom-color:#fff}.badge{background:#ef4444;color:#fff;border-radius:999px;font-size:10px;padding:1px 6px;margin-left:5px;vertical-align:top}
.logout{color:#9ca3af;text-decoration:none;font-size:12px;white-space:nowrap}main{max-width:1180px;margin:0 auto;padding:16px}
.pagehead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:4px 0 14px;flex-wrap:wrap}.pagehead h1{font-size:20px;margin:0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-bottom:14px}.cards.four{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 14px}.card .k{font-size:12px;color:var(--muted)}.card .v{font-size:22px;font-weight:700;margin-top:2px}.card .s{font-size:12px;color:var(--muted);margin-top:3px}
.card.good .v{color:var(--ok)}.card.bad .v{color:var(--bad)}
.panel{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:14px}.panel h2{font-size:14px;margin:0 0 10px}.panel.scroll{overflow-x:auto}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:800px){.grid2{grid-template-columns:1fr}}
.grid2form{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px}@media(max-width:700px){.grid2form{grid-template-columns:1fr}}
table{width:100%;border-collapse:collapse;font-size:13px}th,td{text-align:left;padding:7px 6px;border-bottom:1px solid var(--line);vertical-align:top}th{color:var(--muted);font-size:12px;font-weight:600;white-space:nowrap}
td.r,th.r{text-align:right;white-space:nowrap}tr.click{cursor:pointer}tr.click:hover{background:#fafafa}tr.tot td{font-weight:700;border-top:2px solid var(--ink)}tr.cathead td{background:#f9fafb;font-weight:700}
tr.dim{opacity:.55}.pos{color:var(--ok)}.neg{color:var(--bad)}.muted{color:var(--muted);font-size:12px}
.tag{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;background:#f3f4f6;color:#374151}
.tag.paid,.tag.ongoing,.tag.received{background:#d1fae5;color:var(--ok)}.tag.issued,.tag.onboarding{background:#fef3c7;color:var(--warn)}.tag.overdue,.tag.lost{background:#fee2e2;color:var(--bad)}
.tag.draft{background:#e0e7ff;color:#3730a3}.tag.void,.tag.paused{background:#f3f4f6;color:var(--muted)}.tag.cash{background:#fce7f3;color:var(--cash)}.tag.invoice,.tag.invoiced{background:#e0f2fe;color:#075985}.tag.staff{background:#ede9fe;color:#5b21b6}.tag.occasional,.tag.one_off{background:#f3f4f6;color:#374151}
input,select,textarea{font:inherit;padding:8px 10px;border:1px solid #d1d5db;border-radius:8px;background:#fff;width:100%}input.amt{width:120px;text-align:right}label{display:block;font-size:12px;color:var(--muted);margin-bottom:8px}label input,label select,label textarea{margin-top:3px;display:block}
label.check{display:flex;align-items:center;gap:6px;color:var(--ink);font-size:13px}label.check input{width:auto;margin:0}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:8px}.row>*{flex:1 1 140px}.row .grow{flex:3 1 220px}.row.end{justify-content:flex-end}.row.end>*{flex:0 0 auto}.row form.inline,.inline{display:inline-flex;gap:6px;align-items:center;flex:0 0 auto}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}.btn{font:inherit;font-weight:600;padding:8px 14px;border-radius:8px;border:1px solid #d1d5db;background:#fff;cursor:pointer;text-decoration:none;color:var(--ink);white-space:nowrap;display:inline-block}
.btn.p{background:var(--brand);color:#fff;border-color:var(--brand)}.btn.sm{padding:5px 10px;font-size:12px}.btn.danger{color:var(--bad)}button.x{border:0;background:none;cursor:pointer;color:var(--muted);font-size:14px}
.filters{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:10px}.filters a{font-size:12px;padding:5px 11px;border-radius:999px;border:1px solid #d1d5db;background:#fff;text-decoration:none}.filters a.on{background:var(--brand);color:#fff;border-color:var(--brand)}.filters a .muted{color:inherit;opacity:.7}.filters .right{margin-left:auto}
.flash{padding:10px 14px;border-radius:8px;margin-bottom:12px;background:#d1fae5;color:var(--ok)}.flash.err{background:#fee2e2;color:var(--bad)}.flash.warn{background:#fef3c7;color:var(--warn)}
.todo{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}.todo:last-child{border:0}
.chart{display:flex;gap:6px;align-items:flex-end;height:190px;padding-top:10px}.chart .col{flex:1;display:flex;flex-direction:column;align-items:stretch;height:100%;text-decoration:none;color:inherit}.chart .bars{flex:1;display:flex;gap:2px;align-items:flex-end}
.chart .stack{flex:1;display:flex;flex-direction:column-reverse;border-radius:3px 3px 0 0;overflow:hidden;min-height:2px}.chart .stack .inv{background:#111827}.chart .stack .cash{background:var(--cash)}.chart .exp{flex:1;background:var(--exp);border-radius:3px 3px 0 0;opacity:.85}
.chart .lbl{font-size:11px;color:var(--muted);text-align:center;margin-top:4px}.chart .val{font-size:10px;color:var(--ok);text-align:center}.chart .val.neg{color:var(--bad)}
.legend{font-size:12px;color:var(--muted);margin-top:8px}.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin:0 3px 0 8px}.legend i.inv{background:#111827}.legend i.cash{background:var(--cash)}.legend i.exp{background:var(--exp)}
table.mini td.bar{width:40%}table.mini td.bar i{display:block;height:8px;background:#111827;border-radius:4px}
table.lines td{padding:3px;border:0}.totals{text-align:right;margin:8px 0}
.tx{padding:10px 14px}.txhead{display:flex;gap:12px;align-items:flex-start}.txhead .date{flex:0 0 120px;white-space:nowrap}.txhead .desc{flex:1}.txhead .amt{flex:0 0 auto;font-weight:700;font-size:15px}.tx.in{border-left:4px solid var(--ok)}.tx.out{border-left:4px solid var(--line)}
.why{font-size:12px;color:var(--warn);margin:6px 0}.txform .row{margin-bottom:4px}
details.ret{border-top:1px solid var(--line);padding:8px 0}details.ret summary{cursor:pointer}details.panel summary{cursor:pointer}
tr.editrow{display:none}tr.editrow.show{display:table-row}.inline-edit{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.inline-edit input,.inline-edit select{width:auto;flex:1 1 120px}
body.login{display:flex;align-items:center;justify-content:center;min-height:100vh}.loginbox{background:#fff;border:1px solid var(--line);border-radius:12px;padding:28px;width:340px}.loginbox h1{margin:0 0 16px;font-size:22px}.loginbox h1 span{color:var(--muted);font-weight:500;margin-left:3px}.loginbox .btn{width:100%;margin-top:6px}
@media(max-width:700px){main{padding:10px}.txhead{flex-wrap:wrap}.txhead .date{flex-basis:100%}}
