/* Layout: tabbed ledger tool — summary strip over a register; editor pairs a form with a live paper preview */
:root{
  --bg:#F3F5F6; --surface:#FFFFFF; --sunk:#EBEFF1; --ink:#15212B; --muted:#5A6774; --line:#D9DFE4;
  --accent:#11636F; --accent-ink:#FFFFFF; --accent-soft:#DCEDEF;
  --paid:#1C7C4A; --paid-bg:#DFF1E6; --sent:#9A6200; --sent-bg:#FBEFD6; --over:#B4302A; --over-bg:#FADFDC; --draft:#5A6774; --draft-bg:#E6EAED;
  --paper:#FFFFFF; --paper-ink:#15212B; --paper-muted:#5A6774; --paper-line:#DDE2E6; --paper-band:#EEF2F4;
  --f-display:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;
  --f-body:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --r:8px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0E1417; --surface:#162026; --sunk:#1C2830; --ink:#E4EAEE; --muted:#93A1AC; --line:#2A3740;
  --accent:#4FB4C1; --accent-ink:#082126; --accent-soft:#17343A;
  --paid:#5CCB91; --paid-bg:#173326; --sent:#E3B24E; --sent-bg:#352A12; --over:#F27D72; --over-bg:#3C1D1A; --draft:#A3B0BA; --draft-bg:#25313A;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0E1417; --surface:#162026; --sunk:#1C2830; --ink:#E4EAEE; --muted:#93A1AC; --line:#2A3740;
  --accent:#4FB4C1; --accent-ink:#082126; --accent-soft:#17343A;
  --paid:#5CCB91; --paid-bg:#173326; --sent:#E3B24E; --sent-bg:#352A12; --over:#F27D72; --over-bg:#3C1D1A; --draft:#A3B0BA; --draft-bg:#25313A;
  color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font:15px/1.5 var(--f-body);padding-inline:16px;padding-block:0 48px}
.wrap{max-width:1240px;margin-inline:auto}
h1,h2,h3{font-family:var(--f-display);text-wrap:balance;margin:0;letter-spacing:-.01em}
.num,.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line);margin-inline:-16px;padding:12px 16px}
.top .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.brand{display:flex;align-items:baseline;gap:10px;margin-right:auto;min-width:0}
.brand b{font-family:var(--f-display);font-size:20px;font-weight:700}
.brand span{color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
nav{display:flex;gap:4px;flex-wrap:wrap}
nav button{background:none;border:0;padding:7px 12px;border-radius:999px;cursor:pointer;color:var(--muted);font-weight:500}
nav button:hover{color:var(--ink);background:var(--sunk)}
nav button[aria-current="page"]{background:var(--ink);color:var(--bg)}

.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface);padding:8px 14px;border-radius:var(--r);cursor:pointer;font-weight:500;white-space:nowrap}
.btn:hover{border-color:var(--muted)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.primary:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent}
.btn.danger{color:var(--over)}
.btn.danger.armed{background:var(--over);border-color:var(--over);color:#fff}
.btn:disabled{opacity:.5;cursor:not-allowed}
.link{background:none;border:0;padding:0;color:var(--accent);cursor:pointer;font-weight:500}

main{padding-top:24px}
.banner{background:var(--sent-bg);color:var(--sent);border-radius:var(--r);padding:10px 14px;margin-bottom:16px;font-size:14px}
.page-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:12px;margin-bottom:18px}
.page-head h1{font-size:28px}
.page-head p{margin:2px 0 0;color:var(--muted)}

.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:22px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;min-width:0}
.stat .k{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600}
.stat .v{font-family:var(--f-mono);font-size:22px;font-weight:500;margin-top:4px;overflow-wrap:anywhere}
.stat .s{font-size:13px;color:var(--muted)}
.stat.over .v{color:var(--over)}
@media (max-width:640px){.stats{grid-template-columns:1fr}}

