/* ---------- Colour themes ----------
   Every colour comes from these tokens. A theme is a set of tokens on :root[data-theme=...];
   the app sets data-theme before first paint (index.html) from the user's saved choice. Light is the default.
   Printed documents, labels and cheques keep their own black-on-white colours. */
:root,:root[data-theme="light"]{color-scheme:light;
  --brand:#1e7d55;--brand2:#176546;--brandink:#1a6c4a;--onbrand:#fff;--ink:#2f3437;--muted:#5f686d;--faint:#8b9397;--line:#e1e4e6;--line2:#eceef0;--bg:#f6f7f8;--rail:#eef1f2;--card:#fff;
  --soft:#e6f3ec;--hover:#eff3f2;--sel:#e2f0e8;--warn:#fff5da;--ok:#1d7642;--bad:#bb3a2c;--danger:#bb3a2c;--amber:#8f5600;--info:#2f5ea6;--chipbg:#edf0ef;--field:#c8ced1;
  --badbg:#fbe9e6;--badink:#8a2418;--toast:#2b3236;--toastink:#fff;--scrim:rgba(20,28,25,.35);--formbar:#2f3437;--pvbg:#6b7370;--ring:rgba(30,125,85,.12);
  --s1:#1a9e66;--s2:#2a78d6;--s3:#eb6834;--s4:#6250d6;--s5:#9aa29e;--inc:#1a9e66;--exp:#0d6e6a;--area:rgba(26,158,102,.16);--grid:#e6e9e8;
  --g0:#5d6661;--g1:#1e7d55;--g2:#1f8a7a;--g3:#2f9e44;--g4:#0e8a96;--g5:#2f5ea6;--g6:#c8485a;--g7:#7a4fc4;--shadow:0 1px 2px rgba(30,40,35,.06),0 4px 18px rgba(30,40,35,.07)}
:root[data-theme="green"]{color-scheme:light;
  --brand:#2c7a4b;--brand2:#22633c;--brandink:#256a40;--ink:#263a2e;--muted:#55695c;--faint:#869a8c;--line:#d2e1d7;--line2:#e2ece5;--bg:#eff6f1;--rail:#e3eee7;--card:#fbfdfb;
  --soft:#dbeee2;--hover:#e7f1ea;--sel:#d6eadd;--chipbg:#e2eee6;--field:#b9cdbf;--warn:#fbf3d6;--toast:#22372a;--formbar:#263a2e;--pvbg:#5f7166;--ring:rgba(44,122,75,.14);--grid:#dbe8df;--g1:#2c7a4b}
:root[data-theme="blue"]{color-scheme:light;
  --brand:#2560a8;--brand2:#1c4c87;--brandink:#1f5799;--ink:#25303c;--muted:#566476;--faint:#8794a5;--line:#d9e2ec;--line2:#e8edf3;--bg:#f3f7fb;--rail:#e9eff6;--card:#fff;
  --soft:#e3edf9;--hover:#edf2f9;--sel:#dce8f7;--chipbg:#e8eef6;--field:#c3cfdc;--toast:#24303d;--formbar:#25303c;--pvbg:#66707c;--ring:rgba(37,96,168,.12);--grid:#e2e8ef;
  --s1:#2a78d6;--s2:#1a9e66;--inc:#2a78d6;--area:rgba(42,120,214,.14);--g1:#2560a8}
:root[data-theme="warm"]{color-scheme:light;
  --brand:#8a5a2b;--brand2:#6f4820;--brandink:#7a4e23;--ink:#3b3226;--muted:#6a5d4d;--faint:#9a8c78;--line:#e5dac7;--line2:#efe6d7;--bg:#f9f4ea;--rail:#f1e9da;--card:#fffcf5;
  --soft:#f1e6d1;--hover:#f5ede0;--sel:#eee2ca;--chipbg:#f0e7d7;--field:#d6c8b0;--warn:#fbeecb;--ok:#4c7428;--bad:#a8382a;--danger:#a8382a;--amber:#8a5700;--info:#3d5e8c;
  --badbg:#f8e3dc;--badink:#7f2a1d;--toast:#3b3226;--formbar:#3b3226;--pvbg:#7a6f60;--ring:rgba(138,90,43,.13);--grid:#ebe1d0;
  --s1:#b07a3a;--s3:#c2582c;--inc:#8f6a2e;--area:rgba(176,122,58,.16);--g1:#8a5a2b;--shadow:0 1px 2px rgba(70,50,20,.07),0 4px 18px rgba(70,50,20,.08)}
:root[data-theme="dark"]{color-scheme:dark;
  --brand:#16805a;--brand2:#0f6b4a;--brandink:#5fd1a4;--onbrand:#fff;--ink:#e6eee9;--muted:#a3b2ab;--faint:#7d8a84;--line:#2e3a35;--line2:#25302b;--bg:#121816;--rail:#0d1210;--card:#18201d;
  --soft:#173528;--hover:#1f2a26;--sel:#1b3a2d;--warn:#3a3218;--ok:#5fd18f;--bad:#ff7d6e;--danger:#b8392b;--amber:#f0b24a;--info:#8ab4ff;--chipbg:#22302a;--field:#3a4842;
  --badbg:#3d1d19;--badink:#ffb3a8;--toast:#2a3631;--toastink:#eef4f0;--scrim:rgba(0,0,0,.55);--formbar:#060a08;--pvbg:#2b3330;--ring:rgba(95,209,164,.14);
  --s1:#2fbf80;--s2:#3987e5;--s3:#d95926;--s4:#9085e9;--s5:#77807b;--inc:#2fbf80;--exp:#2aa59e;--area:rgba(47,191,128,.18);--grid:#28332e;--g0:#8a9790;--g1:#16805a;--shadow:0 1px 3px rgba(0,0,0,.4),0 8px 28px rgba(0,0,0,.45)}
@media (prefers-color-scheme:dark){:root[data-theme="auto"]{color-scheme:dark;
  --brand:#16805a;--brand2:#0f6b4a;--brandink:#5fd1a4;--onbrand:#fff;--ink:#e6eee9;--muted:#a3b2ab;--faint:#7d8a84;--line:#2e3a35;--line2:#25302b;--bg:#121816;--rail:#0d1210;--card:#18201d;
  --soft:#173528;--hover:#1f2a26;--sel:#1b3a2d;--warn:#3a3218;--ok:#5fd18f;--bad:#ff7d6e;--danger:#b8392b;--amber:#f0b24a;--info:#8ab4ff;--chipbg:#22302a;--field:#3a4842;
  --badbg:#3d1d19;--badink:#ffb3a8;--toast:#2a3631;--toastink:#eef4f0;--scrim:rgba(0,0,0,.55);--formbar:#060a08;--pvbg:#2b3330;--ring:rgba(95,209,164,.14);
  --s1:#2fbf80;--s2:#3987e5;--s3:#d95926;--s4:#9085e9;--s5:#77807b;--inc:#2fbf80;--exp:#2aa59e;--area:rgba(47,191,128,.18);--grid:#28332e;--g0:#8a9790;--g1:#16805a;--shadow:0 1px 3px rgba(0,0,0,.4),0 8px 28px rgba(0,0,0,.45)}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Avenir Next",system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",sans-serif;background:var(--bg);color:var(--ink);line-height:1.45;font-size:14.5px;overflow-x:hidden}
a{color:var(--brandink);text-decoration:none}
a:hover{text-decoration:underline}
h1{font-size:30px;font-weight:500;margin:0 0 12px;line-height:1.2;letter-spacing:-.2px}
h2{font-size:17px;margin:0 0 10px;font-weight:600}
[hidden]{display:none!important}
.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:middle}
.ic.tiny{width:15px;height:15px;margin-right:6px}
.grow{flex:1}
.mute{color:var(--muted)}
.block{display:block}

/* ---------- Shell ---------- */
#rail,#panel,#top,#bottom{display:none}
body.signed #rail{display:flex;flex-direction:column;align-items:center;position:fixed;left:0;top:0;bottom:0;width:76px;background:var(--rail);z-index:30;padding:10px 0 8px;overflow-y:auto;scrollbar-width:none}
.raillogo{display:flex;width:40px;height:40px;margin:4px 0 12px}
.raillogo img{width:40px;height:40px;border-radius:11px}
.rb{display:flex;flex-direction:column;align-items:center;gap:3px;width:68px;padding:7px 0 6px;border:0;background:none;color:var(--ink);font:inherit;font-size:11px;cursor:pointer;border-radius:10px;text-decoration:none!important}
.rb .ic{width:36px;height:36px;padding:7px;border-radius:10px;stroke-width:1.6}
.rb:hover .ic{background:var(--hover)}
.rb.on .ic{background:var(--brand);color:var(--onbrand)}
.rb.on{font-weight:600}
.railsep{font-size:10px;font-weight:700;letter-spacing:.6px;color:var(--muted);margin:10px 0 2px}
.rcust{margin-top:auto;border-top:1px solid var(--line);border-radius:0;padding-top:10px}
body.signed #top{display:flex;align-items:center;gap:14px;position:fixed;left:76px;right:0;top:0;height:60px;background:var(--card);border-bottom:1px solid var(--line);z-index:25;padding:0 18px 0 22px}
.toplogo,.mobmenu{display:none!important}
.coname{display:flex;align-items:center;gap:8px;min-width:0;flex:0 1 260px}
.coname b{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:uppercase;letter-spacing:.2px}
.testpill{font-size:10px;font-weight:700;background:#ffc93c;color:#1b1f2a;border-radius:99px;padding:1px 7px;cursor:help;flex:none}
.search{position:relative;flex:1 1 560px;max-width:600px;margin:0 auto}
.search label{display:flex;align-items:center;gap:8px;background:var(--rail);border:1px solid transparent;border-radius:6px;padding:0 12px;height:36px}
.search label:focus-within{border-color:var(--brand);background:var(--card)}
.search input{border:0;background:none;padding:0;height:34px;font-size:14px;outline:none}
.search .ic{color:var(--muted);width:18px;height:18px}
.sres{display:none;position:absolute;left:0;right:0;top:42px;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);max-height:70vh;overflow:auto;padding:6px 0;z-index:40}
.sres.show{display:block}
.sres .sg{font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);margin:8px 14px 4px}
.sres a{display:flex;align-items:center;gap:10px;padding:7px 14px;color:var(--ink);text-decoration:none!important}
.sres a span{display:flex;flex-direction:column;min-width:0;flex:1}
.sres a small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sres a em{font-style:normal;color:var(--muted);font-variant-numeric:tabular-nums}
.sres a.on,.sres a:hover{background:var(--hover)}
.sres .ic{width:18px;height:18px;color:var(--muted)}
.topicons{display:flex;align-items:center;gap:4px;flex:none}
.sync{font-size:11.5px;color:var(--muted);margin-right:8px;white-space:nowrap}
.sync[data-s=synced]::before{content:"● ";color:var(--ok)}
.sync[data-s=local]::before,.sync[data-s=offline]::before,.sync[data-s=guest]::before{content:"● ";color:var(--amber)}
.iconbtn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:0;border-radius:8px;background:none;color:var(--ink);cursor:pointer;position:relative;flex:none;text-decoration:none!important}
.iconbtn:hover{background:var(--hover)}
.iconbtn:disabled{opacity:.35;cursor:default}
.iconbtn.small{width:26px;height:26px}
.iconbtn.small .ic{width:16px;height:16px}
.iconbtn .dot{position:absolute;top:7px;right:8px;width:8px;height:8px;border-radius:50%;background:var(--bad);border:2px solid var(--card)}
.avatar{width:32px;height:32px;border-radius:50%;border:0;background:var(--info);color:var(--card);font-weight:700;font-size:14px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex:none;margin-left:4px}
.avatar.big{width:40px;height:40px;font-size:17px;margin:0}
body.signed #panel{display:block;position:fixed;left:76px;top:60px;bottom:0;width:240px;background:var(--card);border-right:1px solid var(--line);z-index:20;overflow-y:auto;padding:12px 10px 24px;transform:translateX(-110%);transition:transform .18s;visibility:hidden}
body.signed.panel-open #panel{transform:none;visibility:visible}
.phead{display:flex;align-items:center;justify-content:space-between;padding:2px 6px 8px}
.phead b{font-size:12px;letter-spacing:.6px}
.pmob{display:none}
.pg{display:flex;align-items:center;gap:10px;width:100%;padding:9px 8px;border:0;background:none;color:var(--ink);font:inherit;font-size:14.5px;cursor:pointer;border-radius:8px;text-align:left;text-decoration:none!important}
.pg:hover{background:var(--hover)}
.pg .car{margin-left:auto;width:16px;height:16px;color:var(--muted);transition:transform .15s}
.pgroup.open .pg .car{transform:rotate(180deg)}
.pgtop{display:none}
.pitems{display:none;padding:2px 0 6px}
.pgroup.open .pitems{display:block}
.pi{display:flex;align-items:center;gap:6px;padding:8px 10px 8px 38px;border-radius:8px;color:var(--ink);font-size:14px;text-decoration:none!important}
.pi:hover{background:var(--hover)}
.pi.on{background:var(--sel);font-weight:700}
.pi span{flex:1}
.pi em,.cl em,.fl em,.ddmenu .soon em{font-style:normal;font-size:10.5px;font-weight:700;color:var(--muted);background:var(--chipbg);border-radius:99px;padding:1px 7px;margin-left:auto}
.pi.soon{color:var(--muted)}
.bm{display:inline-flex;opacity:0;color:var(--muted)}
.bm .ic{width:15px;height:15px}
.pi:hover .bm,.bm.on{opacity:1}
.bm.on .ic{fill:currentColor;color:var(--ink)}
.appdot{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;color:#fff;flex:none}
.appdot .ic{width:14px;height:14px;stroke-width:2.2}
.g0{background:var(--g0)}.g1{background:var(--g1)}.g2{background:var(--g2)}.g3{background:var(--g3)}.g4{background:var(--g4)}.g5{background:var(--g5)}.g6{background:var(--g6)}.g7{background:var(--g7)}
main{min-width:0;padding:24px 16px 60px}
body.signed main{margin-left:76px;padding:76px 32px 80px;transition:margin .18s}
body.signed.panel-open main{margin-left:316px}

/* flyouts */
#flyout{display:none;position:fixed;left:84px;top:68px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:35;max-height:calc(100vh - 80px);overflow:auto}
#flyout.show{display:block}
#flyout.k-create{width:min(860px,calc(100vw - 100px));padding:8px 20px 20px}
#flyout.k-bookmarks{width:280px;padding:6px 8px 10px;top:120px}
#flyout.k-apps{top:auto;bottom:auto;top:200px;width:520px;padding:0}
.fhead{display:flex;align-items:center;justify-content:space-between;padding:8px 4px}
.fhead b{font-size:13px;letter-spacing:.5px}
.cgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px 24px}
.cgrid h3{font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);margin:8px 0 6px;padding-bottom:6px;border-bottom:1px solid var(--line2)}
.cl{display:flex;align-items:center;padding:7px 8px;margin:0 -8px;border-radius:6px;color:var(--ink);text-decoration:none!important}
a.cl:hover{background:var(--hover)}
.cl.soon{color:var(--faint)}
.appsfly{display:grid;grid-template-columns:240px 1fr;min-height:340px}
.acol{border-right:1px solid var(--line2);padding:8px}
.asub{padding:8px}
.ftitle{font-size:12px;font-weight:700;letter-spacing:.6px;color:var(--muted);margin:6px 8px 8px}
.ag{display:flex;align-items:center;gap:10px;width:100%;padding:9px 8px;border:0;background:none;color:var(--ink);font:inherit;cursor:pointer;border-radius:8px;text-align:left;text-decoration:none!important}
.ag .car{margin-left:auto;width:16px;height:16px;color:var(--muted)}
.ag:hover,.ag.on{background:var(--hover)}
.fsep{border-top:1px solid var(--line2);margin:6px 0}
.fl{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;color:var(--ink);text-decoration:none!important}
a.fl:hover{background:var(--hover)}
.fl.soon{color:var(--faint)}
.pad{padding:12px 16px}

/* dropdown menus */
.dd{position:relative;display:inline-flex}
.ddmenu{display:none;position:absolute;top:calc(100% + 4px);left:0;min-width:200px;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:6px 0;z-index:45;text-align:left}
.ddmenu.right{left:auto;right:0}
.ddmenu.wide{min-width:300px}
.dd.up .ddmenu{top:auto;bottom:calc(100% + 4px)}
.dd.open>.ddmenu{display:block}
.ddmenu a,.ddmenu button{display:flex;align-items:center;gap:10px;width:100%;padding:8px 14px;border:0;background:none;color:var(--ink);font:inherit;font-size:14px;cursor:pointer;text-align:left;text-decoration:none!important;white-space:nowrap}
.ddmenu a:hover,.ddmenu button:hover{background:var(--hover)}
.ddmenu .danger{color:var(--bad)}
.ddmenu .ic{width:18px;height:18px;color:var(--muted)}
.ddmenu small{display:block;color:var(--muted);white-space:normal}
#bellMenu a{flex-direction:column;align-items:flex-start;gap:0;white-space:normal}
.ddtitle{font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);margin:6px 14px 4px}
.ddnote{color:var(--muted);font-size:13px;margin:6px 14px}
.ddmenu .check{padding:5px 14px}
.ddwho{display:flex;gap:10px;align-items:center;padding:8px 14px 10px;border-bottom:1px solid var(--line2);margin-bottom:4px}
.ddwho div{display:flex;flex-direction:column;min-width:0}
.ddwho small{color:var(--muted);overflow:hidden;text-overflow:ellipsis}
.fpanel{padding:12px 14px;min-width:260px;display:none;flex-direction:column;gap:10px}
.dd.open>.fpanel{display:flex}

/* phones */
.bottom{display:none}
#scrim{display:none}
@media (max-width:899px){
  body.signed #rail{display:none}
  body.signed #top{left:0;height:56px;padding:0 8px;gap:6px}
  .mobmenu{display:inline-flex!important}
  .toplogo{display:flex!important;flex:none}
  .toplogo img{width:30px;height:30px;border-radius:8px}
  .coname{display:none}
  .search{max-width:none;flex:1 1 auto;min-width:0}
  .search input::placeholder{color:transparent}
  .search label::after{content:"Search";position:absolute;left:38px;color:var(--muted);pointer-events:none;font-size:14px}
  .search label:focus-within::after,.search.has label::after{display:none}
  .sync,.tophelp,.topgear{display:none!important}
  .topbell .ddmenu{position:fixed;left:8px;right:8px;top:56px;min-width:0}
  body.signed #panel{left:0;top:0;width:300px;max-width:88vw;z-index:50;transform:translateX(-105%);box-shadow:var(--shadow)}
  body.signed.drawer #panel{transform:none;visibility:visible}
  body.signed.panel-open #panel{transform:translateX(-105%);visibility:hidden}
  body.signed.drawer.panel-open #panel{transform:none;visibility:visible}
  body.drawer #scrim,body.flyopen #scrim{display:block;position:fixed;inset:0;background:var(--scrim);z-index:32}
  body.drawer #scrim{z-index:45}
  .pmob{display:flex;gap:10px;align-items:center;padding:6px 6px 12px;border-bottom:1px solid var(--line2);margin-bottom:8px}
  .pmob img{width:34px;height:34px;border-radius:9px}
  .pmob div{display:flex;flex-direction:column;min-width:0}
  .pmob b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .pmob small{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis}
  .pgtop{display:flex}
  .phead{display:none}
  body.signed main,body.signed.panel-open main{margin-left:0;padding:70px 14px 96px}
  body.signed .bottom{display:flex;position:fixed;left:0;right:0;bottom:0;background:var(--card);border-top:1px solid var(--line);z-index:30;padding:4px 4px calc(4px + env(safe-area-inset-bottom))}
  .bottom a,.bottom button{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 2px;font-size:11px;color:var(--muted);text-decoration:none!important;background:none;border:0;cursor:pointer;font-family:inherit}
  .bottom a.on{color:var(--brandink);font-weight:700}
  .bottom #b-create .ic{background:var(--brand);color:var(--onbrand);border-radius:50%;padding:4px;width:30px;height:30px}
  #flyout{left:8px!important;right:8px;top:64px!important;width:auto!important;max-height:calc(100vh - 140px)}
  #flyout.k-create{padding:6px 14px 14px}
  .cgrid{grid-template-columns:1fr 1fr;gap:4px 16px}
  .appsfly{grid-template-columns:1fr;min-height:0}
  .acol{border-right:0;border-bottom:1px solid var(--line2)}
  h1{font-size:24px}
}
@media (max-width:420px){.cgrid{grid-template-columns:1fr}}

/* ---------- Buttons & inputs ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1.5px solid var(--brand);background:var(--brand);color:var(--onbrand)!important;font-size:14.5px;font-weight:600;padding:7px 16px;min-height:38px;border-radius:6px;cursor:pointer;text-decoration:none!important;font-family:inherit;white-space:nowrap}
.btn:hover{background:var(--brand2);border-color:var(--brand2)}
.btn:disabled{opacity:.5;cursor:default}
.btn .ic{width:18px;height:18px}
.btn.outline,.btn.ghost{background:var(--card);color:var(--brandink)!important;border-color:var(--brand)}
.btn.ghost{color:var(--ink)!important;border-color:var(--line)}
.btn.outline:hover,.btn.ghost:hover{background:var(--soft)}
.btn.plain{background:none;border-color:transparent;color:var(--ink)!important;font-weight:500;padding:7px 8px}
.btn.plain:hover{background:var(--hover)}
.btn.danger{color:var(--bad)!important;border-color:var(--line)}
.btn.small{font-size:13.5px;padding:4px 12px;min-height:32px}
.btn.wide{width:100%}
.btn.file{position:relative}
.split{display:inline-flex}
.split>.btn:first-child:not(:only-of-type){border-top-right-radius:0;border-bottom-right-radius:0}
.split>.btn.ddbtn:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0;border-left:1px solid rgba(255,255,255,.4);padding:7px 8px;margin-left:0}
.split>.btn.outline.ddbtn:not(:first-child){border-left:1px solid var(--brand)}
.split.small>.btn.ddbtn{padding:4px 6px}
.mini{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:6px;padding:5px 9px;font-size:13px;cursor:pointer;white-space:nowrap;font-family:inherit}
.linkbtn{background:none;border:0;color:var(--brandink);cursor:pointer;font-size:14px;font-family:inherit;padding:0;display:inline-flex;align-items:center;gap:4px}
.linkbtn:hover{text-decoration:underline}
.linkbtn.plain{color:var(--ink)}
.linkbtn.center{display:flex;margin:10px auto 0}
.linkbtn.strong{font-weight:700}
.row{display:flex;gap:8px;align-items:center}
.row.wrap{flex-wrap:wrap}.row.center{justify-content:center}
input,select,textarea{font:inherit;color:var(--ink);background:var(--card);border:1px solid var(--field);border-radius:4px;padding:7px 10px;width:100%;min-width:0;min-height:36px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
input[type=checkbox],input[type=radio]{width:auto;min-height:0;accent-color:var(--brand)}
input:disabled,select:disabled{opacity:.6}
.fld{display:flex;flex-direction:column;gap:4px;min-width:0}
.fld>span:first-child{font-size:13px;color:var(--muted)}
.check{display:flex;align-items:center;gap:8px;font-size:14px}
.check.big{padding:6px 0;font-size:15px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px 16px;margin-bottom:14px}
.grid .wide{grid-column:1/-1}

/* ---------- Page chrome ---------- */
.crumbs{font-size:12.5px;color:var(--muted);margin:0 0 6px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-height:18px}
.crumbs a{color:var(--muted)}
.crumbs i{font-style:normal;color:var(--faint)}
.pagehead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.pagehead h1{margin:0}
.pageacts{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.sub{color:var(--muted);margin:4px 0 10px}
.group{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:22px 0 10px;font-weight:700}
.panel{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:18px;margin-bottom:16px}
.panel.start{background:var(--soft);border-color:transparent}
.tcard{background:var(--card);border:1px solid var(--line);border-radius:10px;margin-bottom:16px;min-width:0}
.tcard.pad{padding:18px}
.cardh{font-size:15px;padding:14px 16px 0;margin:0 0 6px}
.count{background:var(--chipbg);color:var(--muted);border-radius:99px;padding:1px 9px;font-size:12px;font-weight:600}
.empty{color:var(--muted);padding:6px 0}
.note{background:var(--soft);border-radius:8px;padding:10px 14px;margin:0 0 14px}
.note .ic{width:18px;height:18px}
.note.bad{background:var(--badbg);color:var(--badink)}
.note.warnbg{background:var(--warn)}
.fine{color:var(--muted);font-size:12.5px;margin:10px 0}
.bad{color:var(--bad)}.warn{color:var(--amber)}.ok{color:var(--ok)}
.chip{display:inline-block;border-radius:99px;padding:2px 9px;font-size:12px;font-weight:700;background:var(--chipbg);color:var(--muted);white-space:nowrap;text-transform:capitalize}
.chip.ok{color:var(--ok)}.chip.bad{color:#fff;background:var(--danger)}.chip.warn{color:var(--amber)}.chip.info{color:var(--info)}
.soonpanel{text-align:center;padding:40px 20px}
.soonpanel>.ic{width:44px;height:44px;color:var(--brandink)}

/* toolbars & filters */
.lfilters,.toolbar,.sofilters{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line2)}
.sofilters{align-items:flex-end}
.sofilters .fld{width:200px}
.tsearch{display:flex;align-items:center;gap:6px;border:1px solid var(--field);border-radius:4px;padding:0 10px;background:var(--card);min-width:200px;flex:0 1 260px}
.tsearch input{border:0;padding:0;min-height:34px;box-shadow:none!important}
.tsearch .ic{color:var(--muted);width:18px;height:18px}
.tsearch.wide{max-width:520px;flex:1;margin:0 0 16px;min-height:38px}
.tsel{position:relative;display:inline-flex;align-items:center}
.tsel select{appearance:none;-webkit-appearance:none;padding-right:34px;min-width:170px}
.tsel .ic{position:absolute;right:9px;pointer-events:none;color:var(--muted);width:18px;height:18px}
.pill{border:1px solid var(--line);background:var(--chipbg);border-radius:99px;padding:5px 12px;font:inherit;font-size:13.5px;cursor:pointer;color:var(--ink);display:inline-flex;align-items:center;gap:6px}
.pill.on{background:var(--soft);border-color:var(--brand)}
.pill .ic{width:14px;height:14px}
.pager{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:13.5px}
.qpager{display:flex;justify-content:flex-end;align-items:center;gap:6px;padding:10px 14px;font-size:13.5px;flex-wrap:wrap}
.qpager button{border:0;background:none;color:var(--brandink);cursor:pointer;font:inherit;padding:4px 8px}
.qpager button:disabled{color:var(--faint);cursor:default}
.batch{display:flex;gap:10px;align-items:center;padding:8px 14px;background:var(--soft);flex-wrap:wrap}

/* tables */
.tablewrap{overflow-x:auto;max-width:100%}
.tbl{width:100%;border-collapse:collapse;background:var(--card)}
.tbl th{text-align:left;font-size:12px;color:var(--muted);font-weight:700;padding:11px 12px;border-bottom:1px solid var(--line);white-space:nowrap;letter-spacing:.2px}
.tbl.list th.r{white-space:normal;max-width:96px}
.tbl.list td,.tbl.list th{padding-left:9px;padding-right:9px}
.tbl.list .cat-sel{min-width:0;width:150px}
.tbl td{padding:10px 12px;border-top:1px solid var(--line2);vertical-align:middle}
.tbl tbody tr:first-child td{border-top:0}
.tbl .r{text-align:right;white-space:nowrap}
.tbl td.r{font-variant-numeric:tabular-nums}
.tbl .cb{width:40px;padding-right:0}
.tbl td.nw,.tbl a.nw{white-space:nowrap}
.tbl tr[data-go]{cursor:pointer}
.tbl tbody tr:hover td{background:var(--hover)}
.tbl tr.voided td{opacity:.55;text-decoration:line-through}
.tbl tr.voided td:last-child{text-decoration:none}
.tbl tfoot td{font-weight:700;border-top:1px solid var(--line);padding:12px}
.tbl .ap{width:120px;text-align:right}
.tbl select{min-height:32px;padding:4px 8px}
.qtbl td a{font-weight:500}
.catcell select{max-width:240px;min-width:170px}
.sortable{cursor:pointer;user-select:none}
.sortable .ic{width:14px;height:14px}
.rowact{display:inline-flex;align-items:center;gap:2px;justify-content:flex-end}
.ra-main{font-weight:600;white-space:nowrap}
.vbar{width:1px;height:16px;background:var(--line);margin:0 4px}
.coa td:nth-child(3){min-width:150px}
.rowact .ra-main{white-space:nowrap}
.coa td input{min-height:32px;padding:4px 8px;max-width:260px}
@media (max-width:899px){
  .tbl.list,.tbl.list tbody,.tbl.list tfoot,.tbl.list tr,.tbl.list td{display:block;width:100%}
  .tbl.list thead{display:none}
  .tbl.list tr{border-top:1px solid var(--line);padding:10px 14px}
  .tbl.list tbody tr:first-child{border-top:0}
  .tbl.list td{border:0;padding:3px 0;display:flex;justify-content:space-between;align-items:center;gap:12px;text-align:right;min-height:28px}
  .tbl.list td::before{content:attr(data-l);color:var(--muted);font-size:12.5px;text-align:left;flex:none;max-width:45%}
  .tbl.list td:not([data-l])::before,.tbl.list td[data-l=""]::before{content:""}
  .tbl.list td.cb{display:none}
  .tbl.list tfoot td:empty{display:none}
  .tbl.list .r{white-space:normal}
  .tbl.list tbody tr:hover td{background:none}
  .catcell select{max-width:60%}
  .sofilters .fld{width:100%}
  .tsearch{flex:1 1 100%}
}
@media (max-width:600px){.tsel,.tsel select{width:100%}.lfilters .dd{flex:1}}

/* money bar */
.moneybar{display:grid;grid-template-columns:2fr 1fr;gap:28px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px 20px;margin-bottom:16px}
.mb-h{margin:0 0 6px;font-weight:600}
.mb-h small{color:var(--muted);font-weight:400}
.mb-row{display:flex;gap:32px;flex-wrap:wrap}
.mb-item{display:flex;flex-direction:column;color:var(--ink)!important;text-decoration:none!important}
.mb-item b{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums}
.mb-item span{color:var(--muted);font-size:13px}
.mb-bar{display:flex;height:10px;border-radius:5px;background:var(--line2);overflow:hidden;margin-top:8px;gap:2px}
.mb-bar i{display:block;height:100%}
.mb-bar .over{background:var(--s3)}.mb-bar .due{background:var(--s5)}.mb-bar .paid{background:var(--s1)}
@media (max-width:700px){.moneybar{grid-template-columns:1fr;gap:14px}}

/* ---------- Sign-in & company chooser ---------- */
.authpage{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:56px 16px 0}
.authcard{width:100%;max-width:400px;background:var(--card);border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,.12),0 2px 12px rgba(0,0,0,.06);padding:32px 22px 30px;border:1px solid var(--line2)}
.authlogo{display:flex;align-items:center;justify-content:center;gap:9px;font-size:21px;margin-bottom:18px;color:var(--ink)}
.authlogo img{width:34px;height:34px;border-radius:9px}
.authlogo b{color:var(--brandink)}
.authh{font-size:21px;font-weight:600;text-align:center;margin:0 0 6px}
.authsub{text-align:center;color:var(--muted);margin:0 0 18px;font-size:14px}
.authemail{text-align:center;font-weight:600;margin:8px 0 2px}
.authcard form{display:flex;flex-direction:column;gap:14px;margin-top:14px}
.authcard .btn{min-height:40px}
.pwlabel{display:flex;justify-content:space-between;align-items:center}
.pwlabel label{font-size:13px;color:var(--muted)}
.linkbtn.show{font-size:13px;color:var(--brandink)}
.linkbtn.show .ic{width:16px;height:16px}
.or{display:flex;align-items:center;gap:10px;color:var(--faint);font-size:12.5px;margin:18px 0}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
.gmark{font-weight:900;color:#4285f4;font-size:16px}
.authalt{text-align:center;font-size:14px;margin:18px 0 0}
.guestbox{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line2)}
.guestbox .linkbtn{font-size:13px}
.guestbox small{color:var(--muted);font-size:11.5px}
.err{color:var(--bad);min-height:0;margin:8px 0 0;font-size:13.5px;text-align:center}
.err:empty{display:none}
.authfoot{margin-top:auto;padding:40px 0 18px;text-align:center;font-size:12px;color:var(--muted)}
.authfoot nav{display:flex;gap:18px;justify-content:center;margin-bottom:8px}
.authfoot a{color:var(--info)}
.authfoot p{margin:4px 0}
.testnote{color:var(--amber)}
.csearch{display:flex;align-items:center;gap:8px;border:1px solid var(--field);border-radius:4px;padding:0 10px;margin:14px 0 4px}
.csearch input{border:0;box-shadow:none!important;padding:0}
.csearch .ic{color:var(--muted)}
.colabel{color:var(--muted);font-size:13.5px;margin:16px 6px 10px}
.cocard{display:flex;align-items:center;gap:4px;border-radius:10px;box-shadow:0 1px 4px rgba(0,0,0,.14);margin:0 0 14px;background:var(--card);border:1px solid var(--line2)}
.cocard:hover{box-shadow:0 2px 10px rgba(0,0,0,.18)}
.coopen{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:18px 16px;border:0;background:none;color:var(--ink);font:inherit;cursor:pointer;text-align:left;min-width:0}
.coopen b{font-weight:600;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.coopen small{color:var(--brandink);font-size:11.5px;font-weight:600}
.cocard .dd{margin-right:8px}
.coempty{color:var(--muted);text-align:center;margin:12px 0}
.cosep{border-top:1px solid var(--line);margin:20px 0 6px}

/* setup */
.setup{max-width:640px;margin:10px auto}
.setuplogo{display:flex;align-items:center;gap:8px;justify-content:center;margin:10px 0 26px;color:var(--ink)!important;font-size:19px}
.setuplogo img{width:30px;height:30px;border-radius:8px}
.setuplogo b{color:var(--brandink)}
.steps{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:14px;color:var(--muted)}
.steps b{color:var(--ink)}
.bar{height:6px;background:var(--line);border-radius:6px;margin:8px 0 26px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--brand);transition:width .3s}
.q{display:block;font-size:24px;font-weight:600;line-height:1.25;margin-bottom:14px}
.big{font-size:18px;padding:12px 14px;border-radius:8px}
.opts{display:grid;gap:10px}
.opt{font:inherit;font-size:16px;text-align:left;padding:14px 16px;border-radius:10px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;display:flex;flex-direction:column;gap:2px}
.opt.on{border-color:var(--brand);background:var(--soft)}
.opt:disabled{opacity:.55;cursor:default}
.opt small{color:var(--muted);font-size:14px}
.tag{font-size:12px}
.opt .tag,.q .tag{display:inline-block;background:var(--chipbg);color:var(--muted);border-radius:99px;padding:1px 8px;font-weight:600;margin-left:6px}
.help{color:var(--muted);margin-top:14px}
.nav{display:flex;justify-content:space-between;margin-top:24px;gap:10px}
.sum{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 18px}
.sum dt{color:var(--muted)}.sum dd{margin:0;font-weight:600}

/* ---------- Home ---------- */
.home{max-width:1320px}
.homeacts{display:flex;justify-content:flex-end;gap:22px;margin-bottom:-8px}
.homeacts .linkbtn{color:var(--muted);font-size:14.5px;gap:6px}
.welcome{text-align:center;font-size:34px;font-weight:500;margin:8px 0 22px}
.pillrow{display:flex;align-items:center;gap:6px;justify-content:center;margin-bottom:26px}
.pills{display:flex;gap:10px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;padding:2px;min-width:0}
.pills::-webkit-scrollbar{display:none}
.apppill{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:99px;padding:7px 18px 7px 7px;color:var(--ink)!important;font-weight:600;white-space:nowrap;text-decoration:none!important;background:var(--card);flex:none}
.apppill:hover{box-shadow:0 1px 6px rgba(0,0,0,.12)}
.apppill .appdot{width:30px;height:30px}
.apppill .appdot .ic{width:17px;height:17px}
.pillnext{border:0;background:none;color:var(--ink);cursor:pointer;padding:6px;border-radius:50%;flex:none}
.pillnext:hover{background:var(--hover)}
.feedhead{display:flex;align-items:center;justify-content:space-between}
.feed{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin:0 0 26px}
.fcard{border:1px solid var(--line);border-radius:10px;padding:16px 18px;background:var(--card);display:flex;flex-direction:column;gap:6px}
.fcard:first-child{border-color:var(--brand)}
.fctop{display:flex;align-items:center;gap:10px}
.fctop a{color:var(--ink)!important;flex:1}
.fic{display:inline-flex;width:28px;height:28px;border-radius:6px;background:var(--chipbg);align-items:center;justify-content:center;flex:none}
.fic .ic{width:17px;height:17px}
.fcard.bad .fic{color:var(--bad)}.fcard.warn .fic{color:var(--amber)}.fcard.info .fic{color:var(--info)}
.fcard p{margin:0;color:var(--ink)}
.fgo{font-weight:600;font-size:13.5px;display:inline-flex;align-items:center;gap:2px;margin-top:auto}
.fgo .ic{width:16px;height:16px}
.createacts{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 30px}
.createacts>b{font-size:16px;margin-right:4px}
.cchip{border:1px solid var(--line);border-radius:99px;padding:6px 14px;color:var(--ink)!important;text-decoration:none!important;background:var(--card);font-size:14.5px}
.cchip:hover{border-color:var(--brand);background:var(--soft)}
.glance{font-size:16px;font-weight:600;margin:0 0 14px}
.gcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:20px}
.gcard{border:1px solid var(--line);border-radius:10px;padding:18px 20px 0;background:var(--card);display:flex;flex-direction:column;min-width:0;min-height:300px}
@media (max-width:899px){.gcard{min-height:0}.gcard .gfoot,.gcard>footer{margin-top:12px}}
.gcard.c-cashflow{grid-column:span 2}
.ghead{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.ghead h3{font-size:14px;font-weight:600;margin:0;letter-spacing:.2px}
.asof{font-size:12.5px;color:var(--muted)}
.psel{position:relative;display:inline-flex;align-items:center}
.psel select{appearance:none;-webkit-appearance:none;border:0;background:none;font-size:13px;padding:2px 22px 2px 4px;min-height:0;cursor:pointer;color:var(--ink);box-shadow:none!important}
.psel .ic{position:absolute;right:0;width:16px;height:16px;pointer-events:none}
.glabel{margin:0;color:var(--muted);font-size:14px}
.glabel small{font-size:12px}
.gbig{font-size:26px;margin:2px 0 2px;font-variant-numeric:tabular-nums;font-weight:400}
.gbig.small{font-size:20px}
.gbig.neg{color:var(--bad)}
.delta{display:flex;align-items:center;gap:4px;margin:0 0 14px;font-size:14px;color:var(--muted)}
.delta b{font-weight:600}
.delta .ic{width:16px;height:16px;stroke-width:2.2}
.delta.ok b,.delta.ok .ic{color:var(--ok)}.delta.bad b,.delta.bad .ic{color:var(--bad)}
.hbar{display:grid;grid-template-columns:110px 1fr;gap:12px;align-items:center;margin:8px 0}
.hbl{display:flex;flex-direction:column}
.hbl b{font-weight:600;font-variant-numeric:tabular-nums}
.hbl span{color:var(--muted);font-size:13px}
.hbt{height:22px;display:flex}
.hbt i{display:block;height:100%;border-radius:0 4px 4px 0;min-width:2px}
.hbt i.inc{background:var(--inc)}.hbt i.exp{background:var(--exp)}
.gfoot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:auto -20px 0;padding:12px 20px;border-top:1px solid var(--line2)}
.gfoot a,.gfoot .linkbtn{display:inline-flex;align-items:center;gap:6px;font-size:14px}
.gfoot .ic{width:16px;height:16px}
.donutwrap{display:flex;align-items:center;gap:18px;margin:4px 0 14px;flex-wrap:wrap}
.donut{width:140px;height:140px;flex:none;transform:rotate(-90deg)}
.donut circle{fill:none;stroke-width:22}
.donut .track{stroke:var(--line2)}
.seg.s1{stroke:var(--s1)}.seg.s2{stroke:var(--s2)}.seg.s3{stroke:var(--s3)}.seg.s4{stroke:var(--s4)}.seg.s5{stroke:var(--s5)}
.legend{list-style:none;margin:0;padding:0;flex:1;min-width:160px;display:flex;flex-direction:column;gap:6px;font-size:13.5px}
.legend li{display:flex;align-items:center;gap:8px}
.legend span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.legend b{font-weight:500;font-variant-numeric:tabular-nums}
.sw{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none}
.sw.ln{width:14px;height:3px;border-radius:2px}
.sw.s1{background:var(--s1)}.sw.s2{background:var(--s2)}.sw.s3{background:var(--s3)}.sw.s4{background:var(--s4)}.sw.s5{background:var(--s5)}
.banklist{list-style:none;margin:10px 0 12px;padding:0;display:flex;flex-direction:column;gap:12px}
.banklist li{display:flex;gap:12px}
.bankic{display:inline-flex;width:34px;height:34px;border-radius:50%;background:var(--info);color:var(--card);align-items:center;justify-content:center;flex:none}
.bankic .ic{width:19px;height:19px}
.bankic.big{width:40px;height:40px}
.bkname{flex:1;min-width:0}
.bkrow{display:flex;justify-content:space-between;gap:8px;font-size:13.5px}
.bkrow b{font-weight:500;font-variant-numeric:tabular-nums}
.bkrow small{color:var(--muted)}
.review{font-size:13px;font-weight:600}
.cashtop{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.seg2{display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.seg2 button{border:0;background:var(--card);color:var(--ink);font:inherit;font-size:13px;padding:5px 14px;cursor:pointer}
.seg2 button.on{background:var(--ink);color:var(--card);font-weight:600}
.seg2.small button{font-size:12px;padding:3px 9px}
.chart{position:relative;margin:10px 0 0;min-height:210px;width:100%}
.chart svg{display:block}
.chart .grid{stroke:var(--grid);stroke-width:1}
.chart .grid.zero{stroke:var(--faint)}
.chart text{fill:var(--muted);font-size:11.5px;font-family:inherit}
.chart .area{fill:var(--area)}
.chart .cline{fill:none;stroke:var(--s1);stroke-width:2;stroke-linejoin:round}
.chart .cdot{fill:var(--s1);stroke:var(--card);stroke-width:2}
.chart .bin{fill:var(--s1)}.chart .bout{fill:var(--s2)}
.chart .xhair{stroke:var(--faint);stroke-dasharray:3 3}
.gcard{position:relative}
.ctip{position:absolute;top:96px;background:var(--card);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);padding:8px 10px;font-size:12.5px;display:flex;flex-direction:column;gap:2px;pointer-events:none;z-index:3;white-space:nowrap}
.ctip span{display:flex;align-items:center;gap:6px}
.clegend{display:flex;gap:16px;justify-content:flex-end;font-size:12.5px;color:var(--muted);padding:6px 0 12px}
.clegend span{display:flex;align-items:center;gap:6px}
.plist{list-style:none;margin:0 0 10px;padding:0}
.plist a{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--line2);color:var(--ink)!important;text-decoration:none!important}
.plist li:first-child a{border-top:0}
.plist span{display:flex;flex-direction:column;min-width:0}
.plist small{color:var(--muted)}
.privacy .money{filter:blur(7px)}
@media (max-width:899px){.gcards{grid-template-columns:1fr}.gcard.c-cashflow{grid-column:auto}.pillrow{justify-content:flex-start}.welcome{font-size:26px}.homeacts{margin-bottom:0}.gcard{padding:16px 16px 0}.gfoot{margin:auto -16px 0;padding:12px 16px}}
@media (min-width:900px) and (max-width:1180px){.gcard.c-cashflow{grid-column:auto}}

/* ---------- Bank transactions ---------- */
.acchead{display:flex;align-items:center;gap:12px;margin:4px 0 16px}
.accsel{position:relative;display:inline-flex;align-items:center;max-width:100%}
.accsel select{appearance:none;-webkit-appearance:none;border:0;font-size:20px;font-weight:700;padding:2px 30px 2px 2px;background:none;box-shadow:none!important;min-width:0;max-width:100%}
.accsel .ic{position:absolute;right:4px;pointer-events:none}
.bcards{display:flex;gap:14px;overflow-x:auto;padding:2px 2px 6px;margin-bottom:18px}
.bcard{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:280px;max-width:320px;border:1.5px solid var(--line);border-radius:8px;padding:14px 16px;background:var(--card);color:var(--ink);font:inherit;cursor:pointer;text-align:left;flex:none}
.bcard.on{border:2px solid var(--brand);box-shadow:0 0 0 1px var(--brand) inset}
.bctop{display:flex;justify-content:space-between;width:100%;gap:8px}
.bctop b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.badge{font-style:normal;background:var(--ink);color:var(--card);border-radius:99px;font-size:11.5px;font-weight:700;min-width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px}
.bcbank{font-size:18px}
.bcbank b{font-weight:700;font-variant-numeric:tabular-nums}
.bcbooks{color:var(--muted)}
.bcard small{color:var(--muted);font-size:12px;align-self:flex-end}
.tabrow{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.tabs{display:inline-flex;background:var(--chipbg);border-radius:8px;padding:3px;gap:2px}
.tabs button,.tabs a{border:0;background:none;color:var(--muted);font:inherit;font-size:15px;padding:7px 18px;border-radius:6px;cursor:pointer;text-decoration:none!important}
.tabs .on{background:var(--card);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.12)}
.tabs.under{background:none;border-bottom:1px solid var(--line);border-radius:0;padding:0;margin-bottom:16px;display:flex}
.tabs.under button,.tabs.under a{border-radius:0;padding:8px 14px}
.tabs.under .on{box-shadow:inset 0 -3px 0 var(--brand);background:none}
.soonlink{color:var(--faint)!important}
.bank .bdesc{max-width:190px;min-width:140px;font-size:13.5px}
.bank td,.bank th{padding-left:8px;padding-right:8px}
.bank td select{min-width:0;width:104px}
.bank .mcell{min-width:190px}
.bank .mcell select{width:100%}
.bank .mcell .seg2{margin-bottom:5px}
.why{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}
.why.rule,.why.contact{color:var(--ok)}
.why.guess{color:var(--amber)}
.bank .act .split{justify-content:flex-end}
.emptybank{text-align:center;padding:40px 16px;color:var(--muted)}
.emptybank>.ic{width:40px;height:40px;color:var(--faint)}
.tablewrap.bankwrap{container-type:inline-size}
@container (max-width:1000px){
  .bank,.bank tbody,.bank tr,.bank td{display:block;width:100%}
  .bank thead{display:none}
  .bank tr{border-top:1px solid var(--line);padding:12px 14px;display:grid;grid-template-columns:1fr 1fr;gap:6px 12px}
  .bank tbody tr:first-child{border-top:0}
  .bank td{border:0!important;padding:0;text-align:left!important}
  .bank td::before{content:attr(data-l);display:block;color:var(--muted);font-size:11.5px}
  .bank td.cb{display:none}
  .bank td.bdesc,.bank td.mcell,.bank td.act{grid-column:1/-1;max-width:none}
  .bank td[data-l=Spent]:empty,.bank td[data-l=Received]:empty{display:none}
  .bank td select{width:100%;min-width:0}
  .bank .act .split{justify-content:flex-start}
  .bank tbody tr:hover td{background:none}
}
@media (max-width:899px){.bcard{min-width:250px}}

/* modal */
.modalwrap{position:fixed;inset:0;background:var(--scrim);z-index:60;display:flex;align-items:flex-start;justify-content:center;padding:6vh 12px;overflow:auto}
.modal{background:var(--card);border-radius:12px;box-shadow:var(--shadow);width:100%;max-width:640px;padding:20px 22px}
.modal.small{max-width:440px}
.modal.wide{max-width:820px}
.mhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.mhead h2{margin:0;font-size:20px;font-weight:600}
.mfoot{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;align-items:center}
.drop{display:flex;flex-direction:column;align-items:center;gap:4px;border:2px dashed var(--line);border-radius:10px;padding:28px 16px;margin:14px 0;cursor:pointer;text-align:center}
.drop.over{border-color:var(--brand);background:var(--soft)}
.drop .ic{width:34px;height:34px;color:var(--brandink)}
.drop small{color:var(--muted)}
.drop input{max-width:280px;margin-top:8px;border:0;min-height:0}
.paste summary{cursor:pointer;color:var(--brandink);margin-bottom:8px}
.paste textarea{margin-bottom:8px;font-family:ui-monospace,monospace;font-size:13px}
.grid.map{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));margin-top:12px}

