.customer-app{--customer-text:1.25rem;--customer-small:1.125rem;--customer-heading:1.75rem;--customer-menu-title:1.5rem;--customer-target:3.5rem;--customer-gap:.75rem;--customer-bg:#fffdf7;--customer-ink:#242018;--customer-muted:#544c43;--customer-primary:#6e2917;--customer-selected-bg:#fff1e7;--customer-border:#8b705d;color:var(--customer-ink);background:var(--customer-bg);font-family:Noto Sans Thai,Tahoma,Leelawadee UI,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:var(--customer-text);line-height:1.65}.customer-app *,.customer-app :before,.customer-app :after{box-sizing:border-box}.customer-app h1,.customer-app h2{font-size:var(--customer-heading);line-height:1.5}.customer-app .menu-title,.customer-app .menu-price{font-size:var(--customer-menu-title);overflow-wrap:anywhere;font-weight:700}.customer-app .supporting-text{color:var(--customer-muted);font-size:var(--customer-small)}.customer-app button,.customer-app input,.customer-app select,.customer-app textarea{font:inherit}.customer-app button,.customer-app .option-control{min-block-size:max(56px, var(--customer-target));min-inline-size:max(56px, var(--customer-target));border:2px solid var(--customer-border);color:var(--customer-ink);background:var(--customer-bg);white-space:normal;overflow-wrap:anywhere;cursor:pointer;border-radius:.75rem;padding:.75rem 1rem}.customer-app .menu-list,.customer-app .option-list,.customer-app .quantity-controls{gap:max(12px, var(--customer-gap));display:grid}.customer-app .menu-list,.customer-app .option-list{grid-template-columns:minmax(0,1fr)}.customer-app .option-control{align-items:center;gap:var(--customer-gap);grid-template-columns:auto minmax(0,1fr);display:grid}.customer-app .option-control input{block-size:1.5rem;inline-size:1.5rem;accent-color:var(--customer-primary);margin:0}.customer-app .option-control[data-selected=true]{border-color:var(--customer-primary);background:var(--customer-selected-bg);font-weight:700}.customer-app .primary-action{border-color:var(--customer-primary);color:#fff;background:var(--customer-primary);font-weight:700}.customer-app :focus-visible{outline:3px solid var(--customer-primary);outline-offset:4px}.customer-app .menu-placeholder{font-size:2rem;line-height:1.5}.customer-app .sticky-cart{z-index:10;padding:.75rem;padding-bottom:max(.75rem, env(safe-area-inset-bottom));border-top:2px solid var(--customer-border);background:var(--customer-bg);position:sticky;bottom:0}.customer-app .sticky-cart button{inline-size:100%}@media (prefers-reduced-motion:reduce){.customer-app *,.customer-app :before,.customer-app :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#242018;--cream:#fffdf7;--paper:#fff;--brick:#6e2917;--green:#2f6653;--line:#dfd6c7;--bottom-bar-height:8rem}body{color:var(--ink);background:var(--cream);margin:0;font-family:Noto Sans Thai,Tahoma,Leelawadee UI,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:1.125rem;line-height:1.65}*{box-sizing:border-box}button,input,select,textarea{font:inherit}button,.link-button{min-height:56px;color:var(--ink);cursor:pointer;white-space:normal;background:#fffdf7;border:1.5px solid #8b705d;border-radius:12px;padding:12px 18px;font-weight:600}button:disabled{cursor:default;color:#635c52!important;background:#eee8dc!important;border-color:#bcb09e!important}button:hover:not(:disabled){filter:brightness(.96)}a{color:var(--brick);text-underline-offset:4px}button:focus-visible{outline:3px solid var(--brick);outline-offset:4px}a:focus-visible{outline:3px solid var(--brick);outline-offset:4px}input:focus-visible{outline:3px solid var(--brick);outline-offset:4px}select:focus-visible{outline:3px solid var(--brick);outline-offset:4px}h1,h2,h3,p{margin-top:0}h1{margin-bottom:10px;font-size:1.875rem;line-height:1.4}h2{margin-bottom:12px;font-size:1.375rem;line-height:1.5}h3{margin-bottom:8px}small{font-size:1rem}.primary-action{background:var(--brick)!important;color:#fff!important;border-color:var(--brick)!important}.mode-bar{color:#fff;background:#2d4a3d;justify-content:space-between;gap:12px;padding:10px max(18px,50vw - 590px);font-size:1rem;display:flex}.mode-bar a{color:#fff;font-weight:600}.brand-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;max-width:720px;margin:auto;padding:26px 24px 20px;display:flex}.brand{color:var(--brick);align-items:center;gap:12px;text-decoration:none;display:flex}.brand-mark{text-align:center;background:#f6ead7;border-radius:50%;width:58px;height:58px;font-size:2.25rem}.brand strong{font-size:2.625rem;line-height:1.1;display:block}.brand small{color:#544c43;margin-top:4px;font-size:1.125rem;display:block}.brand-note{color:#544c43;text-align:right;font-size:1.125rem;line-height:1.5}.customer-container{max-width:720px;margin:0 auto;padding:28px 24px}.bottom-space{padding-bottom:calc(var(--bottom-bar-height) + 32px)}.customer-app h1{outline:none}.customer-app h1:focus-visible{outline:none}.context-label{color:#234739;background:#edf4ea;border:1px solid #c5d5c5;border-radius:999px;align-items:center;gap:10px;margin-bottom:20px;padding:8px 16px;font-size:1.25rem;font-weight:600;display:inline-flex}.status-dot,.small-dot{background:#2f6653;border-radius:50%;width:9px;height:9px;display:inline-block}.customer-intro h1{margin-bottom:12px;font-size:2rem}.customer-intro p:last-child{color:#544c43}.eyebrow{color:var(--brick);margin-bottom:8px;font-size:1rem;font-weight:700}.customer-app .eyebrow{font-size:1.125rem}.category-nav{flex-wrap:wrap;gap:12px;margin:24px 0 32px;display:flex}.category-picker{background:#fff;border:1px solid #c1b49f;border-radius:14px;margin:20px 0 24px}.category-picker summary{cursor:pointer;min-height:56px;padding:12px 16px;font-size:1.25rem;font-weight:600}.category-picker summary:focus-visible{outline:3px solid var(--brick);outline-offset:4px}.category-picker .category-nav{margin:12px 16px 16px}.category-nav button{border-color:#c1b49f;border-radius:14px;padding:10px 18px;font-weight:500}.category-nav .active,.customer-tabs .active{font-weight:700;background:var(--brick)!important;border-color:var(--brick)!important;color:#fff!important}.menu-section-heading{justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:16px;display:flex}.menu-section-heading h2{margin:0}.menu-card{background:#fff;border:1px solid #d8cfbd;border-radius:20px;padding:22px;box-shadow:0 3px #eee5d833}.menu-card-copy{grid-template-columns:60px minmax(0,1fr);align-items:start;gap:14px;margin-bottom:18px;display:grid}.menu-placeholder{text-align:center;background:#f8f0e1;border:1px solid #ece0cc;border-radius:18px;padding:8px 0}.menu-card .supporting-text{margin:6px 0 12px}.menu-card .menu-price{color:var(--brick)}.menu-card .choose-action{background:#f9f3e7;border-color:#bcaa8e;justify-content:space-between;align-items:center;width:100%;display:flex}.menu-card .choose-action span{font-size:1.625rem}.sold-out{background:#f4efe7}.customer-app .sticky-cart{width:100%;max-width:720px;padding:14px 24px;padding-bottom:max(14px, env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fffdf7f5;position:fixed;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 -8px 30px #2420180a}.sticky-cart button{padding:16px;line-height:1.6}.text-back{text-align:left;margin-bottom:24px;color:var(--brick)!important;background:0 0!important;border-color:#0000!important;padding-left:0!important}.detail-emoji{margin:10px 0;font-size:3.5rem;display:block}.options-screen fieldset{border:0;min-inline-size:0;margin:32px 0;padding:0}.options-screen legend{width:100%;margin-bottom:12px;padding:0;font-size:1.5rem;font-weight:700}.options-screen legend span{color:#544c43;font-size:1.125rem;font-weight:400;display:block}.choice-copy{flex-direction:column;display:flex}.choice-copy strong{font-weight:600}.choice-copy>span{font-size:1.125rem}.customer-app em{color:#542818;font-size:1.125rem;font-style:normal}.quantity-block{margin:28px 0}.quantity-controls{grid-template-columns:56px auto 56px;align-items:center;gap:12px;max-width:290px;display:grid}.quantity-controls button{min-width:56px;padding:5px;font-size:1.75rem}.quantity-controls output{text-align:center;min-width:50px;font-weight:600}.cart-line,.customer-order{border:1px solid var(--line);background:#fff;border-radius:18px;margin:20px 0;padding:22px}.cart-title,.order-title{flex-wrap:wrap;justify-content:space-between;align-items:start;gap:8px;display:flex}.cart-title h2{flex:200px;font-size:1.5rem}.cart-line p,.receipt-line p{color:#544c43;margin:6px 0 16px;font-size:1.125rem}.cart-line-actions{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;display:flex}.remove-action{color:#7d2823!important;background:#fff!important}.bill-total{border-top:1px dashed #c0b39e;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;margin-top:18px;padding:20px 0 6px;display:flex}.bill-total strong{color:var(--brick);font-size:1.75rem}.customer-tabs{gap:12px;max-width:720px;margin:20px auto 0;padding:0 24px;display:flex}.customer-tabs button{flex:1}.customer-order .status-badge{margin:10px 0 20px;font-size:1.125rem}.receipt-line{border-bottom:1px solid #eee6d9;flex-wrap:wrap;justify-content:space-between;gap:16px;padding:14px 0;display:flex}.receipt-line>div{flex:220px}.receipt-line>strong{white-space:nowrap}.empty-state{text-align:center;color:#544c43;padding:50px 16px}.empty-state>span{margin-bottom:14px;font-size:3.75rem;display:block}.empty-state h2{color:var(--ink)}.error-message,.info-message{color:#642719;background:#fff0e5;border:1px solid #d6b197;border-radius:14px;margin:20px 0;padding:16px 18px}.error-message{color:#7d2116;background:#fff0eb;border-color:#c6796c}.error-message p{margin-bottom:12px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.muted{color:#645b4e}.staff-app{background:#f7f4ed;min-height:calc(100vh - 45px)}.staff-topbar{border-bottom:1px solid var(--line);background:#fffdf7;flex-wrap:wrap;justify-content:space-between;gap:16px;padding:24px max(24px,50vw - 600px);display:flex}.staff-topbar strong{color:var(--brick);font-size:2rem}.staff-topbar strong span{color:#645b4e;font-size:1.125rem;font-weight:500}.staff-topbar p{color:#645b4e;margin:4px 0 0}.staff-topbar>div:last-child{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.staff-nav{border-bottom:1px solid var(--line);background:#fffdf7;gap:8px;padding:16px max(24px,50vw - 600px);display:flex;overflow-x:auto}.staff-nav button{background:0 0;border-color:#0000;flex-shrink:0}.staff-nav .active{color:var(--brick);background:#f0e2cf;border-color:#ddc6a7}.staff-nav button span{background:var(--brick);color:#fff;border-radius:100%;margin-left:8px;padding:3px 8px;font-size:1rem}.staff-container{max-width:1248px;margin:auto;padding:32px 24px 60px}.section-top{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;display:flex}.section-top h1{margin-bottom:0}.table-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;display:grid}.table-card{background:#fffdf7;border:1.5px solid #d6d0c0;flex-direction:column;align-items:start;min-height:150px;padding:22px;display:flex}.table-card>span{margin-bottom:10px;font-size:1.375rem}.table-card strong{color:var(--green);font-size:1.25rem}.table-card small{color:#645b4e;margin-top:4px}.table-card.occupied{background:#fff1dc;border-color:#b89964}.table-card.occupied strong{color:#694418}.table-card.selected{box-shadow:0 0 0 3px var(--brick)}.order-filters{flex-wrap:wrap;align-items:center;gap:12px;margin:28px 0;display:flex}.order-filters .active{background:var(--green);color:#fff;border-color:var(--green)}.ticket-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.ticket{background:#fff;border:1px solid #d8cfbd;border-top:5px solid #bda57b;border-radius:16px;min-width:0;padding:22px}.status-border-new{border-top-color:#af572f}.status-border-preparing{border-top-color:#b88535}.status-border-ready{border-top-color:#2f6653}.ticket-top,.ticket-lines>div>div,.ticket-total{flex-wrap:wrap;justify-content:space-between;align-items:start;gap:12px;display:flex}.ticket-top h2{margin-bottom:2px;font-size:1.625rem}.status-badge{color:#573f25;background:#f1e7d6;border-radius:8px;padding:6px 12px;font-size:1rem;font-weight:600;display:inline-block}.status-preparing{color:#6b4615;background:#faedca}.status-ready,.status-served{color:#234d36;background:#e5f0e5}.status-cancelled{color:#763324;background:#f5e5de}.ticket-lines{padding:16px 0}.ticket-lines>div{border-bottom:1px dashed var(--line);padding:12px 0}.ticket-lines p{color:#645b4e;margin:8px 0 0;font-size:1rem}.ticket-total{margin:12px 0 20px;font-weight:600}.ticket-total strong{color:var(--brick);font-size:1.5rem}.ticket-actions{flex-wrap:wrap;gap:12px;display:flex}.ticket-actions .primary-action{flex:200px}.danger-text{color:#812f25}.kitchen-columns{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}.kitchen-columns>section>h2{margin-bottom:20px;font-size:1.375rem}.kitchen-columns .ticket{margin-bottom:20px}.kitchen-columns .ticket-top{flex-direction:column}.column-empty{color:#645b4e;text-align:center;border:1px dashed #c8bfad;border-radius:16px;padding:32px}.count-pill{background:#f0e2cf;border-radius:12px;padding:4px 12px;font-size:1.25rem;display:inline-block}.panel{border:1px solid var(--line);background:#fff;border-radius:18px;min-width:0;margin:24px 0;padding:26px}.login-screen{max-width:460px;margin:50px auto;padding:0 20px}.login-card{border:1px solid var(--line);background:#fff;border-radius:24px;padding:30px}.login-emoji{margin-bottom:8px;font-size:3.375rem;display:block}form label{flex-direction:column;gap:8px;margin-bottom:20px;display:flex}input:not([type=checkbox]):not([type=radio]),select,textarea{min-height:56px;color:var(--ink);background:#fff;border:1.5px solid #8b705d;border-radius:10px;width:100%;min-width:0;padding:10px 14px}.login-card form>button{width:100%;margin-bottom:20px}.form-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 20px;display:grid}.inline-check{align-items:center;gap:12px;flex-direction:row!important;display:flex!important}.inline-check input{width:24px;height:24px}.csv-import{border-top:1px solid var(--line);margin-top:28px;padding-top:20px}.csv-import input{border:0!important;padding-left:0!important}.table-overflow{overflow-x:auto}table{border-collapse:collapse;text-align:left;width:100%}th,td{border-bottom:1px solid var(--line);white-space:nowrap;padding:16px}th{color:#645b4e;font-size:1rem}.inventory-row{grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:16px;margin:16px 0;display:grid}.inventory-row>span{font-size:2.25rem}.inventory-row h2,.inventory-row p{margin-bottom:4px}.available{color:#2f6653}.form-actions{gap:16px;display:flex}.qr-grid,.account-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}.qr-grid .panel{flex-direction:column;align-items:center;gap:16px;display:flex}.qr-grid img{max-width:100%;height:auto}.link-button{justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.account-number{color:#b89c74;font-size:2rem;font-weight:700}.payment-screen{max-width:700px}.payment-screen h1{margin-top:24px}.payment-methods{gap:16px;display:grid}.filter-actions{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.filter-actions label{align-items:center;gap:10px;margin:0;display:flex}.kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:28px;display:grid}.kpi-grid>article{border:1px solid var(--line);background:#fff;border-radius:18px;flex-direction:column;padding:22px;display:flex}.kpi-grid span{color:#645b4e;font-size:1rem}.kpi-grid strong{color:var(--brick);margin:12px 0 8px;font-size:1.875rem}.kpi-grid .top-menu-name{font-size:1.375rem}.kpi-grid small{color:#645b4e}.chart-grid{grid-template-columns:1.5fr 1fr;gap:20px;display:grid}.chart-grid .panel{margin-bottom:0}.chart{width:100%;height:280px}.chart.donut{height:210px}.chart-empty{text-align:center;color:#645b4e;padding:60px 12px}.channel-legend{gap:10px;display:grid}.channel-legend>div{grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:10px;font-size:1rem;display:grid}.legend-dot{border-radius:50%;width:10px;height:10px}.top-menu-list{margin:0;padding:0;list-style:none}.top-menu-list li{border-bottom:1px solid var(--line);grid-template-columns:32px 1fr 1.3fr 48px;align-items:center;gap:14px;padding:14px 0;display:grid}.rank{color:#9c8562}.rank-bar{background:#f4eee3;border-radius:8px;height:16px;overflow:hidden}.rank-bar div{background:#2f6653;border-radius:8px;height:100%}@media (max-width:950px){.kitchen-columns{grid-template-columns:1fr}.kitchen-columns .ticket-top{flex-direction:row}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.chart-grid{grid-template-columns:1fr}.qr-grid,.account-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:600px){.mode-bar{flex-wrap:wrap;gap:4px;padding:8px 16px;font-size:.875rem}.brand-header{padding:20px 16px}.brand-note,.brand small{font-size:1rem}.brand strong{font-size:2.375rem}.customer-container{padding:24px 16px}.customer-intro h1{font-size:1.875rem}.bottom-space{padding-bottom:calc(var(--bottom-bar-height) + 28px)}.customer-app .sticky-cart{padding:12px 16px;padding-bottom:max(12px, env(safe-area-inset-bottom))}.menu-card{padding:18px}.menu-card-copy{grid-template-columns:48px minmax(0,1fr);gap:12px}.customer-tabs{padding:0 16px}.customer-tabs button{padding:12px 10px}.staff-container{padding:24px 16px}.staff-topbar{padding:20px 16px}.staff-nav{padding:12px 16px}.table-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.table-card{padding:18px}.ticket-grid,.form-grid,.qr-grid,.account-grid,.kpi-grid{grid-template-columns:1fr}.inventory-row{grid-template-columns:40px minmax(0,1fr)}.inventory-row>button{grid-column:1/-1}.panel{padding:20px}.filter-actions{align-items:stretch}.top-menu-list li{grid-template-columns:26px 1fr 40px}.rank-bar{grid-area:auto/2}.top-menu-list li>strong{grid-area:span 2/3}.customer-order .bill-total{flex-direction:column}}@media (max-width:400px){.brand-note{display:none}.brand-header{padding:18px 16px}.brand small{max-width:210px}}