.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:transparent;border-radius:999px;padding:4px 12px;font-size:13px;cursor:pointer;color:var(--muted)}
.chip[aria-pressed="true"]{border-color:var(--ink);color:var(--ink);font-weight:600}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);min-width:0}
.scroll{overflow-x:auto}
table.reg{width:100%;border-collapse:collapse;min-width:640px}
.reg th{text-align:left;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:10px 14px;border-bottom:1px solid var(--line)}
.reg td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.reg tr:last-child td{border-bottom:0}
.reg tbody tr{cursor:pointer}
.reg tbody tr:hover td{background:var(--sunk)}
.reg .r{text-align:right}
.reg .sub{color:var(--muted);font-size:13px}
.pill{display:inline-block;font-size:12px;font-weight:600;padding:2px 9px;border-radius:999px;white-space:nowrap}
.pill.paid{color:var(--paid);background:var(--paid-bg)}
.pill.sent{color:var(--sent);background:var(--sent-bg)}
.pill.overdue{color:var(--over);background:var(--over-bg)}
.pill.draft{color:var(--draft);background:var(--draft-bg)}
.empty{padding:40px 20px;text-align:center;color:var(--muted)}
.empty strong{display:block;color:var(--ink);font-family:var(--f-display);font-size:18px;margin-bottom:4px}
.empty .btn{margin-top:14px}

.split{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:900px){.split{grid-template-columns:1fr}}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px;min-width:0}
.panel h2{font-size:18px;margin-bottom:14px}
.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.fields .wide{grid-column:1/-1}
@media (max-width:560px){.fields{grid-template-columns:1fr}}
.f{display:flex;flex-direction:column;gap:4px;min-width:0}
.f>span{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.f small{color:var(--muted);font-size:12px}
input,select,textarea{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:8px 10px;width:100%;min-width:0}
textarea{resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px var(--accent-soft)}
.check{display:flex;align-items:center;gap:8px;font-size:14px}
.check input{width:auto}
.row-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}

