/* Warm frosted glass. Tokens copied from StockFlow (apps/stockflow/base.css). */
@font-face{font-family:'Inter Variable';src:url(fonts/inter-latin-wght-normal.woff2) format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Manrope Variable';src:url(fonts/manrope-latin-wght-normal.woff2) format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url(fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2');font-weight:400;font-display:swap}
:root{
--spacing-1:.25rem;--spacing-2:.5rem;--spacing-3:.75rem;--spacing-4:1rem;--spacing-6:1.5rem;--spacing-8:2rem;--spacing-12:3rem;
--background:#E0D5C8;--foreground:#211C18;--surface:rgba(255,252,248,.9);--sidebar:rgba(249,242,232,.62);--card:rgba(255,255,255,.24);--popup:#FFFCF8;
--primary:#2D2823;--primary-foreground:#FFFCF6;--secondary:#E8DED2;--secondary-foreground:#35302A;--muted-foreground:#493E35;
--success:#12654C;--error:#A12821;--warning:#885819;--info:#3F6058;--border:rgba(85,63,45,.17);--control-border:#8F7D6D;
--glass-card:linear-gradient(125deg,rgba(255,255,255,.42) 0%,rgba(255,255,255,.17) 28%,rgba(255,255,255,.12) 66%,rgba(255,255,255,.32) 100%);
--glass-shell:rgba(255,252,247,.08);--glass-border:rgba(255,255,255,.68);--glass-control:rgba(255,255,255,.22);--glass-hover:rgba(255,255,255,.38);
--glass-shadow:inset 0 1.5px 0 rgba(255,255,255,.95),inset 1px 0 1px rgba(255,255,255,.45),inset 0 -1px 1px rgba(87,62,42,.12),0 12px 30px -17px rgba(46,28,17,.42);
--font-family-base:'Inter Variable','Inter',sans-serif;--font-family-display:'Manrope Variable','Manrope',sans-serif;--font-family-monospace:'IBM Plex Mono',monospace;
--shadow-focus:0 0 0 3px #2D282326;--radius-sm:6px;--radius:12px;--radius-md:15px;--radius-lg:23px;--radius-full:999px;
--chart-color-1:#43816B;--chart-color-2:#B69A7B;--chart-color-3:#799388;
}
@media(prefers-color-scheme:dark){:root{--background:#201C19;--foreground:#F4EEE7;--surface:rgba(40,35,31,.96);--sidebar:rgba(38,32,28,.73);--popup:#302923;--primary:#F2E8DC;--primary-foreground:#27211C;--secondary:#4B4036;--secondary-foreground:#F4EEE7;--muted-foreground:#D1C2B2;--border:rgba(236,218,194,.2);--control-border:#A28F7D;--success:#9DD3B4;--error:#FFB4AB;--warning:#EAC58B;--info:#B3D0C0;--glass-card:linear-gradient(140deg,rgba(53,45,38,.91),rgba(40,34,29,.83));--glass-shell:rgba(41,34,29,.48);--glass-border:rgba(246,231,212,.19);--glass-control:rgba(109,88,70,.24);--glass-hover:rgba(88,71,57,.74);--glass-shadow:inset 0 1px 0 #ffffff0d,0 10px 28px -15px #0009;--shadow-focus:0 0 0 3px #F2E8DC33}}
@media(prefers-reduced-transparency:reduce){:root{--glass-card:#FCF8F2;--glass-shell:#F2EADF;--glass-control:#FFFCF8;--glass-border:#D4C5B5}}
*{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;background:var(--background);color:var(--foreground);font:15px/1.5 var(--font-family-base);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;min-height:100vh}
.backdrop{position:fixed;inset:0;z-index:-1;background:radial-gradient(60vw 50vh at 12% 8%,#f3e6d3 0,transparent 60%),radial-gradient(50vw 45vh at 90% 20%,#d9c7b2 0,transparent 60%),radial-gradient(60vw 60vh at 60% 100%,#cbbba8 0,transparent 60%),var(--background)}
h1,h2,h3{font-family:var(--font-family-display);letter-spacing:-.01em;margin:0 0 var(--spacing-3)}
h1{font-size:1.6rem}h2{font-size:1.15rem}
a{color:inherit}
button,input,select{font:inherit;color:inherit}
.glass{background:var(--glass-card);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:var(--radius-lg);backdrop-filter:blur(22px) saturate(1.3);-webkit-backdrop-filter:blur(22px) saturate(1.3)}
main{flex:1;width:100%}
.loading{text-align:center;margin-top:20vh;color:var(--muted-foreground)}
/* auth */
.auth{max-width:400px;margin:12vh auto 0;padding:var(--spacing-8)}
.brand{display:flex;align-items:center;gap:var(--spacing-2);font-family:var(--font-family-display);font-weight:700;font-size:1.05rem;margin-bottom:var(--spacing-6)}
.brand i{width:28px;height:28px;border-radius:9px;background:var(--primary);display:inline-block;box-shadow:var(--glass-shadow)}
label{display:block;font-size:.85rem;font-weight:600;margin:var(--spacing-4) 0 var(--spacing-1)}
input,select{width:100%;padding:.6rem .8rem;border-radius:var(--radius);border:1px solid var(--control-border);background:var(--glass-control)}
input:focus,select:focus,button:focus-visible{outline:none;box-shadow:var(--shadow-focus);border-color:var(--primary)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.55rem 1rem;border-radius:var(--radius-full);border:1px solid var(--glass-border);background:var(--glass-control);box-shadow:var(--glass-shadow);cursor:pointer;font-weight:600}
.btn:hover{background:var(--glass-hover)}
.btn.primary{background:var(--primary);color:var(--primary-foreground);border-color:transparent}
.btn.small{padding:.3rem .7rem;font-size:.85rem}
.btn.danger{color:var(--error)}
.auth .btn{width:100%;margin-top:var(--spacing-6)}
.error{color:var(--error);font-size:.9rem;margin-top:var(--spacing-3);min-height:1.2em}
.hint{color:var(--muted-foreground);font-size:.85rem}
/* shell */
.shell{display:grid;grid-template-columns:240px 1fr;gap:var(--spacing-4);padding:var(--spacing-4);max-width:1400px;margin:0 auto}
.side{padding:var(--spacing-4);position:sticky;top:var(--spacing-4);align-self:start;background:var(--sidebar)}
.side nav a{display:block;padding:.5rem .75rem;border-radius:var(--radius);text-decoration:none;font-weight:500;margin:2px 0}
.side nav a[aria-current=page]{background:var(--glass-hover);box-shadow:var(--glass-shadow)}
.side nav a:hover{background:var(--glass-control)}
.side .ws{font-size:.85rem;color:var(--muted-foreground);margin:var(--spacing-4) 0 var(--spacing-2)}
.side select{margin-bottom:var(--spacing-4)}
.mode{display:flex;background:var(--glass-control);border-radius:var(--radius-full);padding:3px;margin-top:var(--spacing-4)}
.mode button{flex:1;border:0;background:transparent;border-radius:var(--radius-full);padding:.35rem;cursor:pointer;font-size:.82rem;font-weight:600}
.mode button[aria-pressed=true]{background:var(--primary);color:var(--primary-foreground)}
.content{display:flex;flex-direction:column;gap:var(--spacing-4);min-width:0}
.panel{padding:var(--spacing-6)}
.head{display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-4);flex-wrap:wrap}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--spacing-4)}
.kpi{padding:var(--spacing-4) var(--spacing-6)}
.kpi span{display:block;font-size:.8rem;color:var(--muted-foreground);text-transform:uppercase;letter-spacing:.05em}
.kpi strong{font-family:var(--font-family-display);font-size:1.6rem}
table{width:100%;border-collapse:collapse;font-size:.92rem}
th{text-align:left;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted-foreground);font-weight:600;padding:.5rem .6rem;border-bottom:1px solid var(--border)}
td{padding:.55rem .6rem;border-bottom:1px solid var(--border)}
tr:last-child td{border-bottom:0}
td.num,th.num{text-align:right;font-family:var(--font-family-monospace)}
.pill{display:inline-block;padding:.1rem .55rem;border-radius:var(--radius-full);font-size:.75rem;font-weight:600;background:var(--secondary);color:var(--secondary-foreground)}
.pill.POSTED{background:#12654C22;color:var(--success)}.pill.APPROVAL_PENDING{background:#88581922;color:var(--warning)}.pill.REJECTED{background:#A1282122;color:var(--error)}
.scroll{overflow-x:auto}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--spacing-3)}
.lines td{padding:.3rem}
.lines input,.lines select{padding:.4rem .5rem}
.legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--spacing-2);padding:var(--spacing-4) var(--spacing-6);font-size:.78rem;color:var(--muted-foreground)}
.banner{padding:var(--spacing-3) var(--spacing-4);border-radius:var(--radius);background:#3F605818;font-size:.88rem}
@media(max-width:860px){.shell{grid-template-columns:1fr}.side{position:static}}
/* Batch A: report tabs, status pills and phone-friendly tables */
.tabs{display:flex;flex-wrap:wrap;gap:var(--spacing-2);margin:0 0 var(--spacing-3)}
label.inline{display:flex;align-items:center;gap:var(--spacing-2);margin:0}
label.inline input{width:auto}
.pill.SUBMITTED,.pill.APPROVAL_PENDING{color:var(--warning)}
.pill.REJECTED{color:var(--error)}
@media(max-width:640px){
  .side nav{display:flex;flex-wrap:wrap;gap:var(--spacing-1)}
  table.stack thead{display:none}
  table.stack tr{display:block;padding:var(--spacing-2) 0;border-bottom:1px solid var(--glass-border)}
  table.stack td{display:flex;justify-content:space-between;gap:var(--spacing-3);border:0;padding:2px 0;text-align:right}
  table.stack td::before{content:attr(data-label);color:var(--muted-foreground);text-align:left}
  table.stack td[data-label=""]::before{content:none}
  table.lines.stack td input,table.lines.stack td select{max-width:60%}
}
a.drill { color: inherit; text-decoration: underline dotted; text-underline-offset: 3px; cursor: zoom-in; }
a.drill:hover, a.drill:focus-visible { text-decoration-style: solid; }
.filters { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
/* Phase 1 ERP: modules, tab bar, chips, toasts */
.side nav.modules a{font-weight:600}
.tabbar{display:flex;gap:var(--spacing-1);padding:var(--spacing-1);border-radius:var(--radius-full);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;position:sticky;top:var(--spacing-2);z-index:5;background:var(--sidebar)}
.tabbar::-webkit-scrollbar{display:none}
.tabbar a{flex:0 0 auto;white-space:nowrap;padding:.45rem .9rem;border-radius:var(--radius-full);text-decoration:none;font-weight:600;font-size:.88rem}
.tabbar a[aria-selected=true]{background:var(--primary);color:var(--primary-foreground)}
.tabbar a:hover:not([aria-selected=true]){background:var(--glass-hover)}
.chips{display:flex;gap:var(--spacing-1);overflow-x:auto;margin:var(--spacing-3) 0;scrollbar-width:none}
.chipbtn{flex:0 0 auto;border:1px solid var(--border);background:var(--glass-control);border-radius:var(--radius-full);padding:.25rem .7rem;font-size:.8rem;font-weight:600;cursor:pointer}
.chipbtn[aria-pressed=true]{background:var(--primary);color:var(--primary-foreground);border-color:transparent}
.filters input[type=search]{max-width:320px}
.pill.chip-paid,.pill.chip-approved,.pill.chip-posted,.pill.chip-ok,.pill.chip-active,.pill.chip-settled,.pill.chip-received,.pill.chip-open-{background:#12654C22;color:var(--success)}
.pill.chip-overdue,.pill.chip-low,.pill.chip-out,.pill.chip-90-{background:#A1282122;color:var(--error)}
.pill.chip-part-paid,.pill.chip-awaiting-approval,.pill.chip-open,.pill.chip-61-90{background:#88581922;color:var(--warning)}
.pill.chip-void,.pill.chip-disposed,.pill.chip-not-connected,.pill.chip-closed{background:var(--secondary);color:var(--muted-foreground)}
.kpi.warn strong{color:var(--error)}.kpi.ok strong{color:var(--success)}
.kpis.aged{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.kpis.aged .kpi strong{font-size:1.2rem}
h2.sec{margin:var(--spacing-2) var(--spacing-2) 0}
tr.click{cursor:pointer}tr.click:hover td{background:var(--glass-control)}
.inline-form{display:flex;gap:var(--spacing-1);align-items:center;flex-wrap:wrap;justify-content:flex-end}
.inline-form input{width:7.5rem;padding:.3rem .5rem}.inline-form input[type=date]{width:9.5rem}.inline-form select{width:auto;padding:.3rem .5rem}
.inline-form .error{flex-basis:100%;text-align:right;margin:0;min-height:0}
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-4)}
.split .in h2::before{content:"↓ ";color:var(--success)}.split .out h2::before{content:"↑ ";color:var(--error)}
details.panel summary{cursor:pointer;font-weight:700;font-family:var(--font-family-display)}
.actions{display:flex;gap:var(--spacing-2);flex-wrap:wrap}
.toast{position:fixed;bottom:1.25rem;left:50%;transform:translateX(-50%);background:var(--primary);color:var(--primary-foreground);padding:.6rem 1.1rem;border-radius:var(--radius-full);box-shadow:var(--glass-shadow);z-index:50;font-weight:600}
@media(max-width:860px){.split{grid-template-columns:1fr}}
@media(max-width:640px){
  .side nav.modules{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:var(--spacing-1);scrollbar-width:none}
  .side nav.modules a{flex:0 0 auto;white-space:nowrap;background:var(--glass-control)}
  .panel{padding:var(--spacing-4)}
  .inline-form{justify-content:flex-start}
}
.panel.addco{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;border:2px dashed rgba(0,0,0,.18)}
.panel.addco h2{margin:0 0 4px;font-size:1.15rem}
html,body{overflow-x:hidden}
.shell{grid-template-columns:240px minmax(0,1fr)}
@media(max-width:860px){.shell{grid-template-columns:minmax(0,1fr)}.side{min-width:0}}
.tabbar{max-width:100%}
/* ERP Phase 1 v2: solid cards, account menu, edge fades, 44px targets, paging */
.glass,.panel,.kpi,.side,.tabbar{background:#FBF6EF;backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid #E3D7C9;box-shadow:0 1px 2px rgba(46,28,17,.06),0 6px 18px -14px rgba(46,28,17,.28)}
@media(prefers-color-scheme:dark){.glass,.panel,.kpi,.side,.tabbar{background:#2A241F;border-color:#3A322B}}
th{font-size:11px}
.pill.chip-void,.pill.chip-disposed,.pill.chip-not-connected,.pill.chip-closed{background:#DDD3C8;color:#4A4038;border:1px solid #CBBFB2}
.nowrap,td.nowrap{white-space:nowrap}
td.wide{min-width:14rem}
.side select[aria-label=Workspace]{width:100%;font-size:.86rem;text-overflow:ellipsis}
@media(min-width:861px){.shell{grid-template-columns:272px minmax(0,1fr)}}
.side-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.acct-toggle{display:none}
.acct-menu{display:flex;flex-direction:column;align-items:flex-start;gap:var(--spacing-2);margin-top:var(--spacing-3)}
.btn.primary.addco-btn{font-weight:700}
.btn.big{min-height:44px;padding:.6rem 1.4rem;font-size:1rem}
.panel.head{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-4);flex-wrap:wrap}
.pager{display:flex;gap:var(--spacing-2);align-items:center;justify-content:flex-end;margin-top:var(--spacing-3)}
.pager:empty{display:none}
.fade-wrap{position:relative;min-width:0}
.fade-wrap::before,.fade-wrap::after{content:"";position:absolute;top:0;bottom:0;width:36px;pointer-events:none;opacity:0;transition:opacity .15s;z-index:6;border-radius:inherit}
.fade-wrap::after{right:0;background:linear-gradient(90deg,rgba(251,246,239,0),#FBF6EF 70%)}
.fade-wrap::before{left:0;background:linear-gradient(270deg,rgba(251,246,239,0),#FBF6EF 70%)}
.fade-wrap.more-r::after,.fade-wrap.more-l::before{opacity:1}
.fade-wrap.more-r::after{content:"›";display:flex;align-items:center;justify-content:flex-end;padding-right:6px;font-weight:700;color:var(--muted-foreground)}
.tabwrap{position:sticky;top:var(--spacing-2);z-index:5}
.tabwrap .tabbar{position:static}
@media(max-width:860px){
  .acct-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-size:1.3rem;line-height:1}
  .acct-menu{display:none;padding:var(--spacing-3);border:1px solid #E3D7C9;border-radius:var(--radius);background:#FFFCF8}
  .acct-menu.open{display:flex}
  .acct-menu .btn{width:100%;justify-content:center;text-align:center}
  .side nav.modules{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:var(--spacing-1);scrollbar-width:none;padding-right:28px}
  .side nav.modules::-webkit-scrollbar{display:none}
  .side nav.modules a{flex:0 0 auto;white-space:nowrap}
  .head .actions{width:100%}.head .actions .btn.big{width:100%}
}
@media(max-width:640px){
  .tabbar a,.side nav.modules a,.chipbtn,.btn,.btn.small,.mode button,.inline-form input,.inline-form select,.filters input,select,input{min-height:44px}
  .tabbar a,.side nav.modules a,.chipbtn{display:inline-flex;align-items:center}
  .pill{min-height:28px;display:inline-flex;align-items:center}
  table.stack td:empty{display:none}
  .pager{justify-content:space-between}
}
.btn:not(.primary):not(.danger){box-shadow:none;border-color:#D8CABB;background:#FFFCF8}
.preview-banner{font-weight:600}

.side-panel-wrap{position:fixed;inset:0;background:rgba(30,24,18,.35);z-index:50;display:flex;justify-content:flex-end}
.side-panel{background:var(--surface,#faf5ee);width:min(420px,100vw);height:100%;overflow:auto;padding:24px;box-shadow:-8px 0 30px rgba(0,0,0,.15);box-sizing:border-box}
.sp-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}
.panel-form{display:flex;flex-direction:column;gap:8px}.panel-form input{min-height:44px}
.panel-form .row-btns,.inline-form .row-btns{display:flex;gap:8px;flex-wrap:wrap}.panel-form .row-btns .btn{min-height:44px;flex:1}
.pay-open{white-space:nowrap}
