:root{--primary: #2E7D32;--primary-soft: #C8E6C9;--rail-active: #14481A;--ground: #FAFAFA;--surface: #FFF;--cart-bg: #DDDDDD;--line: #CCCCCC;--ink: #333333;--ink-2: #666666;--ink-3: #999999;--ok: #1B7A32;--warn: #9C4F1D;--crit: #C62828;--crit-soft: #FFEBEE;--warn-soft: #FFF3E0;--ok-soft: #E8F5E9;--shop: #2E7D32;--shop-tint: #2E7D3233;--home: #00D8FF;--home-tint: #00D8FF33;--mono: ui-monospace, "Cascadia Mono", Consolas, monospace;--body: "Bai Jamjuree", "Noto Sans Thai", "Sarabun", -apple-system, "Segoe UI", system-ui, sans-serif;--head-h: 60px;--rail-h: 60px;--cart-w: 400px}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%}body{background:var(--ground);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.4;-webkit-text-size-adjust:100%;-webkit-user-select:none;user-select:none;overscroll-behavior:none}input,textarea{user-select:text}button{font-family:inherit;font-size:1rem;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;border:none;background:none;padding:0}button:disabled{opacity:.45;cursor:default}button:active:not(:disabled){filter:brightness(.94)}:focus-visible{outline:3px solid var(--primary);outline-offset:2px}img{-webkit-user-drag:none;user-select:none}.pos{display:flex;flex-direction:column;height:100%;overflow:hidden}.pos-head{height:var(--head-h);flex-shrink:0;background:var(--primary);color:#fff;display:flex;align-items:center;gap:10px;padding:0 10px}.pos-head .title{font-weight:600;font-size:1.05rem;white-space:nowrap}.pos-head .spacer{flex:1}.head-menu{width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem}.head-search{display:flex;align-items:center;background:#fff9;border-radius:20px;padding-left:14px}.head-search input{width:300px;height:44px;border:none;background:transparent;font-family:inherit;font-size:1rem;color:var(--ink)}.head-search input::placeholder{color:var(--ink-2)}.head-search .clear{width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:var(--ink-2);font-size:1.2rem}.head-btn{min-height:40px;padding:0 16px;border:1px solid #fff;border-radius:6px;color:#fff;font-weight:500}.head-btn[aria-pressed=true]{background:#fff;color:var(--primary)}.head-bill{width:var(--cart-w);display:flex;align-items:center;gap:8px;padding-right:10px}.head-bill .price-mode{width:110px;text-align:center}.head-bill .price-mode .label{font-size:.72rem;display:block;margin-bottom:2px}.head-bill .price-mode button{width:100%;min-height:26px;border:1px solid #fff;border-radius:5px;color:#fff;font-size:.72rem}.head-bill .where{flex:1;text-align:center;font-weight:600}.head-bill .guests{width:90px;text-align:right;font-size:.95rem;display:flex;align-items:center;justify-content:flex-end;gap:5px}.pos-body{flex:1;display:flex;min-height:0}.pos-main{flex:1;min-width:0;overflow-y:auto;-webkit-overflow-scrolling:touch}.pos-rail{height:var(--rail-h);flex-shrink:0;background:var(--primary);display:flex;overflow-x:auto;scrollbar-width:none}.pos-rail::-webkit-scrollbar{display:none}.rail-item{flex:1 0 auto;min-width:76px;height:var(--rail-h);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#fff}.rail-item[aria-pressed=true]{background:var(--rail-active)}.rail-item img{width:20px;height:20px;object-fit:contain}.rail-item .rail-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:16px}.rail-item span{font-size:10px;line-height:1.2;white-space:nowrap}.product-wrap{display:flex;flex-wrap:wrap;align-content:flex-start;margin-left:10px;margin-top:10px}.product-cell{width:100px;height:130px;margin-right:10px;margin-bottom:10px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center}.product-cell img{width:100px;height:100px;object-fit:contain;flex-shrink:0}.product-cell .pname{font-size:12px;line-height:1.15;color:var(--ink);overflow:hidden;width:100%}.product-cell{position:relative}.product-cell .incart{position:absolute;top:2px;right:2px;min-width:22px;height:22px;border-radius:11px;background:var(--rail-active);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 5px}.product-cell.discount .pname{color:var(--crit);font-weight:600}.grid-empty{padding:40px;text-align:center;color:var(--ink-3)}.table-wrap{display:flex;flex-wrap:wrap}.table-cell{width:20%;padding:10px;display:flex;align-items:center;justify-content:center;position:relative}.table-cell img{width:200px;height:140px;object-fit:contain;max-width:100%}.table-cell .tname{position:absolute;text-align:center;font-size:1rem;color:var(--ink);pointer-events:none}.bill-wrap{display:flex;flex-wrap:wrap;align-items:center;padding:10px}.bill-card{width:200px;height:100px;border:2px solid #000;background:#fff;padding:10px;margin-right:10px;margin-bottom:10px;display:flex;flex-direction:column;position:relative;text-align:center;color:var(--ink)}.bill-card .bname{flex:1;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:600;line-height:1.1}.bill-card .bdesc{height:20px;font-size:12px}.bill-card .brow{display:flex;justify-content:space-between;font-size:12px}.bill-card .bicon{position:absolute;left:6px;top:6px;width:40px;height:40px;object-fit:contain}.bill-card .bdel{position:absolute;top:0;right:0;width:40px;height:40px;border:1px solid #FF0000;border-radius:4px;background:#f002;color:red;font-size:24px;display:flex;align-items:center;justify-content:center;z-index:10}.bill-card.shop{border-color:var(--shop);background:var(--shop-tint)}.bill-card.home{border-color:var(--home);background:var(--home-tint)}.bill-card.deli{border-color:#666;background:#efefef}.bill-card.add{border-color:#000;background:#fff;align-items:center;justify-content:center;font-size:40px;color:var(--ink-2)}.deli-strip{height:120px;flex-shrink:0;background:#fff;border-top:1px solid var(--line);padding:10px 0 0 10px;display:flex;gap:0;overflow-x:auto}.cart{width:var(--cart-w);flex-shrink:0;background:var(--cart-bg);display:flex;flex-direction:column;min-height:0}.cart-scroll{flex:1;overflow-y:auto;padding-bottom:10px}.cart-divider{display:flex;align-items:center;gap:8px;padding:6px 10px 2px;font-size:.8rem;color:var(--ink-2)}.cart-divider:before,.cart-divider:after{content:"";flex:1;height:1px;background:#bbb}.cart-row{display:flex;align-items:center;margin-top:2px;padding:0 8px;min-height:38px;position:relative}.cart-row.discount{background:transparent}.cart-row .qty{width:40px;height:30px;flex-shrink:0;border:1px solid var(--primary);border-radius:5px;background:#fff;color:var(--primary);font-size:.95rem}.cart-row .cname{flex:1;margin:0 10px;font-size:.95rem;line-height:1.25}.cart-row .camt{width:80px;text-align:right;font-size:.95rem;white-space:nowrap}.cart-row .edit{width:34px;height:30px;color:var(--ink-2);font-size:1rem}.cart-row.cancelled{opacity:.6}.cart-row.cancelled .cname{text-decoration:line-through}.cart-foot{background:#fafafa;padding-top:3px}.cart-tools{display:flex;gap:6px;padding:3px 10px}.cart-tool{height:30px;padding:0 12px;background:#fff;border:1px solid var(--primary);border-radius:5px;color:var(--primary);font-size:.85rem;display:inline-flex;align-items:center;gap:5px}.cart-total{display:flex;padding:4px 10px;font-size:1rem}.cart-total .grow{flex:1}.cart-total.grand{font-weight:700;font-size:1.15rem}.cart-member{display:flex;align-items:center;padding:2px 10px;color:var(--primary);font-size:.9rem}.cart-actions{display:flex;align-items:center;gap:6px;padding:6px}.cart-actions .print{width:40px;height:40px;flex-shrink:0;border-radius:4px;background:var(--rail-active);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.1rem}.cart-actions .act{height:40px;border-radius:4px;color:#fff;font-weight:600;display:flex;align-items:center;justify-content:center}.cart-actions .act.save{flex:6;background:var(--primary)}.cart-actions .act.bill{flex:2;background:var(--primary)}.cart-actions .act.pay{flex:2;background:var(--rail-active)}.cart-actions .act:disabled{background:#bbb}.paydlg{width:min(1040px,96vw);height:min(660px,92vh);background:var(--ground);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 18px 50px #00000059}.paydlg-head{height:48px;flex-shrink:0;background:var(--primary);color:#fff;display:flex;align-items:center;padding:0 6px 0 16px;font-weight:600}.paydlg-head .grow{flex:1}.paydlg-head button{width:40px;height:40px;color:#fff;font-size:1.4rem;display:flex;align-items:center;justify-content:center}.paydlg-body{flex:1;display:flex;min-height:0}.paydlg-rail{width:200px;flex-shrink:0;padding:10px;display:flex;flex-direction:column;gap:8px;overflow-y:auto}.paydlg-rail .method{min-height:52px;padding:8px 12px;border:1px solid var(--line-strong, #CFD3C9);border-radius:8px;background:#fff;text-align:left;font-size:1rem;display:flex;align-items:center;gap:10px;flex-shrink:0}.paydlg-rail .method[aria-pressed=true]{border-color:var(--primary);border-width:2px;background:var(--primary-soft);color:var(--primary);font-weight:600}.paydlg-rail .spacer{flex:1;min-height:8px}.paydlg-rail .split{min-height:64px;border-radius:8px;background:var(--primary);color:#fff;font-weight:600;font-size:1.05rem;flex-shrink:0}.paydlg-rail .split[aria-pressed=true]{background:var(--rail-active)}.paydlg-main{flex:1;min-width:0;background:#00000010;padding:12px;display:flex;flex-direction:column;gap:10px}.paydlg-sum{display:flex;background:#fff;border-radius:10px;padding:8px 10px;flex-shrink:0}.paydlg-sum>div{flex:1;text-align:center;min-width:0}.paydlg-sum .k{font-size:.85rem;color:var(--ink-2)}.paydlg-sum .v{font-family:var(--mono);font-size:1.55rem;font-weight:700}.paydlg-sum .v.box{background:#f1f2f0;border-radius:8px;padding:2px 8px;border:1px solid var(--line)}.paydlg-sum .v.change{color:var(--rail-active)}.paydlg-work{flex:1;display:flex;gap:10px;min-height:0}.paydlg-pad{flex:1;min-width:0;display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(38px,1fr);gap:8px}.paydlg-pad button{border:1px solid var(--primary);border-radius:10px;background:#fff;color:var(--primary);font-family:var(--mono);font-size:clamp(1rem,3vh,1.5rem);font-weight:600;display:flex;align-items:center;justify-content:center}.paydlg-pad button.quick{font-size:clamp(.85rem,2.2vh,1.05rem)}.paydlg-pad button.confirm{grid-row:span 2;background:var(--primary);color:#fff;font-family:var(--body);font-size:clamp(1rem,2.8vh,1.3rem)}.paydlg-pad button:disabled{opacity:.4}.paydlg-qr{width:230px;flex-shrink:0;background:#fff;border-radius:10px;padding:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:0}.paydlg-qr img{max-width:100%;max-height:100%;image-rendering:pixelated}.paydlg-qr .note{font-size:.75rem;color:var(--ink-2);text-align:center;line-height:1.3}.paydlg-split{flex:1;background:#fff;border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:8px;min-height:0}.paydlg-split .list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:6px}.paydlg-split .row{display:flex;align-items:center;gap:10px;background:#eee;border-radius:10px;padding:8px 10px}.paydlg-split .row .n{flex:1;font-size:1.05rem}.paydlg-split .row .a{font-family:var(--mono);font-size:1.05rem;font-weight:600}.paydlg-split .row button{min-height:38px;padding:0 14px;border-radius:8px;background:var(--primary);color:#fff;font-weight:600}.paydlg-split .add{min-height:52px;border-radius:10px;background:var(--primary);color:#fff;font-weight:600;font-size:1.05rem}.paydlg-split{position:relative}.paydlg-fab{position:absolute;right:14px;bottom:62px;width:54px;height:54px;border-radius:27px;background:var(--primary);color:#fff;font-size:1.8rem;line-height:1;font-weight:600;box-shadow:0 3px 10px #00000047}.paydlg-back{flex-shrink:0;min-height:42px;margin-bottom:8px;border-radius:10px;border:1px dashed #bbb;background:#fff;color:var(--ink-2);font-size:.9rem}.paydlg-split .foot{display:flex;gap:10px;align-items:center;flex-shrink:0}.paydlg-split .foot .info{flex:1;font-size:.95rem}@media(max-height:560px){.paydlg-rail .method{min-height:44px}.paydlg-rail .split{min-height:52px}.paydlg-sum .v{font-size:1.25rem}.paydlg-qr{width:180px}}.pay{height:100%;display:flex;overflow:hidden}.pay-side{width:38%;min-width:260px;max-width:440px;flex-shrink:0;display:flex;flex-direction:column;gap:6px;padding:8px;background:var(--cart-bg);border-right:1px solid var(--line);min-height:0}.pay-qr{flex:1 1 0;min-height:90px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:8px;padding:6px;overflow:hidden}.pay-qr img{max-width:100%;max-height:100%;width:auto;height:auto;image-rendering:pixelated}.pay-qr-note{text-align:center;font-size:.78rem;color:var(--ink-2);line-height:1.3}.pay-received{flex:1 1 auto;min-height:44px;overflow-y:auto;background:#fff;border-radius:8px;padding:4px 0}.pay-received .empty{padding:14px;font-size:.85rem}.pay-side .total-row{padding:1px 4px;font-size:.92rem}.pay-side .total-row.grand{font-size:1.15rem;padding-top:4px}.pay-main{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;gap:6px;padding:8px}.pay-head{display:flex;align-items:center;gap:8px;flex-shrink:0}.pay-head .back{width:44px;height:44px;flex-shrink:0;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:1.3rem;display:flex;align-items:center;justify-content:center}.pay-head .where{flex:1;min-width:0;line-height:1.2}.pay-head .where strong{display:block;font-size:1rem}.pay-head .where span{font-size:.75rem;color:var(--ink-3);font-family:var(--mono)}.pay-total{display:flex;align-items:baseline;gap:10px;flex-shrink:0}.pay-total .label{color:var(--ink-2)}.pay-total .value{flex:1;text-align:right;font-family:var(--mono);font-weight:700;font-size:clamp(1.5rem,4vh,2.2rem)}.pay-label{font-size:.8rem;color:var(--ink-2);flex-shrink:0}.pay-methods{display:flex;flex-wrap:wrap;gap:6px;flex-shrink:0}.pay-methods .pick{min-height:42px;flex:1 1 110px;padding:4px 8px}.pay-main .quick-cash{margin-bottom:0;flex-shrink:0}.pay-main .quick-cash button{min-height:40px}.pay-main .amount-display{margin-bottom:0;flex-shrink:0;font-size:clamp(1.4rem,3.6vh,2.1rem);padding:6px 12px}.pay-main .numpad{flex:1 1 auto;min-height:178px;grid-auto-rows:minmax(34px,1fr);gap:5px}.pay-main .numpad button{min-height:0;height:100%;font-size:clamp(1rem,2.6vh,1.4rem)}.pay-main .btn.wide,.pay-side .btn.wide{flex-shrink:0;min-height:44px}.pay-main,.pay-side{overflow-y:auto}@media(max-height:620px){.pay-qr-note{display:none}.pay-methods .pick{min-height:38px}.pay-main .quick-cash button{min-height:34px}.pay-side .pay-label{display:none}.pay-main,.pay-side{gap:4px;padding:6px}}@media(max-height:560px){.pay-main .pay-label{display:none}.pay-main .numpad{min-height:150px;grid-auto-rows:minmax(30px,1fr)}}@media(max-height:500px){.pay-main .pay-add,.pay-main .quick-cash{display:none}.pay-total .value{font-size:1.4rem}.pay-head .back{width:38px;height:38px}}@media(max-width:760px){.pay{flex-direction:column}.pay-side{width:100%;max-width:none;flex-direction:row;border-right:none;border-bottom:1px solid var(--line);max-height:40%}.pay-side .pay-qr{flex:0 0 auto}}.shortcut{padding:20px}.shortcut .code-row{display:flex;align-items:center;gap:10px;margin-bottom:16px}.shortcut .code-box{width:200px;height:40px;background:#0001;border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:1.2rem}.shortcut .pad{display:flex;gap:8px;max-width:620px}.shortcut .nums{flex:3;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.shortcut .ops{flex:1;display:flex;flex-direction:column;gap:8px}.shortcut button.key{height:80px;border:1px solid var(--primary);border-radius:10px;background:#fff;color:var(--primary);font-size:1.5rem;font-weight:600}.shortcut button.key.enter{height:168px;background:#2e7d3212}.shortcut .hint{margin-top:16px;color:var(--ink-2);font-size:.9rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border-radius:6px;border:1px solid var(--primary);background:var(--primary);color:#fff;font-weight:600}.btn.ghost{background:#fff;color:var(--ink);border-color:var(--line)}.btn.quiet{background:transparent;color:var(--ink-2);border-color:transparent}.btn.danger{background:var(--crit-soft);color:var(--crit);border-color:var(--crit)}.btn.big{min-height:60px;font-size:1.1rem}.btn.wide{width:100%}.page{max-width:720px;margin:0 auto;padding:20px 16px 40px}h1{font-size:1.4rem;margin:0 0 6px;font-weight:700}h2{font-size:1.05rem;margin:20px 0 10px;font-weight:600}.lede{color:var(--ink-2);margin:0 0 18px}.field{margin-bottom:14px}.field label{display:block;font-size:.88rem;color:var(--ink-2);margin-bottom:5px}.field input,.field select,.field textarea{width:100%;min-height:48px;padding:8px 12px;font-family:inherit;font-size:1rem;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:6px}.field input.money{font-family:var(--mono);font-size:1.3rem;text-align:right}.amount-display{font-family:var(--mono);font-size:2.1rem;font-weight:700;text-align:right;padding:10px 14px;border-radius:6px;background:#eee;border:1px solid var(--line);margin-bottom:10px;overflow-x:auto}.numpad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.numpad button{min-height:58px;font-size:1.35rem;font-weight:600;font-family:var(--mono);border-radius:6px;border:1px solid var(--line);background:#fff}.numpad button.wide{grid-column:span 2}.numpad button.erase{font-family:var(--body);font-size:1rem}.quick-cash{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}.quick-cash button{min-height:50px;border-radius:6px;border:1px solid var(--line);background:#fff;font-family:var(--mono);font-weight:600}.overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;padding:16px;z-index:50}.modal{background:var(--ground);border-radius:10px;width:100%;max-width:560px;max-height:92vh;overflow-y:auto;padding:18px;box-shadow:0 12px 40px #00000059}.modal.wide{max-width:860px}.modal h2{margin-top:0;font-size:1.15rem}.alert{border-left:4px solid var(--crit);background:var(--crit-soft);color:var(--crit);padding:10px 14px;border-radius:0 6px 6px 0;margin:10px 0;font-weight:500}.alert.warn{border-left-color:var(--warn);background:var(--warn-soft);color:var(--warn)}.alert.ok{border-left-color:var(--ok);background:var(--ok-soft);color:var(--ok)}.toast-stack{position:fixed;bottom:76px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:8px;z-index:90;width:min(560px,calc(100% - 32px))}.toast{padding:12px 16px;border-radius:6px;background:#222;color:#fff;font-weight:500;box-shadow:0 6px 20px #0000004d}.toast.crit{background:var(--crit)}.toast.warn{background:var(--warn)}.toast.ok{background:var(--ok)}.empty{text-align:center;color:var(--ink-3);padding:40px 20px}.rowlist{display:flex;flex-direction:column;gap:8px}.rowitem{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#fff;border:1px solid var(--line);border-radius:6px;min-height:48px;text-align:left;width:100%}.rowitem .grow{flex:1;min-width:0}.rowitem .v{font-family:var(--mono);font-weight:600;white-space:nowrap}.rowitem .sub{font-size:.82rem;color:var(--ink-3)}.pick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}.pick{min-height:48px;border-radius:6px;border:1px solid var(--line);background:#fff;font-weight:500;padding:8px}.pick[aria-pressed=true]{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:600}.type-grid{display:flex;flex-wrap:wrap;gap:8px}.type-card{border-radius:10px;overflow:hidden;border:2px solid #BBBBBB;background:#fff;padding:0;width:134px}.type-card[aria-pressed=true]{border-width:5px;border-color:var(--primary)}.type-card img{width:100%;height:77.8px;object-fit:contain;display:block}.type-card span{display:block;text-align:center;font-size:.85rem;padding:2px}.qty-row{display:flex;align-items:center;gap:8px}.qty-btn{width:48px;height:48px;border-radius:6px;border:1px solid var(--line);background:#fff;font-size:1.3rem;font-weight:600;display:flex;align-items:center;justify-content:center}.qty-value{font-family:var(--mono);font-size:1.15rem;font-weight:600;min-width:40px;text-align:center}.total-row{display:flex;justify-content:space-between;align-items:baseline;padding:3px 0;color:var(--ink-2)}.total-row.grand{color:var(--ink);font-size:1.4rem;font-weight:700;padding-top:6px}.total-row .v{font-family:var(--mono);font-weight:600}.total-row.discount{color:var(--primary)}.action-row{display:flex;gap:8px;margin-top:10px}.action-row>*{flex:1}.chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;background:#eee;color:var(--ink-2);font-size:.82rem;white-space:nowrap}.chip.ok{background:var(--ok-soft);color:var(--ok)}.chip.warn{background:var(--warn-soft);color:var(--warn)}.chip.crit{background:var(--crit-soft);color:var(--crit)}.pos-head .chip{background:#fff3;color:#fff}.pos-head .chip.crit{background:#c62828;color:#fff}.spinner{width:20px;height:20px;border:3px solid #ccc;border-top-color:var(--primary);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.center-screen{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--ink-2)}