.edit{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:22px;align-items:start}
@media (max-width:1100px){.edit{grid-template-columns:1fr}}
.edit-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-bottom:16px}
.edit-head h1{font-size:24px}
.lines-wrap{overflow-x:auto;margin:16px 0 10px;border:1px solid var(--line);border-radius:6px}
table.lines{width:100%;border-collapse:collapse;min-width:560px}
.lines th{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:left;padding:8px;background:var(--sunk);font-weight:600}
.lines td{padding:6px;border-top:1px solid var(--line);vertical-align:top}
.lines input{padding:6px 8px}
.lines .q{width:72px}.lines .p{width:120px}.lines .v{width:46px;text-align:center}.lines .a{width:116px;text-align:right;padding-top:12px}.lines .x{width:36px}
.lines td.v input{margin-top:9px}
.lines input[type=number]{text-align:right;font-family:var(--f-mono)}
.xbtn{background:none;border:0;color:var(--muted);cursor:pointer;font-size:18px;line-height:1;padding:6px}
.xbtn:hover{color:var(--over)}
.line-add{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.line-add select{width:auto;flex:1 1 200px}
.tot{display:grid;grid-template-columns:auto auto;justify-content:end;gap:4px 24px;margin:14px 0 4px}
.tot .k{color:var(--muted);text-align:right}
.tot .v{text-align:right;font-family:var(--f-mono)}
.tot .grand{font-weight:600;color:var(--ink);font-size:17px;border-top:1px solid var(--line);padding-top:6px}
.dirty{font-size:13px;color:var(--sent)}

.paper-col{position:sticky;top:84px}
@media (max-width:1100px){.paper-col{position:static}}
.paper-label{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:8px}
.paper{background:var(--paper);color:var(--paper-ink);border:1px solid var(--line);border-radius:4px;padding:28px;font-size:12px;line-height:1.45;box-shadow:0 1px 2px rgba(0,0,0,.06),0 8px 24px rgba(0,0,0,.06);overflow-x:auto}
.p-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;margin-bottom:22px}
.p-logo{display:block;max-height:60px;max-width:200px;object-fit:contain;margin-bottom:8px}
.logo-box{display:flex;align-items:center;justify-content:center;min-height:96px;border:1px dashed var(--line);border-radius:6px;background:var(--paper);padding:12px;margin-bottom:12px}
.logo-box img{max-height:80px;max-width:100%;object-fit:contain}
.logo-box span{color:var(--paper-muted);font-size:13px}
.co-switch select{width:auto;max-width:240px;padding:6px 10px;font-weight:500}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.reg tr[aria-selected="true"] td{background:var(--accent-soft)}
.p-lines tr.open td{color:var(--paper-muted);font-style:italic}
.p-aging{width:100%;border-collapse:collapse;margin-top:16px;min-width:340px}
.p-aging th{background:var(--paper-band);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--paper-muted);padding:6px 8px;text-align:right;font-weight:600}
.p-aging td{padding:7px 8px;text-align:right;font-family:var(--f-mono);border-bottom:1px solid var(--paper-line)}
.p-aging td:last-child{font-weight:700}
.st-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:560px){.st-controls{grid-template-columns:1fr}}
.ro .rw{display:none!important}
.who{display:flex;flex-direction:column}
.results{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.role-help{font-size:13px;color:var(--muted);margin:10px 0 0;padding-left:18px}
.role-help li{margin:2px 0}
.p-sign{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.p-sign span{border-top:1px solid var(--paper-ink);padding-top:3px;font-size:10px;color:var(--paper-muted);text-transform:uppercase;letter-spacing:.06em}
.stack{display:flex;flex-direction:column;gap:20px;min-width:0}
.p-biz{font-family:var(--f-display);font-weight:700;font-size:17px}
.p-small{color:var(--paper-muted)}
.p-kind{font-family:var(--f-display);font-weight:700;font-size:20px;color:#11636F;text-transform:uppercase;letter-spacing:.04em;text-align:right}
.p-meta{display:grid;grid-template-columns:auto auto;gap:1px 14px;margin-top:6px}
.p-meta dt{color:var(--paper-muted)}.p-meta dd{margin:0;text-align:right;font-family:var(--f-mono)}
.p-label{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--paper-muted);font-weight:600;margin-bottom:3px}
.p-to{margin-bottom:18px}
table.p-lines{width:100%;border-collapse:collapse;min-width:340px}
.p-lines th{background:var(--paper-band);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--paper-muted);text-align:left;padding:6px 8px;font-weight:600}
.p-lines td{padding:7px 8px;border-bottom:1px solid var(--paper-line);vertical-align:top}
.p-lines .r{text-align:right;font-family:var(--f-mono);white-space:nowrap}
.p-tot{display:grid;grid-template-columns:auto auto;justify-content:end;gap:2px 20px;margin-top:10px}
.p-tot .r{text-align:right;font-family:var(--f-mono)}
.p-tot .g{font-weight:700;font-size:14px;border-top:1.5px solid var(--paper-ink);padding-top:4px}
.p-block{margin-top:18px}
.p-foot{margin-top:22px;color:var(--paper-muted);text-align:center}

#toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:var(--r);font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s;max-width:calc(100% - 32px)}
#toast.show{opacity:1}
@media (prefers-reduced-motion:reduce){#toast{transition:none}}

.who-box{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);min-width:0}
.who-box span{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.signed-out nav,body.signed-out .co-switch,body.signed-out #hdr-new,body.signed-out .who-box{display:none}
.auth{max-width:420px;margin:40px auto 0}
.auth h1{font-size:24px;margin-bottom:6px}
.auth .btn{justify-content:center}
.auth-links{display:flex;justify-content:space-between;gap:12px;margin:14px 0 0}