:root{--bg-void:#030712;--bg-base:#0a0f24;--bg-raised:#0f1730;--brand-cyan:#22d3ee;--brand-blue:#2563eb;--text-primary:#f8fafc;--text-secondary:#cbd5e1;--line:#e2e8f024;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{background:var(--bg-void);min-height:100vh;color:var(--text-primary);margin:0}button,input{font:inherit}.app-shell{grid-template-rows:auto minmax(0,1fr) auto;height:100dvh;display:grid;overflow:hidden}.app-shell.install-open{grid-template-rows:auto auto minmax(0,1fr) auto}.topbar{background:var(--bg-base);border-bottom:1px solid var(--line);grid-template-columns:minmax(170px,1fr) auto minmax(230px,1fr);align-items:center;gap:12px;padding:8px 14px;display:grid}.brand-lockup{align-items:center;gap:14px;min-width:0;display:flex}.brand-lockup img{object-fit:contain;border-radius:8px;flex:none;width:44px;height:44px}.topbar strong{letter-spacing:.02em;display:block}.topbar span{color:var(--text-secondary);font-size:13px}.status{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:14px;display:flex}.keyboard-status-button{min-height:34px;color:var(--brand-cyan);border-color:#22d3ee80;border-radius:6px;padding:0 12px;font-size:12px;font-weight:900}.mode-switch{border:1px solid var(--line);background:#0f1730d1;border-radius:8px;grid-template-columns:repeat(3,minmax(90px,1fr));gap:6px;padding:4px;display:grid}.mode-switch button{border-radius:6px;min-height:38px;padding:0 12px;font-size:13px;font-weight:900}.install-banner{background:linear-gradient(90deg,#22d3ee29,#2563eb14),#071225;border-bottom:1px solid #22d3ee4d;grid-template-columns:minmax(0,1fr) auto auto auto;align-items:center;gap:12px;padding:10px 14px;display:grid}.install-banner strong,.install-banner span{display:block}.install-banner strong{letter-spacing:.01em}.install-banner span{color:var(--text-secondary);margin-top:3px;font-size:12px;line-height:1.35}.install-banner button{border-color:var(--brand-cyan);min-width:118px;min-height:44px;color:var(--brand-cyan);background:#22d3ee1a;padding:0 16px;font-weight:900}.install-banner .dismiss-install{border-color:var(--line);color:var(--text-secondary);background:#0f1730b3}.mode-switch .selected{border-color:var(--brand-cyan);color:var(--brand-cyan);background:#22d3ee1a}.online{color:#10b981!important}.offline{color:#f59e0b!important}.pos-grid{box-sizing:border-box;grid-template-columns:minmax(190px,260px) minmax(360px,1.45fr) minmax(250px,.95fr);gap:8px;width:100%;min-height:0;padding:12px;display:grid;overflow:hidden}.orders-band{grid-template-columns:1fr 300px;gap:12px;min-height:0;padding:12px;display:none;overflow:hidden}.orders-band.active{display:grid}.panel{background:var(--bg-raised);border:1px solid var(--line);border-radius:8px;min-width:0;min-height:0;padding:12px;overflow:auto}.actions{grid-template-rows:auto minmax(0,1fr);gap:12px;display:grid;overflow:hidden}.item-controls{gap:12px;min-height:0;display:grid}.item-controls h2{margin-bottom:0}.customer{padding:12px}.customer input{min-height:44px}.customer dl{grid-template-columns:76px 1fr;gap:6px;margin-top:14px}.panel h2{margin:0 0 12px;font-size:17px}.section-heading{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.section-heading h2{margin:0}.section-heading span{color:var(--text-secondary);font-size:13px}input{box-sizing:border-box;border:1px solid var(--line);width:100%;color:var(--text-primary);background:#050914;border-radius:6px;min-height:48px;padding:11px 14px}dl{grid-template-columns:80px 1fr;gap:8px;margin-top:16px;display:grid}dt{color:var(--text-secondary)}dd{margin:0}.basket{grid-template-rows:auto 1fr auto;display:grid;overflow:hidden}.basket-heading{justify-content:space-between;align-items:center;gap:10px;display:flex}.basket-heading span{color:#fbbf24;font-size:12px;font-weight:700}.empty{color:var(--text-secondary);border:1px dashed var(--line);border-radius:8px;place-items:center;display:grid}.notice{color:var(--brand-cyan);overflow-wrap:anywhere;background:#22d3ee14;border:1px solid #22d3ee4d;border-radius:6px;margin:14px 0 0;padding:10px;font-size:13px}.receipt-notice{gap:8px;display:grid}.receipt-notice button{min-height:38px;color:var(--brand-cyan);border-color:#22d3ee8c}.print-status{text-transform:uppercase;border-radius:6px;width:fit-content;padding:6px 8px;font-size:12px;display:inline-block}.print-status.completed{color:#052e1a;background:#34d399}.print-status.failed{color:#451a03;background:#fbbf24}.login-panel{border-bottom:1px solid var(--line);margin-bottom:14px;padding-bottom:14px}.login-panel form{gap:8px;display:grid}.login-panel p{color:#fca5a5;margin:0;font-size:12px}.login-panel .operator-hint{color:var(--text-secondary);font-size:12px}.login-row{grid-template-columns:1fr 86px;gap:8px;display:grid}.cashier-card{grid-template-columns:1fr auto;align-items:center;gap:8px;display:grid}.cashier-card span{color:var(--text-secondary);margin-top:3px;font-size:12px;display:block}.queue-box,.recent{border-top:1px solid var(--line);margin-top:18px;padding-top:14px}.queue-box h3,.recent h3{color:var(--text-secondary);text-transform:uppercase;margin:0 0 10px;font-size:13px;font-weight:700}.queue-row,.recent-row{justify-content:space-between;align-items:center;gap:10px;padding:6px 0;font-size:13px;display:flex}.queue-row span,.recent-row span{color:var(--text-secondary);display:block}.recent-row button{min-height:32px;padding:0 10px;font-size:12px}.review-row{border-bottom:1px solid var(--line);gap:4px;padding:8px 0;font-size:12px;display:grid}.review-row span{color:var(--text-secondary);overflow-wrap:anywhere}.small{min-height:48px;font-size:12px}.order-search{grid-template-columns:1fr 110px;gap:10px;display:grid}.role-action-panel{background:#22d3ee14;border:1px solid #22d3ee57;border-radius:8px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;margin-bottom:14px;padding:12px;display:grid}.role-action-panel span{color:var(--brand-cyan);text-transform:uppercase;font-size:12px;font-weight:900;display:block}.role-action-panel strong{margin-top:3px;font-size:18px;display:block}.role-action-panel p{color:var(--text-secondary);margin:4px 0 0;font-size:13px;line-height:1.35}.role-action-panel button{border-color:var(--brand-cyan);min-width:190px;min-height:58px;color:var(--brand-cyan);background:#22d3ee1a;font-weight:900}.orders-list{gap:8px;margin-top:12px;display:grid}.order-row{border:1px solid var(--line);background:#0a1024;border-radius:6px;grid-template-columns:minmax(180px,1fr) 130px auto;align-items:center;gap:12px;padding:10px;display:grid}.order-row span{color:var(--text-secondary);font-size:12px;display:block}.order-actions{grid-template-columns:repeat(4,76px);gap:6px;display:grid}.order-actions button{min-height:36px;font-size:13px}.basket-lines{align-content:start;gap:8px;min-height:220px;display:grid;overflow:auto}.basket-line{border:1px solid var(--line);background:#0a1024;border-radius:6px;grid-template-columns:1fr;align-items:center;gap:12px;padding:10px;display:grid}.basket-line span{color:var(--text-secondary);font-size:12px;display:block}.qty-controls{text-align:center;grid-template-columns:34px 34px 34px;align-items:center;display:grid}.qty-controls button{min-height:34px}.price-control{gap:3px;display:grid}.price-control span{color:var(--text-secondary);font-size:11px}.price-control input{min-height:34px;padding:6px 8px}.basket footer{justify-content:space-between;padding-top:14px;font-size:20px;display:flex}.subsidy-panel{background:#10b98114;border:1px solid #10b98161;border-radius:6px;gap:7px;margin-top:10px;padding:10px;display:grid}.subsidy-heading,.subsidy-row,.subsidy-line{justify-content:space-between;align-items:center;gap:10px;display:flex}.subsidy-heading span,.subsidy-row span,.subsidy-line span{color:var(--text-secondary);font-size:12px}.subsidy-row strong,.subsidy-line strong{font-size:13px}.subsidy-row.payable{border-top:1px solid #10b9814d;padding-top:6px}.subsidy-row.payable strong{color:#34d399;font-size:18px}.subsidy-panel p{color:#fbbf24;margin:0;font-size:12px;font-weight:700}.void{background:#3f1724;border-color:#7f1d1d}.void.selected{color:#fecaca;border-color:#ef4444}.tender-row,.balance-row{grid-template-columns:1fr 110px 82px;align-items:center;gap:8px;padding:6px 0;font-size:13px;display:grid}.tender-row button{min-height:32px;font-size:12px}.balance-row{border-top:1px solid var(--line);grid-template-columns:1fr auto;padding-top:10px}.buttons{grid-template-columns:repeat(auto-fit,minmax(132px,1fr));align-content:start;gap:10px;min-height:0;margin:0;padding-right:4px;display:grid;overflow:auto}.buttons button{overflow-wrap:anywhere;min-height:clamp(74px,9vh,108px);padding:10px 12px;font-size:clamp(15px,1.25vw,20px);font-weight:800;line-height:1.08}.category-strip{gap:8px;padding:0;display:flex;overflow-x:auto}.category-strip button{flex:none;min-width:72px;min-height:48px;padding:0 18px;font-size:15px;font-weight:800}.category-strip .selected{border-color:var(--brand-cyan);color:var(--brand-cyan)}.buttons button span,.match-list button span{color:var(--text-secondary);margin-top:6px;font-size:14px;font-weight:700;display:block}.match-list{gap:8px;margin-top:12px;display:grid}.match-list button{text-align:left;min-height:42px;padding:8px 10px}button{border:1px solid var(--line);min-height:44px;color:var(--text-primary);background:#111a36;border-radius:6px}.actions input{min-height:58px;font-size:17px}@media (width>=1680px){.buttons button{min-height:116px;font-size:21px}}.accept{background:var(--brand-blue);border-color:var(--brand-blue);white-space:normal;font-weight:700}.accept-blocked{color:#fbbf24;text-align:right;margin:0;font-size:13px;font-weight:700}.accept:disabled,.cancel:disabled,.order-actions button:disabled{opacity:.45}.cancel{background:#3f1724;border-color:#7f1d1d}.payment-bar{border-top:1px solid var(--line);background:var(--bg-base);flex-wrap:wrap;align-items:center;gap:10px;padding:8px 12px 10px;display:flex}.payment-type-tabs{flex:240px;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-width:210px;display:grid}.payment-type-tabs button,.payment-bar>button{min-height:54px;font-weight:800}.payment-type-tabs .selected{border-color:var(--brand-cyan);color:var(--brand-cyan)}.payment-bar input{flex:116px;min-width:92px;min-height:54px;font-size:18px}.payment-bar .card-reference{flex-basis:190px;font-size:16px}.payment-summary{flex:0 0 116px;gap:4px;display:grid}.payment-summary span{color:var(--text-secondary);text-transform:uppercase;font-size:12px;font-weight:800}.payment-summary strong{font-size:22px}.payment-bar .accept{color:#04130d;background:#10b981;border-color:#10b981;flex:156px;min-height:58px;font-weight:900}.payment-bar .void,.payment-bar .cancel{flex:0 0 78px;min-height:54px;font-weight:900}.payment-bar>button:not(.void):not(.cancel):not(.accept){flex:0 0 118px}.payment-bar .accept-blocked{flex:1 0 100%}.supervisor-inline{flex:1 0 100%;grid-template-columns:1fr 110px 130px;gap:8px;display:grid}.supervisor-inline input,.supervisor-inline button{min-height:50px}.modal-backdrop{z-index:20;background:#030712bd;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.soft-keyboard{z-index:40;background:#0a0f24fa;border:1px solid #22d3ee61;border-radius:10px;gap:10px;width:min(560px,100vw - 24px);max-height:min(72vh,620px);padding:12px;animation:.14s ease-out keyboard-slide-in;display:grid;position:fixed;bottom:12px;right:12px;box-shadow:0 22px 70px #0000009e}.dialog-keyboard-open .soft-keyboard{width:min(360px,100vw - 24px);max-height:min(42vh,330px)}.dialog-keyboard-open .keyboard-header{align-items:center}.dialog-keyboard-open .keyboard-header span{display:none}.dialog-keyboard-open .keyboard-grid{gap:6px}.keyboard-header{justify-content:space-between;align-items:center;gap:16px;display:flex}.keyboard-header strong,.keyboard-header span{display:block}.keyboard-header span{color:var(--text-secondary);text-transform:uppercase;margin-top:2px;font-size:12px;font-weight:800}.keyboard-header button{border-color:var(--brand-cyan);min-width:120px;min-height:46px;color:var(--brand-cyan);font-weight:900}.keyboard-grid{gap:8px;display:grid;overflow:auto}.keyboard-grid button,.letter-pad button,.side-number-pad button{touch-action:manipulation;background:#111a36;border-radius:8px;min-height:58px;font-size:20px;font-weight:900}.keyboard-grid button:active,.letter-pad button:active,.side-number-pad button:active{border-color:var(--brand-cyan);color:var(--brand-cyan);transform:translateY(1px)}.keyboard-body{grid-template-columns:minmax(0,1fr) 122px;gap:10px;min-height:0;display:grid}.letter-pad{gap:8px;min-width:0;display:grid}.letter-row{grid-template-columns:repeat(10,minmax(0,1fr));gap:6px;display:grid}.letter-row:nth-child(2){padding-inline:14px}.letter-row:nth-child(3){grid-template-columns:repeat(7,minmax(0,1fr));padding-inline:38px}.letter-row.action-row{grid-template-columns:minmax(0,1fr) 78px 78px;padding-inline:0}.letter-pad button{min-height:48px;font-size:17px}.letter-pad .wide-key{min-width:0}.side-number-pad{border-left:1px solid var(--line);grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding-left:10px;display:grid}.side-number-pad button{min-height:48px;font-size:18px}.number-keyboard{grid-template-columns:repeat(3,minmax(70px,1fr))}.number-keyboard button{min-height:54px;font-size:22px}@keyframes keyboard-slide-in{0%{opacity:0;transform:translate(18px)translateY(8px)}to{opacity:1;transform:translate(0)translateY(0)}}.support-mode{min-height:0;padding:12px;overflow:hidden}.support-panel{height:100%}.support-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0;display:grid}.support-card{border:1px solid var(--line);background:#0307124d;border-radius:8px;gap:8px;padding:14px;display:grid}.support-card span{color:var(--text-secondary);text-transform:uppercase;font-size:12px;font-weight:800}.support-card strong{font-size:30px}.support-columns{grid-template-columns:1fr 1fr;gap:16px;min-height:0;display:grid}.support-row{border-bottom:1px solid var(--line);grid-template-columns:minmax(0,1fr) 90px auto auto auto;align-items:center;gap:8px;padding:9px 0;display:grid}.support-row span,.support-row em{color:var(--text-secondary);overflow-wrap:anywhere}.support-row button{min-height:34px;padding:0 10px;font-size:12px;font-weight:800}.sale-trace-panel{background:#03071252;border:1px solid #22d3ee57;border-radius:8px;margin-top:18px;padding:14px}.trace-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0;display:grid}.trace-grid div{border:1px solid var(--line);background:#0f1730b8;border-radius:6px;gap:4px;padding:10px;display:grid}.trace-grid span{color:var(--text-secondary);text-transform:uppercase;font-size:12px;font-weight:800}.sale-trace-panel pre{border:1px solid var(--line);max-height:280px;color:var(--text-secondary);white-space:pre-wrap;background:#050914;border-radius:6px;margin:0;padding:12px;font-size:12px;overflow:auto}.payment-dialog{background:#0f1730;border:1px solid #22d3ee6b;border-radius:8px;width:min(560px,100%);padding:22px;box-shadow:0 24px 80px #00000080}.install-dialog{background:#0f1730;border:1px solid #22d3ee6b;border-radius:10px;width:min(640px,100%);padding:22px;box-shadow:0 24px 80px #00000080}.install-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0;display:grid}.install-steps div{border:1px solid var(--line);background:#03071247;border-radius:8px;align-content:start;gap:10px;min-height:130px;padding:14px;display:grid}.install-steps strong{color:#04130d;background:var(--brand-cyan);border-radius:999px;place-items:center;width:40px;height:40px;font-size:20px;display:grid}.install-steps span{color:var(--text-secondary);line-height:1.35}.dialog-heading{justify-content:space-between;align-items:start;gap:18px;margin-bottom:18px;display:flex}.dialog-heading h2{margin:0;font-size:26px}.dialog-heading span{color:var(--text-secondary);margin-top:4px;display:block}.dialog-heading strong{font-size:30px}.dialog-subsidy{background:#10b98114;border:1px solid #10b98159;border-radius:6px;justify-content:space-between;gap:12px;margin-bottom:14px;padding:10px;display:flex}.dialog-subsidy span{color:var(--text-secondary)}.dialog-subsidy strong{color:#34d399}.dialog-tender-tabs{grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px;display:grid}.dialog-tender-tabs button{min-height:64px;font-size:18px;font-weight:800}.dialog-tender-tabs .selected{border-color:var(--brand-cyan);color:var(--brand-cyan)}.dialog-amount{gap:8px;display:grid}.dialog-amount span,.dialog-balance span{color:var(--text-secondary);text-transform:uppercase;font-size:13px;font-weight:800}.dialog-amount input{min-height:66px;font-size:28px}.dialog-balance{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;margin:16px 0 20px;padding-top:16px;display:flex}.dialog-balance strong{font-size:26px}.dialog-actions{grid-template-columns:160px 1fr;gap:12px;display:grid}.dialog-actions button{min-height:64px;font-size:18px;font-weight:800}.cancel-dialog{background:#111a36}.complete-sale{background:var(--brand-blue);border-color:var(--brand-blue)}@media (width<=1180px){.topbar{grid-template-columns:minmax(150px,1fr) auto}.status{grid-column:1/-1;justify-content:space-between}.pos-grid{grid-template-columns:minmax(170px,230px) minmax(320px,1.35fr) minmax(230px,.9fr);padding:8px}.buttons{grid-template-columns:repeat(auto-fit,minmax(118px,1fr))}.buttons button{min-height:72px;font-size:15px}.install-banner{grid-template-columns:minmax(0,1fr) auto}.install-banner .dismiss-install{grid-column:2}}@media (width<=960px){.pos-grid,.orders-band{grid-template-columns:1fr;overflow:auto}.app-shell{overflow:auto}.panel{min-height:320px}.basket,.actions{min-height:520px}.payment-bar{z-index:10;position:sticky;bottom:0}.column-splitter{display:none}.order-row{grid-template-columns:1fr}.order-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.role-action-panel{grid-template-columns:1fr}.role-action-panel button{width:100%}.basket-line{grid-template-columns:1fr}.soft-keyboard{width:min(460px,100vw - 24px)}.keyboard-body{grid-template-columns:1fr}.side-number-pad{border-left:0;border-top:1px solid var(--line);grid-template-columns:repeat(5,minmax(0,1fr));padding-top:8px;padding-left:0}.letter-row,.letter-row:nth-child(2),.letter-row:nth-child(3){grid-template-columns:repeat(5,minmax(0,1fr));padding-inline:0}.install-banner{grid-template-columns:1fr}.install-banner button{width:100%}}