/* ---------- Forms (QBO style) ---------- */
.qform{margin:-16px -32px 0;min-height:calc(100vh - 140px)}
.qfhead{display:flex;justify-content:space-between;align-items:center;padding:12px 32px;border-bottom:1px solid var(--line);background:var(--card)}
.qft{display:flex;align-items:center;gap:10px}
.qft h1{font-size:22px;margin:0}
.qft>.ic{width:24px;height:24px;color:var(--muted)}
.qfbody{padding:20px 32px 24px;background:var(--rail)}
.qftop{display:flex;gap:24px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:18px 20px;margin-bottom:16px}
.qfgrid{flex:1;margin:0;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.qfgrid .f-addr{grid-row:span 2}
.qfgrid .f-addr textarea{height:100%;min-height:80px}
.qfbig{text-align:right;flex:none}
.qfbig span{display:block;font-size:12px;font-weight:700;letter-spacing:.6px;color:var(--muted)}
.qfbig b{font-size:34px;font-weight:600;font-variant-numeric:tabular-nums}
.ltablewrap{background:var(--card);border:1px solid var(--line);border-radius:10px;overflow-x:auto}
.ltable{width:100%;border-collapse:collapse}
.ltable th{font-size:12px;font-weight:700;color:var(--muted);text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.ltable th.r{text-align:right}
.ltable td{padding:6px 8px;border-top:1px solid var(--line2);vertical-align:top}
.ltable tr.line{display:table-row;padding:0;border:0;border-radius:0;background:none;position:static}
.ltable .c-n{width:32px;color:var(--muted);text-align:center;padding-top:14px}
.ltable .c-item{min-width:200px;width:24%}
.ltable .c-desc{width:28%;min-width:160px}
.ltable .c-qty{width:80px}.ltable .c-rate{width:110px}
.ltable .c-qty input,.ltable .c-rate input{text-align:right}
.ltable .c-amt{width:110px;text-align:right;padding-top:14px;font-variant-numeric:tabular-nums}
.ltable .c-tax{width:170px}
.ltable .c-x{width:40px}
.ltable .l-acct{margin-top:6px}
.ltable .ml,.ltable .ml2{display:none}
.c-note{display:block;color:var(--muted);font-size:12px;margin-top:4px}
.x{width:30px;height:30px;border-radius:6px;border:0;background:none;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;margin-top:3px}
.x:hover{background:var(--hover);color:var(--bad)}
.x .ic{width:16px;height:16px}
.lbtns{display:flex;gap:8px;margin:12px 0}
.totals{margin:10px 0 0 auto;max-width:380px;display:flex;flex-direction:column;gap:6px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.totals div{display:flex;justify-content:space-between;gap:12px;font-variant-numeric:tabular-nums}
.totals .grand{font-size:17px;font-weight:600;border-top:1px solid var(--line);padding-top:8px;margin-top:2px}
.totals .grand.bad{color:var(--bad)}
.qfmemo{max-width:560px;margin-top:16px}
.qform>.qfbody>.grid,.qform .group+div{min-width:0}
.formbar{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:18px 0;align-items:center}
.formbar.fixed{position:sticky;bottom:0;z-index:15;background:var(--formbar);border-top:1px solid var(--line);margin:0 -32px;padding:12px 32px}
.formbar.fixed .btn.outline{background:transparent;color:#fff!important;border-color:rgba(255,255,255,.6)}
.formbar.fixed .btn.outline:hover{background:rgba(255,255,255,.12)}
.formbar.fixed .btn.danger{color:#ffb3a8!important}
.qform .formbar.fixed{margin:0}
.qform .formbar.fixed{padding:12px 32px}
.line{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 44px 10px 10px}
.line>.fld{grid-column:span 2}
.line .c-item{grid-column:span 3}.line .c-qty{grid-column:span 1}.line .c-rate{grid-column:span 2}.line .c-tax{grid-column:span 2}
.jline .c-item{grid-column:span 5}.jline .c-qty,.jline .c-rate{grid-column:span 2}.jline .c-tax{grid-column:span 3}
.comp .c-item{grid-column:span 6}.comp .c-qty{grid-column:span 3}
div.line .x{position:absolute;right:8px;top:8px}
#comps,#jl,#bom{display:flex;flex-direction:column;gap:10px;margin-bottom:10px}
.qform .totals:not(#totals){margin-top:12px}
@media (max-width:899px){
  .qform{margin:-14px -14px 0}
  .qfhead{padding:10px 14px}
  .qfbody{padding:14px}
  .qftop{flex-direction:column-reverse;gap:10px;padding:14px}
  .qfbig{text-align:left}
  .qfbig b{font-size:26px}
  .qfgrid .f-addr{grid-row:auto}
  .ltablewrap{background:none;border:0;overflow:visible}
  .ltable,.ltable tbody,.ltable tr,.ltable td{display:block;width:100%!important}
  .ltable thead{display:none}
  .ltable tr.line{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 10px 12px;margin-bottom:10px;position:relative}
  .ltable td{border:0;padding:0;min-width:0!important}
  .ltable .ml,.ltable .ml2{display:block;font-size:12px;color:var(--muted);margin-bottom:2px}
  .ltable .ml2{margin-top:6px}
  .ltable .c-n{display:none}
  .ltable .c-item,.ltable .c-desc{grid-column:span 6}
  .ltable .c-qty,.ltable .c-rate,.ltable .c-amt{grid-column:span 2}
  .ltable .c-amt{padding-top:0;text-align:right}
  .ltable .c-amt b{display:block;padding-top:9px}
  .ltable .c-tax{grid-column:span 5}
  .ltable .c-x{grid-column:span 1;display:flex;align-items:flex-end;justify-content:flex-end}
  .totals{max-width:none}
  .formbar.fixed{margin:0 -14px;padding:10px 14px;bottom:57px}
  .qform .formbar.fixed{padding:10px 14px;margin:0}
  .formbar.fixed .row.wrap{gap:6px}
  .formbar.fixed .btn{padding:6px 10px;font-size:13.5px}
  .line .c-item,.line .c-tax{grid-column:span 12}
  .line .c-qty,.line .c-rate{grid-column:span 6}
  .jline .c-item,.jline .c-tax{grid-column:span 12}.jline .c-qty,.jline .c-rate{grid-column:span 6}
  .comp .c-item{grid-column:span 12}.comp .c-qty,.comp>div.fld{grid-column:span 6}
  div.line{padding-right:10px;padding-top:40px}
}
.code{border:1px solid var(--line);border-radius:10px;padding:10px;margin-bottom:10px;display:flex;flex-direction:column;gap:8px}
.part input.p-l{max-width:160px}.part input.p-r{max-width:100px}
.numbers .row input:first-child{max-width:90px}

/* transaction view */
.formhead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.vlabel{font-size:15px;color:var(--muted)}
.vtotal{display:flex;flex-direction:column;align-items:flex-end}
.vtotal small{font-size:11.5px;font-weight:700;letter-spacing:.5px;color:var(--muted);text-transform:uppercase}
.vtotal b{font-size:26px;font-weight:600}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 16px}
.acct-view{margin-top:18px}
.acct-view summary{cursor:pointer;color:var(--muted);font-weight:600;margin-bottom:8px}
.view .tbl{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.kv th{text-align:left;padding:8px 14px;color:var(--muted);font-weight:600;width:40%}
.kv td{padding:8px 14px}
.kv{background:var(--card);border:1px solid var(--line);border-radius:10px;width:100%;border-collapse:collapse}
.paper{background:#fff;color:#1b1f2a;border-radius:6px;box-shadow:0 1px 3px rgba(0,0,0,.1),0 8px 30px rgba(0,0,0,.08);padding:32px;max-width:900px;border:1px solid #e3e6e4}
.paper h2{font-size:20px;margin:0 0 4px}.paper h3{margin:0 0 4px;color:#0f7a55;letter-spacing:1px}
.paper p{margin:0}
.p-head{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:18px}
.p-meta{text-align:right}
.p-to{margin:0 0 16px!important}
.p-lines{width:100%;border-collapse:collapse;font-size:14px}
.p-lines th{text-align:left;background:#ecf6f1;padding:7px 8px}
.p-lines td{padding:7px 8px;border-bottom:1px solid #e6ebe8;vertical-align:top}
.p-lines .r{text-align:right;white-space:nowrap}
.p-tot{margin:12px 0 0 auto;max-width:300px}
.p-tot div{display:flex;justify-content:space-between;padding:3px 0}
.p-tot .grand{font-size:17px;border-top:2px solid #1b1f2a;margin-top:4px;padding-top:6px}
.p-memo{margin-top:16px!important;color:#555;white-space:pre-line}
@media (max-width:520px){.paper{padding:16px}.p-meta{text-align:left}}

/* lists, products, overview */
.stockcards{display:flex;gap:14px;margin-bottom:16px;flex-wrap:wrap}
.stc{border:1px solid var(--line);border-radius:10px;padding:12px 18px;display:flex;flex-direction:column;min-width:140px;background:var(--card)}
.stc b{font-size:24px;font-weight:600}
.stc span{color:var(--muted);font-size:13px}
.ovgrid{display:grid;grid-template-columns:2fr 1fr;gap:16px}
.shortcuts{display:flex;flex-direction:column;padding:4px 8px 10px}
.shortcuts a{display:flex;justify-content:space-between;align-items:center;padding:9px 8px;border-radius:6px;color:var(--ink)}
.shortcuts a:hover{background:var(--hover);text-decoration:none}
.shortcuts .ic{width:16px;height:16px;color:var(--muted)}
@media (max-width:899px){.ovgrid{grid-template-columns:1fr}}
.createpage .cgrid{gap:8px 32px}

/* reports */
.rgroup{border-bottom:1px solid var(--line);padding:6px 0 10px}
.rgroup summary{font-weight:600;font-size:16px;cursor:pointer;padding:10px 0}
.rrow{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:6px}
.rrow:hover{background:var(--hover)}
.rrow a{flex:1;display:flex;flex-direction:column;color:var(--ink)!important}
.rrow a b{font-weight:500;color:var(--brandink)}
.rrow small{color:var(--muted)}
.star{border:0;background:none;font-size:18px;color:var(--line);cursor:pointer}
.star.on{color:var(--amber)}
.rtool{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin-bottom:14px}
.rtool .fld{width:auto;min-width:150px}
.ricons{display:flex;gap:4px;align-items:center}
.rpaper{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:26px 24px 16px;max-width:1000px;margin:0 auto 14px}
.rhead{text-align:center;margin-bottom:18px}
.rco{margin:0;font-size:15px;color:var(--muted)}
.rhead h2{font-size:22px;font-weight:600;margin:2px 0}
.rsub{margin:0;color:var(--muted);font-size:13.5px}
.report th{border-bottom:2px solid var(--line)}
.report td{padding:7px 12px}
.report tr.head td{font-weight:700;cursor:pointer}
.report tr.head .caret{border:0;background:none;color:var(--muted);padding:0 4px 0 0;cursor:pointer;vertical-align:middle}
.report tr.head .caret .ic{width:16px;height:16px;transition:transform .15s}
.report tr.head.collapsed .caret .ic{transform:rotate(-90deg)}
.report tr[data-in] td:first-child{padding-left:30px}
.report tr.total td{font-weight:700;border-top:1px solid var(--line)}
.report tr.grand td{font-weight:800;border-top:2px solid var(--ink);border-bottom:3px double var(--ink)}
.report tr.link{cursor:pointer}
.rfoot{text-align:center;color:var(--muted);font-size:12px;margin:14px 0 0}
.num.neg{color:var(--bad)}
.settings{display:grid;grid-template-columns:200px minmax(0,1fr);gap:20px}
.stabs{display:flex;flex-direction:column;gap:2px;position:sticky;top:80px;align-self:start}
.stabs a{padding:8px 12px;border-radius:6px;color:var(--ink)}
.stabs a:hover{background:var(--hover);text-decoration:none}
@media (max-width:899px){.settings{grid-template-columns:1fr}.stabs{position:static;flex-direction:row;flex-wrap:wrap}}

/* ---------- Part 3: labels, scan, counts, reconcile, cheques, receipts ---------- */
.cardh.flat{padding:0;margin:0 0 12px}
.nm{margin:0}
.tbl input.num,.tbl input.cnt,.tbl input.qa,.tbl input.o-box,.tbl input.o-pal{width:90px;text-align:right;min-height:32px;padding:4px 8px}
.lchecks{gap:6px 18px;margin-top:4px}
.labelacts{margin-top:4px}
.check.small{font-size:13px;margin-top:6px}
.clip{display:inline-flex;color:var(--muted);vertical-align:middle}.clip .ic{width:15px;height:15px}
.stclink{color:var(--ink)!important;text-decoration:none!important}.stclink:hover{border-color:var(--brand)}
.tbl tr.packrow td:first-child{padding-left:26px}
.bcrow{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 6px}
.bcwrap{background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 8px;width:220px;max-width:100%;flex:none}
.bcwrap:empty{display:none}
.bcsvg{display:block;width:100%;height:auto}
.packbtns{margin-top:10px}
#packTable{border:1px solid var(--line);border-radius:10px}
/* print preview */
body.pvopen{overflow:hidden}
#printzone{position:fixed;inset:0;z-index:80;background:var(--pvbg);display:flex;flex-direction:column;--pvz:1}
.pvbar{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--card);border-bottom:1px solid var(--line);flex-wrap:wrap}
.pvt{display:flex;flex-direction:column;min-width:0}.pvt small{color:var(--muted)}
.pvscroll{flex:1;overflow:auto;padding:18px 12px 40px}
.pvpages{display:flex;flex-direction:column;align-items:center;gap:18px}
.pv-page{zoom:var(--pvz);background:#fff;color:#111;box-shadow:0 2px 12px rgba(0,0,0,.35);position:relative;overflow:hidden;flex:none}
.lsheet{position:absolute;inset:0}
.lcell{position:absolute}
.lbl{box-sizing:border-box;padding:.55em .7em;display:flex;flex-direction:column;gap:.25em;overflow:hidden;color:#111;font-family:Arial,Helvetica,sans-serif;line-height:1.2;border:1px dashed #c9cfcc}
.pv-page>.lsheet>.lcell:only-child>.lbl{border-color:transparent}
.lb-top{display:flex;justify-content:space-between;gap:.6em;font-size:.85em;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.lb-logo{border:1.5px solid #111;padding:0 .35em;border-radius:3px;white-space:nowrap}
.lb-name{font-size:1.35em;font-weight:800;line-height:1.1}
.lb-sku{font-size:1em}
.lb-bc{flex:0 1 auto;min-height:0}.lb-bc svg{width:100%;height:auto;max-height:100%;display:block}
.lb-grid{display:grid;grid-template-columns:auto 1fr;gap:.15em .6em;font-size:.95em}.lb-grid span{color:#444}.lb-grid b{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-big{margin-top:auto;font-size:1.9em;font-weight:900;letter-spacing:.02em;border-top:2px solid #111;padding-top:.15em}.lb-big small{font-size:.5em;font-weight:700;margin-left:.4em}
.lbl.sm{padding:.25em .4em;gap:.1em}.lbl.sm .lb-name{font-size:1em}.lbl.sm .lb-line{display:flex;justify-content:space-between;font-size:.95em}
.sdoc{padding:.6in .6in .5in;font-family:Arial,Helvetica,sans-serif;font-size:10.5pt;color:#111;height:100%;box-sizing:border-box;display:flex;flex-direction:column}
.reprt .sdoc{padding:0;height:auto}
.sd-head{display:flex;justify-content:space-between;gap:20px;margin-bottom:14px}.sd-head h2{font-size:16pt;margin:0 0 2px}.sd-head p{margin:0;color:#333}
.sd-meta{text-align:right}.sd-meta h3{margin:0 0 4px;color:#0f7a55;letter-spacing:1px;font-size:14pt}
.sd-parties{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;border:1px solid #bbb;padding:10px;margin-bottom:10px}.sd-parties p{margin:3px 0 0}
.sd-refs{margin:0 0 10px}
.sd-lines{width:100%;border-collapse:collapse;margin-bottom:10px}.sd-lines th{background:#ecf6f1;text-align:left;padding:5px 6px;font-size:9.5pt}
.sd-lines td{padding:5px 6px;border-bottom:1px solid #ddd;vertical-align:top}.sd-lines .r{text-align:right;white-space:nowrap}.sd-lines tfoot td{font-weight:700;border-top:2px solid #111;border-bottom:0}
.sd-lines .cw{width:1.2in;border-bottom:1px solid #999}
.rsum{max-width:4.8in}.rsum .tot td{font-weight:700;border-top:2px solid #111}
.sdoc h4{margin:12px 0 6px}
.sd-notes{margin:4px 0}.sd-small{font-size:8.5pt;color:#444}
.sd-sign{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:auto;padding-top:30px}.sd-sign i{display:block;border-bottom:1px solid #111;height:34px}.sd-sign span{font-size:8.5pt;color:#333}
.sd-foot{font-size:8pt;color:#888;margin:10px 0 0}
.cheque{height:100%;display:grid;grid-template-rows:3.5in 3.75in 3.75in;font-family:Arial,Helvetica,sans-serif;color:#111}
.cq-top{position:relative;padding:.3in .4in;border-bottom:1px dashed #999}
.cq-co{display:flex;flex-direction:column;font-size:9pt;max-width:3.6in}.cq-co b{font-size:11pt}
.cq-no{position:absolute;right:.4in;top:.3in;font-size:10pt}
.cq-date{position:absolute;right:.4in;top:.75in;display:flex;flex-direction:column;align-items:flex-end;font-size:8pt}.cq-date b{font-size:12pt;letter-spacing:.08em;font-family:"Courier New",monospace}.cq-date small{color:#555;letter-spacing:.1em}
.cq-pay{position:absolute;left:.4in;right:2.1in;top:1.42in;display:flex;align-items:baseline;gap:10px;border-bottom:1px solid #111;font-size:8pt}.cq-words{font-size:11pt;font-weight:600;flex:1}.cq-pay i{font-style:normal}
.cq-amt{position:absolute;right:.4in;top:1.3in;border:1.5px solid #111;padding:4px 10px;display:flex;gap:6px;align-items:baseline;min-width:1.5in;font-family:"Courier New",monospace}.cq-amt b{font-size:13pt}
.cq-to{position:absolute;left:.4in;top:1.85in;display:flex;gap:12px;font-size:10.5pt}.cq-to span{font-size:7.5pt;line-height:1.1;color:#333}
.cq-memo{position:absolute;left:.4in;bottom:.35in;font-size:9pt;width:3in;border-bottom:1px solid #999}.cq-memo span{font-size:7.5pt;margin-right:8px;color:#333}
.cq-sig{position:absolute;right:.4in;bottom:.3in;width:2.6in;text-align:center;font-size:7.5pt}.cq-sig i{display:block;border-bottom:1px solid #111;height:30px}
.cq-stub{padding:.3in .4in;border-bottom:1px dashed #999;font-size:9.5pt}.cq-stub:last-child{border-bottom:0}
.cq-sh{display:flex;justify-content:space-between;border-bottom:1px solid #111;padding-bottom:4px;margin-bottom:6px}
.cq-stub table{width:100%;border-collapse:collapse}.cq-stub td{padding:3px 4px;border-bottom:1px solid #eee}.cq-stub .r{text-align:right}.cq-stub .tot td{font-weight:700;border-top:1px solid #111}
/* scan */
.scanbox{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.scanin{flex:1 1 260px;display:flex;align-items:center;gap:8px;border:1.5px solid var(--brand);border-radius:8px;padding:0 12px;background:var(--card);min-width:0}
.scanin input{border:0;box-shadow:none!important;font-size:18px;min-height:46px;padding:0}
.scanin .ic{color:var(--brandink)}
.scanvideo{width:100%;max-width:520px;border-radius:10px;margin-top:10px;background:#000;display:block}
.scanresult .sr-head{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:flex-start}
.scanresult h2{font-size:20px;margin:0}
.srstats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0}
.srstats>div{border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;min-width:0}
.srstats span{color:var(--muted);font-size:12.5px}.srstats b{font-size:22px;font-weight:600;font-variant-numeric:tabular-nums}.srstats small{color:var(--muted);font-size:12px}
@media (max-width:700px){.srstats{grid-template-columns:1fr 1fr}.srstats b{font-size:18px}}
.scanpick{display:flex;justify-content:space-between;gap:10px;width:100%;padding:10px 16px;border:0;border-top:1px solid var(--line2);background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.scanpick:hover{background:var(--hover)}.scanpick small{color:var(--muted)}
.cntadd{margin-top:10px}.cntadd select{flex:1 1 240px;width:auto}
tr.flash td{animation:flash 1.2s}
@keyframes flash{from{background:var(--sel)}to{background:transparent}}
/* reconcile */
.recbar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 20px;margin-bottom:16px;position:sticky;top:64px;z-index:5}
.recbar>div{display:flex;flex-direction:column}.recbar span{color:var(--muted);font-size:12.5px}.recbar b{font-size:22px;font-weight:600;font-variant-numeric:tabular-nums}.recbar small{color:var(--muted);font-size:12px}
.recbar>i{font-style:normal;font-size:22px;color:var(--muted)}
.recbar .ok b{color:var(--ok)}.recbar .bad b{color:var(--bad)}
.tick{width:28px;height:28px;border-radius:50%;border:1.5px solid var(--line);background:var(--card);color:transparent;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.tick .ic{width:16px;height:16px}.tick.on{background:var(--brand);border-color:var(--brand);color:var(--onbrand)}
.tbl tr.cleared td{background:var(--soft)}
.note.ok{color:var(--ok)}
@media (max-width:899px){.recbar{top:56px;padding:10px 14px;gap:10px}.recbar b{font-size:17px}}
/* receipts and attachments */
.rcard{display:flex;gap:16px;padding:14px;align-items:flex-start}
.rthumb,.attthumb{width:110px;height:140px;flex:none;border:1px solid var(--line);border-radius:8px;background:var(--rail) center/cover no-repeat;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--muted);cursor:pointer;font:inherit;padding:4px;overflow:hidden}
.rthumb small,.attthumb small{font-size:11px;word-break:break-all;text-align:center}
.rbody{flex:1;min-width:0}.rbody p{margin:0 0 4px}
.rgrid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));margin-bottom:10px}
.attrow{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.attthumb{width:84px;height:100px}
.attadd{width:84px;height:100px;border:2px dashed var(--line);border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--brandink);cursor:pointer;font-size:12px;text-align:center}
.attview img{max-width:100%;display:block;margin:0 auto;border-radius:6px}
.attview iframe{width:100%;height:70vh;border:0}
@media (max-width:520px){.rcard{flex-direction:column}.rthumb{width:100%;height:160px}}
@media print{
  body.printing>*:not(#printzone){display:none!important}
  body.printing #printzone{position:static;background:#fff;display:block}
  body.printing .pvbar{display:none!important}
  body.printing .pvscroll{padding:0;overflow:visible}
  body.printing .pvpages{display:block}
  body.printing .pv-page{zoom:1!important;box-shadow:none;margin:0;break-after:page;page-break-after:always}
  body.printing .pv-page:last-child{break-after:auto;page-break-after:auto}
  body.printing .lbl{border-color:transparent}
}
.toast{position:fixed;left:50%;bottom:90px;opacity:0;pointer-events:none;transform:translateX(-50%) translateY(20px);background:var(--toast);color:var(--toastink);padding:12px 18px;border-radius:10px;transition:all .25s;max-width:90vw;z-index:70}
.toast.show{opacity:1;transform:translateX(-50%)}
@media print{
  #rail,#panel,#top,.bottom,#flyout,.actions,.noprint,.formbar,.acct-view,.fine,.toast,.crumbs,.pageacts,.lfilters,.toolbar,.tabrow,.bcards,.acchead,.qpager{display:none!important}
  body{background:#fff;color:#000}
  body.signed main,body.signed.panel-open main{margin:0;padding:0}
  .paper{box-shadow:none;padding:0;max-width:none;border:0}
  .tbl,.tcard,.rpaper{border:0}
}

/* ---------- Payroll & Staff ---------- */
.paytabs{overflow-x:auto;scrollbar-width:none}
.paytabs a{white-space:nowrap}
.sitegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-bottom:8px}
.sitecard{margin:0}
.sitecard h2{margin:0}
.addsite{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border-style:dashed;cursor:pointer;color:var(--brandink);font:inherit;min-height:200px}
.addsite small{color:var(--muted)}
.sitemap{position:relative;height:120px;border-radius:8px;background:repeating-linear-gradient(45deg,var(--soft),var(--soft) 10px,var(--card) 10px,var(--card) 20px);margin:10px 0;overflow:hidden}
.sitemap .ring{position:absolute;left:50%;top:50%;width:calc(var(--r)*2);height:calc(var(--r)*2);margin:calc(var(--r)*-1) 0 0 calc(var(--r)*-1);border-radius:50%;border:2px solid var(--brand);background:var(--ring)}
.sitemap .pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-100%);color:var(--bad)}
.plist{list-style:none;padding:0;margin:8px 0 0;font-size:13px}
.plist li{display:flex;align-items:center;gap:8px;padding:2px 0}
.dot{width:9px;height:9px;border-radius:50%;flex:none}.dot.okd{background:var(--ok)}.dot.badd{background:var(--bad)}
.sched{border-collapse:separate;border-spacing:4px;width:100%;min-width:760px}
.sched th{font-size:12.5px;color:var(--muted);font-weight:700;padding:6px 4px;text-align:center}
.sched th.today{color:var(--brandink)}
.sched th.stype{text-align:left;min-width:120px;vertical-align:top}
.sched th.stype b{display:block;color:var(--ink);font-size:14px}
.sched th.stype small{display:block;font-weight:400;margin-bottom:4px}
.sched td{padding:0;vertical-align:top}
.scell{width:100%;min-height:62px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink);font:inherit;font-size:13px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:6px 4px}
.scell:hover{border-color:var(--brand);background:var(--soft)}
.scell span{font-weight:600}
.scell i{font-style:normal;color:var(--faint);font-size:18px}
.scell em{font-style:normal;font-size:11.5px;font-weight:700;color:#fff;background:var(--danger);border-radius:99px;padding:0 7px}
.scell.gap{border-color:var(--bad)}
.scell.draft{border-style:dashed}
.schfoot{display:flex;flex-wrap:wrap;gap:8px;padding:12px 14px;border-top:1px solid var(--line2)}
.schfoot .chip{text-transform:none;white-space:normal}
.alist{max-height:320px;overflow:auto;border:1px solid var(--line2);border-radius:8px;padding:4px 12px;margin-bottom:10px}
.alist small{margin-left:auto;padding-left:8px}
.trow{display:grid;grid-template-columns:60px 1.4fr 1fr 1fr 70px 1fr 1fr 1fr 32px;gap:8px;align-items:end;padding:8px 0;border-bottom:1px solid var(--line2)}
@media (max-width:899px){.trow{grid-template-columns:1fr 1fr}}
.kpirow{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:6px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 16px;min-width:120px}
.kpi b{display:block;font-size:24px;font-weight:600}
.kpi span{color:var(--muted);font-size:13px}
.acard{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:10px}
.ahead{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:6px}
.apunch{display:flex;flex-wrap:wrap;gap:6px 20px;font-size:13.5px;margin-bottom:8px}
.areason{font-style:italic;color:var(--muted);margin:0 0 8px}
.selfie{width:48px;height:48px;border-radius:8px;object-fit:cover}
.stubs{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;max-height:60vh;overflow:auto}
.stub{border:1px solid var(--line);border-radius:10px;padding:14px;background:var(--card)}
.stub p{margin:2px 0 10px}
.srow{display:flex;justify-content:space-between;gap:12px;padding:3px 0;font-size:14px}
.srow.tot{border-top:1px solid var(--line);margin-top:4px;padding-top:6px;font-weight:600}
textarea{font:inherit}
/* staff phone app */
body.staffmode{background:var(--rail)}
body.staffmode main#app{padding:0;margin:0}
.staffapp{max-width:480px;margin:0 auto;min-height:100vh;background:var(--bg);padding-bottom:84px;position:relative}
.shead{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--card);position:sticky;top:0;z-index:5}
.shead img{width:32px;height:32px;border-radius:8px}
.shead b{display:block;font-size:15px}
.shead small{color:var(--muted)}
.spad{padding:18px 16px}
.spad.center{text-align:center}
.spad h1{font-size:26px}
.pinform{display:flex;flex-direction:column;gap:12px}
.pinbox{font-size:28px;letter-spacing:12px;text-align:center;min-height:56px}
.btn.big{min-height:52px;font-size:17px}
.err{color:var(--bad);min-height:18px}
.snext{background:var(--soft);border-radius:12px;padding:14px 16px;margin:10px 0 14px;display:flex;flex-direction:column;gap:2px;text-align:left}
.snext b{font-size:19px}
.snext.small b{font-size:16px}
.snext small,.snext span{color:var(--muted)}
.slist{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.sitem{display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:10px 14px;background:var(--card);margin-bottom:8px;width:100%;font:inherit;color:inherit;text-align:left}
.sitem.today{border-color:var(--brand)}
.sitem small{display:block;color:var(--muted)}
.stubbtn{cursor:pointer}
.sclock{font-size:48px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.1}
.sbig{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-height:96px;border:0;border-radius:18px;background:var(--brand);color:var(--onbrand);font:inherit;font-size:24px;font-weight:700;letter-spacing:1px;cursor:pointer;margin:14px 0 6px;box-shadow:var(--shadow)}
.sbig small{font-size:13px;font-weight:400;letter-spacing:0;opacity:.9}
.sbig.out{background:var(--danger)}
.sloc{display:flex;flex-direction:column;gap:2px;background:var(--soft);border-radius:10px;padding:10px 12px;margin:10px 0;text-align:left}
.sloc.warn{background:var(--warn);color:var(--ink)}
.sloc small{color:var(--muted)}
.sask{background:var(--warn);border-radius:10px;padding:10px 12px;text-align:left}
.sdone{color:var(--ok);font-weight:600;display:flex;gap:6px;align-items:center;justify-content:center}
.snav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;display:flex;background:var(--card);border-top:1px solid var(--line);z-index:6;padding-bottom:env(safe-area-inset-bottom)}
.snav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;border:0;background:none;color:var(--muted);font:inherit;font-size:11.5px;padding:8px 0;cursor:pointer;position:relative}
.snav button.on{color:var(--brandink);font-weight:700}
.sdot{position:absolute;top:4px;right:calc(50% - 22px);background:var(--danger);color:#fff;font-style:normal;font-size:10px;border-radius:99px;padding:0 5px}
.squeue{margin:0;padding:8px 16px;background:var(--warn);font-size:13px}
.policy{white-space:pre-wrap;font:inherit;font-size:13px;background:var(--rail);padding:10px;border-radius:8px}
@media print{.paytabs,.toolbar .btn{display:none!important}}
/* theme picker */
.themegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.themeopt{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:inherit;text-align:left;padding:10px 12px;cursor:pointer}
.themeopt:hover{border-color:var(--brand)}
.themeopt.on{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand);background:var(--soft)}
.themeopt small{display:block;color:var(--muted);font-size:12.5px}
.tsw{display:inline-flex;flex:none;border-radius:8px;overflow:hidden;border:1px solid var(--line)}
.tsw b{width:14px;height:34px}
.ddthemes{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 14px;border-bottom:1px solid var(--line2);font-size:13px;color:var(--muted)}
.themedots{display:flex;gap:6px}
.tdot{width:22px;height:22px;border-radius:50%;border:1px solid var(--line);background:linear-gradient(135deg,var(--a) 50%,var(--b) 50%);cursor:pointer;padding:0}
.tdot.on{box-shadow:0 0 0 2px var(--card),0 0 0 4px var(--brand)}