:root{--bg:#f2f9f5;--card:#fff;--tx:#13261e;--mut:#66796f;--ac:#12a06c;--acd:#0e8558;--on:#fff;--bd:#dbe8e1;--dn:#e5533d;--er:#d92d20;--g:#e3f6ec;--b:#e5f0fc;--p:#eee8fc;--l:#e9e9fb;--r:#fde8e6;--sh:0 1px 2px #0b2a1c14,0 6px 18px #0b2a1c0d}
@media(prefers-color-scheme:dark){:root{--bg:#0b1511;--card:#13211b;--tx:#e8f3ed;--mut:#8fa69b;--ac:#2fd08f;--acd:#25b97b;--on:#04251a;--bd:#223a30;--g:#12382a;--b:#122b45;--p:#2a2147;--l:#22244a;--r:#43201c;--er:#f97066;--dn:#ff8a6b;--sh:none}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.5 'Hind Siliguri',system-ui,sans-serif;background:var(--bg);color:var(--tx);padding-top:env(safe-area-inset-top)}
button,input,select,textarea{font:inherit;color:inherit}
input,select,textarea{width:100%;padding:12px 14px;border:1px solid var(--bd);border-radius:12px;background:var(--card);font-size:16px}
input:focus,select:focus{border-color:var(--ac)}
:focus-visible{outline:3px solid color-mix(in srgb,var(--ac) 45%,transparent);outline-offset:2px}
label{display:block;margin:12px 0 0;font-size:14px;font-weight:600;color:var(--mut)}label input,label select{margin-top:5px;color:var(--tx);font-weight:400}
button{cursor:pointer;border:1px solid var(--bd);background:var(--card);border-radius:12px;padding:10px 16px;min-height:46px;font-weight:600}
button:disabled{opacity:.5}.pri{background:var(--ac);color:var(--on);border-color:var(--ac)}.pri:hover{background:var(--acd)}
.out{background:var(--card);color:var(--ac);border:1.5px solid var(--ac)}.wide{width:100%}.ghost{background:none;border:0;color:var(--mut)}
svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
header{position:sticky;top:0;z-index:5;background:var(--card);border-bottom:1px solid var(--bd);display:flex;align-items:center;gap:10px;padding:8px 14px}
header img,.hav{width:40px;height:40px;border-radius:12px;object-fit:cover}.hav{display:grid;place-items:center;background:var(--g);color:var(--ac);font-weight:700}
header b{flex:1;font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.seg{display:flex;gap:4px;padding:4px;background:color-mix(in srgb,var(--ac) 10%,var(--card));border:1px solid var(--bd);border-radius:14px;margin:12px 0}
.seg button{flex:1;border:0;background:none;min-height:40px;border-radius:10px;color:var(--mut);padding:6px 10px}.seg .on{background:var(--ac);color:var(--on)}
.lgs{margin:0;padding:3px}.lgs button{min-height:32px;font-size:13px;padding:2px 10px}
nav{position:fixed;bottom:0;left:0;right:0;z-index:6;display:flex;background:var(--card);border-top:1px solid var(--bd);padding-bottom:env(safe-area-inset-bottom)}
nav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;border:0;border-radius:0;background:none;color:var(--mut);font-size:12px;padding:8px 2px;font-weight:600}nav .on{color:var(--ac)}
main{padding:14px 14px 100px;max-width:760px;margin:0 auto}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:12px 0}
.card{border-radius:16px;padding:12px 14px;background:var(--card);border:1px solid var(--bd)}.card small{display:block;color:var(--mut);font-size:13px}
.card b{font-size:21px;font-variant-numeric:tabular-nums;word-break:break-word}
.card.g{background:var(--g)}.card.b{background:var(--b)}.card.p{background:var(--p)}.card.l{background:var(--l)}.card.r{background:var(--r)}.card.r b{color:var(--er)}.card.d{background:var(--r)}
.panel{background:var(--card);border:1px solid var(--bd);border-radius:16px;padding:14px;margin:12px 0;box-shadow:var(--sh)}
.top{display:grid;grid-template-columns:1fr auto;gap:6px 8px;align-items:center}.top label{grid-column:1/-1;margin:0}
.clk b{font-size:17px}.clk small{display:block;color:var(--mut)}
.bdg{background:var(--r);color:var(--er);border-radius:20px;padding:2px 12px;font-size:13px;font-weight:600}
.info{background:var(--b);border:0}.info b{display:block}.info p{margin:4px 0}.info small{color:var(--mut)}
.acts3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0}
.acts3 button{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--ac);color:var(--on);border:0;padding:12px 6px;font-size:13px;line-height:1.2;min-height:80px}.acts3 svg{width:26px;height:26px}
.acts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.acts .out{grid-column:1/-1}
.bl{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 14px;border-radius:12px;text-decoration:none;font-weight:600}
.btns,.bar,.row{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.bar input{flex:1;min-width:160px}
.li{display:flex;align-items:center;gap:12px;padding:12px;background:var(--card);border:1px solid var(--bd);border-radius:14px;margin-bottom:8px;width:100%;text-align:left;font-weight:400}
.li .gr{flex:1;min-width:0}.li>span:last-child{font-weight:700;color:var(--dn)}
.av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--g);color:var(--ac);font-style:normal;font-weight:700;flex:none}
.tw{overflow-x:auto;border:1px solid var(--bd);border-radius:14px;background:var(--card)}table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:15px}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--bd);white-space:nowrap}th{color:var(--mut);font-weight:600;font-size:13px}.r{text-align:right}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:8px;margin:10px 0}.tile{position:relative;margin:0;color:var(--tx)}
.tile input{position:absolute;opacity:0;width:1px;height:1px}.tile span{display:block;text-align:center;padding:12px 6px;border:1.5px solid var(--bd);border-radius:12px;font-weight:600}
.tile input:checked+span{border-color:var(--ac);background:var(--g);color:var(--ac)}.tile input:focus-visible+span{outline:3px solid var(--ac)}
.mut,.note{color:var(--mut);font-size:14px}.err{color:var(--er)}.dn{color:var(--dn);font-weight:600}a{color:var(--ac)}
.auth{max-width:420px;margin:3vh auto;padding:0 18px}.auth h1{font-size:26px;margin:4px 0}.logo{display:block;width:104px;height:104px;object-fit:contain;margin:0 auto 4px}
.or{display:flex;align-items:center;gap:10px;color:var(--mut);margin:14px 0}.or:before,.or:after{content:"";flex:1;height:1px;background:var(--bd)}.c{text-align:center}
dialog{border:0;border-radius:18px;padding:18px;width:min(460px,94vw);background:var(--card);color:var(--tx);max-height:92vh;overflow:auto}dialog::backdrop{background:#0008}
dialog .row button{flex:1}#toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);background:var(--tx);color:var(--bg);padding:10px 16px;border-radius:12px;z-index:99;display:none}
h3{margin:0 0 4px}
@media(min-width:600px){main{padding-top:22px}.acts3 button{flex-direction:row;justify-content:center;min-height:56px;font-size:15px}}
@media(min-width:900px){nav{top:60px;bottom:0;right:auto;width:210px;flex-direction:column;justify-content:flex-start;border-top:0;border-right:1px solid var(--bd);padding:12px 10px}
nav button{flex:none;flex-direction:row;gap:12px;justify-content:flex-start;font-size:16px;padding:12px 14px;border-radius:12px;width:100%}nav .on{background:var(--g)}
main{margin:0 auto 0 230px;max-width:980px;padding-bottom:30px}}
@media(prefers-reduced-motion:no-preference){dialog[open]{animation:p .15s}@keyframes p{from{transform:translateY(8px);opacity:0}}}
/* v2: status colors, settings view, statement edit */
:root{--ok:#16a34a;--warn:#ea7a1a;--wbg:#fff1e5;--fail:#d92d20;--fbg:#fde8e6}
@media(prefers-color-scheme:dark){:root{--ok:#34d27a;--warn:#fb923c;--wbg:#3a2412;--fail:#f97066;--fbg:#43201c}}
.err{margin:8px 0;border-radius:10px;padding:8px 12px;font-size:14px}.err:empty{display:none}
.err.warn{background:var(--wbg);color:var(--warn);border:1px solid var(--warn)}.err.fail{background:var(--fbg);color:var(--fail);border:1px solid var(--fail)}
#toast.ok{background:var(--ok);color:#fff}#toast.warn{background:var(--warn);color:#fff}#toast.fail{background:var(--fail);color:#fff}
button.fail{color:var(--fail);border-color:var(--fail)}
.kv{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--bd)}.kv span{color:var(--mut)}.kv b{text-align:right;word-break:break-word}
.sh{display:flex;align-items:center;gap:12px;margin-bottom:8px}.sh img,.hav.big{width:64px;height:64px;border-radius:16px;object-fit:cover;font-size:26px}.sh h2{margin:0}
.ed{min-height:36px;padding:2px 10px}textarea{resize:vertical}
/* v3: spinner, preview, spacing */
.spin{width:34px;height:34px;margin:18vh auto;border:4px solid var(--bd);border-top-color:var(--ac);border-radius:50%;animation:sp .8s linear infinite}
@keyframes sp{to{transform:rotate(1turn)}}
.pri.busy{position:relative;color:transparent!important}.pri.busy::after{content:"";position:absolute;inset:0;margin:auto;width:20px;height:20px;border:3px solid var(--on);border-right-color:transparent;border-radius:50%;animation:sp .7s linear infinite}
.auth form>.pri,.auth form>.wide{margin-top:18px}
dialog.wide{width:min(780px,96vw)}.pv h4{margin:12px 0 4px}.pvh{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding-bottom:8px;border-bottom:2px solid var(--ac)}.pvl{color:var(--ac);font-size:24px}
/* v5: customer header icons, owner button amount */
.chd{display:flex;align-items:center;gap:10px;margin:8px 0}.chd .gr{flex:1;min-width:0}.chd h2{margin:0;font-size:22px;overflow-wrap:anywhere}.chd p{margin:2px 0 0}
.ib{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--ac);color:var(--on);text-decoration:none}.ib:hover{background:var(--acd)}
.acts3 small{font-weight:400;opacity:.92;font-size:12px}