/* Accounting Desk: BUSY's layout and keys in a shadcn/ui + Vercel skin:
   zinc neutrals, hairline borders, black primary, Geist. */
:root{
  --background:#fff;--foreground:#09090b;--card:#fff;--muted:#f4f4f5;--muted-fg:#71717a;--faint:#a1a1aa;
  --border:#e4e4e7;--input:#e4e4e7;--primary:#18181b;--primary-fg:#fafafa;--accent:#f4f4f5;--ring:#a1a1aa;
  --destructive:#dc2626;--destructive-soft:#fef2f2;--warn:#b45309;--warn-soft:#fffbeb;--ok:#15803d;--ok-soft:#f0fdf4;
  --sel:#f4f4f5;--radius:4px;--page:#f4f4f5;--frame:#fafafa;
  --shadow-xs:0 1px 2px 0 #0000000d;--shadow:0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;
  --font:"Geist",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;--mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  color-scheme:light;
}

*{box-sizing:border-box;border-color:var(--border)}
html,body{height:100%;margin:0}
body{font:14px/1.45 var(--font);color:var(--foreground);background:var(--background);display:flex;flex-direction:column;user-select:none;-webkit-font-smoothing:antialiased;font-feature-settings:"tnum" 0}
button{font:inherit;color:inherit}
kbd{display:inline-flex;align-items:center;height:20px;font:500 11px var(--font);color:var(--muted-fg);background:var(--muted);border-radius:3px;padding:0 5px;white-space:nowrap}
.num,table td.r,table th.r{font-variant-numeric:tabular-nums}

/* ---------- header (Vercel breadcrumb) + tabs ---------- */
#title{height:52px;padding:0 16px;display:flex;align-items:center;gap:10px;font-size:14px}
#title .logo{width:22px;height:22px;flex:none;display:block}
#title .slash{color:var(--border);font-size:20px;font-weight:300;margin:0 2px}
#title .crumb{font-weight:500}
#title .pill{font-size:12px;color:var(--muted-fg);border:1px solid var(--border);border-radius:4px;padding:1px 8px}
#title .grow{flex:1}
#title .who{color:var(--muted-fg);font-size:13px}
#title .av{width:28px;height:28px;border-radius:4px;background:var(--muted);color:var(--foreground);display:grid;place-items:center;font-size:12px;font-weight:600;border:1px solid var(--border)}
#title button{height:32px;border:1px solid var(--border);background:var(--background);border-radius:4px;padding:0 10px;cursor:pointer;font-size:13px;box-shadow:var(--shadow-xs)}
#title button:hover{background:var(--accent)}
#menubar{display:flex;padding:0 8px;border-bottom:1px solid var(--border);gap:2px}
.mi{position:relative;padding:8px 10px 11px;cursor:default;font-size:14px;color:var(--muted-fg)}
.mi::before{content:"";position:absolute;inset:4px 2px 7px;border-radius:4px;z-index:-1}
.mi:hover{color:var(--foreground)}
.mi:hover::before{background:var(--accent)}
.mi.open{color:var(--foreground)}
.mi.open::after{content:"";position:absolute;left:8px;right:8px;bottom:-1px;height:2px;background:var(--foreground)}
#menubar{position:relative;z-index:5;isolation:isolate}
#strip{height:36px;display:flex;justify-content:space-between;align-items:center;padding:0 16px;font-size:12px;color:var(--muted-fg);border-bottom:1px solid var(--border)}
#strip button{height:26px;background:var(--background);border:1px solid var(--border);border-radius:4px;padding:0 9px;margin-left:6px;cursor:pointer;font-size:12px;color:var(--foreground);box-shadow:var(--shadow-xs)}
#strip button:hover{background:var(--accent)}
#busy::before{content:"";display:inline-block;width:6px;height:6px;border-radius:4px;background:var(--ok);margin-right:7px;vertical-align:1px}
#busy.on::before{background:var(--warn)}

/* ---------- dropdown (shadcn DropdownMenu, kept as BUSY's tree) ---------- */
.tree{position:absolute;top:calc(100% + 2px);left:0;z-index:50;background:var(--card);color:var(--foreground);border:1px solid var(--border);border-radius:4px;box-shadow:var(--shadow-lg);min-width:280px;display:flex;flex-direction:column;max-height:calc(100vh - 140px);cursor:default;overflow:hidden;font-size:14px}
.tree .tl{overflow:auto;padding:4px}
.tn{padding:5px 12px 5px 0;white-space:nowrap;display:flex;align-items:center;border-radius:4px}
.tn i{font-style:normal;width:22px;flex:none;text-align:center;color:var(--faint);font-size:12px}
.tn:hover,.tn.cur{background:var(--accent)}
.tn.cur{font-weight:500}
.tn.off{color:var(--faint)}
.tgap{height:1px;background:var(--border);margin:4px -4px}
.tree .tb{display:flex;gap:6px;padding:6px;border-top:1px solid var(--border)}
.tree .tb button{flex:1;height:30px;font-size:13px;background:var(--background);border:1px solid var(--border);border-radius:4px;cursor:pointer;box-shadow:var(--shadow-xs)}
.tree .tb button:hover:not(:disabled){background:var(--accent)}
.tree .tb button:disabled{opacity:.5;cursor:default}

