:root{font-family:'DM Sans','Noto Sans JP','Noto Sans TC',sans-serif;color:#20362d;background:#f4f4ee;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;font-optical-sizing:auto;font-size:15px;font-weight:400;--ink:#20362d;--muted:#748079;--green:#174d3c;--green-2:#236650;--mint:#e4eee7;--line:#e6e9e3;--cream:#fbfbf7;--orange:#d97943;--red:#a53d35;--shadow:0 12px 40px rgba(27,54,42,.07)}
*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #d2a36b;outline-offset:2px}::selection{background:#c6dfcf;color:var(--ink)}
.app-shell{max-width:1440px;margin:0 auto;padding:0 40px}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dfe4db}.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink)}.brand-mark{width:39px;height:39px;border-radius:12px;background:var(--green);color:#fff;display:grid;place-items:center;font-size:21px;font-weight:700}.brand strong,.brand small{display:block}.brand strong{font-size:16px;letter-spacing:.06em}.brand small{font-size:9px;color:var(--muted);letter-spacing:.17em;margin-top:2px}.locale-switch,.icon-button{border:1px solid #dfe4db;background:var(--cream);border-radius:9px;color:var(--ink);padding:9px 13px;font-size:12px}.locale-switch span{color:var(--muted);padding-left:6px}.workspace{padding:34px 0 48px;display:grid;grid-template-columns:minmax(0,1fr) 365px;column-gap:34px;align-items:start}.welcome{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;padding:7px 0 26px}.welcome h1{font-size:27px;letter-spacing:-.035em;margin:6px 0}.welcome p{margin:0;color:var(--muted);font-size:12px}.eyebrow{font-size:9px;font-weight:700;letter-spacing:.2em;color:#728278;text-transform:uppercase}.join-badge{display:flex;gap:8px;align-items:center;color:#537060;background:#e8efe8;border-radius:20px;padding:8px 12px;font-size:11px}.live-dot{width:7px;height:7px;background:#4b956e;border-radius:50%;display:inline-block;box-shadow:0 0 0 3px rgba(75,149,110,.14)}
.tabs{grid-column:1;display:flex;gap:22px;border-bottom:1px solid var(--line);margin:0 0 25px}.tab{position:relative;background:none;border:0;padding:0 0 13px;color:#839087;font-size:13px;font-weight:600}.tab span{margin-left:8px;background:#e9ede7;border-radius:20px;padding:2px 7px;font-size:10px}.tab.active{color:var(--green)}.tab.active:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--green)}.tab.active span{color:var(--green);background:#e0ebe3}.menu-section{grid-column:1;grid-row:3}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:16px}.section-heading h2,.cart-panel h2,.orders-panel h2{font-size:22px;margin:5px 0 0;letter-spacing:-.03em}.menu-count{color:#78867d;font-size:11px;border:1px solid var(--line);border-radius:20px;padding:5px 10px}.category{margin:26px 0 32px}.category h3{font-size:14px;margin:0 0 13px;display:flex;align-items:center;gap:10px}.category h3:after{content:'';height:1px;background:var(--line);flex:1}.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.product-card{background:var(--cream);border:1px solid #e7e9e4;border-radius:13px;padding:17px;box-shadow:0 3px 12px rgba(26,53,40,.025)}.product-top{display:flex;justify-content:space-between;gap:8px;align-items:start}.product-top h4{font-size:14px;margin:0 0 5px}.product-top p{font-size:11px;line-height:1.55;color:var(--muted);margin:0}.price{color:var(--green);white-space:nowrap;font-size:13px}.availability{display:inline-block;margin-top:10px;color:#a36443;font-size:9px;border-radius:20px;padding:4px 7px;background:#f7ece4}.availability.is-available{color:#387154;background:#e9f2eb}.option-group{padding:0;border:0;margin:15px 0 0;min-width:0}.option-group legend,.compact-options legend{font-size:10px;font-weight:600;color:#55675d;padding:0;margin-bottom:8px}.option-group legend small{font-weight:500;color:#b36a43;margin-left:4px}.option-list{display:grid;gap:7px}.option{display:flex;align-items:center;gap:7px;font-size:10px;color:#4a5a51}.option input,.compact-options input,.payment-choice input{accent-color:var(--green)}.option small{margin-left:auto;color:#819087;font-size:9px}.option-muted{color:#abb1ac}.product-actions{display:flex;justify-content:space-between;align-items:center;margin-top:15px;padding-top:12px;border-top:1px solid #eef0ec}.quantity-select{font-size:10px;color:var(--muted);display:flex;align-items:center;gap:9px}.quantity-select select{background:#fff;border:1px solid var(--line);border-radius:7px;padding:5px 8px;color:var(--ink)}.field-hint{display:block;color:var(--orange);margin-top:7px;font-size:10px}
.button{border:0;border-radius:8px;font-weight:600;transition:transform .15s ease,background .15s ease}.button:not(:disabled):active{transform:translateY(1px)}.button.primary{color:#fff;background:var(--green)}.button.primary:not(:disabled):hover{background:var(--green-2)}.button.small{font-size:10px;padding:8px 12px}.button.wide{width:100%;padding:13px 16px;font-size:12px}.button.quiet{background:transparent;color:#617269;margin-top:8px}.button.retry{color:#7a4e2d;background:#f6eadc;margin-top:8px}.text-button{border:0;background:none;color:#7f8b83;font-size:10px;padding:5px}.text-button.danger{color:#a75a47}.cart-panel{grid-column:2;grid-row:2/4;position:sticky;top:18px;background:var(--cream);border:1px solid #e5e9e3;border-radius:14px;padding:20px;box-shadow:var(--shadow)}.cart-panel-head{display:flex;justify-content:space-between;align-items:center}.cart-panel h2{font-size:19px}.icon-button{font-size:18px;padding:4px 9px;line-height:1.3}.empty-state{min-height:164px;border:1px dashed #dfe5de;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:17px 0;color:#77847a}.empty-state p{font-size:12px;margin:9px 0 3px}.empty-state span{font-size:10px}.empty-icon{width:35px;height:35px;border-radius:50%;background:#edf2ec;color:var(--green);display:grid;place-items:center;font-size:20px}.cart-lines{margin:14px 0 5px;max-height:54vh;overflow:auto}.cart-line{border-top:1px solid #edf0eb;padding:14px 0}.cart-line-head{display:flex;justify-content:space-between;align-items:start}.cart-line-head strong,.cart-line>div>strong{font-size:12px}.cart-line-head p{font-size:9px;color:#578267;margin:4px 0 0}.cart-line-foot{display:flex;align-items:center;justify-content:space-between;color:#557063;font-size:11px;margin-top:10px}.stepper{height:28px;display:flex;align-items:center;border:1px solid #e4e9e2;border-radius:8px;overflow:hidden}.stepper button{width:30px;height:28px;border:0;background:#f5f7f3;color:var(--green);font-size:14px}.stepper span{min-width:27px;text-align:center;font-size:10px}.compact-options{border:0;padding:0;margin:10px 0 0;display:flex;flex-wrap:wrap;gap:9px}.compact-options legend{width:100%;margin-bottom:0}.compact-options label{font-size:9px;color:#637268;display:flex;align-items:center;gap:4px}.unavailable-line{display:flex;justify-content:space-between;color:var(--red)}.unavailable-line p{font-size:10px}.cart-version{text-align:right;color:#a2aaa3;font-size:9px}.checkout-button{margin-top:13px}.sync-caption{text-align:center;color:#8a968e;font-size:9px;display:flex;justify-content:center;align-items:center;gap:8px}.sync-caption .live-dot{width:6px;height:6px}.notice{background:#eff5ed;color:#416d50;padding:10px 12px;border-radius:8px;font-size:11px;line-height:1.6}.error{background:#fbefeb;color:#98483c;padding:10px 12px;border-radius:8px;font-size:11px;line-height:1.6}.cart-panel .error,.cart-panel .notice{margin:10px 0 0}.preview-mode .eyebrow{margin-top:2px}.muted{color:var(--muted);font-size:11px;line-height:1.6}.quote-lines{max-height:35vh;overflow:auto;margin:17px 0}.quote-line{padding:12px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto;gap:5px 10px}.quote-line>div strong,.quote-line>strong{font-size:11px}.quote-line>div span,.quote-line>div small{display:block;color:var(--muted);font-size:9px;margin-top:4px}.quote-option{grid-column:1/-1;color:#7a867e;font-size:9px}.total-row{border-top:1px solid #dfe5de;padding:14px 0 5px;display:flex;align-items:center;justify-content:space-between}.total-row span{font-size:12px}.total-row strong{font-size:20px;color:var(--green)}.tax-row{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.payment-choice{border:0;padding:0;margin:19px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:8px}.payment-choice legend{grid-column:1/-1;font-weight:600;font-size:11px;margin-bottom:4px}.payment-choice label{border:1px solid var(--line);padding:9px 7px;border-radius:8px;font-size:9px;display:flex;align-items:center;gap:4px}.payment-choice label:has(input:checked){border-color:#89a992;background:#f2f7f1}.payment-note{font-size:9px;color:#748078;line-height:1.6;margin:8px 0 16px}.orders-panel{grid-column:1;grid-row:3}.order-card{background:var(--cream);border:1px solid var(--line);border-radius:12px;margin:12px 0;padding:17px}.order-card-title{display:flex;justify-content:space-between;align-items:start;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:10px}.order-card-title h3{margin:4px 0 0;font-size:14px;overflow-wrap:anywhere}.order-kicker{font-size:9px;color:var(--muted)}.order-method{font-size:9px;color:var(--green);background:var(--mint);padding:6px 9px;border-radius:15px}.order-line,.order-total{display:flex;justify-content:space-between;gap:10px;padding:7px 0;font-size:10px;color:#59685f}.order-line strong,.order-total strong{white-space:nowrap}.order-total{border-top:1px solid var(--line);margin-top:8px;padding-top:12px;font-weight:600;color:var(--ink)}.order-card>small{display:block;color:#8d9890;margin-top:8px;font-size:9px}.workspace-footer{grid-column:1/-1;margin-top:40px;border-top:1px solid #dfe4db;padding-top:18px;color:#8b968e;font-size:10px}.workspace-footer span{margin:0 8px;color:#c4cbc4}.entry-card{max-width:420px;margin:76px auto;background:var(--cream);border:1px solid var(--line);border-radius:16px;padding:32px;box-shadow:var(--shadow)}.entry-card h1{font-size:25px;margin:7px 0}.entry-card>p{font-size:12px;color:var(--muted);line-height:1.7}.table-chip{display:flex;justify-content:space-between;background:#f0f4ef;padding:12px 14px;border-radius:9px;margin:20px 0;font-size:11px;color:var(--muted)}.table-chip strong{color:var(--ink);overflow-wrap:anywhere}.field{display:grid;gap:8px;font-size:11px;color:#53665b;margin:18px 0}.field input{border:1px solid #dfe5de;background:#fff;border-radius:8px;padding:12px}.entry-card .button{margin-top:7px}.loading-card{margin:80px auto;padding:24px;text-align:center;color:var(--muted)}
@media(max-width:1050px){.app-shell{padding:0 24px}.workspace{grid-template-columns:minmax(0,1fr) 330px;gap:25px}.product-grid{grid-template-columns:1fr}}
@media(max-width:760px){.app-shell{padding:0 17px}.topbar{height:68px}.workspace{display:flex;flex-direction:column;padding-top:24px;gap:0}.welcome{width:100%;padding-bottom:20px}.welcome h1{font-size:22px}.join-badge{font-size:0;padding:9px}.join-badge .live-dot{font-size:initial}.tabs{width:100%;gap:20px;margin-bottom:20px}.menu-section,.cart-panel,.orders-panel{width:100%}.menu-section{order:2}.cart-panel{order:1;position:static;margin:8px 0 20px}.orders-panel{order:1}.product-grid{grid-template-columns:1fr}.cart-lines{max-height:none}.workspace-footer{width:100%;margin-top:18px}.entry-card{margin:42px auto;padding:25px}.quote-lines{max-height:40vh}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
.order-option{display:block;color:var(--muted);font-size:9px;margin-top:3px}
@media(max-width:760px){.empty-state{min-height:88px;margin:10px 0}.workspace-footer{order:3}}
.staff-workspace{grid-template-columns:minmax(0,1fr)}.staff-tabs{grid-column:1/-1;align-items:center}.staff-tabs .icon-button{margin-left:auto}.staff-table-view,.staff-detail,.kds-view{grid-column:1/-1;min-width:0}.staff-table-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.staff-table-card,.cash-settings-card,.staff-order-card,.confirm-dialog{background:var(--cream);border:1px solid var(--line);border-radius:13px;padding:16px;box-shadow:var(--shadow)}.staff-table-card-head,.staff-table-actions,.staff-section-title,.staff-order-head,.staff-order-payment{display:flex;justify-content:space-between;align-items:center;gap:12px}.staff-table-card h3{margin:0 0 8px;font-size:16px}.table-mode,.staff-detail-meta,.staff-order-head small{font-size:10px;color:var(--muted)}.status-chip{display:inline-flex;padding:4px 8px;border-radius:20px;font-size:9px;background:#edf1ec;color:#53665b}.status-open,.status-ready{background:#e7f1e8;color:#387154}.status-closed,.status-cancelled,.status-served{background:#f0f1ee;color:#78837c}.status-preparing{background:#f8efe2;color:#986a35}.status-accepted{background:#e8eef5;color:#496c8d}.staff-table-metrics{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:14px;padding-top:12px;color:var(--muted);font-size:10px}.staff-table-metrics span{display:grid;gap:5px}.staff-table-metrics strong{font-size:13px;color:var(--ink)}.staff-table-actions{justify-content:flex-end;margin-top:12px}.cash-settings-card{margin-top:24px;max-width:560px}.settings-check{display:flex;align-items:center;gap:8px;font-size:12px}.settings-check input{accent-color:var(--green)}.cash-settings-card .field select{padding:10px;border:1px solid var(--line);border-radius:8px;background:#fff}.staff-detail-meta{display:flex;gap:14px;flex-wrap:wrap;margin:-3px 0 18px}.staff-section-title{margin:20px 0 10px}.staff-section-title h3{margin:0;font-size:15px}.staff-order-card{margin:10px 0;padding:14px}.staff-order-head{align-items:flex-start}.staff-order-head strong,.staff-order-head small{display:block}.staff-order-head strong{font-size:12px}.staff-order-head small{margin-top:5px;overflow-wrap:anywhere}.staff-order-lines{padding:0;margin:12px 0;list-style:none}.staff-order-lines li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid #edf0eb;font-size:11px}.staff-order-lines li span{display:grid;gap:4px}.staff-order-lines li small{color:var(--muted);font-size:9px}.staff-order-lines li strong{white-space:nowrap;font-size:10px}.staff-order-payment{justify-content:flex-start;border-top:1px solid var(--line);padding-top:10px;color:var(--muted);font-size:10px}.staff-order-payment strong{margin-left:auto;color:var(--ink)}.staff-order-actions{display:flex;justify-content:flex-end;gap:8px}.staff-order-card .notice{margin:10px 0}.kds-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start}.kds-column{min-width:0;background:#eef1eb;border-radius:12px;padding:12px}.kds-column>h3{display:flex;justify-content:space-between;align-items:center;margin:2px 2px 10px;font-size:12px}.kds-column>h3 span{font-size:10px;color:var(--muted);background:#fff;border-radius:20px;padding:3px 7px}.staff-order-card.compact{padding:12px}.staff-order-card.compact .staff-order-lines{margin:8px 0}.staff-order-card.compact .staff-order-lines li{border:0;padding:4px 0}.staff-order-card.compact .staff-order-head{display:block}.staff-order-card.compact .staff-order-head .status-chip{margin-top:8px}.staff-order-card.compact .staff-order-actions{margin-top:10px}.dialog-backdrop{position:fixed;inset:0;z-index:20;background:rgba(25,39,32,.45);display:grid;place-items:center;padding:16px}.confirm-dialog{width:min(500px,100%);max-height:min(90vh,780px);overflow:auto}.confirm-dialog h2{font-size:20px;margin:7px 0 16px}.confirm-dialog .field{margin:12px 0}.confirm-dialog .field input{width:100%}.cash-order-list,.blocker-list{padding-left:21px;color:#56675d;font-size:11px;line-height:1.8}.receipt-card{display:grid;grid-template-columns:1fr 1fr;gap:10px;background:#f2f5f0;border-radius:9px;padding:13px;margin:12px 0}.receipt-card>div{display:grid;gap:4px}.receipt-card span,.receipt-card small{font-size:9px;color:var(--muted)}.receipt-card strong{font-size:12px;overflow-wrap:anywhere}.receipt-card>small{grid-column:1/-1}.close-table{margin-top:20px}.staff-entry{margin:42px auto}.staff-entry input{width:100%}.staff-retry{grid-column:1/-1;max-width:360px;justify-self:end}
@media(max-width:900px){.staff-table-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kds-columns{grid-template-columns:1fr}.kds-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.kds-column>h3{grid-column:1/-1}.kds-column .staff-order-card{margin:0}}
@media(max-width:760px){.staff-workspace{display:flex;flex-direction:column;gap:0}.staff-tabs{width:100%}.staff-table-view,.staff-detail,.kds-view{width:100%}.staff-table-grid{grid-template-columns:1fr}.kds-column{grid-template-columns:1fr}.staff-table-card{padding:14px}.staff-retry{width:100%;max-width:none}.confirm-dialog{padding:16px}.staff-detail-meta{gap:8px}}

/* Pilot accessibility: native staff dialogs and 44px touch targets. */
dialog.confirm-dialog {
  margin: auto;
  color: inherit;
}

dialog.confirm-dialog::backdrop {
  background: rgba(25, 39, 32, .45);
}

.button.small,
.text-button,
.icon-button,
.locale-switch,
.staff-tabs .tab {
  min-height: 44px;
  min-width: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.stepper {
  /* 44px buttons plus the 1px border on each side. */
  height: 46px;
}

.stepper button {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Staff/KDS surfaces: every control keeps a 44px hit area. */
.staff-workspace .button,
.staff-entry .button,
.confirm-dialog .button {
  min-height: 44px;
  min-width: 44px;
  padding-inline: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.text-button {
  min-width: 44px;
  padding-inline: 8px;
}

.staff-workspace .field input,
.staff-workspace .field select,
.staff-entry .field input,
.confirm-dialog .field input {
  min-height: 44px;
}

.settings-check {
  min-height: 44px;
}

.settings-check input {
  width: 20px;
  height: 20px;
}