:root{--bg:#111318;--p1:#1a1d23;--p2:#23272f;--p3:#2d323c;--bd:#363c48;--tx:#eef1f6;--mu:#98a2b3;--ac:#3b82f6;--ok:#22c55e;--warn:#f59e0b;--bad:#ef4444}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--tx);font:14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,Inter,sans-serif;-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;background:var(--p3);border:1px solid var(--bd);border-radius:8px;padding:9px 12px;cursor:pointer;user-select:none;-webkit-user-select:none}
button:hover{filter:brightness(1.12)}button:active{transform:scale(.97)}
button.primary{background:var(--ac);border-color:var(--ac);color:#fff;font-weight:600}
button.danger{color:#fca5a5}button.ghost{background:transparent;border-color:transparent}
button.ok{background:#15803d;border-color:#22c55e;font-weight:600}
button:disabled{opacity:.4;pointer-events:none}
input,select,textarea{font:inherit;color:var(--tx);background:var(--p2);border:1px solid var(--bd);border-radius:8px;padding:9px 10px;width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--ac);outline-offset:-1px}
input[type=checkbox]{width:auto}
a{color:#93c5fd}
h1,h2,h3{margin:0 0 12px}h2{font-size:20px}h3{font-size:15px}
.muted{color:var(--mu)}.small{font-size:12px}.sp{flex:1}.right{text-align:right}
.bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.empty{color:var(--mu);text-align:center;padding:40px 16px}
.card{background:var(--p1);border:1px solid var(--bd);border-radius:12px;padding:16px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px;align-items:start}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.kpi{background:var(--p1);border:1px solid var(--bd);border-radius:12px;padding:14px}.kpi span{color:var(--mu);font-size:12px}.kpi b{display:block;font-size:24px;margin-top:4px}
table{width:100%;border-collapse:collapse}th,td{padding:8px;border-bottom:1px solid var(--bd);text-align:left;vertical-align:top}
th{color:var(--mu);font-weight:500;font-size:12px}td.n,th.n{text-align:right;white-space:nowrap}
tr.click{cursor:pointer}tr.click:hover{background:var(--p2)}
.pill{display:inline-block;font-size:11px;padding:2px 8px;border-radius:9px;background:var(--p3);white-space:nowrap}.pill.bad{background:#7f1d1d}.pill.ok{background:#14532d}.pill.warn{background:#78350f}
.sw{display:inline-block;width:14px;height:14px;border-radius:4px;vertical-align:-2px;margin-right:6px}
.row{display:flex;justify-content:space-between;gap:10px;padding:3px 0;color:var(--mu)}.row b{color:var(--tx)}.row.big{font-size:20px;font-weight:700;color:var(--tx)}
.fld{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}.fld>span{color:var(--mu);font-size:12px}
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0 12px}
.chk{display:flex;align-items:center;gap:8px;margin:6px 0;cursor:pointer}
.tabs{display:flex;gap:4px;flex-wrap:wrap}.tabs button{background:transparent}.tabs button.on{background:var(--ac);border-color:var(--ac);color:#fff}
.seg{display:flex;gap:4px;align-items:center}.seg button{padding:7px 11px}.seg button.on{background:var(--ac);border-color:var(--ac);color:#fff}
/* modal */
.mbg{position:fixed;inset:0;background:#000b;display:flex;align-items:center;justify-content:center;z-index:50;padding:16px}
.mbox{background:var(--p1);border:1px solid var(--bd);border-radius:14px;padding:20px;width:min(400px,100%);max-height:92vh;overflow:auto}
.mbox.wide{width:min(680px,100%)}.mbox.xwide{width:min(960px,100%)}
.mact{display:flex;gap:8px;justify-content:flex-end;margin-top:16px;align-items:center;flex-wrap:wrap}
.mlist{display:grid;gap:8px}.mlist button{text-align:left;padding:12px}
.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.keypad button{padding:16px;font-size:20px;font-weight:600}
.npv{font-size:32px;font-weight:700;text-align:right;padding:6px 4px 14px;min-height:58px;letter-spacing:.04em}
.rcpt{background:#fbfbf8;color:#111;padding:16px;border-radius:8px;font:12.5px/1.45 ui-monospace,Menlo,Consolas,monospace;white-space:pre;overflow:auto;margin:0}
.secret{font:16px ui-monospace,Menlo,monospace;background:var(--p2);padding:10px;border-radius:8px;word-break:break-all;user-select:all}
#toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,90px);background:#0b1220;border:1px solid var(--bd);padding:11px 16px;border-radius:10px;transition:.25s;z-index:80;opacity:0;max-width:90vw}
#toast.show{transform:translate(-50%,0);opacity:1}#toast.err{border-color:var(--bad)}
/* auth screens */
.center{min-height:100%;display:flex;align-items:center;justify-content:center;padding:20px;background:radial-gradient(circle at 30% 15%,#1e293b,#0b0d10 70%)}
.authbox{width:min(380px,100%)}.brand{font-size:24px;font-weight:700;margin-bottom:6px;display:flex;align-items:center;gap:10px}
.logo-i{width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,#ef4444,#f59e0b);display:inline-block;flex:none}
/* app shell with sidebar */
.shell{display:grid;grid-template-columns:220px 1fr;height:100vh;height:100dvh}
.side{background:var(--p1);border-right:1px solid var(--bd);padding:14px 10px;display:flex;flex-direction:column;gap:2px;overflow:auto}
.side .brand{font-size:16px;padding:4px 8px 14px}
.side button{text-align:left;background:transparent;border-color:transparent;color:var(--mu);padding:8px 10px}
.side button.on{background:var(--p3);color:var(--tx);border-color:var(--bd)}
.side .grp{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:#6b7280;padding:12px 10px 4px}
.page{overflow:auto;padding:20px 24px}
.ptitle{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}.ptitle h2{margin:0}
@media (max-width:860px){.shell{grid-template-columns:1fr;grid-template-rows:auto 1fr}.side{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--bd)}.side .grp,.side .brand{display:none}.side button{white-space:nowrap}.page{padding:14px}}
/* thermal printing */
#printArea{display:none}
@media print{
  @page{margin:0}
  body *{visibility:hidden!important}
  #printArea,#printArea *{visibility:visible!important}
  #printArea{display:block!important;position:absolute;left:0;top:0;color:#000;background:#fff}
  #printArea pre{margin:0;padding:2mm 3mm 8mm;font:11.5px/1.3 ui-monospace,Menlo,Consolas,"Courier New",monospace;white-space:pre}
  #printArea.w80 pre{width:76mm}#printArea.w58 pre{width:54mm;font-size:10px}
  #printArea .cut{page-break-after:always}
}