*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;font-family:Bai Jamjuree,sans-serif}:root{--primary: #7fa98f;--primary-dark: #6d9880;--primary-light:#edf4f0;--bg: #f5f3ef;--surface: #ffffff;--text: #2d3142;--text-sub: #8a92a8;--border: #e8e5df;--radius: 16px;--shadow: 0 2px 8px rgba(45,49,66,.07);--shadow-lg: 0 8px 24px rgba(45,49,66,.12);--safe-bottom: env(safe-area-inset-bottom, 0px)}html{font-size:16px}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;min-height:100dvh}img{display:block}.app{max-width:480px;margin:0 auto;min-height:100dvh;background:var(--bg);position:relative}.header{position:sticky;top:0;z-index:50;background:var(--primary);padding:14px 16px 10px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 2px 8px #7fa98f4d}.header-left{display:flex;flex-direction:column;gap:1px}.header-restaurant{font-size:11px;color:#ffffffbf}.header-table{font-size:18px;font-weight:800;color:#fff}.header-cart-btn{position:relative;width:44px;height:44px;border-radius:50%;background:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 2px 6px #0000001f}.cart-badge{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;background:#fff;color:var(--primary);border-radius:9px;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 4px;border:2px solid var(--primary)}.cat-tabs{display:flex;gap:8px;overflow-x:auto;padding:12px 16px;scrollbar-width:none;background:var(--surface);border-bottom:1px solid var(--border)}.cat-tabs::-webkit-scrollbar{display:none}.cat-tab{display:flex;align-items:center;gap:5px;padding:7px 14px;border-radius:20px;border:1.5px solid var(--border);background:var(--surface);font-size:13px;font-weight:600;color:var(--text-sub);cursor:pointer;white-space:nowrap;transition:all .15s;flex-shrink:0}.cat-tab.active{background:var(--primary);border-color:var(--primary);color:#fff}.cat-icon{font-size:16px}.menu-content{padding:8px 8px 120px}.product-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.product-card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;cursor:pointer;transition:transform .12s,box-shadow .12s;-webkit-tap-highlight-color:transparent;border:2px solid transparent}.product-card:active{transform:scale(.97)}.product-card.unavailable{opacity:.5;pointer-events:none}.product-card.in-cart{border-color:var(--primary)}.product-img-wrap{position:relative}.product-cart-badge{position:absolute;top:5px;right:5px;min-width:20px;height:20px;background:var(--primary);color:#fff;border-radius:10px;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 4px;border:2px solid #fff;box-shadow:0 1px 4px #00000040;line-height:1}.product-img{width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--bg);display:block}.product-img-placeholder{width:100%;aspect-ratio:1/1;background:linear-gradient(135deg,#eef5f1,#dceee4);display:flex;align-items:center;justify-content:center;font-size:28px}.product-img-placeholder.drink{background:linear-gradient(135deg,#eef2fb,#d8e7f8)}.product-info{padding:6px 8px 8px}.product-name{font-size:12px;font-weight:700;color:var(--text);margin-bottom:2px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.product-desc{font-size:10px;color:var(--text-sub);line-height:1.4;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.product-foot{display:flex;align-items:center;justify-content:space-between}.product-price{font-size:13px;font-weight:800;color:var(--primary)}.product-add-btn{width:24px;height:24px;border-radius:50%;background:var(--primary);border:none;cursor:pointer;color:#fff;font-size:16px;font-weight:400;display:flex;align-items:center;justify-content:center;line-height:1;flex-shrink:0}.product-unavail-badge{font-size:10px;color:var(--text-sub);background:var(--bg);padding:2px 6px;border-radius:10px}.sheet-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:100;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.sheet{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;background:var(--surface);border-radius:20px 20px 0 0;z-index:101;max-height:92dvh;display:flex;flex-direction:column;animation:slideUp .25s ease;padding-bottom:max(16px,var(--safe-bottom))}@keyframes slideUp{0%{transform:translate(-50%) translateY(100%)}to{transform:translate(-50%) translateY(0)}}.sheet-handle{width:36px;height:4px;border-radius:2px;background:var(--border);margin:10px auto 0;flex-shrink:0}.sheet-scroll{overflow-y:auto;flex:1}.sheet-scroll::-webkit-scrollbar{display:none}.ps-img{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--bg)}.ps-img-placeholder{width:100%;aspect-ratio:16/9;background:linear-gradient(135deg,#eef5f1,#dceee4);display:flex;align-items:center;justify-content:center;font-size:64px}.ps-img-placeholder.drink{background:linear-gradient(135deg,#eef2fb,#d8e7f8)}.ps-info{padding:16px 16px 0}.ps-name{font-size:20px;font-weight:800;margin-bottom:4px}.ps-desc{font-size:14px;color:var(--text-sub);line-height:1.5;margin-bottom:10px}.ps-price{font-size:22px;font-weight:800;color:var(--primary)}.opt-group{padding:16px 16px 0}.opt-group-head{margin-bottom:10px}.opt-group-name{font-size:15px;font-weight:700;display:flex;align-items:center;gap:6px}.opt-required-badge{font-size:10px;font-weight:700;background:#fee2e2;color:#dc2626;padding:2px 7px;border-radius:8px}.opt-items{display:flex;flex-direction:column;gap:2px}.opt-item-label{display:flex;align-items:center;justify-content:space-between;padding:13px 14px;border-radius:10px;border:1.5px solid var(--border);cursor:pointer;transition:all .12s;background:var(--surface)}.opt-item-label.selected{border-color:var(--primary);background:var(--primary-light)}.opt-item-label input{display:none}.opt-item-left{display:flex;align-items:center;gap:10px}.opt-item-check{width:20px;height:20px;border-radius:50%;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .12s}.opt-item-check.radio{border-radius:50%}.opt-item-check.checkbox{border-radius:5px}.opt-item-check.checked{background:var(--primary);border-color:var(--primary);color:#fff;font-size:12px}.opt-item-name{font-size:14px;font-weight:500}.opt-item-price{font-size:13px;color:var(--primary);font-weight:600}.ps-note{padding:16px}.ps-note-label{font-size:14px;font-weight:700;margin-bottom:8px}.ps-note-input{width:100%;padding:12px 14px;border:1.5px solid var(--border);border-radius:10px;font-size:14px;font-family:inherit;resize:none;outline:none;color:var(--text)}.ps-note-input:focus{border-color:var(--primary)}.ps-footer{padding:12px 16px 0;border-top:1px solid var(--border);display:flex;align-items:center;gap:12px;flex-shrink:0}.qty-control{display:flex;align-items:center;gap:12px;background:var(--bg);border-radius:12px;padding:4px 8px}.qty-btn{width:32px;height:32px;border-radius:50%;background:var(--surface);border:1.5px solid var(--border);font-size:18px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text);transition:all .12s}.qty-btn:active{background:var(--border)}.qty-btn:disabled{opacity:.4;cursor:not-allowed}.qty-num{font-size:17px;font-weight:800;min-width:24px;text-align:center}.add-cart-btn{flex:1;padding:14px;background:var(--primary);color:#fff;border:none;border-radius:14px;cursor:pointer;font-size:15px;font-weight:700;font-family:inherit;display:flex;align-items:center;justify-content:space-between;transition:background .15s}.add-cart-btn:active{background:var(--primary-dark)}.add-cart-btn.disabled{background:#d1d5db;cursor:not-allowed}.cart-header{padding:16px 16px 12px;border-bottom:1px solid var(--border);flex-shrink:0}.cart-title{font-size:18px;font-weight:800}.cart-items{padding:8px 0}.cart-item{padding:14px 16px;display:flex;align-items:flex-start;gap:12px;border-bottom:1px solid var(--border)}.cart-item-info{flex:1;min-width:0}.cart-item-name{font-size:15px;font-weight:700;margin-bottom:3px}.cart-item-opts{font-size:12px;color:var(--text-sub);line-height:1.6}.cart-item-note{font-size:12px;color:#4d7a60;background:#edf4f0;padding:3px 8px;border-radius:6px;margin-top:4px;display:inline-block}.cart-item-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex-shrink:0}.cart-item-price{font-size:15px;font-weight:800;color:var(--primary)}.cart-item-qty-row{display:flex;align-items:center;gap:8px}.cart-qty-btn{width:28px;height:28px;border-radius:50%;border:1.5px solid var(--border);background:var(--surface);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text)}.cart-qty-num{font-size:14px;font-weight:700;min-width:20px;text-align:center}.cart-empty{padding:48px 24px;text-align:center;color:var(--text-sub)}.cart-empty-icon{font-size:48px;margin-bottom:12px}.cart-empty-text{font-size:15px;font-weight:600}.cart-summary{padding:14px 16px;border-top:1px solid var(--border);flex-shrink:0}.cart-total-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.cart-total-label{font-size:15px;font-weight:700;color:var(--text-sub)}.cart-total-value{font-size:22px;font-weight:800;color:var(--text)}.order-btn{width:100%;padding:16px;background:var(--primary);color:#fff;border:none;border-radius:14px;cursor:pointer;font-size:16px;font-weight:800;font-family:inherit;transition:background .15s}.order-btn:active{background:var(--primary-dark)}.order-btn:disabled{background:#d1d5db;cursor:not-allowed}.cart-fab{position:fixed;bottom:max(24px,calc(var(--safe-bottom) + 16px));left:50%;transform:translate(-50%);width:calc(100% - 32px);max-width:448px;display:flex;align-items:center;justify-content:space-between;background:#2d3142;color:#fff;border:none;border-radius:16px;cursor:pointer;padding:14px 16px;font-family:inherit;box-shadow:0 8px 24px #2d314238;animation:fabIn .2s ease;z-index:40}@keyframes fabIn{0%{opacity:0;transform:translate(-50%) translateY(20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.fab-count-badge{background:var(--primary);color:#fff;border-radius:10px;padding:2px 10px;font-size:13px;font-weight:800}.fab-label{font-size:15px;font-weight:700}.fab-total{font-size:15px;font-weight:800}.success-screen{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 20px max(28px,var(--safe-bottom));text-align:center;background:var(--bg);gap:0}.queue-ticket{background:var(--primary);color:#fff;border-radius:20px;padding:20px 40px 22px;margin-bottom:20px;width:100%;box-shadow:0 8px 24px #7fa98f4d;animation:popIn .35s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}.queue-ticket:before{content:"";position:absolute;top:-30px;right:-30px;width:100px;height:100px;background:#ffffff1a;border-radius:50%}.queue-ticket-label{font-size:12px;font-weight:600;opacity:.85;letter-spacing:.05em;text-transform:uppercase;margin-bottom:4px}.queue-ticket-number{font-size:64px;font-weight:800;line-height:1;letter-spacing:-.02em}.queue-ticket-sub{font-size:14px;font-weight:600;opacity:.9;margin-top:4px}@keyframes popIn{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}.success-icon{margin-bottom:6px;animation:popIn .4s ease .1s both}.success-title{font-size:22px;font-weight:800;margin-bottom:6px}.success-sub{font-size:14px;color:var(--text-sub);margin-bottom:18px;line-height:1.6}.success-order-list{width:100%;background:var(--surface);border-radius:16px;padding:0;margin-bottom:20px;text-align:left;box-shadow:var(--shadow);overflow:hidden}.success-order-list-head{padding:12px 16px;font-size:13px;font-weight:700;color:var(--text-sub);border-bottom:1px solid var(--border);background:var(--bg)}.success-order-item{display:flex;justify-content:space-between;align-items:flex-start;padding:12px 16px;border-bottom:1px solid var(--border);gap:10px}.success-order-item-left{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.success-order-name{font-size:14px;font-weight:700}.success-order-qty{font-weight:600;color:var(--primary)}.success-order-opts{font-size:12px;color:var(--text-sub)}.success-order-note{font-size:11px;color:#4d7a60;background:#edf4f0;padding:2px 7px;border-radius:6px;display:inline-block;margin-top:2px}.success-order-price{font-size:14px;font-weight:800;color:var(--primary);white-space:nowrap;flex-shrink:0}.success-order-total{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;font-size:16px;font-weight:800;background:var(--bg)}.success-order-total span:last-child{color:var(--primary);font-size:18px}.success-back-btn{padding:14px 32px;border-radius:14px;background:var(--primary-light);color:var(--primary);border:1.5px solid var(--primary);font-size:15px;font-weight:700;font-family:inherit;cursor:pointer}.text-primary{color:var(--primary)}.fw-bold{font-weight:700}.staff-tabs{display:flex;background:var(--surface);border-bottom:1px solid var(--border);padding:0 16px;gap:4px}.staff-tab{flex:1;position:relative;display:flex;align-items:center;justify-content:center;gap:6px;padding:12px 8px;background:none;border:none;border-bottom:3px solid transparent;font-size:14px;font-weight:600;font-family:inherit;color:var(--text-sub);cursor:pointer;transition:all .15s}.staff-tab.active{color:var(--primary);border-bottom-color:var(--primary)}.staff-tab-badge{min-width:18px;height:18px;background:#ef4444;color:#fff;border-radius:9px;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 4px;line-height:1;animation:pulse 1.4s ease-in-out infinite}.swv-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px;text-align:center;color:var(--text-sub)}.swv-empty-icon{font-size:52px;margin-bottom:12px}.swv-empty-title{font-size:16px;font-weight:700;margin-bottom:4px}.swv-empty-sub{font-size:13px}.swv-list{padding:12px 12px 120px;display:flex;flex-direction:column;gap:12px}.swv-batch{background:var(--surface);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;border-left:4px solid var(--primary)}.swv-batch-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:var(--primary-light)}.swv-batch-meta{display:flex;flex-direction:column;gap:2px}.swv-queue{font-size:15px;font-weight:800;color:var(--text)}.swv-time{font-size:12px;color:var(--text-sub)}.swv-serve-btn{padding:8px 16px;border-radius:10px;background:var(--primary);color:#fff;border:none;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;transition:background .15s}.swv-serve-btn:active{background:var(--primary-dark)}.swv-items{padding:8px 0}.swv-item{display:flex;align-items:flex-start;justify-content:space-between;padding:8px 14px;gap:10px;border-bottom:1px solid var(--border)}.swv-item:last-child{border-bottom:none}.swv-item-left{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.swv-item-name{font-size:14px;font-weight:700}.swv-item-qty{color:var(--primary);font-weight:700}.swv-item-opts{font-size:11px;color:var(--text-sub)}.swv-item-note{font-size:11px;color:#4d7a60;background:#edf4f0;padding:2px 7px;border-radius:6px;display:inline-block}.swv-item-price{font-size:14px;font-weight:700;color:var(--primary);flex-shrink:0}.swv-batch-total{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:var(--bg);font-size:14px;font-weight:800}.swv-batch-total span:last-child{color:var(--primary)}.header-staff-badge{font-size:11px;font-weight:700;background:#ffffff40;color:#fff;padding:2px 8px;border-radius:8px;display:inline-block}.header-table-row{display:flex;align-items:center;gap:8px}.header-switch-btn{font-size:11px;font-weight:700;background:#ffffff38;color:#fff;border:1px solid rgba(255,255,255,.4);padding:2px 8px;border-radius:8px;cursor:pointer;font-family:inherit;transition:background .12s}.header-switch-btn:active{background:#ffffff61}.stp-header{padding:14px 16px 12px;border-bottom:1px solid var(--border);flex-shrink:0}.stp-title{font-size:18px;font-weight:800}.stp-sub{font-size:13px;color:var(--text-sub);margin-top:2px}.stp-list{padding:10px 12px 20px;display:flex;flex-direction:column;gap:8px;overflow-y:auto}.stp-item{width:100%;display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:var(--surface);border:2px solid var(--border);border-radius:14px;cursor:pointer;font-family:inherit;transition:all .12s;-webkit-tap-highlight-color:transparent}.stp-item:active{transform:scale(.98)}.stp-item.active{border-color:var(--primary);background:var(--primary-light)}.stp-item-left{display:flex;flex-direction:column;gap:3px;text-align:left}.stp-item-name{font-size:16px;font-weight:700;color:var(--text)}.stp-item-cap{font-size:12px;color:var(--text-sub)}.stp-check{font-size:18px;font-weight:800;color:var(--primary)}.success-btns{display:flex;flex-direction:column;gap:10px;width:100%}.success-switch-btn{padding:14px 32px;border-radius:14px;background:var(--primary);color:#fff;border:none;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer}.order-status-banner{display:flex;align-items:center;justify-content:space-between;width:100%;padding:10px 16px;background:var(--surface);border:none;cursor:pointer;font-family:inherit;border-bottom:1px solid var(--border);border-top:3px solid var(--primary);transition:background .12s;-webkit-tap-highlight-color:transparent}.order-status-banner:active{background:#f9fafb}.osb-left{display:flex;align-items:center;gap:10px}.osb-icon{font-size:20px}.osb-title{font-size:14px;font-weight:700;color:var(--text);text-align:left}.osb-sub{font-size:12px;color:var(--text-sub);display:flex;align-items:center;gap:5px}.osb-active-dot{width:7px;height:7px;border-radius:50%;background:var(--primary);display:inline-block;animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}.osb-right{display:flex;align-items:center;gap:8px}.osb-status{font-size:13px;font-weight:700;padding:4px 10px;border-radius:20px}.osb-pending{background:#fef5d8;color:#7a5c1e}.osb-cooking{background:#feecd8;color:#7a4020}.osb-ready{background:#dff0e8;color:#2d6a4a}.osb-served{background:#eeeef4;color:#555570}.osb-arrow{font-size:20px;color:var(--text-sub)}.os-header{display:flex;align-items:flex-start;justify-content:space-between;padding:14px 16px 12px;border-bottom:1px solid var(--border);flex-shrink:0}.os-title{font-size:18px;font-weight:800}.os-subtitle{font-size:13px;color:var(--text-sub);margin-top:2px}.os-all-served{font-size:12px;font-weight:700;color:#2d6a4a;background:#dff0e8;padding:4px 10px;border-radius:20px}.os-batch{margin-bottom:1px}.os-batch-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;gap:10px}.os-status-pending{background:#fef9ed}.os-status-cooking{background:#fef4ec}.os-status-ready{background:#edf7f2}.os-status-served{background:#f5f5f8}.os-batch-left{display:flex;align-items:center;gap:10px}.os-batch-icon{font-size:22px}.os-batch-status{font-size:14px;font-weight:800}.os-batch-time{font-size:11px;color:var(--text-sub);margin-top:1px}.os-progress{display:flex;align-items:center;gap:4px}.os-dot{width:8px;height:8px;border-radius:50%;background:#d1d5db;transition:all .3s}.os-dot.done{background:#9ca3af}.os-dot.current{background:var(--primary);transform:scale(1.3);box-shadow:0 0 0 3px #ff6b3533}.os-items{border-top:1px solid var(--border)}.os-item{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border)}.os-item:last-child{border-bottom:none}.os-item-img-wrap{flex-shrink:0}.os-item-img{width:48px;height:48px;object-fit:cover;border-radius:10px;border:1px solid var(--border)}.os-item-img-ph{width:48px;height:48px;border-radius:10px;background:linear-gradient(135deg,#eef5f1,#dceee4);display:flex;align-items:center;justify-content:center;font-size:22px}.os-item-img-ph.drink{background:linear-gradient(135deg,#eef2fb,#d8e7f8)}.os-item-info{flex:1;min-width:0}.os-item-name{font-size:14px;font-weight:700}.os-item-qty{color:var(--primary);font-weight:700}.os-item-opts{font-size:12px;color:var(--text-sub);margin-top:2px}.os-item-note{display:inline-block;margin-top:3px;font-size:11px;color:#92400e;background:#fffbeb;padding:2px 7px;border-radius:6px}.os-item-price{font-size:14px;font-weight:800;color:var(--primary);flex-shrink:0;white-space:nowrap}.os-grand-total{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-top:2px solid var(--border);background:var(--surface);flex-shrink:0}.os-grand-label{font-size:15px;font-weight:700;color:var(--text-sub)}.os-grand-value{font-size:22px;font-weight:800;color:var(--text)}