/* ---------- main, shortcut sidebar, status ---------- */
#main{flex:1;display:flex;min-height:0}
#work{flex:1;overflow:auto;position:relative;display:flex;flex-direction:column;min-width:0}
#side{width:200px;border-left:1px solid var(--border);padding:12px 8px;overflow:auto;background:var(--background)}
#side h4{margin:0 8px 6px;font-size:12px;font-weight:500;color:var(--muted-fg)}
#side button{display:flex;align-items:center;justify-content:space-between;width:100%;gap:8px;font-size:13px;background:none;border:0;border-radius:4px;padding:5px 8px;text-align:left;cursor:pointer;flex-direction:row-reverse}
#side button:hover{background:var(--accent)}
#side button b{display:inline-flex;align-items:center;height:20px;font:500 11px var(--font);color:var(--muted-fg);background:var(--muted);border-radius:3px;padding:0 5px}
#side button b u{text-decoration:none}
#side button b u::before{content:"Alt+"}
#side .gap{height:1px;background:var(--border);margin:8px}
#crumb{border-top:1px solid var(--border);font-size:12px;padding:5px 16px;color:var(--muted-fg)}
#crumb:empty{display:none}
#status{border-top:1px solid var(--border);display:flex;gap:20px;align-items:center;font-size:12px;padding:6px 16px;color:var(--muted-fg)}
#status b{color:var(--foreground);font-weight:500}
#status .grow{flex:1}

/* ---------- home (shadcn dashboard) ---------- */
.home{padding:24px 28px 32px;display:flex;flex-direction:column;gap:16px;max-width:1240px;width:100%;margin:0 auto}
.home h1{margin:0;font-size:24px;font-weight:600;letter-spacing:-.02em}
.home .sub{color:var(--muted-fg);margin-top:2px;font-size:14px}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-xs)}
.kpi{padding:18px 20px;cursor:pointer;text-align:left}
.kpi:hover{border-color:var(--ring)}
.kpi span{display:block;font-size:13px;font-weight:500;color:var(--muted-fg)}
.kpi b{display:block;font-size:24px;font-weight:600;letter-spacing:-.02em;margin-top:6px;font-variant-numeric:tabular-nums}
.kpi em{display:block;font-style:normal;font-size:12px;color:var(--muted-fg);margin-top:2px}
.split{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:16px;align-items:start}
.card h3{margin:0;padding:18px 20px 4px;font-size:16px;font-weight:600;letter-spacing:-.01em}
.card .desc{padding:0 20px 12px;color:var(--muted-fg);font-size:13px}
.card table.rep th{background:none}
.card table.rep{border-top:1px solid var(--border)}
.acts{display:flex;flex-direction:column;padding:0 8px 8px}
.acts button{display:flex;justify-content:space-between;align-items:center;background:none;border:0;padding:8px 12px;border-radius:4px;cursor:pointer;font-size:14px}
.acts button:hover{background:var(--accent)}
.empty{padding:28px 20px;color:var(--muted-fg);text-align:center;font-size:14px}

/* ---------- inputs ---------- */
input,select{font:inherit;font-size:14px;color:var(--foreground);border:1px solid transparent;background:transparent;padding:4px 8px;border-radius:4px;user-select:text;min-width:0}
.hrow input,.hrow select,.form input,.form select,.mbox input,.rhead select,.rtool input{height:36px;border-color:var(--input);background:var(--background);box-shadow:var(--shadow-xs);padding:0 10px}
input:focus,select:focus{outline:none;border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in srgb,var(--ring) 35%,transparent)}
input[readonly]{color:var(--muted-fg)}

