/* Soulbrew's final shared UI layer. Keep component behavior in the existing
   route styles; this file owns the cross-product visual and accessibility
   contract so storefront and operations no longer drift. */
:root {
  --ui-control-h: 48px;
  --ui-touch-h: 44px;
  --ui-focus-ring: 0 0 0 3px rgba(201, 120, 93, .32);
}

:focus-visible { outline: 3px solid var(--ui-peach-strong, var(--focus)); outline-offset: 3px; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }

body.lp .btn, body.lp .pill, body.lp .filter-pill, body.lp .segmented button,
body.admin-body .btn, body.admin-body .filter-pill, body.admin-body .store-toggle,
body.admin-body .admin-topbar__link, body.admin-body .admin-burger {
  min-height: var(--ui-touch-h);
}
body.lp .field input, body.lp .field select, body.lp .field textarea,
body.admin-body .field input, body.admin-body .field select, body.admin-body .field textarea {
  font-size: 16px;
  min-height: var(--ui-control-h);
}
body.lp .field label, body.admin-body .field label { font-size: 14px; }
body.lp .status-pill, body.admin-body .status-pill { display:inline-flex; align-items:center; gap:6px; min-height:28px; }
body.lp .status-pill::before, body.admin-body .status-pill::before { content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
body.lp .status-pill.ok::before, body.admin-body .status-pill.ok::before { background:var(--success); }
body.lp .status-pill.warn::before, body.admin-body .status-pill.warn::before { background:var(--warn); }
body.lp .status-pill.danger::before, body.admin-body .status-pill.danger::before { background:var(--danger); }
body.lp .cart-drawer, body.lp .item-modal, body.lp .order-context-modal,
body.admin-body .editor-drawer, body.admin-body .admin-command__dialog { box-shadow: var(--ui-shadow-float, var(--shadow-lg)); }
body.lp .filter-pill, body.admin-body .filter-pill { white-space: nowrap; }
body.lp .field input:focus, body.lp .field select:focus, body.lp .field textarea:focus,
body.admin-body .field input:focus, body.admin-body .field select:focus, body.admin-body .field textarea:focus {
  border-color: var(--ui-peach-strong, var(--accent)); box-shadow: var(--ui-focus-ring); outline:none;
}

/* POS: counter-speed working surface. */
body.admin-body [data-app][data-route="pos"] .admin-content { max-width: 1480px; }
.pos-shell { grid-template-columns:minmax(0, 1fr) minmax(360px, 420px); gap:28px; }
.pos-toolbar { position:sticky; top:0; z-index:8; flex-wrap:wrap; padding:4px 0 14px; background:color-mix(in srgb, var(--paper) 94%, transparent); backdrop-filter:blur(10px); }
.pos-search input { min-height:52px; font-size:16px; }
.pos-categories { flex:1 1 100%; padding-bottom:2px; }
.pos-products { grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:14px; }
.pos-product { min-height:154px; padding:18px; border-radius:16px; }
.pos-product__image { width:100%; height:72px; object-fit:cover; border-radius:11px; background:var(--paper-sunken); }
.pos-product:focus-visible { box-shadow:var(--ui-focus-ring); }
.pos-product__name { font-size:16px; }
.pos-product strong { font-size:20px; }
.pos-product__add { align-self:flex-start; color:var(--accent); font-size:13px; }
.pos-product__modifiers { color:var(--ink-faint); font-size:11px; line-height:1.25; }
.pos-no-results { display:grid; justify-items:start; gap:10px; padding:28px; border:1px dashed var(--hairline-strong); border-radius:16px; color:var(--ink-soft); }
.pos-cart { top:16px; max-height:calc(100dvh - 100px); overflow:auto; padding:22px; }
.pos-cart__head { position:sticky; top:-22px; z-index:2; margin:-22px -22px 16px; padding:22px 22px 14px; background:var(--paper-raised); border-bottom:1px solid var(--hairline); }
.pos-section-head { display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:8px; }
.pos-section-head label { color:var(--ink-soft); font-size:14px; font-weight:700; }
.pos-customer-modes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.pos-mode { min-height:42px; padding:8px; border:1px solid var(--hairline-strong); border-radius:10px; color:var(--ink-soft); font-size:13px; font-weight:700; line-height:1.15; }
.pos-mode.is-active { background:var(--accent); border-color:var(--accent); color:#fff; }
.pos-customer-picker { margin-top:16px; padding-top:16px; border-top:1px solid var(--hairline); }
.pos-customer-fields { margin:14px 0; }
.pos-cart-lines { max-height:280px; }
.pos-line { grid-template-columns:minmax(0,1fr) auto auto auto; gap:10px; padding:4px 0; }
.pos-line__edit { min-height:32px; padding:4px 7px; border:1px solid var(--hairline-strong); border-radius:8px; color:var(--accent-deep); font-size:12px; font-weight:700; }
.pos-line__edit:hover { border-color:var(--accent); background:var(--accent-tint); }
.pos-line__controls { gap:8px; }
.pos-line__controls button { width:38px; height:38px; border-radius:10px; font-size:21px; }
.pos-line__controls b { min-width:20px; text-align:center; font-size:15px; }
.pos-summary .pos-total { margin-top:5px; padding:14px 0; font-size:20px; }
.pos-review__breakdown { display:grid; gap:7px; padding:12px 0; border-bottom:1px solid var(--hairline); color:var(--ink-soft); font-size:14px; }
.pos-review__breakdown > div { display:flex; justify-content:space-between; gap:12px; }
.pos-review__lines > div > span { display:flex; flex-direction:column; gap:3px; }
.pos-review__lines small { color:var(--ink-faint); font-size:12px; }
.pos-receipt-note { margin:18px auto 0; max-width:48ch; padding:11px 14px; border-radius:10px; background:var(--success-tint); color:var(--success); font-size:14px; font-weight:700; }
.pos-charge { position:sticky; bottom:0; z-index:2; min-height:52px !important; box-shadow:0 -10px 22px var(--paper-raised); }
.pos-inline-error { margin:12px 0; padding:10px 12px; border:1px solid color-mix(in srgb,var(--danger) 35%,transparent); border-radius:10px; background:var(--danger-tint); color:var(--danger); font-size:14px; font-weight:600; }
.pos-review, .pos-complete { max-width:760px; margin:clamp(16px,5vw,64px) auto; padding:clamp(22px,4vw,40px); }
.pos-review__head, .pos-complete__actions, .pos-review__actions { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.pos-review__head p:not(.eyebrow), .pos-complete > p:not(.eyebrow) { margin-top:8px; color:var(--ink-soft); font-size:16px; }
.pos-review__meta { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:28px 0 18px; }
.pos-review__meta div { padding:13px; border-radius:12px; background:var(--paper-sunken); }
.pos-review__meta dt { color:var(--ink-faint); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.pos-review__meta dd { margin:5px 0 0; font-size:15px; font-weight:700; }
.pos-review__lines { border-top:1px solid var(--hairline); border-bottom:1px solid var(--hairline); }
.pos-review__lines > div { display:flex; justify-content:space-between; gap:16px; padding:12px 0; font-size:15px; }
.pos-review__total { display:flex; justify-content:space-between; align-items:baseline; padding:18px 0; font-size:18px; font-weight:700; }
.pos-review__total strong { font-size:28px; }
.pos-review__actions { justify-content:flex-end; }
.pos-complete { text-align:center; }
.pos-complete__mark { display:grid; place-items:center; width:58px; height:58px; margin:0 auto 18px; border-radius:50%; background:var(--success-tint); color:var(--success); font-size:30px; font-weight:800; }
.pos-complete h2 { font-size:32px; }
.pos-complete > p:not(.eyebrow) { max-width:52ch; margin-inline:auto; }
.pos-complete__actions { justify-content:center; margin-top:26px; }
.pos-mobile-sale { display:none; }

@media (max-width:980px) {
  .pos-cart { max-height:none; }
}
@media (max-width:640px) {
  body.admin-body [data-app][data-route="pos"] .admin-content { padding:16px 14px 92px; }
  .pos-toolbar { top:-1px; padding-top:10px; }
  .pos-categories { overflow-x:auto; flex-wrap:nowrap; margin-inline:-2px; padding-bottom:6px; scrollbar-width:thin; }
  .pos-products { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .pos-product { min-height:138px; padding:14px; }
  .pos-product__image { height:58px; }
  .pos-product__name { font-size:14px; }
  .pos-product strong { font-size:18px; }
  .pos-cart { border-radius:16px; }
  .pos-mobile-sale { position:fixed; z-index:190; right:14px; bottom:14px; left:14px; display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:10px; min-height:58px; padding:10px 14px; border-radius:15px; background:var(--accent); color:#fff; box-shadow:0 16px 38px rgba(44,32,24,.26); font-size:13px; text-align:left; }
  .pos-mobile-sale[hidden] { display:none; }
  .pos-mobile-sale strong { font-size:17px; }
  .pos-mobile-sale span:last-child { font-weight:800; }
  .pos-cart__head { position:static; margin:0 0 16px; padding:0 0 14px; }
  .pos-customer-modes { grid-template-columns:1fr; }
  .pos-review__meta { grid-template-columns:1fr; }
  .pos-review__head, .pos-review__actions, .pos-complete__actions { align-items:stretch; flex-direction:column; }
  .pos-review__actions .btn, .pos-complete__actions .btn { width:100%; }
}

/* POS modifier editor and Kitchen production controls. */
.pos-modifier-modal { position:fixed; inset:0; z-index:240; display:grid; place-items:center; padding:20px; background:rgba(29,25,20,.48); }
.pos-modifier-modal[hidden] { display:none; }
.pos-modifier-dialog { width:min(620px,100%); max-height:min(760px,calc(100dvh - 40px)); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--hairline); border-radius:18px; background:var(--paper-raised); box-shadow:var(--shadow-lg); }
.pos-modifier-dialog__head, .pos-modifier-dialog__foot { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 22px; border-bottom:1px solid var(--hairline); }
.pos-modifier-dialog__head h2 { margin-top:3px; }
.pos-modifier-dialog__body { overflow:auto; padding:20px 22px; }
.pos-modifier-dialog__foot { justify-content:flex-end; border-top:1px solid var(--hairline); border-bottom:0; }
.pos-modifier-close { width:38px; height:38px; border-radius:10px; color:var(--ink-soft); font-size:26px; line-height:1; }
.pos-modifier-close:hover { background:var(--paper-sunken); color:var(--ink); }
.pos-option-group + .pos-option-group { margin-top:20px; }
.pos-option-group__head { display:flex; justify-content:space-between; gap:12px; margin-bottom:9px; }
.pos-option-group__head span { color:var(--ink-faint); font-size:12px; font-weight:700; }
.pos-option-choices { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:8px; }
.pos-option-choice { min-height:48px; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:10px 12px; border:1px solid var(--hairline-strong); border-radius:10px; color:var(--ink-soft); text-align:left; }
.pos-option-choice small { color:var(--accent-deep); font-weight:700; }
.pos-option-choice.is-selected { border-color:var(--accent); background:var(--accent-tint); color:var(--accent-deep); box-shadow:var(--ui-focus-ring); }

.kds-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:16px; }
.kds-toolbar h2 { margin-top:3px; }
.kds-toolbar > div:first-child p:last-child { margin-top:6px; color:var(--ink-soft); }
.kds-toolbar__actions { display:flex; align-items:flex-end; gap:8px; }
.kds-outlet-field { min-width:190px; }
.kds-status { min-height:26px; margin-bottom:12px; color:var(--ink-faint); font-size:13px; font-weight:700; }
.kds-status.is-warn { color:var(--warn); }
.kds-status.is-error { color:var(--danger); }
.kds-board.is-alerting { animation:kds-alert .55s ease-in-out 2; }
@keyframes kds-alert { 50% { filter:brightness(1.08); transform:translateY(-2px); } }
.kds-ticket__handoff { margin-top:8px; color:var(--ink-soft); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.045em; }
.kds-ticket__items li { align-items:flex-start; }
.kds-ticket__items li strong { font-weight:800; }
.kds-empty-state, .kds-error { display:grid; justify-items:start; gap:8px; padding:34px; border:1px dashed var(--hairline-strong); border-radius:14px; color:var(--ink-soft); }
.kds-empty-state strong, .kds-error strong { color:var(--ink); font-size:17px; }
.kds-upcoming { margin-top:18px; padding:14px 16px; border:1px solid var(--hairline); border-radius:14px; background:var(--paper-sunken); }
.kds-upcoming__head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.kds-upcoming__head div { display:grid; gap:3px; }
.kds-upcoming__head span { color:var(--ink-faint); font-size:12px; }
.kds-upcoming__head b { min-width:26px; padding:4px 9px; border-radius:999px; background:var(--warn); color:#fff; text-align:center; }
.kds-upcoming__list { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:10px; margin-top:12px; }
.kds-upcoming__ticket { min-width:0; border:1px solid var(--hairline); border-radius:12px; background:var(--paper-raised); overflow:hidden; }
.kds-upcoming__ticket summary { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:64px; padding:11px 12px; cursor:pointer; list-style:none; }
.kds-upcoming__ticket summary::-webkit-details-marker { display:none; }
.kds-upcoming__ticket summary:focus-visible { outline:3px solid var(--focus); outline-offset:-3px; }
.kds-upcoming__summary { display:grid; grid-template-columns:1fr auto; gap:3px 9px; min-width:0; }
.kds-upcoming__summary b { color:var(--warn); font-variant-numeric:tabular-nums; }
.kds-upcoming__summary small { grid-column:1 / -1; display:flex; align-items:center; flex-wrap:wrap; gap:5px; color:var(--ink-faint); }
.kds-upcoming__summary .kds-badge { font-style:normal; }
.kds-upcoming__toggle { flex:0 0 auto; color:var(--accent-deep); font-size:var(--fs-xs); font-weight:800; }
.kds-upcoming__ticket[open] .kds-upcoming__toggle { font-size:0; }
.kds-upcoming__ticket[open] .kds-upcoming__toggle::after { content:"Hide"; font-size:var(--fs-xs); }
.kds-upcoming__detail { display:grid; gap:10px; padding:0 12px 12px; border-top:1px solid var(--hairline); }
.kds-upcoming__detail > p { display:grid; gap:2px; margin-top:10px; color:var(--ink-soft); font-size:var(--fs-xs); }
.kds-upcoming__detail > p strong { color:var(--ink); text-transform:uppercase; letter-spacing:.05em; font-size:10px; }
.kds-upcoming__detail ul { display:grid; gap:6px; }
.kds-upcoming__detail li { display:flex; gap:8px; font-size:var(--fs-sm); }
.kds-upcoming__detail li b { min-width:24px; color:var(--accent-deep); }
.kds-upcoming__detail li span { display:grid; gap:1px; }
.kds-upcoming__detail li small { color:var(--ink-faint); font-size:var(--fs-xs); }
.kds-upcoming__detail footer { display:flex; justify-content:space-between; gap:8px; padding-top:9px; border-top:1px solid var(--hairline); color:var(--ink-faint); font-size:var(--fs-xs); }
.kds-upcoming__detail footer strong { color:var(--ink); font-size:var(--fs-sm); }
@media (max-width:640px) { .kds-upcoming__list { grid-template-columns:1fr; } .kds-upcoming__ticket summary { min-height:68px; } }
@media (max-width:760px) {
  .kds-toolbar { align-items:stretch; flex-direction:column; gap:14px; }
  .kds-toolbar__actions { align-items:stretch; flex-wrap:wrap; }
  .kds-outlet-field { flex:1 1 100%; }
  .kds-toolbar__actions .btn { flex:1 1 0; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; transition-duration:0.01ms !important; animation-duration:0.01ms !important; }
}

/* Responsive hardening. These bounded rules intentionally leave the desktop
   composition (1025px+) untouched. */
@media (max-width: 1024px) {
  body.lp .lp-nav__left { display:none; }
  body.lp .lp-nav .nav-toggle { display:inline-flex; }
  body.lp .lp-nav__row { grid-template-columns:auto 1fr auto; padding-inline:clamp(16px, 4vw, 36px); }
  body.lp .lp-nav__brand { justify-self:start; }

  body.lp .wrap { padding-inline:clamp(16px, 4vw, 36px); }
  body.lp .hero, body.lp .loyalty, body.lp .delivery__grid { grid-template-columns:1fr !important; }
  body.lp .hero { min-height:auto !important; }
  body.lp .hero__visual, body.lp .loyalty__art, body.lp .delivery__visual { min-height:clamp(390px, 54vw, 520px) !important; }
  body.lp .order-ribbon { grid-template-columns:1fr; gap:18px; }
  body.lp .checkout-grid { grid-template-columns:1fr; }
  body.lp .order-summary, body.lp .order-summary .checkout-card { position:static; }

  body.admin-body .admin-app { grid-template-columns:1fr; }
  body.admin-body .admin-side { position:fixed; inset:0 auto 0 0; z-index:220; width:min(300px, 88vw); transform:translateX(-102%); transition:transform var(--dur-med) var(--ease); }
  body.admin-body .admin-side.is-open { transform:translateX(0); box-shadow:var(--shadow-lg); }
  body.admin-body .admin-burger { display:flex; }
  body.admin-body .admin-scrim { display:block; position:fixed; inset:0; z-index:210; background:rgba(20,16,12,.4); opacity:0; pointer-events:none; transition:opacity var(--dur-med) var(--ease); }
  body.admin-body .admin-scrim.is-visible { opacity:1; pointer-events:auto; }
  body.admin-body .pos-shell { grid-template-columns:1fr; }
  body.admin-body .pos-cart { position:static; max-height:none; }
  body.admin-body .kds-board, body.admin-body .dash-grid { grid-template-columns:1fr; }
}

@media (min-width: 641px) and (max-width: 1024px) {
  body.lp .menu-body .drink-grid { grid-template-columns:repeat(3, minmax(0, 1fr)); }
  body.lp .sel-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.lp .checkout-card { padding:24px; }
  body.lp .cart-drawer { width:min(460px, 70vw); }
  body.admin-body .admin-content { padding:24px 20px 72px; }
  body.admin-body .admin-tablewrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  body.admin-body .admin-table { min-width:680px; }
  body.admin-body .pos-products { grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  body.lp .lp-ico, body.lp .nav-toggle { width:44px !important; height:44px !important; min-width:44px !important; min-height:44px !important; }
  body.lp .lp-nav__row { min-height:64px; padding-inline:16px; }
  body.lp .lp-nav__brand img { width:118px !important; height:31px !important; }
  body.lp .lp-menu { padding-inline:16px; padding-bottom:calc(22px + env(safe-area-inset-bottom)); }
  body.lp .hero { padding-inline:20px !important; }
  body.lp .hero__visual, body.lp .loyalty__art, body.lp .delivery__visual { min-height:340px !important; }
  body.lp .hero__drink { width:min(78vw, 390px) !important; }
  body.lp .hero__proof { gap:14px; }
  body.lp .order-ribbon, body.lp .checkout-card { padding-inline:18px; }
  body.lp .menu-body .drink-grid, body.lp .sel-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.lp .filter-row { flex-wrap:nowrap; overflow-x:auto; padding:0 2px 8px; scrollbar-width:thin; }
  body.lp .filter-pill { flex:0 0 auto; }
  body.lp .cart-drawer { width:100vw; padding-bottom:env(safe-area-inset-bottom); }
  body.lp .modal-overlay { align-items:flex-end; }
  body.lp .item-modal { max-height:calc(100dvh - env(safe-area-inset-top)); padding-bottom:env(safe-area-inset-bottom); }
  body.lp .checkout-card .field-row.two, body.lp .checkout-account-fields { grid-template-columns:1fr; }
  body.lp .checkout-payment-card .segmented { overflow-x:auto; padding-bottom:4px; }
  body.lp .checkout-payment-card .segmented button { min-width:150px; flex:1 0 auto; }
  body.lp .checkout-body { padding-bottom:calc(92px + env(safe-area-inset-bottom)); }
  body.lp [data-place-order] { position:sticky; bottom:calc(10px + env(safe-area-inset-bottom)); z-index:8; box-shadow:0 10px 24px rgba(38,34,26,.18); }

  body.admin-body .admin-content { padding:18px 14px calc(88px + env(safe-area-inset-bottom)); }
  body.admin-body .admin-topbar__link, body.admin-body .admin-burger { width:44px; height:44px; min-width:44px; min-height:44px; }
  body.admin-body .admin-tablewrap { overflow-x:auto; -webkit-overflow-scrolling:touch; box-shadow:inset -12px 0 12px -16px rgba(0,0,0,.6); }
  body.admin-body .admin-table { min-width:680px; }
  body.admin-body .pos-products { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.admin-body .pos-mobile-sale { bottom:calc(14px + env(safe-area-inset-bottom)); }
  body.admin-body .pos-modifier-modal { padding:12px; }
  body.admin-body .pos-modifier-dialog { max-height:calc(100dvh - 24px - env(safe-area-inset-bottom)); }
  body.admin-body .kds-toolbar__actions .btn { min-height:44px; }
}

/* Dense data becomes a complete, labeled record at phone width. The DOM
   remains a semantic table, so no admin field or action is removed. */
@media (max-width: 640px) {
  body.admin-body .admin-tablewrap:has(.admin-table[data-responsive-cards="true"]) {
    margin-inline:0;
    overflow:visible;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  body.admin-body .admin-tablewrap:has(.admin-table[data-responsive-cards="true"])::after { display:none; }
  body.admin-body .admin-table[data-responsive-cards="true"] { display:block; min-width:0; width:100%; font-size:13px; }
  body.admin-body .admin-table[data-responsive-cards="true"] thead {
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    clip-path:inset(50%);
    white-space:nowrap;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] tbody { display:grid; gap:10px; }
  body.admin-body .admin-table[data-responsive-cards="true"] tbody tr {
    display:block;
    overflow:hidden;
    border:1px solid var(--hairline);
    border-radius:14px;
    background:var(--paper-raised);
    box-shadow:0 5px 14px rgba(44,32,24,.04);
  }
  body.admin-body .admin-table[data-responsive-cards="true"] td {
    position:relative;
    display:block;
    min-height:44px;
    padding:11px 12px 11px 108px;
    border-bottom:1px solid var(--hairline);
    color:var(--ink);
    background:transparent !important;
    box-shadow:none !important;
    overflow-wrap:anywhere;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] td:last-child { border-bottom:0; }
  body.admin-body .admin-table[data-responsive-cards="true"] td::before {
    content:attr(data-label);
    position:absolute;
    top:12px;
    left:12px;
    width:84px;
    color:var(--ink-faint);
    font-size:10px;
    font-weight:800;
    letter-spacing:.06em;
    line-height:1.25;
    text-transform:uppercase;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] td:has(.table-actions) {
    min-height:56px;
    padding:9px 12px;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] td:has(.table-actions)::before { display:none; }
  body.admin-body .admin-table[data-responsive-cards="true"] td:has(.table-actions) .table-actions { justify-content:flex-end; }
  body.admin-body .admin-table[data-responsive-cards="true"] td select,
  body.admin-body .admin-table[data-responsive-cards="true"] td input[type="number"] { width:100%; max-width:220px; }
}

@media (min-width: 1025px) {
  body.lp .checkout-grid { grid-template-columns:minmax(0,1.45fr) minmax(340px,.9fr); gap:44px; }
  body.lp .order-summary { top:96px; }
  body.admin-body .kds-board { grid-template-columns:repeat(3,minmax(260px,1fr)); gap:18px; }
  body.admin-body .admin-toolbar--orders, body.admin-body .admin-toolbar--customers { padding-inline:16px; }
}

/* ========================================================================
   Touch-first refinement — final cascade for phones and tablets.
   The storefront stays editorial; operations becomes a compact workspace.
   ======================================================================== */

@media (max-width: 1024px) {
  body.lp .lp-nav { position:sticky; top:0; }
  body.lp .lp-nav__row { min-height:68px; }
  body.lp .lp-nav__right { gap:2px; }
  body.lp .lp-menu.is-open { max-height:calc(100dvh - 68px); overflow:auto; }
  body.lp .lp-menu a { min-height:52px; }
  body.lp .hero__copy { max-width:min(680px, 100%); }
  body.lp .hero__actions { flex-wrap:wrap; gap:12px; }
  body.lp .hero__proof { max-width:620px; }
  body.lp .order-ribbon__actions { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.lp .outlet { grid-template-columns:minmax(220px, .82fr) minmax(0, 1fr); }
  body.lp .checkout-grid { align-items:start; }
  body.lp .cart-drawer { width:min(480px, 78vw); }

  body.admin-body .admin-topbar { position:relative; z-index:20; }
  body.admin-body .admin-topbar__actions { gap:8px; }
  body.admin-body .admin-content { width:100%; }
  body.admin-body .admin-toolbar,
  body.admin-body .admin-section__head,
  body.admin-body .admin-card__head { align-items:flex-start; }
  body.admin-body .admin-toolbar { flex-wrap:wrap; gap:12px; }
  body.admin-body .admin-search { flex:1 1 260px; }
  body.admin-body .admin-search input { width:100%; }
  body.admin-body .dash-kpis { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.admin-body .kpi { min-height:128px; }
  body.admin-body .schedule-slots { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.admin-body .kds-board { grid-auto-flow:column; grid-auto-columns:minmax(300px, 42vw); grid-template-columns:none; overflow-x:auto; overscroll-behavior-inline:contain; padding-bottom:8px; scroll-snap-type:x proximity; }
  body.admin-body .kds-lane { scroll-snap-align:start; }
}

@media (min-width: 641px) and (max-width: 1024px) {
  body.lp .hero { padding-top:clamp(42px, 7vw, 76px) !important; }
  body.lp .hero__visual { min-height:clamp(410px, 48vw, 510px) !important; }
  body.lp .delivery__grid { gap:28px; }
  body.lp .checkout-body { padding-bottom:72px; }
  body.admin-body .admin-content { padding:26px clamp(20px, 4vw, 36px) 88px; }
  body.admin-body .admin-card { padding:22px; }
  body.admin-body .admin-grid-2 { gap:16px; }
  body.admin-body .dash-grid { grid-template-columns:minmax(0, 1.1fr) minmax(280px, .9fr); }
  body.admin-body .schedule-slots { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  body.lp { font-size:15px; }
  body.lp .wrap { padding-inline:18px; }
  body.lp .lp-nav { position:sticky; }
  body.lp .lp-nav__row { min-height:64px; }
  body.lp .lp-nav__right { gap:0; }
  body.lp .lp-menu a { padding-inline:4px; }
  body.lp .hero { padding-top:42px !important; padding-bottom:20px !important; }
  body.lp .hero__eyebrow { font-size:11px; }
  body.lp .hero__big { max-width:8ch; }
  body.lp .hero__sub { font-size:15px; }
  body.lp .hero__actions { align-items:stretch; }
  body.lp .hero__actions .pill { flex:1 0 100%; justify-content:center; }
  body.lp .hero__text-link { min-height:44px; display:inline-flex; align-items:center; }
  body.lp .hero__proof { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px 14px; margin-top:24px; }
  body.lp .hero__proof span:last-child { grid-column:1 / -1; }
  body.lp .hero__visual { min-height:320px !important; }
  body.lp .hero__halo { width:min(74vw, 330px) !important; }
  body.lp .hero__drink { width:min(82vw, 380px) !important; }
  body.lp .order-ribbon { gap:16px; padding:22px 18px; }
  body.lp .order-ribbon__intro { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
  body.lp .order-ribbon__intro b { text-align:right; }
  body.lp .order-ribbon__actions { grid-template-columns:1fr; gap:10px; }
  body.lp .order-ribbon__actions a { min-height:68px; }
  body.lp .section-title { font-size:clamp(34px, 10vw, 46px) !important; }
  body.lp .section-heading > p { font-size:14px; }
  body.lp .dcard__no { font-size:10px; }
  body.lp .dcard__pr { margin-top:5px; }
  body.lp .mood__prompt-foot { align-items:stretch; flex-direction:column; }
  body.lp .mood__prompt-foot button { width:100%; min-height:48px; }
  body.lp .loyalty__copy, body.lp .ethos__copy { padding:54px 20px; }
  body.lp .delivery__buttons { width:100%; }
  body.lp .delivery__buttons .pill { width:100%; justify-content:center; }
  body.lp .outlet { grid-template-columns:1fr; }
  body.lp .outlet__media { min-height:250px; }
  body.lp .outlet__body { padding:24px 20px; }
  body.lp .hours-table { font-size:13px; }
  body.lp .menu-body, body.lp .outlets-list, body.lp .account-body, body.lp .checkout-body { padding-block:36px 64px; }
  body.lp .menu-toolbar { gap:14px; }
  body.lp .filter-row { margin-inline:-18px; padding-inline:18px; scroll-padding-inline:18px; }
  body.lp .drink-grid { gap:14px; }
  body.lp .drink-card { min-width:0; }
  body.lp .drink-card__body { padding:13px; }
  body.lp .drink-card__name { font-size:14px; }
  body.lp .drink-card__desc { display:none; }
  body.lp .drink-card .add-btn { width:40px; height:40px; }
  body.lp .cart-drawer__head, body.lp .cart-drawer__foot { padding-top:18px; padding-bottom:18px; }
  body.lp .cart-line { gap:10px; }
  body.lp .cart-line img { width:54px; height:54px; flex-basis:54px; }
  body.lp .item-modal__body { padding:20px 18px; gap:18px; }
  body.lp .item-modal__footer { position:sticky; bottom:0; padding:14px 18px calc(14px + env(safe-area-inset-bottom)); box-shadow:0 -12px 24px rgba(28,26,22,.08); }
  body.lp .checkout-card { border-radius:12px !important; }
  body.lp .checkout-card h2 { font-size:18px; }
  body.lp .account-dashboard-grid { gap:12px; }

  body.admin-body { font-size:15px; }
  body.admin-body .admin-side { width:min(320px, 86vw); }
  body.admin-body .admin-side__brand { height:64px; }
  body.admin-body .admin-nav { padding:12px 10px 18px; }
  body.admin-body .admin-nav__item { min-height:46px; }
  body.admin-body .admin-topbar { min-height:64px; padding-inline:10px; gap:8px; }
  body.admin-body .admin-topbar__actions { gap:4px; }
  body.admin-body .admin-jump, body.admin-body .store-toggle { min-width:44px; min-height:44px; }
  body.admin-body .admin-content { padding:16px 12px calc(96px + env(safe-area-inset-bottom)); }
  body.admin-body .admin-content > * + * { margin-top:18px; }
  body.admin-body .admin-lead { font-size:14px; }
  body.admin-body .admin-card { padding:16px; border-radius:12px; }
  body.admin-body .admin-card__head, body.admin-body .admin-section__head { gap:12px; }
  body.admin-body .admin-section__head .btn, body.admin-body .admin-card__head .btn { width:100%; }
  body.admin-body .dash-kpis { grid-template-columns:1fr 1fr; gap:8px; }
  body.admin-body .kpi { min-height:112px; padding:14px; }
  body.admin-body .kpi__value { font-size:1.55rem; }
  body.admin-body .kpi__label { font-size:10px; }
  body.admin-body .kpi__sub { font-size:11px; }
  body.admin-body .dash-actions { grid-template-columns:1fr; gap:8px; }
  body.admin-body .quick-action { min-height:48px; }
  body.admin-body .admin-toolbar { align-items:stretch; }
  body.admin-body .admin-search { flex-basis:100%; }
  body.admin-body .admin-toolbar > .filter-pills { overflow-x:auto; flex-wrap:nowrap; margin-inline:-2px; padding-bottom:3px; }
  body.admin-body .admin-toolbar > .filter-pills .filter-pill { flex:0 0 auto; min-height:42px; }
  body.admin-body .table-actions { flex-wrap:wrap; }
  body.admin-body .admin-tablewrap { border-radius:12px; }
  body.admin-body .admin-table { min-width:620px; font-size:13px; }
  body.admin-body .admin-table th, body.admin-body .admin-table td { padding:12px; }
  body.admin-body .schedule-slots { grid-template-columns:1fr; gap:10px; }
  body.admin-body .schedule-slot { border-radius:12px; }
  body.admin-body .schedule-order { grid-template-columns:62px minmax(0, 1fr) auto; gap:8px; padding:12px; }
  body.admin-body .schedule-order .status-pill { display:none; }
  body.admin-body .kds-board { grid-auto-columns:minmax(278px, 82vw); gap:12px; margin-inline:-12px; padding:0 12px 10px; }
  body.admin-body .kds-lane { min-height:300px; }
  body.admin-body .editor-overlay { align-items:flex-end; }
  body.admin-body .editor-drawer { width:100%; max-height:94dvh; border-radius:18px 18px 0 0; }
  body.admin-body .editor-head { min-height:62px; padding:12px 16px; }
  body.admin-body .editor-body { padding:16px 14px; }
  body.admin-body .editor-foot { padding:12px 14px calc(12px + env(safe-area-inset-bottom)); }
  body.admin-body .promo-form__grid, body.admin-body .admin-grid-2, body.admin-body .email-health-grid { grid-template-columns:1fr; }
  body.admin-body .email-health-grid { gap:8px; }
  body.admin-body .email-health-actions { align-items:stretch; flex-direction:column; }
  body.admin-body .email-health-actions .btn { width:100%; }
  body.admin-body .loyalty-ledger-list > div { align-items:flex-start; flex-direction:column; gap:4px; }
}

@media (max-width: 380px) {
  body.lp .hero__big { font-size:clamp(44px, 13.5vw, 54px) !important; }
  body.lp .menu-body .drink-grid, body.lp .sel-grid { gap:12px 10px; }
  body.lp .dcard__nm { font-size:13px; }
  body.admin-body .dash-kpis { grid-template-columns:1fr; }
  body.admin-body .admin-topbar__title h1 { max-width:118px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}

/* Mobile experience pass: purpose-built ordering and operations surfaces. */
@media (max-width: 640px) {
  /* Storefront: turn every page header into a compact context bar, leaving
     the first useful action in reach instead of spending the screen on chrome. */
  body.lp .menu-hero,
  body.lp .outlets-hero,
  body.lp .account-hero,
  body.lp .checkout-hero {
    padding:34px 18px 30px !important;
  }
  body.lp .menu-hero__big,
  body.lp .outlets-hero__big,
  body.lp .account-hero__big,
  body.lp .checkout-hero__big {
    margin-top:8px;
    font-size:clamp(2.2rem, 10.5vw, 3rem) !important;
    line-height:1 !important;
  }
  body.lp .menu-hero__sub,
  body.lp .outlets-hero__sub,
  body.lp .account-hero__sub,
  body.lp .checkout-hero__sub { margin-top:12px; font-size:14px; }
  body.lp .menu-outlet-choice {
    margin:18px -2px 0;
    padding:16px;
    border-radius:14px;
  }
  body.lp .menu-outlet-choice h2 { font-size:21px !important; }
  body.lp .menu-outlet-picker { grid-template-columns:1fr; margin-top:14px; }
  body.lp .menu-outlet-radio { min-height:64px; padding:12px; }
  body.lp .menu-fulfillment-choice { margin-top:14px; padding-top:14px; }
  body.lp .menu-fulfillment-choice .segmented { display:grid; grid-template-columns:1fr 1fr; }
  body.lp .menu-fulfillment-choice .segmented button { min-height:46px; }
  body.lp .menu-hero .filter-row { margin-top:20px; }
  body.lp .menu-hero .filter-pill {
    min-height:42px;
    padding-inline:15px;
    font-size:12px;
    letter-spacing:normal;
    text-transform:none;
  }
  body.lp .menu-section { margin-top:38px; }
  body.lp .menu-section__title { margin-bottom:20px; padding-bottom:12px; font-size:18px; letter-spacing:.08em; }
  body.lp .menu-body .drink-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:28px 12px; }
  body.lp .menu-body .drink-card__media { aspect-ratio:1 / 1.1; border-radius:15px !important; }
  body.lp .menu-body .drink-card__body { align-items:flex-start; padding:11px 2px 0; text-align:left; }
  body.lp .menu-body .drink-card__tagline { font-size:10px; letter-spacing:.08em; }
  body.lp .menu-body .drink-card__name { min-height:2.45em; margin-top:5px; font-size:14px; line-height:1.2; letter-spacing:normal; text-transform:none; }
  body.lp .menu-body .drink-card__meta { justify-content:flex-start; margin-top:7px; }
  body.lp .menu-body .drink-card__tag { font-size:9px; padding:3px 7px; }
  body.lp .menu-body .drink-card__foot { width:100%; justify-content:space-between; margin-top:10px; gap:6px; }
  body.lp .menu-body .drink-card__price { font-size:13px; letter-spacing:normal; }
  body.lp .menu-body .drink-card .add-btn { width:42px; height:42px; min-width:42px; }
  body.lp .pause-banner { padding:14px; font-size:13px; }

  /* Checkout follows the task order on phones: choices, payment, then totals. */
  body.lp .checkout-grid { display:flex; flex-direction:column; gap:14px; }
  body.lp .order-summary { order:0; width:100%; }
  body.lp .order-summary .checkout-card { background:#f0e6d9 !important; }
  body.lp .checkout-form { width:100%; gap:14px; }
  body.lp .checkout-card { padding:18px !important; }
  body.lp .checkout-card h2 { margin-bottom:15px; }
  body.lp .outlet-radio { min-height:72px; padding:14px; }
  body.lp .segmented { display:grid; grid-template-columns:1fr 1fr; }
  body.lp .segmented button { padding:11px 10px; font-size:12px; letter-spacing:.06em; }
  body.lp .promo-row { align-items:stretch; flex-direction:column; }
  body.lp .promo-row .btn { width:100%; }
  body.lp .checkout-inline-actions { display:grid; grid-template-columns:1fr 1fr; }
  body.lp .checkout-inline-actions .btn { justify-content:center; }

  /* Customer spaces become stacked cards with readable order history. */
  body.lp .account-head { align-items:stretch; flex-direction:column; margin-bottom:18px; }
  body.lp .account-head__actions { display:grid; grid-template-columns:1fr 1fr; }
  body.lp .account-head__actions .btn { justify-content:center; }
  body.lp .account-dashboard-grid { grid-template-columns:1fr 1fr; gap:9px; }
  body.lp .account-dashboard-card { min-height:112px; padding:15px; }
  body.lp .account-dashboard-card--points { grid-column:1 / -1; min-height:130px; }
  body.lp .account-quick-actions { grid-template-columns:1fr; margin-bottom:26px; }
  body.lp .account-quick-actions a { min-height:64px; padding:14px; border-right:0; border-bottom:1px solid rgba(38,34,26,.12); }
  body.lp .account-quick-actions a:last-child { border-bottom:0; }
  body.lp .order-history-item { align-items:stretch; flex-direction:column; }
  body.lp .order-history-item__main { padding:15px; gap:12px; }
  body.lp .order-history-item__actions { justify-content:stretch; padding:10px 15px; border-top:1px solid rgba(38,34,26,.12); border-left:0; }
  body.lp .order-history-item__actions .btn { width:100%; justify-content:center; }
  body.lp .track-head { align-items:stretch; flex-direction:column; }
  body.lp .track-head .btn { width:100%; justify-content:center; }
  body.lp .track-status-panel { padding:18px; }
  body.lp .track-steps { overflow-x:auto; padding-bottom:6px; }
  body.lp .track-step { min-width:82px; }

  /* Admin: use a dense field-console pattern, avoiding tiny desktop controls. */
  body.admin-body .admin-scroll { overflow-x:hidden; }
  body.admin-body .admin-side__brand-copy img { height:23px; }
  body.admin-body .admin-side__tag { font-size:10px; }
  body.admin-body .admin-nav__group { margin-bottom:10px; }
  body.admin-body .admin-nav__label { margin:9px 7px 5px; font-size:10px; }
  body.admin-body .admin-nav__item { gap:12px; padding:11px 12px; font-size:15px; }
  body.admin-body .admin-nav__item svg { width:20px; height:20px; }
  body.admin-body .admin-side__foot { padding:12px 14px calc(12px + env(safe-area-inset-bottom)); }
  body.admin-body .admin-topbar__title { min-width:0; }
  body.admin-body .admin-topbar__title h1 { font-size:17px; }
  body.admin-body .admin-topbar__actions > * { flex:0 0 auto; }
  body.admin-body .admin-topbar__link,
  body.admin-body .admin-burger,
  body.admin-body .store-toggle { border-color:rgba(44,32,24,.14); background:#fff; }
  body.admin-body .admin-section__head > div,
  body.admin-body .admin-card__head > div { width:100%; }
  body.admin-body .admin-section__head h2 { font-size:21px; }
  body.admin-body .admin-section__head p,
  body.admin-body .field-hint { font-size:13px; line-height:1.45; }
  body.admin-body .admin-toolbar { padding:9px; border-radius:12px; }
  body.admin-body .admin-toolbar .btn-primary { margin-left:0; width:100%; justify-content:center; }
  body.admin-body .admin-search input,
  body.admin-body .admin-inline-search { min-height:46px; }
  body.admin-body .filter-pills { gap:7px; }
  body.admin-body .filter-pill { min-height:40px; }
  body.admin-body .queue-row { min-height:72px; padding:12px; }
  body.admin-body .queue-row__main strong { font-size:14px; }
  body.admin-body .schedule-days { margin-inline:-12px; padding-inline:12px; scroll-padding-inline:12px; }
  body.admin-body .schedule-day { min-height:76px; }
  body.admin-body .schedule-summary { gap:12px 18px; padding:14px; }
  body.admin-body .schedule-summary strong { font-size:20px; }
  body.admin-body .schedule-order { min-height:60px; }
  body.admin-body .schedule-order__main small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  body.admin-body .product-row,
  body.admin-body .avail-row { min-height:72px; padding:12px; }
  body.admin-body .product-row__actions,
  body.admin-body .avail-row__actions { gap:7px; }
  body.admin-body .admin-switch { min-width:44px; min-height:30px; }
  body.admin-body .kds-toolbar { gap:12px; }
  body.admin-body .kds-toolbar__actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  body.admin-body .kds-outlet-field { grid-column:1 / -1; }
  body.admin-body .kds-toolbar__actions .btn { min-height:44px; }
  body.admin-body .kds-ticket { padding:14px; }
  body.admin-body .kds-ticket__items { margin-block:12px; }
  body.admin-body .editor-drawer::before { content:""; display:block; width:38px; height:4px; margin:9px auto -3px; border-radius:99px; background:var(--hairline-strong); }
  body.admin-body .editor-head h2 { font-size:18px; }
  body.admin-body .editor-foot .btn { flex:1; justify-content:center; }
}

@media (min-width: 641px) and (max-width: 820px) {
  body.lp .menu-body .drink-grid { grid-template-columns:repeat(3, minmax(0, 1fr)); gap:26px 16px; }
  body.lp .menu-body .drink-card__name { font-size:15px; }
  body.lp .checkout-grid { grid-template-columns:minmax(0, 1.1fr) minmax(260px, .9fr); }
  body.lp .order-summary { position:sticky; top:86px; }
  body.lp .account-dashboard-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.admin-body .dash-kpis { grid-template-columns:repeat(4, minmax(0, 1fr)); }
  body.admin-body .kpi { min-height:118px; padding:16px; }
  body.admin-body .kpi__value { font-size:1.75rem; }
}

/* An explicit mobile command rail keeps the four operational destinations in
   thumb reach. Less frequent configuration remains in the full drawer. */
.admin-mobile-nav { display:none; }
.mobile-order-dock { display:none; }
.mobile-cart-summary { display:none; }

/* Operations app shell — never applies at desktop widths. */
@media (min-width:641px) and (max-width:1024px) {
  body.admin-body .admin-app { display:block; position:relative; }
  body.admin-body .admin-main { min-height:100dvh; margin-left:88px; }
  body.admin-body .admin-topbar {
    position:relative;
    min-height:74px;
    padding:0 24px;
    background:rgba(255,255,255,.92);
    box-shadow:0 1px 0 rgba(44,32,24,.08), 0 10px 28px rgba(44,32,24,.045);
    backdrop-filter:blur(18px);
  }
  body.admin-body .admin-topbar__title h1 { font-size:21px; }
  body.admin-body .admin-topbar__title p { display:block; max-width:60ch; font-size:13px; }
  body.admin-body .admin-topbar__date,
  body.admin-body .admin-jump,
  body.admin-body .admin-topbar__link:last-child { display:none; }
  body.admin-body .admin-topbar__actions { gap:8px; }
  body.admin-body .admin-mode-switch { min-height:44px; padding:4px; border-radius:12px; background:var(--paper-sunken); }
  body.admin-body .admin-mode-switch__button { min-height:36px; padding-inline:10px; border-radius:9px; }
  body.admin-body .store-toggle { min-height:44px; padding-inline:13px; border-radius:12px; }
  body.admin-body .admin-content { max-width:1500px; padding:28px 28px 48px; }
  body.admin-body .admin-card { border-radius:16px; }
  body.admin-body .admin-toolbar { position:sticky; top:0; z-index:8; }
  body.admin-body .admin-mobile-nav {
    position:fixed;
    z-index:200;
    top:14px;
    bottom:14px;
    left:12px;
    width:64px;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:6px;
    padding:7px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:20px;
    background:linear-gradient(180deg, #302219, #201710);
    box-shadow:0 18px 46px rgba(44,32,24,.24);
  }
  body.admin-body .admin-mobile-nav::before {
    content:"SB";
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    margin:1px auto 8px;
    border-radius:14px;
    background:rgba(233,164,134,.16);
    color:var(--ui-peach);
    font-size:11px;
    font-weight:800;
    letter-spacing:.08em;
  }
  body.admin-body .admin-mobile-nav__item {
    min-height:54px;
    display:grid;
    place-items:center;
    gap:3px;
    padding:6px 2px;
    border-radius:13px;
    color:rgba(255,255,255,.62);
    font-size:10px;
    font-weight:700;
    line-height:1.1;
  }
  body.admin-body .admin-mobile-nav__item svg { width:20px; height:20px; }
  body.admin-body .admin-mobile-nav__item.is-active { background:rgba(255,255,255,.12); color:#fff; box-shadow:inset 2px 0 0 var(--ui-peach); }
  body.admin-body .admin-mobile-nav__item:last-child { margin-top:auto; color:var(--ui-peach); }
  body.admin-body .dash-kpis { grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px; }
  body.admin-body .kpi { min-height:132px; padding:17px; }
  body.admin-body .kpi__value { font-size:1.9rem; }
  body.admin-body .dash-actions { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:8px; }
  body.admin-body .quick-action { min-height:54px; justify-content:center; padding:10px; text-align:center; }
  body.admin-body .quick-action__ic { display:none; }
  body.admin-body .kds-board { grid-auto-columns:minmax(310px, 37vw); }
  body.admin-body .editor-drawer { width:min(680px, calc(100vw - 88px)); }

  /* Tablet panels use a stable two-column working rhythm rather than a
     desktop table squeezed beneath the navigation rail. */
  body.admin-body .admin-grid-2 { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
  body.admin-body .loyalty-admin-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.admin-body .promo-form__grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.admin-body .admin-tablewrap { overflow-x:auto; overscroll-behavior-inline:contain; }
  body.admin-body .admin-table { min-width:640px; }
  body.admin-body .product-rows { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; }
  body.admin-body .product-row { min-height:72px; }
  body.admin-body .avail-rows { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.admin-body .schedule-slots { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.admin-body .schedule-slot { padding:14px; }
  body.admin-body .schedule-order { grid-template-columns:54px minmax(0, 1fr) auto; }
  body.admin-body .schedule-order .status-pill { display:none; }
  body.admin-body .kds-ticket__btns .btn { min-height:42px; }

  /* Keep header actions and ticket state visible; the header gains a second
     row when the tablet is too narrow instead of discarding controls. */
  body.admin-body .admin-topbar { flex-wrap:wrap; height:auto; min-height:74px; padding-block:9px; }
  body.admin-body .admin-topbar__title { flex:1 1 360px; }
  body.admin-body .admin-topbar__title p { white-space:normal; overflow:visible; text-overflow:clip; }
  body.admin-body .admin-topbar__actions { flex:1 1 100%; order:3; width:100%; overflow-x:auto; padding-top:3px; scrollbar-width:none; }
  body.admin-body .admin-topbar__actions::-webkit-scrollbar { display:none; }
  body.admin-body .admin-topbar__date,
  body.admin-body .admin-jump,
  body.admin-body .admin-topbar__link:last-child { display:flex; }
  body.admin-body .admin-jump { min-height:42px; white-space:nowrap; }
  body.admin-body .schedule-order { grid-template-columns:54px minmax(0, 1fr) auto; }
  body.admin-body .schedule-order .status-pill { display:inline-flex; grid-column:2; justify-self:start; }
  body.admin-body .schedule-order__main small { white-space:normal; overflow:visible; text-overflow:clip; }
  body.admin-body .product-row__main .admin-muted,
  body.admin-body .avail-row__main strong,
  body.admin-body .queue-row__main strong { overflow:visible; white-space:normal; text-overflow:clip; }
}

@media (max-width: 640px) {
  body.admin-body .admin-mobile-nav {
    position:fixed;
    z-index:180;
    right:10px;
    bottom:max(10px, env(safe-area-inset-bottom));
    left:10px;
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:minmax(0, 1fr);
    align-items:stretch;
    min-height:64px;
    padding:5px;
    border:1px solid rgba(44,32,24,.14);
    border-radius:18px;
    background:rgba(255,255,255,.96);
    box-shadow:0 14px 36px rgba(44,32,24,.18);
    backdrop-filter:blur(14px);
  }
  body.admin-body .admin-mobile-nav::before { display:none; }
  body.admin-body .admin-mobile-nav__item {
    min-width:0;
    min-height:52px;
    display:grid;
    place-items:center;
    gap:2px;
    padding:5px 4px;
    border-radius:13px;
    color:var(--ink-soft);
    font-size:10px;
    font-weight:700;
    line-height:1.1;
  }
  body.admin-body .admin-mobile-nav__item svg { width:19px; height:19px; }
  body.admin-body .admin-mobile-nav__item span { overflow:hidden; max-width:100%; text-overflow:ellipsis; white-space:nowrap; }
  body.admin-body .admin-mobile-nav__item.is-active { background:var(--accent); color:#fff; box-shadow:0 4px 10px rgba(44,32,24,.16); }
  body.admin-body .admin-content { padding-bottom:calc(102px + env(safe-area-inset-bottom)); }
  body.admin-body [data-app][data-route="pos"] .pos-mobile-sale { bottom:calc(86px + env(safe-area-inset-bottom)); }

  body.admin-body .admin-topbar {
    background:rgba(255,255,255,.96);
    box-shadow:0 1px 0 rgba(44,32,24,.08), 0 8px 24px rgba(44,32,24,.045);
    backdrop-filter:blur(16px);
  }
  body.admin-body .admin-topbar { height:auto; min-height:72px; flex-wrap:wrap; align-content:center; padding-block:8px; }
  body.admin-body .admin-topbar__title { flex:1 1 220px; }
  body.admin-body .admin-topbar__title h1 { max-width:none; overflow:visible; white-space:normal; text-overflow:clip; letter-spacing:-.02em; }
  body.admin-body .admin-topbar__title p { display:block; overflow:visible; white-space:normal; text-overflow:clip; font-size:12px; line-height:1.35; }
  body.admin-body .admin-topbar__actions { flex:1 1 100%; order:3; width:100%; overflow-x:auto; padding-top:4px; scrollbar-width:none; }
  body.admin-body .admin-topbar__actions::-webkit-scrollbar { display:none; }
  body.admin-body .admin-mode-switch { display:inline-flex; flex:0 0 auto; }
  body.admin-body .admin-mode-switch__button { min-height:38px; padding-inline:9px; }
  body.admin-body .admin-jump { display:flex; min-height:38px; white-space:nowrap; }
  body.admin-body .admin-jump span { display:inline; }
  body.admin-body .admin-topbar__date { display:inline; white-space:nowrap; }
  body.admin-body .store-toggle { max-width:none; font-size:12px; white-space:nowrap; }
  body.admin-body .admin-topbar__actions > .admin-topbar__link:last-child { display:flex; }
  body.admin-body .admin-content[data-busy="true"] { opacity:.7; transition:opacity .14s ease; }
  body.admin-body .admin-content .admin-empty,
  body.admin-body .admin-content .admin-error { border-radius:16px; }
  body.admin-body .admin-tablewrap { position:relative; }
  body.admin-body .admin-tablewrap::after {
    content:"Swipe table";
    position:absolute;
    right:8px;
    bottom:7px;
    padding:4px 7px;
    border-radius:99px;
    background:rgba(44,32,24,.08);
    color:var(--ink-faint);
    font-size:10px;
    font-weight:700;
    pointer-events:none;
  }
  body.admin-body .admin-tablewrap:has(.admin-table tbody:empty)::after { display:none; }

  /* Phone content is deliberately card-led. Dense data remains available in
     an edge-to-edge, first-column-pinned table when a true table is needed. */
  body.admin-body .dash-welcome { margin-bottom:14px; padding:18px; gap:12px; border-radius:16px; }
  body.admin-body .dash-welcome h2 { max-width:16ch; font-size:24px; }
  body.admin-body .dash-welcome p { max-width:31ch; font-size:13px; line-height:1.45; }
  body.admin-body .dash-live { width:100%; grid-template-columns:auto 1fr auto; padding:9px 10px; }
  body.admin-body .dash-live time { grid-column:auto; justify-self:end; }
  body.admin-body .dash-kpis { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:9px; }
  body.admin-body .kpi { min-height:118px; padding:14px; border-radius:14px; }
  body.admin-body .kpi__label { min-height:2.4em; font-size:10px; line-height:1.2; }
  body.admin-body .kpi__value { margin-top:auto; font-size:1.7rem; }
  body.admin-body .kpi__sub { display:block; overflow:visible; text-overflow:clip; white-space:normal; font-size:11px; line-height:1.3; }
  body.admin-body .dash-actions { grid-template-columns:repeat(2, minmax(0, 1fr)); margin-bottom:16px; }
  body.admin-body .quick-action { min-height:54px; padding:10px; font-size:13px; }
  body.admin-body .quick-action__ic { display:inline-flex; flex:0 0 auto; }
  body.admin-body .quick-action:last-child { grid-column:1 / -1; }
  body.admin-body .dash-grid, body.admin-body .dash-side { gap:14px; }
  body.admin-body .dash-health, body.admin-body .dash-queue { padding:16px; }
  body.admin-body .queue-row { grid-template-columns:auto minmax(0, 1fr) auto; gap:9px; padding:11px; }
  body.admin-body .queue-row__no { min-width:58px; font-size:12px; }
  body.admin-body .queue-row__status { display:inline-flex; grid-column:2; grid-row:2; justify-self:start; font-size:10px; }
  body.admin-body .queue-row__time { grid-column:3; grid-row:1 / span 2; font-size:11px; }
  body.admin-body .health-row { align-items:flex-start; min-height:58px; padding:11px 0; }
  body.admin-body .health-row span { line-height:1.4; }

  body.admin-body .admin-section { margin-top:24px; }
  body.admin-body .admin-section__head { margin-bottom:14px; padding-bottom:12px; }
  body.admin-body .admin-section__head h3, body.admin-body .admin-card h3 { font-size:16px; }
  body.admin-body .admin-grid-2 { grid-template-columns:1fr; gap:12px; }
  body.admin-body .stat-tiles, body.admin-body .loyalty-stat-tiles { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:9px; }
  body.admin-body .stat-tile { min-height:98px; padding:14px; }
  body.admin-body .stat-tile strong { font-size:1.45rem; }
  body.admin-body .promo-form { gap:16px; }
  body.admin-body .promo-form button[type="submit"] { width:100%; justify-content:center; }
  body.admin-body .field textarea { min-height:120px; }
  body.admin-body .field select[multiple] { min-height:120px; }

  body.admin-body .admin-tablewrap { margin-inline:-12px; border-right:0; border-left:0; border-radius:0; }
  body.admin-body .admin-table { min-width:560px; }
  body.admin-body .admin-table th:first-child,
  body.admin-body .admin-table td:first-child { position:sticky; left:0; z-index:1; background:var(--paper-raised); box-shadow:8px 0 14px -16px rgba(44,32,24,.75); }
  body.admin-body .admin-table th:first-child { background:var(--paper-sunken); }
  body.admin-body .admin-table--rows tbody tr:hover td:first-child { background:var(--paper-raised); }
  body.admin-body .admin-table th, body.admin-body .admin-table td { padding:12px 10px; }
  body.admin-body .table-actions { gap:6px; white-space:normal; }
  body.admin-body .table-actions .btn { padding-inline:10px; }

  body.admin-body .product-group { margin-bottom:22px; }
  body.admin-body .product-group__title { position:sticky; top:0; z-index:7; margin:0 -12px 10px; padding:10px 12px; background:var(--paper); }
  body.admin-body .product-rows { gap:8px; }
  body.admin-body .product-row { min-height:66px; gap:9px; padding:10px; border-radius:13px; }
  body.admin-body .product-row__handle { width:16px; font-size:18px; }
  body.admin-body .product-row__thumb { width:46px; height:46px; }
  body.admin-body .product-row__main strong { font-size:14px; }
  body.admin-body .product-row__main .admin-muted { overflow:visible; white-space:normal; text-overflow:clip; font-size:12px; }
  body.admin-body .product-row__price { font-size:13px; }
  body.admin-body .product-row .btn, body.admin-body .product-row .icon-btn { min-width:40px; min-height:40px; }

  body.admin-body .avail-bar { display:grid; grid-template-columns:1fr; gap:10px; }
  body.admin-body .avail-scope { justify-content:space-between; min-height:46px; padding:0 12px; border:1px solid var(--hairline); border-radius:12px; background:var(--paper-raised); }
  body.admin-body .avail-scope select { flex:1; max-width:74%; border:0; background:transparent; text-align:right; }
  body.admin-body .avail-hint { padding:10px 12px; border-radius:10px; background:var(--paper-sunken); font-size:12px; line-height:1.45; }
  body.admin-body .avail-group { margin-bottom:24px; }
  body.admin-body .avail-group__head { align-items:center; }
  body.admin-body .avail-group__head .btn { min-height:38px; padding-inline:10px; }
  body.admin-body .avail-rows { grid-template-columns:1fr; gap:8px; }
  body.admin-body .avail-row { min-height:64px; padding:10px; border-radius:13px; }
  body.admin-body .avail-row__thumb { width:44px; height:44px; }
  body.admin-body .avail-row__main strong { overflow:visible; white-space:normal; text-overflow:clip; }
  body.admin-body .avail-row__state { display:block; font-size:10px; }

  body.admin-body .schedule-head { margin-bottom:16px; }
  body.admin-body .schedule-head h2 { font-size:24px; }
  body.admin-body .schedule-days { gap:7px; margin-bottom:12px; }
  body.admin-body .schedule-day { min-height:72px; padding:10px; }
  body.admin-body .schedule-day strong { font-size:14px; }
  body.admin-body .schedule-summary { margin-bottom:14px; }
  body.admin-body .schedule-slots { gap:9px; }
  body.admin-body .schedule-slot { padding:12px; }
  body.admin-body .schedule-order { min-height:58px; grid-template-columns:48px minmax(0,1fr) auto; }
  body.admin-body .schedule-order__total { font-size:12px; }
  body.admin-body .schedule-order .status-pill { display:inline-flex; grid-column:2; justify-self:start; }
  body.admin-body .schedule-order__main small { overflow:visible; white-space:normal; text-overflow:clip; }
  body.admin-body .schedule-blackouts-card { padding:14px; }

  body.admin-body .kds-toolbar { margin-bottom:12px; }
  body.admin-body .kds-status { margin-bottom:12px; }
  body.admin-body .kds-board { grid-auto-columns:minmax(288px, 84vw); }
  body.admin-body .kds-lane { padding:10px; min-height:350px; }
  body.admin-body .kds-lane__head { padding:6px 4px 10px; }
  body.admin-body .kds-ticket { padding:13px; }
  body.admin-body .kds-ticket__items li { font-size:14px; }
  body.admin-body .kds-ticket__outlet,
  body.admin-body .kds-item em { overflow:visible; white-space:normal; text-overflow:clip; }
  body.admin-body .kds-ticket__foot { align-items:stretch; flex-direction:column; }
  body.admin-body .kds-ticket__btns { display:grid; grid-template-columns:1fr 1fr; }
  body.admin-body .kds-ticket__btns .btn { width:100%; min-height:44px; justify-content:center; }
}

/* Final phone cascade: operational records must never revert to a clipped,
   pinned-column table after a panel repaints (search, sort, or live updates). */
@media (max-width: 640px) {
  body.admin-body .admin-table[data-responsive-cards="true"] td {
    position:relative;
    left:auto;
    z-index:auto;
    min-width:0;
    padding:11px 12px 11px 108px;
    background:transparent !important;
    box-shadow:none !important;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] th:first-child,
  body.admin-body .admin-table[data-responsive-cards="true"] td:first-child {
    position:relative;
    left:auto;
    z-index:auto;
    box-shadow:none;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] td[colspan] {
    padding:20px 12px;
    text-align:left;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] td[colspan]::before { display:none; }
  body.admin-body .admin-table[data-responsive-cards="true"] td > * {
    max-width:100%;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] .status-pill,
  body.admin-body .admin-table[data-responsive-cards="true"] .product-tag,
  body.admin-body .admin-table[data-responsive-cards="true"] .cust-repeat {
    max-width:100%;
    white-space:normal;
  }
}

/* Tablets have enough room to show the fields side-by-side, but not enough
   room for a desktop data grid. Keep every field visible in a record card. */
@media (min-width: 641px) and (max-width: 1024px) {
  body.admin-body .admin-tablewrap:has(.admin-table[data-responsive-cards="true"]) {
    overflow:visible;
    border:0;
    background:transparent;
    box-shadow:none;
  }
  body.admin-body .admin-tablewrap:has(.admin-table[data-responsive-cards="true"])::after { display:none; }
  body.admin-body .admin-table[data-responsive-cards="true"] {
    display:block;
    min-width:0;
    width:100%;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] thead {
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    clip-path:inset(50%);
    white-space:nowrap;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] tbody { display:grid; gap:12px; }
  body.admin-body .admin-table[data-responsive-cards="true"] tbody tr {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    overflow:hidden;
    border:1px solid var(--hairline);
    border-radius:16px;
    background:var(--paper-raised);
    box-shadow:0 6px 16px rgba(44,32,24,.04);
  }
  body.admin-body .admin-table[data-responsive-cards="true"] td {
    position:relative;
    left:auto;
    z-index:auto;
    min-width:0;
    min-height:66px;
    padding:29px 14px 12px;
    border-right:1px solid var(--hairline);
    border-bottom:1px solid var(--hairline);
    background:transparent !important;
    box-shadow:none !important;
    overflow-wrap:anywhere;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] td:nth-child(2n) { border-right:0; }
  body.admin-body .admin-table[data-responsive-cards="true"] td::before {
    content:attr(data-label);
    position:absolute;
    top:11px;
    left:14px;
    color:var(--ink-faint);
    font-size:10px;
    font-weight:800;
    letter-spacing:.06em;
    line-height:1.2;
    text-transform:uppercase;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] td:first-child,
  body.admin-body .admin-table[data-responsive-cards="true"] td:has(.table-actions),
  body.admin-body .admin-table[data-responsive-cards="true"] td[colspan] {
    grid-column:1 / -1;
  }
  body.admin-body .admin-table[data-responsive-cards="true"] td:first-child { background:rgba(44,32,24,.025) !important; }
  body.admin-body .admin-table[data-responsive-cards="true"] td:has(.table-actions) { min-height:58px; padding:10px 14px; border-right:0; border-bottom:0; }
  body.admin-body .admin-table[data-responsive-cards="true"] td:has(.table-actions)::before,
  body.admin-body .admin-table[data-responsive-cards="true"] td[colspan]::before { display:none; }
  body.admin-body .admin-table[data-responsive-cards="true"] td:has(.table-actions) .table-actions { justify-content:flex-end; }
  body.admin-body .admin-table[data-responsive-cards="true"] td[colspan] { min-height:0; padding:20px 14px; border:0; }
}

/* Content-led operational rows. These preserve the same controls while
   giving names, pricing, fulfilment notes, and status their own room. */
@media (max-width: 640px) {
  body.admin-body .product-row {
    display:grid;
    grid-template-columns:18px 48px minmax(0, 1fr) auto;
    align-items:start;
    gap:10px;
  }
  body.admin-body .product-row__handle { grid-row:1 / span 2; align-self:center; }
  body.admin-body .product-row__thumb { grid-row:1 / span 2; width:48px; height:48px; }
  body.admin-body .product-row__main { min-width:0; padding-top:1px; }
  body.admin-body .product-row__main strong {
    display:block;
    overflow-wrap:anywhere;
    line-height:1.3;
  }
  body.admin-body .product-row__main .admin-muted {
    display:block;
    margin-top:4px;
    overflow:visible;
    text-overflow:clip;
    white-space:normal;
    line-height:1.4;
  }
  body.admin-body .product-row__price { align-self:start; padding-top:2px; }
  body.admin-body .product-row > .admin-switch,
  body.admin-body .product-row > .admin-muted:last-of-type { align-self:center; }
  body.admin-body .product-row__actions {
    grid-column:2 / -1;
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:8px;
    width:100%;
    padding-top:9px;
    border-top:1px solid var(--hairline);
  }

  body.admin-body .avail-row {
    display:grid;
    grid-template-columns:44px minmax(0, 1fr) auto;
    align-items:center;
    gap:10px;
  }
  body.admin-body .avail-row__thumb { grid-row:1 / span 2; width:44px; height:44px; }
  body.admin-body .avail-row__main { min-width:0; }
  body.admin-body .avail-row__main strong {
    overflow:visible;
    text-overflow:clip;
    white-space:normal;
    line-height:1.3;
  }
  body.admin-body .avail-row__main .admin-muted { display:block; margin-top:3px; }
  body.admin-body .avail-row__state {
    display:block;
    grid-column:2;
    grid-row:2;
    align-self:start;
    white-space:normal;
  }
  body.admin-body .avail-row .admin-switch { grid-column:3; grid-row:1 / span 2; }

  body.admin-body .schedule-order__main strong,
  body.admin-body .schedule-order__main small,
  body.admin-body .kds-ticket__who,
  body.admin-body .kds-ticket__note,
  body.admin-body .kds-item strong,
  body.admin-body .kds-item em,
  body.admin-body .kds-upcoming__detail span {
    overflow:visible;
    text-overflow:clip;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  body.admin-body .schedule-order__main small { line-height:1.35; }
  body.admin-body .kds-ticket__meta { flex-wrap:wrap; row-gap:6px; }
  body.admin-body .kds-ticket__items li { align-items:flex-start; }
  body.admin-body .kds-item { min-width:0; }
}

@media (max-width: 640px) {
  body.admin-body .product-row { grid-template-columns:16px 44px minmax(0, 1fr) auto; padding:12px 10px; }
  body.admin-body .product-row__thumb { width:44px; height:44px; }
  body.admin-body .product-row__price { font-size:14px; }
  body.admin-body .product-row__actions { grid-column:1 / -1; justify-content:stretch; }
  body.admin-body .product-row__actions .btn { flex:1 1 120px; justify-content:center; }
  body.admin-body .avail-row { padding:11px; }
  body.admin-body .avail-row__state { font-size:11px; }
  body.admin-body .schedule-order { align-items:start; }
  body.admin-body .schedule-order__total { padding-top:1px; }
}

/* ========================================================================
   Storefront app shell. Intentionally scoped below the desktop breakpoint:
   desktop retains the authored editorial navigation and page composition.
   ======================================================================== */
@media (max-width: 1024px) {
  body.lp .mobile-order-dock {
    position:fixed;
    z-index:185;
    right:clamp(12px, 2vw, 20px);
    bottom:max(12px, env(safe-area-inset-bottom));
    left:clamp(12px, 2vw, 20px);
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    align-items:center;
    min-height:66px;
    padding:5px;
    border:1px solid rgba(44,32,24,.14);
    border-radius:18px;
    background:rgba(255,253,249,.97);
    box-shadow:0 14px 34px rgba(44,32,24,.18);
    backdrop-filter:blur(14px);
  }
  body.lp .mobile-order-dock__item {
    min-width:0;
    min-height:54px;
    display:grid;
    place-items:center;
    gap:3px;
    padding:6px 4px;
    border-radius:13px;
    color:var(--ui-muted);
    font-size:10px;
    font-weight:700;
    line-height:1.1;
  }
  body.lp .mobile-order-dock__item svg { width:19px; height:19px; }
  body.lp .mobile-order-dock__item.is-active { background:var(--ui-espresso); color:#fff; box-shadow:0 4px 10px rgba(44,32,24,.16); }
  body.lp .mobile-cart-summary {
    position:fixed;
    z-index:184;
    right:clamp(12px, 2vw, 20px);
    bottom:calc(90px + env(safe-area-inset-bottom));
    left:clamp(12px, 2vw, 20px);
    min-height:58px;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto auto;
    align-items:center;
    gap:10px;
    padding:9px 13px 9px 10px;
    border:1px solid rgba(255,255,255,.15);
    border-radius:16px;
    background:var(--ui-espresso);
    color:var(--sb-cafe-cream);
    box-shadow:0 12px 28px rgba(44,32,24,.24);
    text-align:left;
  }
  body.lp .mobile-cart-summary[hidden] { display:none; }
  body.lp .mobile-cart-summary__icon { display:grid; place-items:center; width:38px; height:38px; border-radius:11px; background:rgba(255,255,255,.11); }
  body.lp .mobile-cart-summary__icon svg { width:20px; height:20px; }
  body.lp .mobile-cart-summary__copy { display:grid; gap:2px; min-width:0; }
  body.lp .mobile-cart-summary__copy b { font-size:13px; line-height:1.1; }
  body.lp .mobile-cart-summary__copy small { color:var(--sb-cafe-latte-100); font-size:10px; font-weight:650; }
  body.lp .mobile-cart-summary > strong { font-size:14px; white-space:nowrap; }
  body.lp .mobile-cart-summary__arrow { display:grid; place-items:center; width:25px; height:25px; border-radius:99px; background:var(--ui-peach); color:var(--ui-espresso); font-size:15px; font-weight:800; }

  body.lp:has(.mobile-order-dock) .lp-foot { padding-bottom:calc(104px + env(safe-area-inset-bottom)); }
  body.lp:has(.mobile-cart-summary:not([hidden])) .lp-foot,
  body.lp:has(.mobile-cart-summary:not([hidden])) .menu-body,
  body.lp:has(.mobile-cart-summary:not([hidden])) .outlets-list,
  body.lp:has(.mobile-cart-summary:not([hidden])) .account-body { padding-bottom:calc(178px + env(safe-area-inset-bottom)); }

  body.lp .menu-hero .filter-row {
    position:sticky;
    z-index:20;
    top:68px;
    padding-block:10px;
    margin-bottom:-10px;
    background:var(--ui-espresso);
  }
  body.lp .menu-hero .filter-row::after { content:""; flex:0 0 6px; }
  body.lp .filter-pill { min-height:44px; }
  body.lp .menu-body .drink-grid { gap:20px 16px; }
  body.lp .drink-card .add-btn { min-width:44px; min-height:44px; }
  body.lp .cart-drawer { width:min(480px, 78vw); }
  body.lp .item-modal__footer { box-shadow:0 -12px 24px rgba(28,26,22,.08); }
  body.lp .checkout-card { border-radius:16px; }
}

@media (min-width: 641px) and (max-width: 1024px) {
  body.lp .menu-hero .filter-row { top:70px; }
  body.lp .menu-body .drink-grid { grid-template-columns:repeat(3, minmax(0, 1fr)); gap:26px 18px; }
  body.lp .checkout-grid { grid-template-columns:minmax(0, 1.08fr) minmax(270px, .92fr); gap:22px; }
  body.lp .order-summary,
  body.lp .order-summary .checkout-card { position:sticky; top:88px; }
  body.lp .outlet { grid-template-columns:minmax(250px,.9fr) minmax(0,1.1fr); }
}

@media (max-width: 640px) {
  body.lp .mobile-order-dock { min-height:64px; }
  body.lp .mobile-cart-summary { bottom:calc(86px + env(safe-area-inset-bottom)); }
  body.lp .menu-hero .filter-row { top:64px; margin-inline:-18px; padding-inline:18px; scroll-padding-inline:18px; overflow-x:auto; flex-wrap:nowrap; scrollbar-width:none; }
  body.lp .menu-hero .filter-row::-webkit-scrollbar { display:none; }
  body.lp .menu-hero .filter-pill { flex:0 0 auto; }
  body.lp .menu-body .drink-grid { grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px 12px; }
  body.lp .drink-card__body { padding:13px 2px 0; }
  body.lp .item-modal { width:100%; max-height:calc(100dvh - env(safe-area-inset-top)); border-radius:22px 22px 0 0; }
  body.lp .item-modal__footer { padding-bottom:calc(14px + env(safe-area-inset-bottom)); }
  body.lp .cart-drawer {
    top:auto;
    right:0;
    bottom:0;
    left:0;
    width:100vw;
    height:min(88dvh, 760px);
    max-height:calc(100dvh - env(safe-area-inset-top));
    border-radius:22px 22px 0 0;
    transform:translateY(104%);
  }
  body.lp .cart-drawer.is-open { transform:translateY(0); }
  body.lp .checkout-body { padding-bottom:calc(104px + env(safe-area-inset-bottom)); }
  body.lp [data-place-order] { bottom:calc(10px + env(safe-area-inset-bottom)); }
}

/* Storefront responsive ownership. These rules intentionally come last so
   older visual passes cannot create a tablet navigation gap or let the phone
   dock cover the opening hero. */
@media (min-width: 641px) and (max-width: 1024px) {
  body.lp .lp-nav .nav-toggle { display:inline-flex !important; }
}

@media (max-width: 640px) {
  body.lp .hero { padding-bottom:calc(104px + env(safe-area-inset-bottom)) !important; }
  body.lp .lp-foot a { display:inline-flex; align-items:center; min-height:44px; }
}

/* ========================================================================
   Desktop storefront app dock. The dock remains a bottom-edge control at
   every supported size; the top bar is only the brand and bag utility surface.
   ======================================================================== */
@media (min-width: 1025px) {
  body.lp .lp-nav {
    position:sticky;
    top:0;
    z-index:150;
    min-height:72px;
    background:rgba(44,32,24,.97) !important;
    box-shadow:0 1px 0 rgba(255,255,255,.07);
    backdrop-filter:blur(16px);
  }
  body.lp .lp-nav__row {
    grid-template-columns:1fr auto;
    max-width:none;
    min-height:72px;
    padding-inline:clamp(24px, 4vw, 64px);
  }
  body.lp .lp-nav__left,
  body.lp .lp-nav__right [data-account-link] { display:none; }
  body.lp .lp-nav__brand { grid-column:1; justify-self:start; }
  body.lp .lp-nav__right { grid-column:2; justify-self:end; }
  body.lp .lp-nav__right .lp-ico { width:44px; height:44px; }

  /* The sticky desktop bar already occupies its own row. Do not reserve that
     same vertical space again inside every page hero. */
  body.lp.lp-home .hero {
    padding:clamp(40px, 4vw, 56px) clamp(28px, 8vw, 120px) 36px !important;
  }
  body.lp.lp-home .hero__copy { padding-top:0; }
  body.lp .menu-hero,
  body.lp .outlets-hero,
  body.lp .account-hero,
  body.lp .checkout-hero {
    padding-top:clamp(44px, 4vw, 64px) !important;
  }
  body.lp .about-story { padding-block:clamp(48px, 6vw, 80px); }

  /* A concise welcome keeps the ordering surface in the opening viewport. */
  body.lp.lp-home .hero {
    min-height:min(560px, calc(100svh - 72px)) !important;
    padding-block:28px !important;
  }
  body.lp.lp-home .hero__big { font-size:clamp(3.45rem, 5.2vw, 5.4rem) !important; }
  body.lp.lp-home .hero__visual { min-height:360px !important; }
  body.lp.lp-home .hero__drink { width:min(30vw, 420px) !important; }
  body.lp.lp-home .order-ribbon { padding-block:20px; }
  body.lp.lp-home .order-ribbon__actions a { min-height:62px; }

  body.lp .mobile-order-dock {
    position:fixed;
    z-index:185;
    bottom:max(20px, env(safe-area-inset-bottom));
    left:50%;
    width:min(660px, calc(100vw - 48px));
    min-height:68px;
    margin:0;
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    align-items:center;
    padding:6px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:20px;
    background:rgba(44,32,24,.97);
    box-shadow:0 18px 48px rgba(44,32,24,.28);
    backdrop-filter:blur(18px);
    transform:translateX(-50%);
  }
  body.lp .mobile-order-dock__item {
    min-width:0;
    min-height:54px;
    display:grid;
    place-items:center;
    gap:4px;
    padding:6px 10px;
    border-radius:14px;
    color:#dacdbf;
    font-size:11px;
    font-weight:700;
    line-height:1.1;
    transition:background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
  }
  body.lp .mobile-order-dock__item svg { width:20px; height:20px; }
  body.lp .mobile-order-dock__item:hover { background:rgba(255,255,255,.09); color:#fffaf3; }
  body.lp .mobile-order-dock__item.is-active { background:var(--sb-cafe-latte-200); color:var(--sb-cafe-espresso); box-shadow:0 4px 12px rgba(0,0,0,.16); }

  body.lp .mobile-cart-summary {
    position:fixed;
    z-index:184;
    bottom:calc(104px + env(safe-area-inset-bottom));
    left:50%;
    width:min(320px, calc(100vw - 48px));
    min-height:58px;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto auto;
    align-items:center;
    gap:10px;
    padding:9px 13px 9px 10px;
    transform:translateX(-50%);
    border:1px solid rgba(255,255,255,.16);
    border-radius:16px;
    background:#24332f;
    color:var(--sb-cafe-cream);
    box-shadow:0 14px 32px rgba(36,51,47,.24);
    text-align:left;
  }
  body.lp .mobile-cart-summary[hidden] { display:none; }
  body.lp .mobile-cart-summary__icon { display:grid; place-items:center; width:38px; height:38px; border-radius:11px; background:rgba(255,255,255,.11); }
  body.lp .mobile-cart-summary__icon svg { width:20px; height:20px; }
  body.lp .mobile-cart-summary__copy { display:grid; gap:2px; min-width:0; }
  body.lp .mobile-cart-summary__copy b { font-size:13px; line-height:1.1; }
  body.lp .mobile-cart-summary__copy small { color:#c7d9d1; font-size:10px; font-weight:650; }
  body.lp .mobile-cart-summary > strong { font-size:14px; white-space:nowrap; }
  body.lp .mobile-cart-summary__arrow { display:grid; place-items:center; width:25px; height:25px; border-radius:99px; background:var(--sb-cafe-latte-200); color:var(--sb-cafe-espresso); font-size:15px; font-weight:800; }

  /* Keep the final footer actions clear of the persistent bottom dock. */
  body.lp:has(.mobile-order-dock) .lp-foot {
    padding-bottom:120px;
  }
}

@media (min-width: 1220px) {
  body.lp .mobile-cart-summary {
    bottom:calc(104px + env(safe-area-inset-bottom));
    left:50%;
    width:280px;
    transform:translateX(-50%);
  }
}

/* ========================================================================
   Responsive UI contract

   This is the only compatibility layer that sits after the route-specific
   responsive passes above. It deliberately owns shared containment, fixed
   surface clearance, and long-data handling; page art remains in its route
   stylesheet. Keep new cross-route responsive fixes here instead of adding a
   further "final" cascade elsewhere.
   ======================================================================== */

body.lp .lp-nav,
body.lp .lp-menu,
body.lp .mobile-order-dock,
body.lp .mobile-cart-summary,
body.admin-body .admin-topbar,
body.admin-body .admin-mobile-nav,
body.admin-body .pos-mobile-sale {
  isolation:isolate;
}

@media (max-width: 1024px) {
  /* Every flexible child that can contain CMS, address, or provider text is
     allowed to shrink before it can widen the document. */
  body.lp .lp-nav__row > *,
  body.lp .hero > *,
  body.lp .order-ribbon > *,
  body.lp .outlet > *,
  body.lp .checkout-grid > *,
  body.lp .account-dashboard-grid > *,
  body.admin-body .admin-topbar > *,
  body.admin-body .admin-toolbar > *,
  body.admin-body .admin-card__head > *,
  body.admin-body .admin-section__head > *,
  body.admin-body .dash-grid > *,
  body.admin-body .pos-shell > * {
    min-width:0;
  }

  body.lp .mobile-order-dock,
  body.lp .mobile-cart-summary,
  body.admin-body .admin-mobile-nav,
  body.admin-body .pos-mobile-sale {
    max-width:calc(100vw - 20px);
  }

  body.lp .cart-drawer,
  body.lp .item-modal,
  body.admin-body .editor-drawer,
  body.admin-body .pos-modifier-dialog {
    max-width:100vw;
  }

  body.admin-body .admin-tablewrap,
  body.admin-body .kds-board,
  body.admin-body .schedule-days,
  body.admin-body .pos-categories {
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
  }
}

@media (min-width: 641px) and (max-width: 1024px) {
  /* The tablet rail is deliberately outside the reading column. Drawers and
     editor surfaces never slide beneath it. */
  body.admin-body .editor-drawer {
    width:min(680px, calc(100vw - 88px));
  }

  body.admin-body .admin-topbar__actions {
    min-width:0;
    scrollbar-width:thin;
  }

  body.lp .cart-drawer__items,
  body.admin-body .editor-body,
  body.admin-body .pos-modifier-dialog__body {
    min-width:0;
  }
}

@media (max-width: 640px) {
  /* Fixed storefront surfaces form one vertical stack: live cart, route dock,
     then the device inset. Content reserves this exact stack at its end. */
  body.lp .mobile-order-dock {
    z-index:185;
    bottom:max(10px, env(safe-area-inset-bottom));
  }

  body.lp .mobile-cart-summary {
    z-index:186;
    bottom:calc(84px + env(safe-area-inset-bottom));
  }

  body.lp:has(.mobile-order-dock) .lp-foot {
    padding-bottom:calc(102px + env(safe-area-inset-bottom));
  }

  body.lp:has(.mobile-cart-summary:not([hidden])) .menu-body,
  body.lp:has(.mobile-cart-summary:not([hidden])) .outlets-list,
  body.lp:has(.mobile-cart-summary:not([hidden])) .account-body,
  body.lp:has(.mobile-cart-summary:not([hidden])) .lp-foot {
    padding-bottom:calc(174px + env(safe-area-inset-bottom));
  }

  body.lp .checkout-body {
    padding-bottom:calc(112px + env(safe-area-inset-bottom));
  }

  body.lp .cart-drawer {
    z-index:230;
    height:min(88dvh, 760px);
  }

  body.lp .item-modal,
  body.lp .modal-overlay {
    z-index:240;
  }

  body.lp .cart-line > *,
  body.lp .field-row > *,
  body.lp .checkout-inline-actions > *,
  body.lp .account-head__actions > *,
  body.lp .order-history-item > *,
  body.lp .track-layout > * {
    min-width:0;
  }

  body.lp .cart-line__name,
  body.lp .cart-line__mods,
  body.lp .order-history-item__main,
  body.lp .track-status-panel,
  body.lp .outlet__body,
  body.lp .field-hint {
    overflow-wrap:anywhere;
  }

  body.lp .segmented button,
  body.lp .checkout-inline-actions .btn,
  body.lp .account-head__actions .btn {
    min-width:0;
  }

  /* Admin fixed surfaces use distinct layers. The sale rail must clear the
     command rail, while drawers and editors remain safely above both. */
  body.admin-body .admin-mobile-nav { z-index:180; }
  body.admin-body [data-app][data-route="pos"] .pos-mobile-sale {
    z-index:190;
    bottom:calc(86px + env(safe-area-inset-bottom));
  }
  body.admin-body .admin-side,
  body.admin-body .admin-scrim { z-index:220; }
  body.admin-body .editor-overlay,
  body.admin-body .pos-modifier-modal { z-index:240; }

  body.admin-body .admin-content {
    padding-bottom:calc(108px + env(safe-area-inset-bottom));
  }

  body.admin-body .admin-topbar__actions,
  body.admin-body .table-actions,
  body.admin-body .email-health-actions,
  body.admin-body .integration-test {
    min-width:0;
  }

  body.admin-body .admin-inline-search,
  body.admin-body .integration-secret input,
  body.admin-body .integration-endpoint,
  body.admin-body .integration-endpoint code,
  body.admin-body .field-hint {
    max-width:100%;
    min-width:0;
    overflow-wrap:anywhere;
  }

  body.admin-body .admin-table[data-responsive-cards="true"] td,
  body.admin-body .admin-table[data-responsive-cards="true"] td > * {
    min-width:0;
    max-width:100%;
    overflow-wrap:anywhere;
  }

  body.admin-body .admin-table[data-responsive-cards="true"] .table-actions {
    justify-content:flex-start;
  }

  body.admin-body .product-row__main,
  body.admin-body .avail-row__main,
  body.admin-body .schedule-order__main,
  body.admin-body .queue-row__main,
  body.admin-body .kds-item,
  body.admin-body .kds-ticket__items {
    min-width:0;
  }

  body.admin-body .product-row__main strong,
  body.admin-body .avail-row__main strong,
  body.admin-body .schedule-order__main strong,
  body.admin-body .queue-row__main strong,
  body.admin-body .kds-ticket__outlet,
  body.admin-body .kds-ticket__who,
  body.admin-body .kds-ticket__note {
    overflow-wrap:anywhere;
  }

  body.admin-body .editor-drawer,
  body.admin-body .pos-modifier-dialog {
    width:100%;
    max-height:calc(100dvh - env(safe-area-inset-top));
  }

  body.admin-body .editor-body,
  body.admin-body .pos-modifier-dialog__body {
    min-height:0;
    overflow:auto;
  }
}