/* ---------- vouchers ---------- */
.vch{flex:1;display:flex;gap:20px;padding:20px 24px;min-height:0}
.vmain{flex:1;min-width:0;display:flex;flex-direction:column;gap:14px;overflow:auto;padding:2px}
.vmain>*{flex:none}
.vinfo{width:240px;display:flex;flex-direction:column;gap:12px;padding-top:44px}
.vinfo fieldset:last-child{flex:1}
fieldset{border:1px solid var(--border);border-radius:var(--radius);margin:0;padding:12px 14px;background:var(--card);box-shadow:var(--shadow-xs);font-size:13px;min-height:64px}
legend{font-size:12px;font-weight:500;color:var(--muted-fg);padding:0 4px;margin-left:-4px}
.vinfo div{line-height:1.6}
.vtitle span,.form h3 span{font-size:20px;font-weight:600;letter-spacing:-.02em}
.hrow{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap}
.hrow label{color:var(--muted-fg);font-size:13px;font-weight:500}
.hrow b{margin-right:12px;font-weight:500}
.hrow input[size="72"]{flex:1;min-width:240px}
.hrow input[size="34"]{flex:1;max-width:340px}
table.grid{border-collapse:separate;border-spacing:0;background:var(--card);width:100%;font-variant-numeric:tabular-nums;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-xs)}
table.grid th{border-bottom:1px solid var(--border);padding:8px 10px;text-align:left;font-weight:500;color:var(--muted-fg);font-size:13px;background:var(--muted)}
table.grid td{border-bottom:1px solid var(--border);padding:0;height:34px}
table.grid td+td,table.grid th+th{border-left:1px solid var(--border)}
table.grid tbody tr:last-child td{border-bottom:0}
table.grid td.sn{width:44px;text-align:center;color:var(--faint);font-size:12px}
table.grid tbody tr:focus-within td{background:var(--muted)}
table.grid input{width:100%;height:33px;border:0;border-radius:0;padding:0 10px}
table.grid input:focus{box-shadow:inset 0 0 0 2px var(--foreground);background:var(--background)}
table.grid tfoot td{border-top:1px solid var(--border);border-bottom:0;font-weight:600;padding:8px 10px;background:var(--muted)}
.r{text-align:right}
.vbot{display:flex;gap:14px;align-items:flex-start}
.vbot .tax{width:42%;min-height:120px;font-variant-numeric:tabular-nums}
.vbot .tax table{width:100%;border-collapse:collapse}
.vbot .tax th{font-weight:500;color:var(--muted-fg);text-align:right;padding:3px 4px;border-bottom:1px solid var(--border)}
.vbot .tax td{text-align:right;padding:4px}
.gt{display:flex;justify-content:flex-end;align-items:center;gap:14px;font-size:14px;color:var(--muted-fg)}
.gt b{font-size:22px;font-weight:600;color:var(--foreground);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.keybar{border-top:1px solid var(--border);color:var(--muted-fg);display:flex;flex-wrap:wrap;gap:4px 16px;padding:8px 16px;font-size:12px}
.keybar .k{display:inline-flex;gap:6px;align-items:center}

/* ---------- buttons, forms, dialogs ---------- */
.btn{display:inline-flex;align-items:center;height:36px;font:500 14px var(--font);border:1px solid var(--border);background:var(--background);border-radius:4px;padding:0 16px;cursor:pointer;box-shadow:var(--shadow-xs)}
.btn:hover{background:var(--accent)}
.btn:focus{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--ring) 35%,transparent)}
#okb{background:var(--primary);border-color:var(--primary);color:var(--primary-fg)}
#okb:hover{opacity:.9}
.form{margin:40px auto;background:var(--card);border:1px solid var(--border);border-radius:4px;box-shadow:var(--shadow);padding:24px;width:min(520px,calc(100% - 32px))}
.form h3{margin:0 0 18px}
.form .f{display:flex;flex-direction:column;align-items:stretch;margin:12px 0;gap:6px}
.form .f label{font-size:14px;font-weight:500}
.form .f input,.form .f select{width:100%}
.form .btns{display:flex;gap:8px;justify-content:flex-end;margin-top:22px}
.note{color:var(--muted-fg);font-size:13px;margin:14px 0 0}
.note:empty{display:none}
#toast{position:fixed;right:20px;bottom:56px;background:var(--card);color:var(--foreground);border:1px solid var(--border);border-radius:var(--radius);padding:12px 16px;display:none;z-index:99;box-shadow:var(--shadow-lg);max-width:min(420px,80vw);font-size:14px;font-weight:500}
#toast.err{color:var(--destructive);border-color:color-mix(in srgb,var(--destructive) 35%,var(--border))}
#modal,#lock{position:fixed;inset:0;background:#00000080;z-index:80;display:flex;align-items:center;justify-content:center}
#lock{background:#000000b3}
.mbox{background:var(--card);border:1px solid var(--border);border-radius:4px;box-shadow:var(--shadow-lg);padding:24px;width:min(480px,calc(100% - 32px));max-height:72vh;overflow:auto}
.mbox h3{margin:0 0 14px;font-size:18px;font-weight:600;text-align:left}
.mbox .li{padding:8px 10px;border-radius:4px;cursor:pointer;display:flex;justify-content:space-between;gap:12px}
.mbox .li:hover{background:var(--accent)}
.mbox .li b{color:var(--faint);font-weight:400}
.mbox .li b:hover{color:var(--destructive)}

/* ---------- reports (shadcn data table) ---------- */
.rtool{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:16px 24px 0}
.rtool button{height:32px;font-size:13px;font-weight:500;background:var(--background);border:1px solid var(--border);border-radius:4px;padding:0 12px;cursor:pointer;box-shadow:var(--shadow-xs)}
.rtool button:hover{background:var(--accent)}
.rtool input{width:220px;height:32px}
.rhead{padding:0 24px 16px;color:var(--muted-fg);font-size:14px;margin-top:-30px;max-width:60%}
.rhead u{display:block;text-decoration:none;font-size:22px;font-weight:600;letter-spacing:-.02em;color:var(--foreground);margin-bottom:2px}
.rhead u+br{display:none}
.rhead select{margin-top:8px;height:34px}
.rbody{flex:1;overflow:auto;margin:0 24px 16px;border:1px solid var(--border);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow-xs)}
table.rep{border-collapse:separate;border-spacing:0;width:100%;font-size:14px;font-variant-numeric:tabular-nums}
table.rep+table.rep{margin-top:20px;border-top:1px solid var(--border)}
table.rep th{height:40px;padding:0 14px;border-bottom:1px solid var(--border);font-weight:500;color:var(--muted-fg);position:sticky;top:0;text-align:left;z-index:1;background:var(--card);white-space:nowrap}
table.rep th.r{text-align:right}
table.rep td{border-bottom:1px solid var(--border);padding:9px 14px;white-space:nowrap}
table.rep tbody tr:last-child td{border-bottom:0}
table.rep tr.g td{font-weight:600}
table.rep tr.s td{color:var(--muted-fg)}
table.rep tr.s td:first-child{padding-left:30px}
table.rep tr.tot td{font-weight:600;background:var(--muted)}
table.rep tr.click{cursor:pointer}
table.rep tr.click:hover td{background:color-mix(in srgb,var(--muted) 60%,transparent)}
table.rep tr.sel td{background:var(--sel)!important}
table.rep tr.sel td:first-child{box-shadow:inset 3px 0 0 var(--foreground)}
.two{display:flex;min-height:100%}
.two>div{flex:1;border-right:1px solid var(--border)}
.two>div:last-child{border-right:0}
.bars{display:flex;align-items:flex-end;gap:12px;height:220px;padding:28px 30px 0;border-bottom:1px solid var(--border)}
.bars div{flex:1;background:var(--primary);border-radius:3px 3px 0 0;position:relative;min-height:1px}
.bars div i{position:absolute;top:-18px;left:-8px;right:-8px;text-align:center;font-style:normal;font-size:11px;color:var(--muted-fg)}
.bars div em{position:absolute;bottom:-20px;left:0;right:0;text-align:center;font-style:normal;font-size:12px;color:var(--muted-fg)}

@media (max-width:1100px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.split{grid-template-columns:1fr}}
@media (max-width:1000px){.vinfo{display:none}#side{display:none}.rhead{margin-top:0;max-width:none}}
@media print{#menubar,#side,#status,#crumb,.rtool,.keybar,#title,#strip{display:none}#work,.rbody{overflow:visible}.rbody{border:0;margin:0;box-shadow:none}.rhead{margin-top:0}table.rep th{position:static}}

/* ---------- two-tone zones, as BUSY uses colour: white = your data, grey = around it ---------- */
#work{background:var(--page)}
#side,#status,#crumb{background:var(--frame)}
.keybar{background:var(--card)}
.vch .hrow{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;box-shadow:var(--shadow-xs)}
.vch .hrow+.hrow{margin-top:-15px;border-top:0;border-top-left-radius:0;border-top-right-radius:0;padding-top:4px}
.vch .hrow:has(+.hrow){border-bottom-left-radius:0;border-bottom-right-radius:0;padding-bottom:4px}
.vinfo{padding-top:42px}
.vinfo fieldset{background:var(--frame)}
.vtitle{margin-bottom:-4px}
.gt{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;box-shadow:var(--shadow-xs)}
.vbot .tax{background:var(--card)}

/* ---------- fixed layout: the window never scrolls on entry screens, grids scroll inside ---------- */
#title{height:46px}
#strip{position:absolute;top:46px;right:14px;height:41px;border:0;padding:0;gap:6px;z-index:6;background:none}
#side{padding:8px}
#side button{padding:3px 8px}
.vch{overflow:hidden;padding:12px 18px;gap:16px}
.vmain{overflow:hidden;gap:10px}
.vtitle span{font-size:17px}
.vch .hrow input,.vch .hrow select{height:32px}
.gwrap{border:1px solid var(--border);border-radius:var(--radius);background:var(--card);overflow:auto;box-shadow:var(--shadow-xs);min-height:0}
.vmain>.gwrap.main{flex:1 1 auto;min-height:100px}
.gwrap table.grid{border:0;border-radius:0;box-shadow:none;overflow:visible}
.gwrap thead th{position:sticky;top:0;z-index:2}
.gwrap tfoot td{position:sticky;bottom:0;z-index:2}
table.grid td{height:30px}
table.grid input{height:29px}
.vbot{flex:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) auto;gap:12px;height:136px;align-items:stretch}
.vbot .tax{width:auto;min-height:0;overflow:auto;padding-top:6px}
.vbot .gwrap.bs{height:100%}
.vbot .gt{flex-direction:column;align-items:flex-end;justify-content:space-between;min-width:180px;gap:4px}
.vbot .gt span{align-self:flex-end;font-size:13px}
.vbot .gt b{flex:1;font-size:24px}
.vbot .gt .btn{width:100%;justify-content:center}
.vinfo{padding-top:36px;overflow:hidden}
.vinfo fieldset{min-height:0}
#status{display:none}
.vt{font-size:15px;font-weight:600;margin-right:14px;letter-spacing:-.01em}
.vinfo{padding-top:0}
.vbot{height:118px}
.vbot .tax table th{padding:2px 4px}
.vbot .gt b{font-size:22px}
.vch{padding:10px 16px}
/* home fits the window; lists scroll inside their cards */
.home{height:100%;overflow:hidden;padding:16px 22px;gap:12px}
.home h1{font-size:20px}
.cards{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px}
.kpi{padding:12px 16px}
.kpi b{font-size:20px;margin-top:2px}
.split{flex:1;min-height:0;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)!important}
.split>.card{height:100%;display:flex;flex-direction:column;min-height:0;overflow:hidden}
.split>.card>.scroll,.split>.card>.acts{overflow:auto;flex:1;min-height:0}
.split>.card>.scroll table.rep th{position:sticky;top:0}
.card h3{padding:12px 16px 2px;font-size:15px}
.card .desc{padding:0 16px 8px}
.acts{display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:0 8px 8px;flex:1;min-height:0;align-content:start}
.acts button{padding:6px 10px;font-size:13px}
/* master forms: label beside field so they fit */
.form{margin:16px auto;padding:18px 22px}
.form .f{flex-direction:row;align-items:center;margin:7px 0;gap:12px}
.form .f label{width:150px;flex:none;color:var(--muted-fg);font-weight:500;font-size:13px;text-align:right}
.form .f input,.form .f select{flex:1;height:34px}
.form .btns{margin-top:14px}
#title .crumb+.crumb{margin-left:10px;color:var(--muted-fg)}
/* keyboard highlight */
#work button:focus-visible,#side button:focus-visible,#strip button:focus-visible,.kpi:focus-visible{outline:2px solid var(--foreground);outline-offset:1px}
table.rep tr[data-c]:focus{outline:none}
table.rep tr[data-c]:focus td{background:var(--sel)}
table.rep tr[data-c]:focus td:first-child{box-shadow:inset 3px 0 0 var(--foreground)}

/* ---------- working density: built for people entering vouchers all day ----------
   dark title bar, light menu bar, tighter rows, darker secondary text */
:root{--muted-fg:#52525b;--faint:#82828c;--border:#d4d4d8;--input:#c4c4ca;--page:#ececee;--frame:#f6f6f7}
body{font-size:13px}
#title{height:34px;background:#18181b;color:#fafafa;font-size:13px;padding:0 12px;gap:8px}
#title .logo{width:20px;height:20px;background:none}
#title .crumb{color:#fafafa}
#title .crumb+.crumb{color:#d4d4d8}
#title .pill{border-color:#3f3f46;color:#d4d4d8;font-size:11.5px;padding:0 7px}
#title .who{color:#a1a1aa;font-size:12px}
#title button{height:24px;background:#27272a;border-color:#3f3f46;color:#fafafa;font-size:12px;box-shadow:none;padding:0 8px}
#title button:hover{background:#3f3f46}
#title .av{width:24px;height:24px;background:#3f3f46;border-color:#52525b;color:#fafafa;font-size:11px}
#menubar{background:#f4f4f5;border-bottom:1px solid var(--border);padding:0 4px}
.mi{padding:5px 10px 7px;font-size:13px;color:var(--foreground)}
.mi::before{inset:3px 1px 4px}
.mi.open{background:var(--background);box-shadow:inset 1px 0 var(--border),inset -1px 0 var(--border)}
.mi.open::before{background:none}
.mi.open::after{bottom:-1px;height:2px;left:0;right:0}
#strip{top:34px;height:30px;right:8px}
#strip button{height:22px;font-size:11.5px;padding:0 7px}
#busy{font-size:11.5px}
.tree{font-size:13px;min-width:260px}
.tn{padding:3px 12px 3px 0}
#side{width:178px;padding:6px}
#side h4{font-size:11px;margin:0 6px 4px}
#side button{font-size:12.5px;padding:2px 6px}
#side button b{height:18px;font-size:10.5px}
#side .gap{margin:5px 6px}
#crumb{padding:3px 12px;font-size:11.5px}
.keybar{padding:4px 12px;font-size:11.5px;gap:3px 12px}
kbd{height:18px;font-size:10.5px}
/* home */
.home{padding:10px 14px;gap:8px;max-width:none}
.home h1{font-size:16px}
.home .sub{font-size:12px;margin-top:0}
.cards{gap:8px}
.kpi{padding:7px 12px}
.kpi span{font-size:12px}
.kpi b{font-size:17px;margin-top:0}
.kpi em{font-size:11.5px;margin-top:0}
.split{gap:8px}
.card h3{padding:8px 12px 0;font-size:13px}
.card .desc{padding:0 12px 6px;font-size:12px}
.acts{padding:0 6px 6px}
.acts button{padding:4px 8px;font-size:13px}
/* tables */
table.rep{font-size:13px}
table.rep th{height:28px;padding:0 10px;font-size:12px;color:var(--muted-fg);background:var(--frame)}
table.rep td{padding:4px 10px}
table.rep tr.s td:first-child{padding-left:24px}
.rtool{padding:6px 14px 0;gap:4px}
.rtool button{height:26px;font-size:12px;padding:0 9px}
.rtool input{height:26px}
.rhead{padding:0 14px 6px;margin-top:-26px;font-size:12.5px}
.rhead u{font-size:16px}
.rbody{margin:0 14px 10px}
/* forms and buttons */
.hrow input,.hrow select,.form input,.form select,.mbox input,.rhead select{height:28px;font-size:13px;padding:0 8px}
.btn{height:28px;font-size:13px;padding:0 12px}
.form{padding:14px 18px;width:min(500px,calc(100% - 24px))}
.form h3 span{font-size:16px}
.form .f{margin:5px 0}
.form .f input,.form .f select{height:28px}
/* vouchers */
.vch{padding:8px 12px;gap:10px}
.vmain{gap:7px}
.vch .hrow{padding:6px 10px}
.vch .hrow input,.vch .hrow select{height:26px}
.vt{font-size:14px}
table.grid th{padding:4px 8px;font-size:12px}
table.grid td{height:26px}
table.grid input{height:25px;font-size:13px;padding:0 8px}
table.grid tfoot td{padding:4px 8px}
.vbot{height:100px;gap:8px}
.vbot .gt{padding:8px 10px;min-width:160px}
.vbot .gt b{font-size:19px}
.vinfo{width:210px;gap:8px}
fieldset{padding:6px 10px;font-size:12.5px}
/* two-column masters */
.form.wide{width:min(880px,calc(100% - 24px))}
.form.wide .fgrid{display:grid;grid-template-columns:1fr 1fr;column-gap:22px}
.form .f label{width:130px}
.form .btns .btn:first-child{margin-right:auto}
.form .btns .btn:only-child,.form .btns #qb:first-child{margin-right:0}
/* ---------- printable invoice ---------- */
.paperwrap{flex:1;overflow:auto;padding:12px 0 20px;background:var(--page)}
.paper{width:210mm;min-height:297mm;margin:0 auto;background:#fff;color:#111;padding:12mm 12mm 14mm;box-shadow:var(--shadow);font:12px/1.4 var(--font);display:flex;flex-direction:column;gap:8px}
.paper b{font-weight:600}
.ptitle{display:flex;justify-content:space-between;align-items:baseline;border-bottom:2px solid #111;padding-bottom:4px}
.ptitle b{font-size:16px;letter-spacing:.06em}
.ptitle span{font-size:11px;color:#555}
.pseller{text-align:center}
.pseller .pname{font-size:18px;font-weight:700}
.pgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pbox{border:1px solid #bbb;padding:6px 8px}
.ph,.pwords span,.pbank span,.pterms span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#555;margin-bottom:2px}
.pmeta{display:grid;grid-template-columns:1fr 1fr;gap:2px 10px;align-content:start}
.pmeta div{display:flex;flex-direction:column}
.pmeta span{font-size:10px;color:#555}
table.pt{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
table.pt th{background:#f1f1f1;border:1px solid #bbb;padding:3px 5px;font-size:10.5px;font-weight:600;text-align:left}
table.pt td{border:1px solid #ccc;padding:3px 5px;vertical-align:top}
table.pt .r{text-align:right}
table.pt tfoot td{font-weight:600;background:#f7f7f7}
table.pt tr.sund td{color:#444}
table.pt.small{font-size:11px}
.pwords{border:1px solid #bbb;padding:5px 8px}
.pbank{margin-top:6px;font-size:11px}
.ptot{border:1px solid #bbb;padding:6px 8px;display:flex;flex-direction:column;gap:2px;font-variant-numeric:tabular-nums}
.ptot div{display:flex;justify-content:space-between}
.ptot .grand{border-top:1px solid #111;margin-top:4px;padding-top:4px;font-size:14px}
.pfoot{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding-top:10px}
.pterms{font-size:11px;max-width:60%}
.psign{text-align:center;font-size:11.5px;border-top:1px solid #111;padding-top:4px;min-width:200px}
@page{size:A4;margin:0}
@media print{body *{visibility:hidden}.paper,.paper *{visibility:visible}.paper{position:absolute;left:0;top:0;box-shadow:none;margin:0}#main,#work,.paperwrap{overflow:visible!important;display:block}}
/* checks */
.iss{padding:6px 10px;border-left:3px solid var(--warn);background:var(--warn-soft);margin-bottom:4px;font-size:13px}
.mbtns{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
#okb2{background:var(--primary);color:var(--primary-fg);border-color:var(--primary)}
.sev{display:inline-block;min-width:58px;font-size:11px;font-weight:600;padding:0 5px;border-radius:3px;text-align:center;margin-right:8px}
.sev.s3{background:var(--destructive-soft);color:var(--destructive)}
.sev.s2{background:var(--warn-soft);color:var(--warn)}
.sev.s1{background:var(--muted);color:var(--muted-fg)}
.side2{display:flex;flex-direction:column;gap:8px;min-height:0;height:100%}
.side2>.card{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.side2>.attn{flex:1}
.side2>.attn>.scroll{overflow:auto;flex:1;min-height:0;padding:0 6px 6px}
.cnt{font-size:11px;background:var(--muted);color:var(--muted-fg);border-radius:3px;padding:0 6px;margin-left:4px;vertical-align:1px}
.ai{display:flex;align-items:baseline;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--border);padding:5px 6px;font-size:12.5px;cursor:pointer;line-height:1.35}
.ai:hover{background:var(--accent)}
.split>.side2>.card .acts{grid-template-columns:1fr 1fr}
/* bill adjustment */
fieldset.badj{flex:1;overflow:auto}
.bill{display:flex;justify-content:space-between;gap:6px;padding:3px 4px;border-bottom:1px solid var(--border);cursor:pointer;font-size:12px;font-variant-numeric:tabular-nums}
.bill:hover{background:var(--accent)}
.bill.on{background:var(--ok-soft);font-weight:600}
.bill i{font-style:normal;color:var(--ok)}
.bnote{color:var(--muted-fg);font-size:11.5px;margin-top:4px}
.rbody input.clr{height:24px;width:110px;border:1px solid var(--input);background:var(--background)}
.rbody tr.s input.clr{color:var(--ok)}
/* voucher header: fixed 8-column grid so labels and fields line up row to row */
.vhead{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-xs);padding:6px 10px 8px}
.vhtop{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-bottom:5px;margin-bottom:6px;border-bottom:1px solid var(--border)}
.vmeta{font-size:12px;color:var(--muted-fg)}
.vmeta b{color:var(--foreground);font-weight:500}
.vgrid{display:grid;grid-template-columns:repeat(4,max-content minmax(0,1fr));gap:5px 10px;align-items:center}
.vgrid>label{font-size:12.5px;color:var(--muted-fg);white-space:nowrap}
.vgrid input,.vgrid select{width:100%;height:27px;font-size:13px;padding:0 8px;border:1px solid var(--input);background:var(--background);border-radius:3px}
.vgrid .span3{grid-column:span 3}
.vgrid .span7{grid-column:span 7}
.vhead:not(:has(.vhtop)){padding:6px 10px}
/* ---------- in-app lists ---------- */
select.enh{display:none!important}
.selx{display:flex;align-items:center;justify-content:space-between;gap:6px;width:100%;height:28px;padding:0 8px;font:13px var(--font);color:var(--foreground);background:var(--background);border:1px solid var(--input);border-radius:3px;cursor:pointer;text-align:left;min-width:0}
.selx span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.selx b{font-weight:400;color:var(--muted-fg);font-size:12px;line-height:1;margin-top:-4px}
.selx:focus{outline:none;border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in srgb,var(--ring) 35%,transparent)}
.vgrid .selx{height:27px}
.form .f .selx{flex:1;height:28px}
.rhead .selx{display:inline-flex;width:auto;min-width:240px;margin-top:6px}
#pop{position:fixed;z-index:120;display:none;background:var(--card);border:1px solid var(--border);border-radius:4px;box-shadow:var(--shadow-lg);max-height:290px;overflow:auto;padding:3px;font-size:13px}
#pop .po{display:flex;flex-direction:column;padding:4px 8px;border-radius:3px;cursor:default;line-height:1.3}
#pop .po span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#pop .po i{font-style:normal;font-size:11.5px;color:var(--muted-fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#pop .po.cur span{font-weight:600}
#pop .po:hover{background:var(--accent)}
#pop .po.hi{background:var(--primary);color:var(--primary-fg)}
#pop .po.hi i{color:color-mix(in srgb,var(--primary-fg) 75%,transparent)}
#pop .pe{padding:6px 8px;color:var(--muted-fg)}
/* ---------- one panel style for voucher screens ---------- */
.vinfo{padding-top:0;width:230px}
.vside{flex:1;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-xs);overflow:auto;min-height:0}
.vside section{padding:9px 12px 10px;border-bottom:1px solid var(--border)}
.vside section:last-child{border-bottom:0}
.vside section.badj{flex:1;min-height:0;overflow:auto}
.vside h4,.vpanel .ph{margin:0 0 6px;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted-fg)}
.vside b{display:block;font-size:13px;font-weight:600;margin-bottom:4px}
.vside dl{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;margin:0;font-size:12.5px}
.vside dt{color:var(--muted-fg)}
.vside dd{margin:0;text-align:right;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.vside #td{font-size:12.5px;line-height:1.45}
.none{color:var(--faint);font-size:12px;line-height:1.4}
.vpanel{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-xs);display:flex;flex-direction:column;min-height:0;overflow:hidden}
.vpanel .ph{padding:7px 10px 0;margin:0}
.vpanel .pb{flex:1;overflow:auto;padding:4px 10px 8px}
table.mini{width:100%;border-collapse:collapse;font-size:12.5px;font-variant-numeric:tabular-nums}
table.mini th{font-weight:500;color:var(--muted-fg);text-align:left;padding:3px 4px;border-bottom:1px solid var(--border)}
table.mini th.r,table.mini td.r{text-align:right}
table.mini td{padding:3px 4px;border-bottom:1px solid color-mix(in srgb,var(--border) 60%,transparent)}
table.mini tr:last-child td{border-bottom:0}
.vbot .tax{width:auto;padding:0}
.vbot .gt{background:var(--card);justify-content:space-between}
.vbot .gt span{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted-fg)}
/* review dialog */
.rvh{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:10px}
.rvh b{font-size:16px;font-weight:600}
.rvh span{font-size:12.5px;color:var(--muted-fg)}
ul.rv{list-style:none;margin:0;padding:0;border:1px solid var(--border);border-radius:var(--radius)}
ul.rv li{position:relative;padding:8px 12px 8px 28px;font-size:13px;line-height:1.4;border-bottom:1px solid var(--border)}
ul.rv li:last-child{border-bottom:0}
ul.rv li::before{content:"";position:absolute;left:12px;top:14px;width:7px;height:7px;border-radius:50%;background:var(--warn)}
.mbtns .btn kbd{margin-left:6px;background:transparent;border:1px solid currentColor;opacity:.6}
.mbox{width:min(560px,calc(100% - 32px))}
.mbtns .btn kbd{color:inherit;height:17px}
/* review dialog: errors red (block saving), warnings yellow (can save anyway) */
.rvg{margin-top:10px}
.rvt{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:5px;font-size:12.5px}
.rvt span{color:var(--muted-fg)}
.rvg ul.rv{border-radius:var(--radius)}
.rvg.err ul.rv{background:var(--destructive-soft);border-color:color-mix(in srgb,var(--destructive) 35%,var(--border))}
.rvg.err ul.rv li{border-color:color-mix(in srgb,var(--destructive) 20%,transparent)}
.rvg.err ul.rv li::before{background:var(--destructive)}
.rvg.err .rvt b{color:var(--destructive)}
.rvg.warn ul.rv{background:var(--warn-soft);border-color:color-mix(in srgb,var(--warn) 35%,var(--border))}
.rvg.warn ul.rv li{border-color:color-mix(in srgb,var(--warn) 20%,transparent)}
.rvg.warn ul.rv li::before{background:var(--warn)}
.rvg.warn .rvt b{color:var(--warn)}
:root{--warn-soft:#fef9e7}
.ptot .sub{border-top:1px solid #bbb;margin-top:2px;padding-top:2px;font-weight:600}
/* review items that can be fixed */
ul.rv li:has(.fx){padding:0}
ul.rv li:has(.fx)::before{left:12px;top:14px}
.fx{display:flex;width:100%;justify-content:space-between;align-items:baseline;gap:12px;background:none;border:0;text-align:left;padding:8px 12px 8px 28px;font:13px/1.4 var(--font);color:var(--foreground);cursor:pointer;border-radius:0}
.fx span{flex:none;font-size:12px;font-weight:600;color:var(--foreground);opacity:.55}
.fx:hover span,.fx:focus span{opacity:1;text-decoration:underline}
.fx:hover,.fx:focus{background:color-mix(in srgb,var(--foreground) 5%,transparent);outline:none}
.retnote{display:block;font-size:12px;font-weight:400;color:var(--muted-fg);margin-top:2px}
/* review banners (alert style): one soft-coloured banner per issue */
:root{--err-bg:#fbe9ec;--err-ink:#8e1f2f;--err-icon:#c0303f;--warn-bg:#fcf2dc;--warn-ink:#6b4a05;--warn-icon:#a76b00}
.als{display:flex;flex-direction:column;gap:6px}
.al{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:var(--radius);font:13px/1.4 var(--font);text-align:left}
.al svg{width:16px;height:16px;flex:none}
.al .am{flex:1}
.al.err{background:var(--err-bg);color:var(--err-ink)}
.al.err svg{color:var(--err-icon)}
.al.warn{background:var(--warn-bg);color:var(--warn-ink)}
.al.warn svg{color:var(--warn-icon)}
.al.fx{cursor:pointer}
.al .fxl{flex:none;font-size:12px;font-weight:600;opacity:.7}
.al.fx:hover .fxl,.al.fx:focus .fxl{opacity:1;text-decoration:underline}
.al.fx:hover,.al.fx:focus{outline:none;filter:brightness(.97);box-shadow:inset 0 0 0 1px currentColor}
.rvg .rvt b{font-weight:600}
.rvg.err .rvt b{color:var(--err-icon)}
.rvg.warn .rvt b{color:var(--warn-icon)}
#title button.ico{width:26px;padding:0;display:grid;place-items:center}
#title button.ico svg{width:14px;height:14px}
@media (max-width:960px){#busy{display:none}}
details.bxf{border:1px solid var(--border);border-radius:var(--radius);margin-bottom:5px;font-size:12.5px}
details.bxf summary{padding:6px 10px;cursor:pointer}
details.bxf summary span{color:var(--muted-fg)}
details.bxf div{padding:4px 10px 8px;max-height:180px;overflow:auto;color:var(--muted-fg);line-height:1.5}