/*! ROU guest screens (order page + pay) — GENERATED for the landing mockup.
 *  Regenerate with build-order-preview-css.py after updating
 *  plugins/rou-core/assets/css/{rou-guest-tokens,rou-order-shell,rou-confirmed}.css
 */
.rou-order-preview :is(.rou-order-shell, .rou-confirmed-shell) {
    --rou-primary:        #D90F32;
    --rou-primary-dark:   #B00D29;
    --rou-primary-light:  #FF4D6A;
    --rou-secondary:      #F97316;
    --rou-secondary-dark: #EA580C;
    --rou-accent:         #84CC16;
    --rou-accent-dark:    #65A30D;
    --rou-accent-soft:    rgba(132, 204, 22, 0.12);
    --rou-cream:          #FFF7ED;
    --rou-cream-soft:     #FFFCF5;
    --rou-surface:        #FFFFFF;
    --rou-surface-muted:  #F8F8F7;
    --rou-border:         #E5E7EB;
    --rou-border-strong:  rgba(0, 0, 0, 0.12);
    --rou-text:           #3F3F46;
    --rou-text-strong:    #1E1E1E;
    --rou-text-light:     #71717A;
    --rou-text-muted:     #9CA3AF;
    --rou-success:        #16A34A;
    --rou-warning:        #F59E0B;
    --rou-danger:         #DC2626;
    --rou-info:           #0284C7;
    --rou-gold:           #D4AF37;
    --rou-font-display:   'Poppins', 'Inter', 'Noto Sans SC', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --rou-font-body:      'Poppins', 'Inter', 'Noto Sans SC', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --rou-radius-xs: 4px;
    --rou-radius-sm: 8px;
    --rou-radius:    12px;
    --rou-radius-lg: 16px;
    --rou-shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.06);
    --rou-shadow:    0 4px 14px rgba(0, 0, 0, 0.08);
    --rou-shadow-lg: 0 20px 40px rgba(217, 15, 50, 0.15);
}
.rou-order-preview :is(.rou-order-shell, .rou-confirmed-shell) {
  --c-bg:var(--rou-cream,#FFF7ED);
  --c-surface:var(--rou-surface,#FFFFFF);
  --c-text:var(--rou-text,#3F3F46);
  --c-muted:var(--rou-text-light,#71717A);
  --c-border:color-mix(in srgb, var(--c-text) 12%, transparent);
  --c-accent:var(--rou-primary,#D90F32);
  --c-on-accent:#FFFFFF;
  --c-accent-light:color-mix(in srgb, var(--c-accent) 12%, var(--c-surface));
  --c-accent-hover:var(--rou-primary-dark,#B00D29);
  --c-dark:var(--rou-text-strong,#1E1E1E);
  --c-dark-mid:#3a3a3c;
  --c-success:var(--rou-success,#16a34a);
  --c-danger:var(--rou-danger,#dc2626);
  --c-qty-bg:color-mix(in srgb, var(--c-text) 6%, transparent);
  --c-warm:var(--rou-cream-soft,#FFFCF5);
  --font-body:var(--rou-font-body,'Poppins',system-ui,-apple-system,sans-serif);
  --font-display:var(--rou-font-display,'Poppins',system-ui,-apple-system,sans-serif);
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-7:32px;
  --content-max:100%;
  --radius:999px;
  --radius-card:1.25rem;
  --radius-input:999px;
  --shadow:0 1px 4px rgba(26,26,26,0.05);
  --shadow-lg:0 16px 40px rgba(26,26,26,0.12);
  --rou-ui-radius-sm:1.25rem;
  --rou-header-sticky-offset:7.25rem;
  --rou-browse-search-h:0px;
  --rou-scroll-anchor-pad:calc(env(safe-area-inset-top,0px) + var(--rou-header-sticky-offset) + var(--rou-browse-search-h));
  --rou-text-body:15px;--rou-text-sm:14px;--rou-text-caption:12px;--rou-text-micro:11px;--rou-text-title:18px;--rou-text-figure:1.05rem;
  --rou-leading-tight:1.25;--rou-leading-snug:1.4;--rou-leading-body:1.5;
  --rou-touch:44px;--rou-gap-tight:var(--sp-2);--rou-gap:var(--sp-3);--rou-gap-block:var(--sp-4);--rou-gap-section:var(--sp-6);
  --rou-page-inline:max(1rem,env(safe-area-inset-left,0px));
  --rou-page-inline-right:max(1rem,env(safe-area-inset-right,0px));
}
.rou-order-preview * {box-sizing:border-box;margin:0;padding:0}
.rou-order-preview :is(.rou-order-shell, .rou-confirmed-shell) {scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:var(--rou-scroll-anchor-pad)}
.rou-order-preview .rou-order-shell {
  --c-bg:var(--rou-cream,#FFF7ED);
  --c-surface:var(--rou-surface,#FFFFFF);
  --c-text:var(--rou-text,#3F3F46);
  --c-muted:var(--rou-text-light,#71717A);
  --c-border:color-mix(in srgb, var(--c-text) 12%, transparent);
  --c-accent:var(--rou-primary,#D90F32);
  --c-on-accent:#FFFFFF;
  --c-accent-light:color-mix(in srgb, var(--c-accent) 12%, var(--c-surface));
  --c-accent-hover:var(--rou-primary-dark,#B00D29);
  --c-dark:var(--rou-text-strong,#1E1E1E);
  font-family:var(--font-body);background:var(--c-bg);color:var(--c-text);font-size:var(--rou-text-body);line-height:var(--rou-leading-body);padding-bottom:calc(7.5rem + env(safe-area-inset-bottom,0px));touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;overflow-x:hidden
}
.rou-order-preview .rou-order-frame {width:100%;max-width:none;margin:0;min-height:100%;background:var(--c-surface)}
.rou-order-preview .rou-header {position:sticky;top:0;z-index:40;border-bottom:1px solid color-mix(in srgb, var(--c-border) 70%, transparent);background:color-mix(in srgb, var(--c-surface) 95%, transparent);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);color:var(--c-text);padding:max(1rem,env(safe-area-inset-top,0px)) var(--rou-page-inline-right) 0 var(--rou-page-inline)}
.rou-order-preview .rou-header-inner {display:flex;flex-direction:column;gap:0}
.rou-order-preview .rou-header-top {display:flex;align-items:center;gap:0.75rem;min-width:0;padding-bottom:0.75rem}
.rou-order-preview .rou-order-mark {display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;flex:0 0 auto;border-radius:50%;border:1px solid var(--c-border);background:color-mix(in srgb, var(--c-surface) 90%, transparent);color:var(--c-accent);font-family:var(--font-display);font-size:0.78rem;font-weight:600;letter-spacing:0.04em}
.rou-order-preview .rou-order-mark--logo {object-fit:cover;padding:0}
.rou-order-preview .rou-brand {min-width:0;flex:1}
.rou-order-preview .rou-site-name {font-family:var(--font-display);font-size:1rem;font-weight:600;letter-spacing:-0.01em;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rou-order-preview .rou-site-tag {margin:0.15rem 0 0;font-size:0.75rem;line-height:1.3;color:var(--c-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rou-order-preview .rou-header-context {display:flex;flex-wrap:wrap;align-items:center;gap:0.5rem;padding-bottom:0.75rem}
.rou-order-preview .rou-table-badge {display:inline-flex;align-items:center;gap:0.375rem;padding:0.375rem 0.75rem;border-radius:999px;background:var(--c-dark);color:var(--c-on-accent);font-size:0.75rem;font-weight:600;line-height:1.25}
.rou-order-preview .rou-table-badge--diner {background:transparent;color:var(--c-text);border:1px solid var(--c-border)}
.rou-order-preview .rou-table-badge--delivery {background:var(--c-dark);color:var(--c-on-accent)}
.rou-order-preview .rou-header-top .rou-lang-switch {margin-left:auto;flex:0 0 auto}
.rou-order-preview .rou-lang-switch {position:relative}
.rou-order-preview .rou-lang-btn {display:inline-flex;align-items:center;gap:var(--rou-gap-tight);background:var(--c-qty-bg);border:none;border-radius:999px;padding:var(--rou-gap-tight) var(--rou-gap);cursor:pointer;color:var(--c-muted);font-size:var(--rou-text-caption);font-weight:500;line-height:var(--rou-leading-tight);font-family:var(--font-body);transition:background .2s,color .2s;-webkit-tap-highlight-color:transparent}
.rou-order-preview .rou-lang-btn:hover {color:var(--c-text);background:rgba(60,60,67,0.1)}
.rou-order-preview .rou-lang-btn svg {flex-shrink:0;width:14px;height:14px;display:block;opacity:.75}
.rou-order-preview .rou-lang-code {letter-spacing:.03em}
.rou-order-preview .rou-lang-dropdown {position:absolute;top:calc(100% + var(--rou-gap-tight));right:0;min-width:220px;max-height:min(70%,420px);overflow:auto;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-card);box-shadow:var(--shadow-lg);padding:var(--rou-gap-tight);z-index:9999;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .18s,visibility .18s,transform .18s ease;pointer-events:none}
.rou-order-preview .rou-lang-filter {width:100%;box-sizing:border-box;margin:0 0 6px;padding:8px 10px;border:1px solid var(--c-border);border-radius:8px;font:inherit;font-size:13px;background:var(--c-warm,#f8f8f7)}
.rou-order-preview .rou-lang-switch.open .rou-lang-dropdown {opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}
.rou-order-preview .rou-lang-option {display:flex;align-items:center;gap:var(--rou-gap-tight);padding:var(--rou-gap-tight) var(--rou-gap);border-radius:var(--radius-input);text-decoration:none;font-size:var(--rou-text-sm);line-height:var(--rou-leading-snug);color:var(--c-text);transition:background .15s;white-space:nowrap}
.rou-order-preview .rou-lang-option:hover {background:var(--c-qty-bg)}
.rou-order-preview .rou-lang-option.rou-lang-active {font-weight:600;color:var(--c-text)}
.rou-order-preview .rou-lang-option svg {margin-left:auto;color:var(--c-accent)}
.rou-order-preview .rou-lang-flag {display:inline-flex;align-items:center;justify-content:center;width:26px;height:18px;border-radius:3px;background:var(--c-warm);font-size:10px;font-weight:700;color:var(--c-muted);letter-spacing:.5px;flex-shrink:0}
.rou-order-preview .rou-main {padding:0 0 1.5rem}
.rou-order-preview .rou-active-orders {background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-card);padding:var(--rou-gap);margin:var(--rou-gap-block) 0;font-size:var(--rou-text-sm);line-height:var(--rou-leading-snug);box-shadow:var(--shadow)}
.rou-order-preview .rou-active-orders__head {display:flex;align-items:center;gap:var(--rou-gap-tight);font-weight:600;font-size:var(--rou-text-caption);line-height:var(--rou-leading-tight);color:var(--c-muted);padding-bottom:var(--rou-gap-tight);margin-bottom:var(--sp-1);border-bottom:1px solid var(--c-border)}
.rou-order-preview .rou-active-orders__head svg {opacity:.55}
.rou-order-preview .rou-active-orders__row {display:flex;justify-content:space-between;align-items:center;padding:var(--rou-gap-tight) 0;text-decoration:none;color:inherit;border-bottom:1px solid var(--c-border);transition:opacity .15s}
.rou-order-preview .rou-active-orders__row:hover {opacity:.75}
.rou-order-preview .rou-active-orders__row:last-of-type {border-bottom:none}
.rou-order-preview .rou-active-orders__status {font-size:var(--rou-text-caption);font-weight:500;line-height:var(--rou-leading-tight);color:var(--c-muted);background:var(--c-qty-bg);padding:var(--sp-1) var(--rou-gap-tight);border-radius:999px}
.rou-order-preview .rou-wallet-panel {margin:var(--rou-gap) 0;padding:var(--rou-gap);background:var(--c-qty-bg);border:none;border-radius:1.25rem}
.rou-order-preview .rou-wallet-panel__head {display:flex;align-items:center;gap:var(--rou-gap-tight);margin-bottom:var(--rou-gap-tight)}
.rou-order-preview .rou-wallet-panel__icon {font-size:1.125rem;line-height:1;opacity:.85}
.rou-order-preview .rou-wallet-panel__head strong {color:var(--c-text);font-size:var(--rou-text-sm);font-weight:600;line-height:var(--rou-leading-snug)}
.rou-order-preview .rou-wallet-panel__check {display:flex;align-items:center;gap:var(--rou-gap-tight);font-size:var(--rou-text-sm);line-height:var(--rou-leading-snug);cursor:pointer;color:var(--c-text)}
.rou-order-preview .rou-wallet-panel__check input[type=checkbox] {width:18px;height:18px;flex-shrink:0;margin:0;accent-color:var(--c-accent)}
.rou-order-preview .rou-wallet-panel__amount-row {display:none;margin-top:var(--rou-gap-tight)}
.rou-order-preview .rou-wallet-panel__amount-row label {font-size:var(--rou-text-caption);font-weight:600;color:var(--c-muted)}
.rou-order-preview .rou-wallet-panel__amount-row input[type=number] {width:120px;padding:var(--rou-gap-tight);border:1px solid var(--c-border);border-radius:var(--radius-input);font-size:var(--rou-text-body);margin-top:var(--sp-1);background:var(--c-surface)}
.rou-order-preview .rou-wallet-panel__currency {font-size:var(--rou-text-caption);color:var(--c-muted);margin-left:var(--sp-1)}
.rou-order-preview .rou-wallet-login-hint {text-align:center;padding:var(--rou-gap-tight) var(--rou-gap);font-size:var(--rou-text-caption);line-height:var(--rou-leading-snug);color:var(--c-muted)}
.rou-order-preview .rou-wallet-login-hint a {color:var(--c-accent);text-decoration:underline;font-weight:600}
.rou-order-preview .rou-browse-sticky {position:sticky;top:var(--rou-header-sticky-offset);z-index:25;margin:0 0 var(--rou-gap-tight);padding:0.65rem 1rem;background:var(--c-surface);border-bottom:none}
.rou-order-preview .rou-browse-sticky .rou-search-wrap {margin-top:0;margin-bottom:0}
.rou-order-preview .rou-menu-split {margin:0 0 var(--rou-gap-block)}
.rou-order-preview .rou-menu-split-inner {display:flex;align-items:flex-start;gap:var(--rou-gap);min-width:0}
.rou-order-preview .rou-cat-rail {flex:0 0 clamp(72px,26cqw,108px);min-width:0;position:sticky;top:calc(var(--rou-header-sticky-offset) + var(--rou-browse-search-h));align-self:flex-start;max-height:calc(100% - var(--rou-header-sticky-offset) - var(--rou-browse-search-h) - var(--rou-gap-block));overflow-y:auto;-webkit-overflow-scrolling:touch;border-right:none;background:transparent;z-index:26;padding:0 var(--sp-1) var(--rou-gap) 0;scrollbar-width:thin}
.rou-order-preview .rou-items-scroller {flex:1;min-width:0;padding-right:var(--sp-1)}
.rou-order-preview .rou-search-wrap {position:relative;margin:0 0 var(--rou-gap-tight)}
.rou-order-preview .rou-search-wrap svg {position:absolute;left:11px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:var(--c-muted);pointer-events:none;opacity:.65}
.rou-order-preview .rou-search-wrap input {width:100%;padding:7px var(--rou-gap-block) 7px 34px;border:none;border-radius:var(--radius-input);background:var(--c-surface);font-size:16px;font-family:var(--font-body);line-height:var(--rou-leading-snug);color:var(--c-text);outline:none;transition:box-shadow .2s;min-height:40px;box-shadow:inset 0 0 0 1px var(--c-border)}
.rou-order-preview .rou-search-wrap input:focus {box-shadow:inset 0 0 0 1px rgba(60,60,67,0.28),0 0 0 3px rgba(60,60,67,0.08)}
.rou-order-preview .rou-search-wrap input::placeholder {color:var(--c-muted)}
.rou-order-preview .rou-search-empty {display:none;margin:var(--sp-1) 0 0;padding:var(--rou-gap-tight) var(--rou-gap);font-size:var(--rou-text-caption);line-height:var(--rou-leading-snug);color:var(--c-muted);text-align:center;background:var(--c-surface);border:none;border-radius:var(--radius-input)}
.rou-order-preview .rou-search-empty.is-visible {display:block}
.rou-order-preview .rou-cat-nav {display:flex;flex-direction:column;flex-wrap:nowrap;gap:var(--sp-1);padding:var(--rou-gap-tight) 0;scrollbar-width:thin}
.rou-order-preview .rou-cat-nav::-webkit-scrollbar {width:4px}
.rou-order-preview .rou-cat-nav::-webkit-scrollbar-thumb {background:var(--c-border);border-radius:4px}
.rou-order-preview .rou-cat-nav a {flex-shrink:0;width:100%;padding:var(--rou-gap-tight);border-radius:0.65rem;font-size:var(--rou-text-caption);font-weight:500;text-decoration:none;color:var(--c-muted);background:transparent;border:none;transition:background .15s,color .15s;text-transform:none;letter-spacing:0;min-height:36px;display:inline-flex;align-items:center;justify-content:flex-start;text-align:left;line-height:var(--rou-leading-snug);overflow-wrap:anywhere;hyphens:auto;-webkit-tap-highlight-color:transparent}
.rou-order-preview .rou-cat-nav a:hover {color:var(--c-text);background:var(--c-qty-bg)}
.rou-order-preview .rou-cat-nav a.cat-active {background:var(--c-surface);color:var(--c-text);font-weight:700;box-shadow:inset 3px 0 0 var(--c-accent)}
.rou-order-preview .rou-section {margin-bottom:var(--rou-gap-section);text-align:left}
.rou-order-preview .rou-section .rou-item {text-align:left}
.rou-order-preview .rou-items-scroller > .rou-section:first-child .rou-section-title {margin-top:0}
.rou-order-preview .rou-section-title {font-family:var(--font-display);font-size:var(--rou-text-caption);font-weight:600;padding:8px 0 6px;color:var(--c-muted);border:none;border-radius:0;margin:0 0 var(--rou-gap);display:block;letter-spacing:0.04em;text-transform:uppercase;line-height:var(--rou-leading-tight);scroll-margin-top:var(--rou-scroll-anchor-pad);position:sticky;top:calc(var(--rou-header-sticky-offset) + var(--rou-browse-search-h) - 1px);z-index:8;background:linear-gradient(var(--c-surface) 70%,transparent)}
.rou-order-preview .rou-item {background:transparent;border:none;border-bottom:1px solid color-mix(in srgb, var(--c-text) 10%, transparent);border-radius:0;padding:0.9rem 1rem;margin:0;box-shadow:none;transition:background .15s}
.rou-order-preview .rou-item:hover {box-shadow:none;background:color-mix(in srgb, var(--c-text) 3%, transparent)}
.rou-order-preview .rou-item.has-qty {background:var(--c-accent-light);box-shadow:none}
.rou-order-preview .rou-item-top {display:flex;justify-content:space-between;align-items:flex-start;gap:var(--rou-gap)}
.rou-order-preview .rou-item-info {flex:1;min-width:0}
.rou-order-preview .rou-item-name {font-weight:600;font-size:var(--rou-text-body);line-height:var(--rou-leading-snug);letter-spacing:-.01em;color:var(--c-text);overflow-wrap:anywhere}
.rou-order-preview .rou-item-original-name {font-size:var(--rou-text-caption,12px);line-height:1.3;color:var(--c-muted,rgba(0,0,0,.55));margin:.15rem 0 .25rem;overflow-wrap:anywhere}
.rou-order-preview .rou-item-name-line {display:flex;align-items:center;gap:var(--rou-gap-tight);flex-wrap:wrap}
.rou-order-preview .rou-item-blurb {margin:var(--sp-1) 0 0;font-size:var(--rou-text-sm);line-height:var(--rou-leading-snug);color:var(--c-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rou-order-preview .rou-item-media {position:relative;flex:0 0 5.25rem;width:5.25rem}
.rou-order-preview .rou-item-photo {display:block;width:5.25rem;height:5.25rem;padding:0;border:0;background:var(--c-warm);border-radius:1rem;overflow:hidden;cursor:zoom-in;-webkit-tap-highlight-color:transparent}
.rou-order-preview .rou-item-photo img {display:block;width:5.25rem;height:5.25rem;object-fit:cover}
.rou-order-preview .rou-item.has-photo .rou-item-media .rou-stepper {position:absolute;right:4px;bottom:4px;z-index:2;background:rgba(255,255,255,.96);box-shadow:0 1px 4px rgba(0,0,0,.14)}
.rou-order-preview .rou-item.has-photo .rou-stepper:not(.active) {background:var(--c-accent);border-radius:999px;overflow:hidden}
.rou-order-preview .rou-item.has-photo .rou-stepper:not(.active) .rou-plus {color:var(--c-on-accent);width:36px;height:36px}
.rou-order-preview .rou-item.has-photo .rou-stepper:not(.active) button:hover {background:rgba(0,0,0,.12);color:#fff}
.rou-order-preview .rou-item.has-photo .rou-stepper:not(.active) .rou-minus,
.rou-order-preview .rou-item.has-photo .rou-stepper:not(.active) .rou-qty {display:none}
.rou-order-preview .rou-item.has-photo .rou-stepper.active .rou-qty {width:28px;font-size:var(--rou-text-sm)}
.rou-order-preview .rou-item.has-photo .rou-stepper.active button {width:32px;height:32px}
.rou-order-preview .rou-item.has-photo .rou-allergen {width:22px;height:22px;font-size:10px}
.rou-order-preview .rou-shared-count {display:none;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 var(--sp-1);border-radius:999px;background:var(--c-qty-bg);color:var(--c-muted);font-size:11px;font-weight:600;line-height:1}
.rou-order-preview .rou-shared-count.visible {display:inline-flex;color:var(--c-accent);background:var(--c-accent-light)}
.rou-order-preview .rou-allergens {display:flex;flex-wrap:wrap;gap:var(--sp-1);margin-top:var(--sp-2)}
.rou-order-preview .rou-allergen {display:inline-flex;align-items:center;justify-content:center;font-size:var(--rou-text-sm);width:26px;height:26px;border-radius:6px;background:var(--c-qty-bg);cursor:default}
.rou-order-preview .rou-allergen-legend {background:transparent;border:none;border-radius:0;margin:var(--rou-gap) 0 0;font-size:var(--rou-text-sm);line-height:var(--rou-leading-snug)}
.rou-order-preview .rou-allergen-legend summary {padding:var(--rou-gap-tight) 0;cursor:pointer;font-weight:500;font-size:var(--rou-text-caption);line-height:var(--rou-leading-snug);color:var(--c-muted);list-style:none;display:flex;align-items:center;gap:var(--rou-gap-tight)}
.rou-order-preview .rou-allergen-legend summary::before {content:none}
.rou-order-preview .rou-allergen-legend summary::after {content:'▸';margin-left:auto;font-size:10px;opacity:.55;transition:transform .15s}
.rou-order-preview .rou-allergen-legend[open] summary::after {transform:rotate(90deg)}
.rou-order-preview .rou-allergen-legend[open] summary {color:var(--c-text)}
.rou-order-preview .rou-allergen-grid {display:flex;flex-wrap:wrap;gap:var(--rou-gap-tight) var(--rou-gap);padding:var(--rou-gap-tight) 0 var(--rou-gap)}
.rou-order-preview .rou-legend-item {display:inline-flex;align-items:center;gap:var(--sp-1);font-size:var(--rou-text-caption);line-height:var(--rou-leading-snug);color:var(--c-muted);white-space:nowrap}
.rou-order-preview .rou-item-price {font-family:var(--font-display);font-size:var(--rou-text-body);font-weight:600;line-height:var(--rou-leading-tight);color:var(--c-text);margin-top:var(--sp-2);white-space:nowrap}
.rou-order-preview .rou-item-desc-btn {background:none;border:none;color:var(--c-muted);cursor:pointer;font-size:var(--rou-text-caption);padding:var(--sp-1) 0;border-radius:0;transition:color .15s;display:inline-flex;align-items:center;gap:var(--sp-1);margin-top:var(--sp-2);font-family:var(--font-body);min-height:auto}
.rou-order-preview .rou-item-desc-btn:hover {color:var(--c-text);background:none}
.rou-order-preview .rou-item-desc {display:none;font-size:var(--rou-text-sm);color:var(--c-muted);padding:var(--rou-gap-tight) 0 0;margin-top:var(--sp-2);background:transparent;border-radius:0;line-height:var(--rou-leading-body);border-left:none;border-top:1px solid var(--c-border);overflow-wrap:anywhere}
.rou-order-preview .rou-item-desc.open {display:block}
.rou-order-preview .rou-stepper {display:flex;align-items:center;gap:0;flex-shrink:0;border:none;border-radius:999px;overflow:hidden;background:var(--c-accent)}
.rou-order-preview .rou-stepper:not(.active) .rou-minus,
.rou-order-preview .rou-stepper:not(.active) .rou-qty {display:none}
.rou-order-preview .rou-stepper:not(.active) .rou-plus {color:var(--c-on-accent);width:2.25rem;height:2.25rem}
.rou-order-preview .rou-stepper button {width:var(--rou-touch);height:var(--rou-touch);border:none;background:transparent;cursor:pointer;font-size:18px;font-weight:500;line-height:1;color:var(--c-muted);display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s;font-family:var(--font-body);-webkit-tap-highlight-color:transparent}
.rou-order-preview .rou-stepper button:hover {background:rgba(60,60,67,0.08);color:var(--c-text)}
.rou-order-preview .rou-stepper button:active {transform:none}
.rou-order-preview .rou-stepper .rou-qty {width:48px;text-align:center;border:none;background:transparent;font-size:var(--rou-text-body);font-weight:600;line-height:var(--rou-leading-tight);color:var(--c-text);font-family:var(--font-body);-moz-appearance:textfield;padding:0}
.rou-order-preview .rou-stepper .rou-qty::-webkit-outer-spin-button,
.rou-order-preview .rou-stepper .rou-qty::-webkit-inner-spin-button {-webkit-appearance:none;margin:0}
.rou-order-preview .rou-stepper.active {background:var(--c-surface);box-shadow:inset 0 0 0 1px var(--c-border)}
.rou-order-preview .rou-stepper.active .rou-qty {color:var(--c-text)}
.rou-order-preview .rou-stepper.active .rou-plus,
.rou-order-preview .rou-stepper.active .rou-minus {color:var(--c-text)}
.rou-order-preview .rou-pre-submit {background:transparent;border:none;border-radius:0;padding:0;margin:var(--rou-gap-section) 1rem;box-shadow:none}
.rou-order-preview .rou-pre-submit > .rou-form-section.rou-notes-panel {margin:0 0 var(--rou-gap);padding:var(--rou-gap);border:none;border-radius:var(--radius-card);background:var(--c-surface);box-shadow:inset 0 0 0 1px var(--c-border)}
.rou-order-preview .rou-pre-submit > .rou-wallet-panel:first-child {margin-top:0}
.rou-order-preview .rou-pre-submit .rou-wallet-panel {margin-bottom:0}
.rou-order-preview .rou-pre-submit .rou-wallet-login-hint {margin-top:0;text-align:left}
.rou-order-preview .rou-pre-submit .rou-allergen-legend {margin:var(--rou-gap) 0 0}
.rou-order-preview .rou-form-section {background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-card);padding:var(--rou-gap-section);margin:var(--rou-gap-section) 0}
.rou-order-preview .rou-form-section legend {font-family:var(--font-display);font-size:var(--rou-text-title);line-height:var(--rou-leading-tight);padding:0 var(--sp-1);color:var(--c-text)}
.rou-order-preview .rou-form-grid {display:grid;grid-template-columns:1fr 1fr;gap:var(--rou-gap);margin-top:var(--rou-gap)}
@container rou-order (max-width: 500px) {
.rou-order-preview .rou-form-grid {grid-template-columns:1fr}
}
.rou-order-preview .rou-field {display:flex;flex-direction:column;gap:var(--sp-1)}
.rou-order-preview .rou-field.full {grid-column:1/-1}
.rou-order-preview .rou-field label {font-size:var(--rou-text-caption);font-weight:500;line-height:var(--rou-leading-tight);text-transform:none;letter-spacing:0;color:var(--c-muted)}
.rou-order-preview .rou-field input,
.rou-order-preview .rou-field textarea {padding:var(--rou-gap-tight) var(--rou-gap);border:none;border-radius:var(--radius-input);font-size:16px;font-family:var(--font-body);line-height:var(--rou-leading-snug);color:var(--c-text);background:var(--c-qty-bg);outline:none;transition:box-shadow .2s;box-shadow:inset 0 0 0 1px var(--c-border)}
.rou-order-preview .rou-field input {min-height:var(--rou-touch)}
.rou-order-preview .rou-field input:focus,
.rou-order-preview .rou-field textarea:focus {box-shadow:inset 0 0 0 1px rgba(60,60,67,0.28),0 0 0 3px rgba(60,60,67,0.08)}
.rou-order-preview .rou-field input::placeholder,
.rou-order-preview .rou-field textarea::placeholder {color:#bbb}
.rou-order-preview .rou-field textarea {resize:vertical;min-height:60px;padding-block:var(--rou-gap);border-radius:1rem}
.rou-order-preview .rou-form-section.rou-notes-panel {margin:var(--rou-gap-section) 0;padding:var(--rou-gap-block)}
.rou-order-preview .rou-reviews {margin:var(--rou-gap-section) 0;padding:var(--rou-gap-section);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-card);font-size:var(--rou-text-sm);line-height:var(--rou-leading-body);color:var(--c-text)}
.rou-order-preview .rou-cart-float {position:absolute;z-index:50;left:50%;bottom:max(0.75rem,env(safe-area-inset-bottom,0px));width:min(26.5rem,calc(100% - 1.5rem));padding:0;background:transparent;border:0;box-shadow:none;transform:translate(-50%,140%);transition:transform .25s ease}
.rou-order-preview .rou-cart-float.visible {transform:translate(-50%,0)}
.rou-order-preview .rou-cart-bar {display:flex;align-items:center;gap:0.75rem;padding:0.45rem 0.45rem 0.45rem 0.55rem;cursor:pointer;-webkit-tap-highlight-color:transparent;border:1px solid var(--c-border);border-radius:999px;background:color-mix(in srgb, var(--c-surface) 94%, transparent);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:var(--shadow-lg)}
.rou-order-preview .rou-cart-bar-summary {display:flex;align-items:center;gap:0.7rem;min-width:0;flex:1}
.rou-order-preview .rou-cart-bag {position:relative;display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;flex:0 0 auto;border-radius:50%;background:var(--c-dark);color:var(--c-on-accent)}
.rou-order-preview .rou-cart-count {position:absolute;top:-0.15rem;right:-0.15rem;background:var(--c-accent);color:var(--c-on-accent);font-size:0.65rem;font-weight:700;line-height:1;min-width:1.15rem;height:1.15rem;border-radius:999px;display:flex;align-items:center;justify-content:center;padding:0 0.2rem}
.rou-order-preview .rou-cart-total {font-family:var(--font-display);font-size:1rem;font-weight:600;line-height:1.2;letter-spacing:-0.01em;color:var(--c-text)}
.rou-order-preview .rou-cart-submit {background:var(--c-accent);color:var(--c-on-accent);border:none;padding:0.75rem 1.15rem;border-radius:999px;font-size:0.92rem;font-weight:600;line-height:1.2;cursor:pointer;font-family:var(--font-body);transition:opacity .2s;-webkit-tap-highlight-color:transparent;min-height:2.75rem}
.rou-order-preview .rou-cart-submit:hover:not(:disabled) {background:var(--c-accent-hover)}
.rou-order-preview .rou-cart-submit:active:not(:disabled) {transform:none}
.rou-order-preview .rou-cart-submit:disabled,
.rou-order-preview .rou-sidebar-btn:disabled {opacity:.4;cursor:not-allowed}
.rou-order-preview .rou-cart-items li.rou-cart-wallet-line {color:var(--c-accent)}
.rou-order-preview .rou-sidebar-items li.rou-cart-wallet-line {color:var(--c-accent);font-weight:600}
.rou-order-preview .rou-cart-detail {max-height:0;overflow:hidden;transition:max-height .25s ease;background:transparent;border:0}
.rou-order-preview .rou-cart-float.expanded .rou-cart-detail {max-height:50vh;overflow-y:auto;margin-bottom:0.45rem;border:1px solid var(--c-border);border-radius:1.25rem;background:color-mix(in srgb, var(--c-surface) 94%, transparent);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.rou-order-preview .rou-cart-items {padding:0 var(--rou-page-inline-right) var(--rou-gap-block) var(--rou-page-inline);max-width:var(--content-max);margin:0 auto}
.rou-order-preview .rou-cart-items ul {list-style:none;padding:0}
.rou-order-preview .rou-cart-items li {display:flex;justify-content:space-between;align-items:baseline;gap:var(--rou-gap);padding:var(--rou-gap-tight) 0;border-bottom:1px solid var(--c-border);font-size:var(--rou-text-sm);line-height:var(--rou-leading-snug);color:var(--c-text)}
.rou-order-preview .rou-cart-items li:last-child {border:none}
.rou-order-preview .rou-cart-empty {padding:var(--rou-gap-block) var(--rou-gap-section);text-align:center;color:var(--c-muted);font-size:var(--rou-text-sm);line-height:var(--rou-leading-snug)}
.rou-order-preview .rou-sidebar {display:none}
.rou-order-preview .rou-order-colophon {margin:0;padding:2rem 1rem;text-align:center}
.rou-order-preview .rou-order-colophon .rou-rhome-powered {color:var(--c-muted);font-size:0.75rem;text-decoration:none}
.rou-order-preview .rou-back {display:inline-flex;align-items:center;gap:var(--rou-gap-tight);margin:1.5rem 1rem 0.25rem;font-size:var(--rou-text-sm);line-height:var(--rou-leading-snug);color:var(--c-muted);text-decoration:none;transition:color .2s;min-height:var(--rou-touch)}
.rou-order-preview .rou-back:hover {color:var(--c-text)}
.rou-order-preview .rou-footer-line {font-size:var(--rou-text-caption);line-height:var(--rou-leading-snug);color:var(--c-muted);margin:var(--rou-gap-tight) 0 var(--rou-gap-section);padding-top:var(--rou-gap-block);border-top:1px solid var(--c-border);opacity:.75}
.rou-order-preview .rou-empty-state {text-align:center;padding:var(--sp-7) var(--rou-gap-section);color:var(--c-muted)}
.rou-order-preview .rou-empty-state p {font-size:var(--rou-text-title);line-height:var(--rou-leading-snug);font-weight:500}
.rou-order-preview .rou-empty-state--soft {padding:var(--rou-gap-section) 0}
@media (prefers-reduced-motion: reduce) {
.rou-order-preview .rou-order-shell * {transition-duration:0.01ms !important;animation-duration:0.01ms !important}


}
@container rou-order (max-width: 899px) {
.rou-order-preview :is(.rou-order-shell, .rou-confirmed-shell) {
    --rou-gap-block:var(--sp-4);
  }
.rou-order-preview .rou-brand {flex:1 1 auto;min-width:0;max-width:none}
.rou-order-preview .rou-table-badge {max-width:100%}
.rou-order-preview .rou-menu-split {margin:0 0 var(--rou-gap-block)}
.rou-order-preview .rou-menu-split-inner {gap:var(--sp-2)}
.rou-order-preview .rou-cat-rail {flex-basis:clamp(68px,24cqw,96px);padding-right:var(--sp-1)}
.rou-order-preview .rou-items-scroller {padding-right:0}
.rou-order-preview .rou-footer-line {padding-bottom:max(var(--rou-gap-block),env(safe-area-inset-bottom,0px))}


}
@container rou-order (max-width: 480px) {
.rou-order-preview .rou-header-inner {gap:var(--sp-2)}
.rou-order-preview .rou-cart-bar {flex-wrap:nowrap}
.rou-order-preview .rou-cart-bar-summary {flex:1 1 auto;min-width:0}
.rou-order-preview .rou-cart-total {font-size:0.95rem}
.rou-order-preview .rou-cart-submit {flex:0 0 auto;padding-inline:0.9rem;white-space:nowrap}
.rou-order-preview .rou-cat-nav a {font-size:11px;padding:var(--sp-2) var(--sp-1)}
.rou-order-preview .rou-item-media,
.rou-order-preview .rou-item.has-photo .rou-item-media {flex-basis:96px;width:96px}
.rou-order-preview .rou-item-photo,
.rou-order-preview .rou-item-photo img {width:96px;height:96px}


}
@container rou-order (max-width: 360px) {
.rou-order-preview .rou-cat-rail {flex-basis:60px}


}
.rou-order-preview .rou-form-section-title { font-size: 15px; font-weight: 700; margin: 0 0 10px; }
.rou-order-preview .rou-delivery-panel {margin:1rem 1rem 0;padding:var(--rou-gap-section);border-radius:var(--radius-card);background:var(--c-warm);box-shadow:inset 0 0 0 1px var(--c-border)}
.rou-order-preview .rou-delivery-panel .rou-form-section-title {margin-bottom:12px}
.rou-order-preview .rou-delivery-panel .rou-field {margin-bottom:10px}
.rou-order-preview .rou-delivery-panel .rou-field:last-child {margin-bottom:0}
@container rou-order (min-width: 900px) {
.rou-order-preview .rou-delivery-panel {display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
.rou-order-preview .rou-delivery-panel .rou-form-section-title {grid-column:1/-1;margin-bottom:0}
.rou-order-preview .rou-delivery-panel .rou-field:last-child {grid-column:1/-1}


}
.rou-order-preview .rou-section-title {display:flex;align-items:baseline;justify-content:space-between;gap:0.75rem}
.rou-order-preview .rou-section-count {font-weight:500;color:var(--c-muted)}
.rou-order-preview .rou-item-top > .rou-item-photo {flex:0 0 5.25rem;width:5.25rem;height:5.25rem}
.rou-order-preview .rou-item-open {display:block;width:100%;margin:0;padding:0;border:0;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer}
.rou-order-preview .rou-item-foot {display:flex;align-items:flex-end;justify-content:space-between;gap:0.6rem;margin-top:0.55rem}
.rou-order-preview .rou-choose-hint {margin:0.15rem 0 0;font-size:0.66rem;line-height:1.3;color:var(--c-muted)}
.rou-order-preview .rou-highlight-pill {display:inline-flex;align-items:center;border-radius:999px;padding:0.12rem 0.45rem;background:var(--c-accent-light);color:var(--c-accent);font-size:0.62rem;font-weight:700;line-height:1.3}
.rou-order-preview .rou-allergen-chip {display:inline-flex;align-items:center;gap:0.25rem;border-radius:999px;padding:0.12rem 0.45rem;border:1px solid var(--c-border);background:color-mix(in srgb, var(--c-bg) 72%, var(--c-surface));color:var(--c-muted);font-size:0.65rem;font-weight:600;line-height:1.2}
.rou-order-preview .rou-allergen-chip svg {width:0.8rem;height:0.8rem;flex:0 0 auto}
.rou-order-preview .rou-allergens {display:flex;flex-wrap:wrap;gap:0.3rem;margin-top:0.45rem}
.rou-order-preview .rou-cat-nav a {position:relative;padding-right:1.1rem}
.rou-order-preview .rou-cat-qty {position:absolute;top:0.15rem;right:0.1rem;min-width:1rem;height:1rem;padding:0 0.2rem;border-radius:999px;background:var(--c-accent);color:var(--c-on-accent);font-size:0.6rem;font-weight:700;display:flex;align-items:center;justify-content:center}
.rou-order-preview .rou-cat-qty[hidden],
.rou-order-preview .rou-love__count[hidden] {display:none !important}
.rou-order-preview .rou-love {padding:0.85rem 0 0.4rem;border-bottom:1px solid var(--c-border)}
.rou-order-preview .rou-love__head {display:flex;align-items:center;gap:0.4rem;padding:0 1rem 0.55rem;color:var(--c-accent)}
.rou-order-preview .rou-love__head h2 {margin:0;font-family:var(--font-display);font-size:0.92rem;font-weight:650;color:var(--c-text)}
.rou-order-preview .rou-love__row {display:flex;gap:0.75rem;overflow-x:auto;padding:0 1rem 0.65rem;scroll-snap-type:x mandatory;list-style:none;scrollbar-width:none}
.rou-order-preview .rou-love__row::-webkit-scrollbar {display:none}
.rou-order-preview .rou-love__card {width:9.5rem;flex:0 0 auto;scroll-snap-align:start}
.rou-order-preview .rou-love-open {display:block;width:100%;padding:0;border:0;background:transparent;text-align:left;color:inherit;font:inherit;cursor:pointer}
.rou-order-preview .rou-love__photo {position:relative;display:block;height:6.5rem;border-radius:1.4rem;overflow:hidden;background:var(--c-warm);border:1px solid var(--c-border)}
.rou-order-preview .rou-love__photo img {width:100%;height:100%;object-fit:cover;display:block}
.rou-order-preview .rou-love__badge {position:absolute;left:0.45rem;top:0.45rem;border-radius:999px;padding:0.15rem 0.45rem;background:color-mix(in srgb, var(--c-surface) 90%, transparent);color:var(--c-text);font-size:0.62rem;font-weight:700}
.rou-order-preview .rou-love__count {position:absolute;right:0.45rem;top:0.45rem;min-width:1.15rem;height:1.15rem;border-radius:999px;background:var(--c-accent);color:var(--c-on-accent);font-size:0.62rem;font-weight:700;display:flex;align-items:center;justify-content:center}
.rou-order-preview .rou-love__name {display:block;margin-top:0.45rem;font-size:0.82rem;font-weight:650;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rou-order-preview .rou-love__meta {display:flex;align-items:center;justify-content:space-between;gap:0.4rem;margin-top:0.2rem}
.rou-order-preview .rou-love__price {font-family:var(--font-display);font-size:0.9rem;font-weight:650}
.rou-order-preview .rou-love-plus {width:1.75rem;height:1.75rem;border:0;border-radius:999px;background:var(--c-accent);color:var(--c-on-accent);font-size:1rem;line-height:1;cursor:pointer}
.rou-order-preview .rou-dish-sheet {position:absolute;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;background:transparent;box-shadow:none;color:var(--c-text)}
.rou-order-preview .rou-dish-sheet:not([open]) {display:none}
.rou-order-preview .rou-dish-sheet[open] {display:flex;align-items:flex-end;justify-content:center}
.rou-order-preview .rou-dish-sheet::backdrop {background:rgba(26,26,26,.45)}
.rou-order-preview .rou-dish-sheet__panel {position:relative;display:flex;flex-direction:column;width:min(28rem,100%);max-height:92%;overflow:hidden;border-radius:2rem 2rem 0 0;background:var(--c-surface);box-shadow:var(--shadow-lg)}
.rou-order-preview .rou-dish-sheet__hero {flex:0 0 auto}
.rou-order-preview .rou-dish-sheet__img {display:block;width:100%;height:11rem;object-fit:cover;background:var(--c-warm)}
.rou-order-preview .rou-dish-sheet__close {position:absolute;top:0.7rem;right:0.7rem;z-index:2;width:2.25rem;height:2.25rem;border:1px solid var(--c-border);border-radius:999px;background:color-mix(in srgb, var(--c-surface) 90%, transparent);color:var(--c-text);font-size:1.25rem;line-height:1;cursor:pointer}
.rou-order-preview .rou-dish-sheet__body {min-height:0;overflow:auto;padding:1.1rem 1.25rem 1rem}
.rou-order-preview .rou-dish-sheet__hero[hidden] ~ .rou-dish-sheet__body .rou-dish-sheet__head {padding-right:2rem}
.rou-order-preview .rou-dish-sheet__head {display:flex;align-items:flex-start;justify-content:space-between;gap:0.75rem}
.rou-order-preview .rou-dish-sheet__title {margin:0;font-family:var(--font-display);font-size:1.25rem;font-weight:650;line-height:1.2}
.rou-order-preview .rou-dish-sheet__price {margin:0;flex:0 0 auto;font-family:var(--font-display);font-size:1.05rem;font-weight:650}
.rou-order-preview .rou-dish-sheet__desc {margin:0.4rem 0 0;font-size:0.92rem;line-height:1.5;color:var(--c-muted)}
.rou-order-preview .rou-dish-sheet__body .rou-highlight-pill {margin-top:0.75rem}
.rou-order-preview .rou-choice-group {margin:1.15rem 0 0;padding:0;border:0}
.rou-order-preview .rou-choice-group legend {display:flex;align-items:baseline;gap:0.45rem;font-size:0.92rem;font-weight:650}
.rou-order-preview .rou-choice-group legend em {font-style:normal;font-size:0.72rem;font-weight:500;color:var(--c-muted)}
.rou-order-preview .rou-choice-row {display:flex;flex-wrap:wrap;gap:0.45rem;margin-top:0.55rem}
.rou-order-preview .rou-choice {border:1px solid var(--c-border);background:var(--c-bg);color:var(--c-text);border-radius:999px;padding:0.5rem 0.9rem;font:inherit;font-size:0.9rem;cursor:pointer}
.rou-order-preview .rou-choice.is-on {background:var(--c-dark);color:var(--c-on-accent);border-color:var(--c-dark);font-weight:650}
.rou-order-preview .rou-choice__delta {margin-left:0.35rem;font-size:0.72rem;opacity:.8}
.rou-order-preview .rou-dish-allergens {margin-top:1.35rem}
.rou-order-preview .rou-dish-allergens h3 {margin:0;font-size:0.92rem}
.rou-order-preview .rou-dish-allergens p {margin:0.3rem 0 0;font-size:0.75rem;line-height:1.45;color:var(--c-muted)}
.rou-order-preview .rou-dish-allergen-chips {display:flex;flex-wrap:wrap;gap:0.4rem;margin-top:0.55rem}
.rou-order-preview .rou-dish-sheet__bar {display:flex;align-items:center;gap:0.7rem;flex:0 0 auto;padding:0.75rem 1.1rem max(1rem,env(safe-area-inset-bottom));border-top:1px solid var(--c-border);background:var(--c-surface)}
.rou-order-preview .rou-dish-qty {display:flex;align-items:center;gap:0.25rem;border:1px solid var(--c-border);border-radius:999px;padding:0.2rem}
.rou-order-preview .rou-dish-qty button {width:2.25rem;height:2.25rem;border:0;border-radius:999px;background:transparent;color:var(--c-text);font-size:1.1rem;cursor:pointer}
.rou-order-preview .rou-dish-qty span {min-width:1.4rem;text-align:center;font-weight:650}
.rou-order-preview .rou-dish-add {flex:1;border:0;border-radius:999px;background:var(--c-accent);color:var(--c-on-accent);min-height:2.9rem;padding:0.75rem 1rem;font:inherit;font-size:0.95rem;font-weight:650;cursor:pointer}
.rou-order-preview .rou-dish-add:disabled {opacity:.4;cursor:not-allowed}
@keyframes rou-sheet-up {from{transform:translateY(18px);opacity:.6}to{transform:none;opacity:1}}
@keyframes rou-review-up {from{transform:translate(-50%,18px);opacity:.6}to{transform:translateX(-50%);opacity:1}}
.rou-order-preview .rou-dish-sheet__panel {animation:rou-sheet-up .32s cubic-bezier(.22,1,.36,1)}
@keyframes rou-count-pop {0%{transform:scale(.7)}60%{transform:scale(1.12)}100%{transform:scale(1)}}
@keyframes rou-stepper-in {from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:none}}
.rou-order-preview .rou-order-shell button,
.rou-order-preview .rou-order-shell a,
.rou-order-preview .rou-order-shell summary,
.rou-order-preview .rou-order-shell input,
.rou-order-preview .rou-order-shell textarea {
  transition:transform 160ms ease-out,background-color 160ms ease-out,color 160ms ease-out,border-color 160ms ease-out,opacity 160ms ease-out,box-shadow 160ms ease-out;
}
.rou-order-preview .rou-order-shell button:focus-visible,
.rou-order-preview .rou-order-shell a:focus-visible,
.rou-order-preview .rou-order-shell summary:focus-visible,
.rou-order-preview .rou-order-shell input:focus-visible,
.rou-order-preview .rou-order-shell textarea:focus-visible {
  outline:none;
  box-shadow:0 0 0 3px color-mix(in srgb, var(--c-accent) 30%, transparent);
}
.rou-order-preview .rou-order-shell button:active:not(:disabled) {transform:scale(.94)}
.rou-order-preview .rou-order-shell .rou-order-mark {
  background:radial-gradient(circle at 30% 22%, color-mix(in srgb, var(--c-accent) 14%, transparent), transparent 34%), var(--c-surface);
  color:var(--c-text);
  font-size:.75rem;
  letter-spacing:.04em;
}
.rou-order-preview .rou-order-shell .rou-header-pill {
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
  gap:.375rem;
  margin:0;
  border:1px solid var(--c-border);
  background:var(--c-surface);
  padding:.375rem .75rem;
  border-radius:999px;
  font-family:inherit;
  font-size:.75rem;
  font-weight:600;
  line-height:1.25;
  color:var(--c-text);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  white-space:nowrap;
}
.rou-order-preview .rou-order-shell .rou-header-pill:hover {background:color-mix(in srgb, var(--c-text) 4%, var(--c-surface));color:var(--c-text)}
.rou-order-preview .rou-order-shell .rou-header-pill svg {width:.875rem;height:.875rem;flex:0 0 auto;opacity:1}
.rou-order-preview .rou-order-shell .rou-lang-switch {flex:0 0 auto;margin-left:auto}
.rou-order-preview .rou-order-shell .rou-lang-code {max-width:9rem;overflow:hidden;text-overflow:ellipsis}
.rou-order-preview .rou-order-shell .rou-lang-dropdown {
  right:0;
  left:auto;
  top:calc(100% + .5rem);
  width:10rem;
  min-width:10rem;
  max-width:min(16rem,calc(100cqw - var(--rou-page-inline) - var(--rou-page-inline-right)));
  max-height:min(15rem,60%);
  border-radius:1.5rem;
  padding:.5rem;
  box-shadow:var(--shadow-lg);
}
.rou-order-preview .rou-order-shell .rou-lang-option {
  justify-content:space-between;
  gap:.5rem;
  border-radius:999px;
  padding:.5rem .75rem;
  font-size:.875rem;
  line-height:1.25;
}
.rou-order-preview .rou-order-shell .rou-lang-flag {display:none}
.rou-order-preview .rou-order-shell .rou-lang-option.rou-lang-active {background:var(--c-dark);color:var(--c-on-accent);font-weight:600}
.rou-order-preview .rou-order-shell .rou-lang-option.rou-lang-active svg {flex:0 0 auto;color:inherit}
.rou-order-preview .rou-order-shell .rou-lang-option svg {width:.875rem;height:.875rem}
.rou-order-preview .rou-order-shell .rou-table-badge svg {width:.875rem;height:.875rem;flex:0 0 auto}
.rou-order-preview .rou-order-shell .rou-search-wrap input,
.rou-order-preview .rou-order-shell .rou-field input {
  border:1px solid var(--c-border);
  background:var(--c-surface);
  box-shadow:none;
}
.rou-order-preview .rou-order-shell .rou-search-wrap input:focus,
.rou-order-preview .rou-order-shell .rou-field input:focus,
.rou-order-preview .rou-order-shell .rou-field textarea:focus {
  box-shadow:0 0 0 3px color-mix(in srgb, var(--c-accent) 30%, transparent);
}
.rou-order-preview .rou-order-shell .rou-cat-rail {
  flex:0 0 5.5rem;
  width:5.5rem;
  padding:0;
  top:var(--rou-header-sticky-offset);
  max-height:calc(100% - var(--rou-header-sticky-offset));
  background:color-mix(in srgb, var(--c-text) 4%, var(--c-surface));
  border-right:1px solid color-mix(in srgb, var(--c-text) 12%, transparent);
}
.rou-order-preview .rou-order-shell .rou-cat-nav {gap:0;padding:.5rem 0}
.rou-order-preview .rou-order-shell .rou-cat-nav a {
  min-height:0;
  border-radius:0;
  padding:1rem .5rem;
  font-size:.72rem;
  font-weight:600;
  background:transparent;
}
.rou-order-preview .rou-order-shell .rou-cat-nav a:hover {background:var(--c-qty-bg);color:var(--c-text)}
.rou-order-preview .rou-order-shell .rou-cat-nav a:focus-visible {box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--c-accent) 40%, transparent);outline:none}
.rou-order-preview .rou-order-shell .rou-cat-nav a.cat-active {background:var(--c-surface);box-shadow:none;font-weight:700;color:var(--c-text)}
.rou-order-preview .rou-order-shell .rou-cat-nav a.cat-active::before {
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:3px;
  height:1.75rem;
  transform:translateY(-50%);
  border-radius:0 999px 999px 0;
  background:var(--c-accent);
}
.rou-order-preview .rou-order-shell .rou-cat-qty {top:.55rem;right:.3rem;width:1rem;height:1rem;min-width:1rem}
.rou-order-preview .rou-order-shell .rou-section-title {
  margin:0;
  top:calc(var(--rou-header-sticky-offset) - 1px);
  scroll-margin-top:calc(env(safe-area-inset-top, 0px) + var(--rou-header-sticky-offset));
  padding:.625rem 1rem;
  color:var(--c-text);
  font-size:.875rem;
  font-weight:600;
  letter-spacing:0;
  text-transform:none;
  background:color-mix(in srgb, var(--c-surface) 95%, transparent);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.rou-order-preview .rou-order-shell .rou-section-count {font-size:.7rem;font-weight:400}
.rou-order-preview .rou-order-shell .rou-item {padding:.875rem 1rem}
.rou-order-preview .rou-order-shell .rou-item.has-qty {background:transparent}
.rou-order-preview .rou-order-shell .rou-item-name {font-family:var(--font-display);font-size:.875rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-item-blurb {font-size:.75rem;line-height:1.625}
.rou-order-preview .rou-order-shell .rou-item-price {font-size:1rem;margin-top:0}
.rou-order-preview .rou-order-shell .rou-item-media,
.rou-order-preview .rou-order-shell .rou-item-photo,
.rou-order-preview .rou-order-shell .rou-item-photo img,
.rou-order-preview .rou-order-shell .rou-item-top > .rou-item-photo {width:5.25rem;height:5.25rem;flex-basis:5.25rem}
.rou-order-preview .rou-order-shell .rou-item-photo {border-radius:1rem}
.rou-order-preview .rou-order-shell .rou-item-photo:empty,
.rou-order-preview .rou-order-shell .rou-love__photo:not(:has(img)) {
  display:flex;
  align-items:center;
  justify-content:center;
}
.rou-order-preview .rou-order-shell .rou-item-photo:empty::after,
.rou-order-preview .rou-order-shell .rou-love__photo:not(:has(img))::after {
  content:"";
  width:1.25rem;
  height:1.25rem;
  background:var(--c-muted);
  opacity:.55;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.5 4.5L18 9l-4.5 1.5L12 15l-1.5-4.5L6 9l4.5-1.5L12 3z'/%3E%3Cpath d='M5 16l.8 2.2L8 19l-2.2.8L5 22l-.8-2.2L2 19l2.2-.8L5 16z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.5 4.5L18 9l-4.5 1.5L12 15l-1.5-4.5L6 9l4.5-1.5L12 3z'/%3E%3Cpath d='M5 16l.8 2.2L8 19l-2.2.8L5 22l-.8-2.2L2 19l2.2-.8L5 16z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.rou-order-preview .rou-order-shell .rou-item-photo img {transition:transform .3s ease}
.rou-order-preview .rou-order-shell .rou-item-photo:hover img {transform:scale(1.03)}
.rou-order-preview .rou-order-shell .rou-highlight-pill {gap:.25rem;padding:.125rem .4rem;font-size:.58rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-highlight-pill[data-flag]::before {
  content:"";
  width:.65rem;
  height:.65rem;
  flex:0 0 auto;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.072-2.143-.224-4.054 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.153.433-2.294 1-3a2.5 2.5 0 0 0 2.5 2.5z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.072-2.143-.224-4.054 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.153.433-2.294 1-3a2.5 2.5 0 0 0 2.5 2.5z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.rou-order-preview .rou-order-shell .rou-highlight-pill[data-flag="chefs-pick"]::before {
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.5 4.5L18 9l-4.5 1.5L12 15l-1.5-4.5L6 9l4.5-1.5L12 3z'/%3E%3Cpath d='M5 16l.8 2.2L8 19l-2.2.8L5 22l-.8-2.2L2 19l2.2-.8L5 16z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.5 4.5L18 9l-4.5 1.5L12 15l-1.5-4.5L6 9l4.5-1.5L12 3z'/%3E%3Cpath d='M5 16l.8 2.2L8 19l-2.2.8L5 22l-.8-2.2L2 19l2.2-.8L5 16z'/%3E%3C/svg%3E");
}
.rou-order-preview .rou-order-shell .rou-stepper {
  gap:.25rem;
  overflow:visible;
  background:transparent;
  border-radius:0;
}
.rou-order-preview .rou-order-shell .rou-stepper button {
  width:2rem;
  height:2rem;
  padding:0;
  border-radius:999px;
  background:transparent;
}
.rou-order-preview .rou-order-shell .rou-stepper button svg {width:1rem;height:1rem;display:block}
.rou-order-preview .rou-order-shell .rou-stepper .rou-plus,
.rou-order-preview .rou-order-shell .rou-stepper:not(.active) .rou-plus,
.rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper:not(.active) .rou-plus {
  width:2rem;
  height:2rem;
  background:var(--c-accent);
  color:var(--c-on-accent);
}
.rou-order-preview .rou-order-shell .rou-stepper .rou-plus:hover {background:var(--c-accent-hover);color:var(--c-on-accent)}
.rou-order-preview .rou-order-shell .rou-stepper .rou-minus {
  border:1px solid var(--c-border);
  color:var(--c-text);
  background:transparent;
  animation:rou-stepper-in .2s cubic-bezier(.22,1,.36,1) both;
}
.rou-order-preview .rou-order-shell .rou-stepper .rou-minus:hover {background:color-mix(in srgb, var(--c-text) 5%, transparent);color:var(--c-text)}
.rou-order-preview .rou-order-shell .rou-stepper .rou-qty {
  width:1.5rem;
  font-size:.875rem;
  font-weight:600;
}
.rou-order-preview .rou-order-shell .rou-stepper.active .rou-qty {animation:rou-count-pop .26s cubic-bezier(.34,1.56,.64,1) both}
.rou-order-preview .rou-order-shell .count-pop {animation:rou-count-pop .26s cubic-bezier(.34,1.56,.64,1) both}
.rou-order-preview .rou-order-shell .rou-love__head h2 {font-size:.875rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-love__name {font-weight:600}
.rou-order-preview .rou-order-shell .rou-love__price {font-size:.875rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-love-plus {display:inline-flex;align-items:center;justify-content:center;padding:0}
.rou-order-preview .rou-order-shell .rou-love-plus svg {width:.875rem;height:.875rem}
.rou-order-preview .rou-order-shell .rou-love-plus:hover {background:var(--c-accent-hover)}
.rou-order-preview .rou-order-shell .rou-choice {padding:.5rem .875rem;font-size:.875rem}
.rou-order-preview .rou-order-shell .rou-choice:hover {border-color:color-mix(in srgb, var(--c-text) 28%, var(--c-border))}
.rou-order-preview .rou-order-shell .rou-choice:focus-visible {outline:none;box-shadow:0 0 0 3px color-mix(in srgb, var(--c-accent) 30%, transparent)}
.rou-order-preview .rou-order-shell .rou-choice:active:not(.is-on) {transform:scale(.96);background:var(--c-qty-bg)}
.rou-order-preview .rou-order-shell .rou-dish-sheet__title {font-size:1.25rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-dish-sheet__price {font-size:1.125rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-dish-sheet__desc {font-size:.875rem}
.rou-order-preview .rou-order-shell .rou-dish-sheet__close,
.rou-order-preview .rou-order-shell .rou-review-close {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.25rem;
  height:2.25rem;
  padding:0;
}
.rou-order-preview .rou-order-shell .rou-dish-sheet__close svg,
.rou-order-preview .rou-order-shell .rou-review-close svg {width:1rem;height:1rem}
.rou-order-preview .rou-order-shell .rou-dish-qty {gap:.375rem;padding:.25rem}
.rou-order-preview .rou-order-shell .rou-dish-qty button {display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0}
.rou-order-preview .rou-order-shell .rou-dish-qty button svg {width:1rem;height:1rem}
.rou-order-preview .rou-order-shell .rou-dish-qty span {font-size:.875rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-dish-add {font-size:.875rem;font-weight:600;min-height:0;padding:.875rem 1.25rem}
.rou-order-preview .rou-order-shell .rou-dish-add:disabled {opacity:.4}
.rou-order-preview .rou-order-shell .rou-cart-float {
  bottom:max(.75rem, env(safe-area-inset-bottom, 0px));
  width:min(28rem, 100%);
  padding:0 .75rem;
  transform:translateX(-50%);
  pointer-events:none;
}
.rou-order-preview .rou-order-shell .rou-cart-float.visible {transform:translateX(-50%)}
.rou-order-preview .rou-order-shell .rou-cart-bar {
  pointer-events:auto;
  gap:.75rem;
  padding:.5rem;
}
.rou-order-preview .rou-order-shell .rou-cart-bag {
  width:3rem;
  height:3rem;
  border:0;
  padding:0;
  cursor:pointer;
  font:inherit;
}
.rou-order-preview .rou-order-shell .rou-cart-bag svg {width:1.25rem;height:1.25rem}
.rou-order-preview .rou-order-shell .rou-cart-count {min-width:1.25rem;height:1.25rem;font-size:.65rem}
.rou-order-preview .rou-order-shell .rou-cart-count[hidden],
.rou-order-preview .rou-order-shell .rou-cart-total[hidden] {display:none !important}
.rou-order-preview .rou-order-shell .rou-cart-bar-summary {flex-direction:column;align-items:flex-start;gap:0}
.rou-order-preview .rou-order-shell .rou-cart-total {font-size:1rem}
.rou-order-preview .rou-order-shell .rou-cart-hint {display:block;max-width:100%;font-size:.75rem;line-height:1.35;color:var(--c-muted)}
.rou-order-preview .rou-order-shell .rou-cart-float.visible .rou-cart-hint {font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rou-order-preview .rou-order-shell .rou-cart-submit {
  display:inline-flex;
  align-items:center;
  gap:.25rem;
  min-height:0;
  padding:.75rem 1.25rem;
  font-size:.875rem;
  font-weight:600;
}
.rou-order-preview .rou-order-shell .rou-cart-submit svg {width:1rem;height:1rem}
.rou-order-preview .rou-order-shell .rou-cart-submit:disabled {opacity:.35}
.rou-order-preview .rou-order-shell .rou-cart-submit:hover:not(:disabled) {background:var(--c-accent-hover)}
.rou-order-preview .rou-order-shell .rou-cart-submit:active:not(:disabled) {transform:scale(.94)}
.rou-order-preview .rou-order-shell .rou-review-backdrop {display:none}
.rou-order-preview .rou-order-shell .rou-cart-float.expanded .rou-review-backdrop {
  display:block;
  position:absolute;
  inset:0;
  z-index:55;
  border:0;
  padding:0;
  background:rgba(26,26,26,.45);
  cursor:pointer;
  pointer-events:auto;
}
.rou-order-preview .rou-order-shell .rou-cart-detail {max-height:none;overflow:visible;pointer-events:none}
.rou-order-preview .rou-order-shell .rou-cart-float.expanded .rou-cart-detail {
  display:block;
  position:absolute;
  z-index:60;
  left:50%;
  bottom:0;
  width:min(28rem, 100%);
  max-height:92%;
  overflow:auto;
  margin:0;
  padding:1.25rem 1.25rem max(1.25rem, env(safe-area-inset-bottom, 0px));
  transform:translateX(-50%);
  border:1px solid var(--c-border);
  border-radius:2rem 2rem 0 0;
  background:var(--c-surface);
  box-shadow:var(--shadow-lg);
  pointer-events:auto;
  animation:rou-review-up .32s cubic-bezier(.22,1,.36,1) both;
}
.rou-order-preview .rou-order-shell .rou-cart-float:not(.expanded) .rou-cart-detail {display:none}
.rou-order-preview .rou-order-shell .rou-review-head {display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}
.rou-order-preview .rou-order-shell .rou-review-title {margin:0;font-family:var(--font-display);font-size:1.125rem;font-weight:600;line-height:1.2}
.rou-order-preview .rou-order-shell .rou-review-sub {margin:.15rem 0 0;font-size:.75rem;color:var(--c-muted)}
.rou-order-preview .rou-order-shell .rou-review-close {border:1px solid var(--c-border);border-radius:999px;background:transparent;color:var(--c-text);cursor:pointer}
.rou-order-preview .rou-order-shell .rou-review-lines {list-style:none;margin:1rem 0 0;padding:0;max-height:42vh;overflow:auto}
.rou-order-preview .rou-order-shell .rou-review-line {display:flex;align-items:center;gap:.75rem;padding:.35rem 0}
.rou-order-preview .rou-order-shell .rou-review-line__copy {min-width:0;flex:1}
.rou-order-preview .rou-order-shell .rou-review-line__copy p {margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rou-order-preview .rou-order-shell .rou-review-line__copy p:first-child {font-size:.875rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-review-line__copy p:last-child {font-size:.75rem;color:var(--c-muted)}
.rou-order-preview .rou-order-shell .rou-review-step {display:flex;align-items:center;gap:.25rem}
.rou-order-preview .rou-order-shell .rou-review-step button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2rem;
  height:2rem;
  padding:0;
  border-radius:999px;
  cursor:pointer;
}
.rou-order-preview .rou-order-shell .rou-review-step svg {width:1rem;height:1rem}
.rou-order-preview .rou-order-shell .rou-review-less {border:1px solid var(--c-border);background:transparent;color:var(--c-text)}
.rou-order-preview .rou-order-shell .rou-review-more {border:0;background:var(--c-accent);color:var(--c-on-accent)}
.rou-order-preview .rou-order-shell .rou-review-step span {min-width:1.5rem;text-align:center;font-size:.875rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-review-line__sum {width:4rem;text-align:right;font-size:.875rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-review-totals {margin:1rem 0 0;padding:0;border-top:1px solid var(--c-border)}
.rou-order-preview .rou-order-shell .rou-review-totals div {display:flex;align-items:center;justify-content:space-between;padding-top:.7rem}
.rou-order-preview .rou-order-shell .rou-review-totals dt {font-size:.875rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-review-totals dd {margin:0;font-family:var(--font-display);font-size:1.125rem;font-weight:600}
.rou-order-preview .rou-order-shell .rou-cart-items {max-width:none;margin:0;padding:0}
.rou-order-preview .rou-order-shell .rou-review-send {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  width:100%;
  margin-top:1rem;
  padding:1rem 1.5rem;
  border:0;
  border-radius:999px;
  background:var(--c-accent);
  color:var(--c-on-accent);
  font:inherit;
  font-size:1rem;
  font-weight:600;
  cursor:pointer;
}
.rou-order-preview .rou-order-shell .rou-review-send svg {width:1rem;height:1rem}
.rou-order-preview .rou-order-shell .rou-review-send:disabled {opacity:.4;cursor:not-allowed}
.rou-order-preview .rou-order-shell .rou-review-send:hover:not(:disabled) {background:var(--c-accent-hover)}
.rou-order-preview .rou-order-shell .rou-review-clear {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.375rem;
  width:100%;
  margin-top:.5rem;
  padding:.625rem 1rem;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--c-muted);
  font:inherit;
  font-size:.75rem;
  font-weight:500;
  cursor:pointer;
}
.rou-order-preview .rou-order-shell .rou-review-clear svg {width:.875rem;height:.875rem}
.rou-order-preview .rou-order-shell .rou-review-clear:hover {color:var(--c-text)}
.rou-order-preview .rou-order-shell .rou-header-inner {align-items:stretch;width:100%;min-width:0}
.rou-order-preview .rou-order-shell .rou-header-top {width:100%;min-width:0}
.rou-order-preview .rou-order-shell .rou-header-context {width:100%;min-width:0}
.rou-order-preview .rou-order-shell .rou-site-name {white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rou-order-preview .rou-order-shell .rou-site-tag {white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rou-order-preview .rou-order-shell .rou-service-btn {margin-left:auto}
.rou-order-preview .rou-order-shell .rou-active-orders {
  margin-left:var(--rou-page-inline);
  margin-right:var(--rou-page-inline-right);
}
.rou-order-preview .rou-order-shell .rou-love__head,
.rou-order-preview .rou-order-shell .rou-love__row {
  padding-left:var(--rou-page-inline);
  padding-right:var(--rou-page-inline-right);
}
.rou-order-preview .rou-order-shell .rou-section-title {
  padding-left:var(--rou-page-inline);
  padding-right:var(--rou-page-inline-right);
}
.rou-order-preview .rou-order-shell .rou-item {
  padding:.9rem var(--rou-page-inline-right) .9rem var(--rou-page-inline);
}
.rou-order-preview .rou-order-shell .rou-delivery-panel {
  margin:1rem var(--rou-page-inline-right) 0 var(--rou-page-inline);
}
.rou-order-preview .rou-order-shell .rou-pre-submit {
  margin:var(--rou-gap-section) var(--rou-page-inline-right) var(--rou-gap-section) var(--rou-page-inline);
}
.rou-order-preview .rou-order-shell .rou-pre-submit > .rou-form-section.rou-notes-panel {margin-left:0;margin-right:0}
.rou-order-preview .rou-order-shell .rou-wallet-login-hint {
  margin-left:var(--rou-page-inline);
  margin-right:var(--rou-page-inline-right);
}
.rou-order-preview .rou-order-shell .rou-order-colophon {
  padding-left:var(--rou-page-inline);
  padding-right:var(--rou-page-inline-right);
}
.rou-order-preview .rou-service-sheet {position:absolute;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;background:transparent;box-shadow:none;color:var(--c-text)}
.rou-order-preview .rou-service-sheet:not([open]) {display:none}
.rou-order-preview .rou-service-sheet[open] {display:flex;align-items:flex-end;justify-content:center}
.rou-order-preview .rou-service-sheet::backdrop {background:rgba(26,26,26,.45)}
.rou-order-preview .rou-service-sheet__panel {
  position:relative;
  width:min(28rem,100%);
  max-height:min(92%,100%);
  overflow:auto;
  border-radius:2rem 2rem 0 0;
  background:var(--c-surface);
  box-shadow:var(--shadow-lg);
  padding:1.25rem 1.25rem max(1.25rem,env(safe-area-inset-bottom));
  animation:rou-sheet-up .32s cubic-bezier(.22,1,.36,1);
}
.rou-order-preview .rou-service-sheet__close {
  position:absolute;
  top:.7rem;
  right:.7rem;
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.25rem;
  height:2.25rem;
  padding:0;
  border:1px solid var(--c-border);
  border-radius:999px;
  background:color-mix(in srgb, var(--c-surface) 90%, transparent);
  color:var(--c-text);
  cursor:pointer;
}
.rou-order-preview .rou-service-sheet__close svg {width:1rem;height:1rem}
.rou-order-preview .rou-service-sheet__title {margin:0 2rem 0 0;font-family:var(--font-display);font-size:1.25rem;font-weight:600;line-height:1.2}
.rou-order-preview .rou-service-sheet__lead {margin:.4rem 0 0;font-size:.875rem;line-height:1.45;color:var(--c-muted)}
.rou-order-preview .rou-service-list {display:flex;flex-direction:column;gap:.5rem;margin-top:1rem}
.rou-order-preview .rou-service-ask {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:.15rem;
  width:100%;
  min-height:2.75rem;
  padding:.75rem .9rem;
  border:1px solid var(--c-border);
  border-radius:1rem;
  background:var(--c-surface);
  color:var(--c-text);
  font:inherit;
  text-align:left;
  cursor:pointer;
}
.rou-order-preview .rou-service-ask strong {font-size:.9rem;font-weight:600}
.rou-order-preview .rou-service-ask span {font-size:.75rem;line-height:1.35;color:var(--c-muted)}
.rou-order-preview .rou-service-ask:hover {border-color:color-mix(in srgb, var(--c-text) 28%, var(--c-border));background:var(--c-qty-bg)}
.rou-order-preview .rou-service-ask:focus-visible {outline:none;box-shadow:0 0 0 3px color-mix(in srgb, var(--c-accent) 30%, transparent)}
.rou-order-preview .rou-service-ask:active {transform:scale(.97)}
.rou-order-preview .rou-service-error {margin:.75rem 0 0;font-size:.8rem;color:var(--c-accent)}
.rou-order-preview .rou-service-again {
  display:inline-flex;
  margin-top:1rem;
  padding:.7rem 1rem;
  border:1px solid var(--c-border);
  border-radius:999px;
  background:transparent;
  color:var(--c-text);
  font:inherit;
  font-size:.8rem;
  font-weight:600;
  cursor:pointer;
}
.rou-order-preview .rou-order-shell .rou-dish-sheet__panel {max-height:min(92%,100%)}
@container rou-order (max-width: 380px) {
.rou-order-preview .rou-order-shell .rou-cat-rail {flex-basis:4.5rem;width:4.5rem}
.rou-order-preview .rou-order-shell .rou-cat-nav a {padding:.7rem .3rem;font-size:.65rem}
.rou-order-preview .rou-order-shell .rou-item-top > .rou-item-photo,
.rou-order-preview .rou-order-shell .rou-item-photo,
.rou-order-preview .rou-order-shell .rou-item-photo img {width:4rem;height:4rem}
.rou-order-preview .rou-order-shell .rou-item-top > .rou-item-photo {flex-basis:4rem}
.rou-order-preview .rou-order-shell .rou-cart-submit {padding:.65rem .7rem;font-size:.8rem}
.rou-order-preview .rou-order-shell .rou-service-btn {padding:.35rem .6rem}
.rou-order-preview .rou-order-shell .rou-site-name {font-size:.95rem}


}
@container rou-order (min-width: 900px) {
.rou-order-preview :is(.rou-order-shell, .rou-confirmed-shell) {
    --rou-page-inline:clamp(1.25rem,3cqw,2.5rem);
    --rou-page-inline-right:clamp(1.25rem,3cqw,2.5rem);
  }
.rou-order-preview .rou-order-frame {
    max-width:64rem;
    margin-inline:auto;
    min-height:calc(100% - 2.5rem);
    border-radius:2rem;
    box-shadow:0 18px 50px rgba(26,26,26,0.08);
  }
.rou-order-preview .rou-order-shell {padding-top:1rem;padding-bottom:calc(8rem + env(safe-area-inset-bottom,0px))}
.rou-order-preview .rou-cat-rail {flex:0 0 7.5rem;width:7.5rem}
.rou-order-preview .rou-cat-nav a {font-size:.82rem;padding:1rem .75rem}
.rou-order-preview .rou-pre-submit {display:grid;grid-template-columns:1fr 1fr;gap:0 1.25rem}
.rou-order-preview .rou-pre-submit > * {grid-column:auto}
.rou-order-preview .rou-pre-submit > .rou-form-section.rou-notes-panel {margin:0 0 var(--rou-gap) 0}


}
@container rou-order (min-width: 1200px) {
.rou-order-preview .rou-order-frame {max-width:80rem}
.rou-order-preview .rou-cat-rail {flex:0 0 9rem;width:9rem}
.rou-order-preview .rou-cat-nav a {font-size:.85rem;padding:1.1rem .85rem}


}
.rou-order-preview a.rou-switch-seat {text-decoration:none;color:inherit;cursor:pointer}
.rou-order-preview a.rou-switch-seat:hover,
.rou-order-preview a.rou-switch-seat:focus {text-decoration:none}
.rou-order-preview :is(.rou-order-shell, .rou-confirmed-shell) {
  --c-bg:var(--rou-cream,#FFF7ED);
  --c-surface:var(--rou-surface,#FFFFFF);
  --c-text:var(--rou-text,#3F3F46);
  --c-muted:var(--rou-text-light,#71717A);
  --c-border:color-mix(in srgb, var(--c-text) 12%, transparent);
  --c-accent:var(--rou-primary,#D90F32);
  --c-on-accent:#FFFFFF;
  --c-accent-light:color-mix(in srgb, var(--c-accent) 12%, var(--c-surface));
  --c-accent-hover:var(--rou-primary-dark,#B00D29);
  --c-dark:var(--rou-text-strong,#1E1E1E);
  --c-success:var(--rou-success,#16a34a);
  --c-danger:var(--rou-danger,#dc2626);
  --c-warm:var(--rou-cream-soft,#FFFCF5);
  --font-body:var(--rou-font-body,'Poppins',system-ui,-apple-system,sans-serif);
  --font-display:var(--rou-font-display,'Poppins',system-ui,-apple-system,sans-serif);
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-7:32px;
  --radius:999px;
  --radius-card:1.25rem;
  --shadow:0 1px 4px rgba(26,26,26,0.05);
  --shadow-lg:0 16px 40px rgba(26,26,26,0.12);
  --page-inline:max(1.25rem,env(safe-area-inset-left,0px));
  --page-inline-right:max(1.25rem,env(safe-area-inset-right,0px));
  --touch:44px;
}
.rou-order-preview * {box-sizing:border-box;margin:0;padding:0}
.rou-order-preview :is(.rou-order-shell, .rou-confirmed-shell) {-webkit-text-size-adjust:100%}
.rou-order-preview .rou-confirmed-shell {
  font-family:var(--font-body);
  background:var(--c-bg);
  color:var(--c-text);
  font-size:15px;
  line-height:1.55;
  padding:0;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  min-height:100%;
}
.rou-order-preview .rou-confirmed-card {
  width:100%;
  max-width:none;
  margin:0;
  min-height:100%;
  background:var(--c-surface);
  display:flex;
  flex-direction:column;
  
  padding:max(0px,env(safe-area-inset-top,0px)) max(0px,env(safe-area-inset-right,0px)) max(0px,env(safe-area-inset-bottom,0px)) max(0px,env(safe-area-inset-left,0px));
}
.rou-order-preview .rou-confirmed-header {
  display:flex;
  align-items:center;
  gap:0.75rem;
  padding:1rem 1.25rem;
  border-bottom:1px solid var(--c-border);
}
.rou-order-preview .rou-confirmed-mark {
  width:2.5rem;height:2.5rem;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;
  border:1px solid var(--c-border);
  background:var(--c-warm);
  color:var(--c-accent);
  font-family:var(--font-display);
  font-size:0.78rem;font-weight:600;letter-spacing:0.04em;
  overflow:hidden;
}
.rou-order-preview .rou-confirmed-mark img {width:100%;height:100%;object-fit:cover;border-radius:50%}
.rou-order-preview .rou-confirmed-header-info {min-width:0;flex:1}
.rou-order-preview .rou-confirmed-restaurant {
  display:block;
  font-family:var(--font-display);
  font-size:1rem;font-weight:600;line-height:1.25;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.rou-order-preview .rou-confirmed-meta {
  display:block;
  font-size:0.75rem;color:var(--c-muted);line-height:1.3;
  margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.rou-order-preview .rou-confirmed-table-chip {
  display:inline-flex;align-items:center;gap:0.375rem;
  flex-shrink:0;
  padding:0.375rem 0.75rem;
  border-radius:999px;
  background:var(--c-dark);
  color:var(--c-surface);
  font-size:0.75rem;font-weight:600;
  line-height:1;
}
.rou-order-preview .rou-confirmed-table-chip svg {width:0.875rem;height:0.875rem}
.rou-order-preview .rou-confirmed-body {
  flex:1;
  padding:1.5rem 1.25rem 2rem;
  display:flex;
  flex-direction:column;
  gap:1.75rem;
}
.rou-order-preview .rou-confirmed-moment {
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:0.5rem;
  padding:2.25rem 1.5rem 2rem;
  background:
    radial-gradient(130% 95% at 50% -12%, color-mix(in srgb, var(--c-accent) 12%, transparent) 0%, transparent 58%),
    linear-gradient(180deg, var(--c-warm) 0%, var(--c-bg) 100%);
  border-bottom:1px solid color-mix(in srgb, var(--c-accent) 10%, transparent);
}
.rou-order-preview .rou-confirmed-seal {
  width:4.75rem;height:4.75rem;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;
  background:var(--c-accent);
  color:#fff;
  transform:rotate(-6deg);
  box-shadow:0 0 0 5px color-mix(in srgb, var(--c-accent) 12%, transparent),
             0 0 0 6px color-mix(in srgb, var(--c-accent) 22%, transparent),
             0 12px 26px color-mix(in srgb, var(--c-accent) 28%, transparent);
  animation:rou-seal-in .55s cubic-bezier(.34,1.56,.64,1) both;
}
.rou-order-preview .rou-confirmed-seal svg {width:2.4rem;height:2.4rem;display:block}
@keyframes rou-seal-in {
  0%{transform:rotate(-6deg) scale(1.5);opacity:0}
  60%{transform:rotate(-6deg) scale(.94);opacity:1}
  100%{transform:rotate(-6deg) scale(1);opacity:1}
}
.rou-order-preview .rou-confirmed-seal--paid {
  background:var(--c-success);
  box-shadow:0 0 0 5px color-mix(in srgb, var(--c-success) 12%, transparent),
             0 0 0 6px color-mix(in srgb, var(--c-success) 22%, transparent),
             0 12px 26px color-mix(in srgb, var(--c-success) 28%, transparent);
}
.rou-order-preview .rou-confirmed-seal--awaiting {
  background:var(--c-surface);
  color:var(--c-accent);
  border:2px solid color-mix(in srgb, var(--c-accent) 35%, transparent);
  box-shadow:0 0 0 5px color-mix(in srgb, var(--c-accent) 8%, transparent),
             0 8px 20px color-mix(in srgb, var(--c-accent) 14%, transparent);
}
.rou-order-preview .rou-confirmed-moment h1 {
  font-family:var(--font-display);
  font-size:1.75rem;font-weight:700;line-height:1.12;
  color:var(--c-text);
  margin:0.5rem 0 0;
  letter-spacing:-0.01em;
}
.rou-order-preview .rou-confirmed-moment > p {
  font-size:0.9375rem;color:var(--c-muted);line-height:1.45;
  margin:0;
  max-width:26rem;
}
.rou-order-preview .rou-confirmed-moment:not(.rou-confirmed-moment--pay) {
  --overhang:3.25rem;
  position:relative;
  isolation:isolate;
  gap:0;
  padding:2.25rem 1.25rem 0;
  color:#fff;
  background:
    radial-gradient(85% 70% at 50% -8%, color-mix(in srgb, #fff 22%, transparent) 0%, transparent 70%),
    radial-gradient(60% 50% at 100% 100%, color-mix(in srgb, #000 16%, transparent) 0%, transparent 100%),
    var(--c-accent);
  border-bottom:0;
  border-radius:0 0 2rem 2rem;
  transition:background-color .4s ease;
}
.rou-order-preview .rou-confirmed-moment:not(.rou-confirmed-moment--pay)::before {
  content:'';
  position:absolute;inset:0;z-index:-1;
  border-radius:inherit;
  background-image:radial-gradient(color-mix(in srgb, #fff 16%, transparent) 1px, transparent 1.5px);
  background-size:16px 16px;
  -webkit-mask-image:linear-gradient(180deg, #000 0%, transparent 72%);
          mask-image:linear-gradient(180deg, #000 0%, transparent 72%);
  pointer-events:none;
}
.rou-order-preview .rou-confirmed-moment.is-awaiting,
.rou-order-preview .rou-confirmed-moment.is-cancelled {
  background:
    radial-gradient(85% 70% at 50% -8%, color-mix(in srgb, #fff 12%, transparent) 0%, transparent 70%),
    var(--c-dark);
}
.rou-order-preview .rou-confirmed-moment:not(.rou-confirmed-moment--pay) + .rou-confirmed-body {
  padding-top:calc(var(--overhang, 3.25rem) + 1.75rem);
}
.rou-order-preview .rou-confirmed-hero {
  display:flex;flex-direction:column;align-items:center;
  gap:0.5rem;
  width:100%;max-width:26rem;
}
.rou-order-preview .rou-confirmed-hero .rou-confirmed-seal {
  width:4.25rem;height:4.25rem;
  background:#fff;
  color:var(--c-accent);
  box-shadow:0 0 0 6px color-mix(in srgb, #fff 20%, transparent),
             0 0 0 7px color-mix(in srgb, #fff 32%, transparent),
             0 16px 30px color-mix(in srgb, #000 24%, transparent);
}
.rou-order-preview .rou-confirmed-hero .rou-confirmed-seal svg {width:2.125rem;height:2.125rem}
.rou-order-preview .rou-confirmed-hero .rou-confirmed-seal--paid {color:var(--c-success)}
.rou-order-preview .rou-confirmed-hero .rou-confirmed-seal--awaiting {
  background:transparent;color:#fff;
  border:2px solid color-mix(in srgb, #fff 55%, transparent);
  box-shadow:none;
}
.rou-order-preview .rou-confirmed-hero h1 {
  margin:0.75rem 0 0;
  font-family:var(--font-display);
  font-size:1.875rem;font-weight:800;line-height:1.08;
  letter-spacing:-0.025em;
  color:#fff;
  text-wrap:balance;
}
.rou-order-preview .rou-confirmed-hero p {
  margin:0;
  max-width:22rem;
  font-size:0.9375rem;line-height:1.45;
  color:color-mix(in srgb, #fff 88%, transparent);
  text-wrap:pretty;
}
.rou-order-preview .rou-confirmed-ticket {
  position:relative;
  isolation:isolate;
  width:min(100%, 21rem);
  margin:1.625rem 0 calc(var(--overhang, 3.25rem) * -1);
  padding:1.125rem 1.25rem 1.25rem;
  display:flex;flex-direction:column;align-items:center;gap:0.125rem;
  color:var(--c-text);
  filter:drop-shadow(0 16px 22px color-mix(in srgb, #000 20%, transparent)) drop-shadow(0 1px 2px color-mix(in srgb, #000 10%, transparent));
  animation:rou-ticket-drop .6s cubic-bezier(.22,1,.36,1) .15s both;
}
.rou-order-preview .rou-confirmed-ticket::before {
  content:'';
  position:absolute;inset:0;z-index:-1;
  border-radius:1.25rem 1.25rem 0 0;
  background:var(--c-surface);
  -webkit-mask:radial-gradient(circle at 50% 100%, #0000 0.3rem, #000 calc(0.3rem + 0.5px)) 50% 100% / 0.875rem 100% repeat-x;
          mask:radial-gradient(circle at 50% 100%, #0000 0.3rem, #000 calc(0.3rem + 0.5px)) 50% 100% / 0.875rem 100% repeat-x;
}
@keyframes rou-ticket-drop {
  0%{opacity:0;transform:translateY(-14px)}
  100%{opacity:1;transform:translateY(0)}
}
.rou-order-preview .rou-order-ticket-label {
  font-family:var(--font-display);
  font-size:0.6875rem;font-weight:600;
  text-transform:uppercase;letter-spacing:0.16em;
  color:var(--c-muted);
}
.rou-order-preview .rou-confirmed-ticket .rou-order-ticket-number {
  font-family:var(--font-display);
  font-size:3rem;font-weight:800;
  line-height:1;
  letter-spacing:-0.035em;
  font-variant-numeric:tabular-nums;
  color:var(--c-dark);
}
.rou-order-preview .rou-confirmed-ticket-meta {
  margin:0.25rem 0 0;
  font-size:0.8125rem;font-weight:500;line-height:1.3;
  color:var(--c-muted);
}
.rou-order-preview .rou-confirmed-ticket-stamp {
  position:absolute;top:0.875rem;right:0.875rem;
  padding:0.1875rem 0.5rem;
  border:2px solid currentColor;
  border-radius:0.375rem;
  color:var(--c-success);
  font-family:var(--font-display);
  font-size:0.625rem;font-weight:800;line-height:1.2;
  letter-spacing:0.14em;text-transform:uppercase;
  transform:rotate(-12deg);
  opacity:0.92;
  animation:rou-stamp-in .45s cubic-bezier(.34,1.56,.64,1) .65s both;
}
@keyframes rou-stamp-in {
  0%{opacity:0;transform:rotate(-12deg) scale(1.8)}
  100%{opacity:0.92;transform:rotate(-12deg) scale(1)}
}
.rou-order-preview .rou-confirmed-ticket-foot {
  width:100%;
  margin-top:0.875rem;
  padding-top:0.875rem;
  border-top:1.5px dashed color-mix(in srgb, var(--c-text) 18%, transparent);
  display:flex;justify-content:center;
}
.rou-order-preview .rou-confirmed-ticket-foot:empty {display:none}
.rou-order-preview .rou-confirmed-eta {
  display:flex;align-items:center;gap:0.625rem;
  text-align:left;
}
.rou-order-preview .rou-confirmed-eta > svg {width:1.625rem;height:1.625rem;flex:0 0 auto;color:var(--c-accent)}
.rou-order-preview .rou-confirmed-eta-line {
  margin:0;
  font-family:var(--font-display);
  font-size:1rem;font-weight:700;line-height:1.25;
  color:var(--c-dark);
}
.rou-order-preview .rou-confirmed-eta-note {
  margin:0.125rem 0 0;
  font-size:0.75rem;line-height:1.4;
  color:var(--c-muted);
}
.rou-order-preview .rou-confirmed-live {
  display:inline-flex;align-items:center;gap:0.5rem;
  margin:0;
  font-size:0.75rem;font-weight:600;line-height:1.3;
  color:var(--c-muted);
}
.rou-order-preview .rou-confirmed-live-dot {
  position:relative;
  width:0.5rem;height:0.5rem;flex:0 0 auto;
  border-radius:50%;
  background:var(--c-success);
}
.rou-order-preview .rou-confirmed-live-dot::after {
  content:'';
  position:absolute;inset:0;
  border-radius:50%;
  background:var(--c-success);
  animation:rou-live-ping 1.8s ease-out infinite;
}
@keyframes rou-live-ping {
  0%{transform:scale(1);opacity:.55}
  80%,100%{transform:scale(2.6);opacity:0}
}
.rou-order-preview .rou-confirmed-steps h2,
.rou-order-preview .rou-confirmed-shell:not(.rou-pay-shell) .rou-confirmed-receipt h2 {
  font-family:var(--font-display);
  font-size:0.6875rem;font-weight:700;margin:0 0 0.875rem;
  text-transform:uppercase;letter-spacing:0.14em;
  color:var(--c-muted);
}
.rou-order-preview .rou-status-card {
  display:flex;align-items:center;gap:0.875rem;
  padding:1rem 1.125rem;
  border-radius:1.25rem;
  background:var(--c-warm);
  border:1px solid color-mix(in srgb, var(--c-accent) 14%, transparent);
  margin-bottom:1.375rem;
  animation:rou-card-enter .5s cubic-bezier(.22,1,.36,1) both;
}
@keyframes rou-card-enter {
  0%{opacity:0;transform:translateY(8px) scale(.97)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}
.rou-order-preview .rou-status-card-icon {
  display:inline-flex;align-items:center;justify-content:center;
  width:2.75rem;height:2.75rem;
  flex-shrink:0;
  border-radius:50%;
  background:var(--c-accent);
  color:#fff;
  box-shadow:0 8px 18px color-mix(in srgb, var(--c-accent) 28%, transparent);
}
.rou-order-preview .rou-status-card-icon svg {width:1.375rem;height:1.375rem;display:block}
.rou-order-preview .rou-status-card-icon:empty {display:none}
.rou-order-preview .rou-status-card-text {
  display:flex;flex-direction:column;gap:0.125rem;
  min-width:0;
}
.rou-order-preview .rou-status-card-title {
  font-family:var(--font-display);
  font-size:1.0625rem;font-weight:700;line-height:1.2;
  color:var(--c-dark);
}
.rou-order-preview .rou-status-card-note {
  font-size:0.8125rem;color:var(--c-muted);line-height:1.4;
}
.rou-order-preview .rou-progress {
  position:relative;
  padding:0 0.5rem;
}
.rou-order-preview .rou-progress[hidden] {display:none}
.rou-order-preview .rou-progress-rail {
  position:absolute;
  top:0.6875rem;left:calc(16.66% + 0.5rem);right:calc(16.66% + 0.5rem);
  height:3px;
  border-radius:999px;
  background:color-mix(in srgb, var(--c-text) 10%, transparent);
  overflow:hidden;
  z-index:0;
}
.rou-order-preview .rou-progress-fill {
  height:100%;
  border-radius:999px;
  background:var(--c-accent);
  transition:width .8s cubic-bezier(.22,1,.36,1);
}
.rou-order-preview .rou-progress-nodes {
  display:flex;
  justify-content:space-between;
  position:relative;
  z-index:1;
}
.rou-order-preview .rou-progress-node {
  display:flex;flex-direction:column;align-items:center;
  gap:0.5rem;
  width:33.33%;
}
.rou-order-preview .rou-progress-dot {
  width:1.375rem;height:1.375rem;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;
  border:2px solid color-mix(in srgb, var(--c-text) 16%, transparent);
  background:var(--c-surface);
  flex-shrink:0;
  position:relative;
  transition:all .45s cubic-bezier(.34,1.56,.64,1);
}
.rou-order-preview .rou-progress-dot::after {
  content:'';
  width:0.4375rem;height:0.4375rem;
  border-radius:50%;
  background:transparent;
  transition:background .3s;
}
.rou-order-preview .rou-progress-node.is-done .rou-progress-dot {
  background:var(--c-accent);
  border-color:var(--c-accent);
}
.rou-order-preview .rou-progress-node.is-done .rou-progress-dot::after {
  width:0.375rem;height:0.625rem;
  border-radius:0;
  background:transparent;
  border:solid #fff;border-width:0 2px 2px 0;
  transform:translateY(-1px) rotate(45deg);
}
.rou-order-preview .rou-progress-node.is-active .rou-progress-dot {
  background:var(--c-surface);
  border-color:var(--c-accent);
  border-width:2.5px;
  transform:scale(1.15);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--c-accent) 16%, transparent);
}
.rou-order-preview .rou-progress-node.is-active .rou-progress-dot::after {
  background:var(--c-accent);
}
.rou-order-preview .rou-progress-node.is-active .rou-progress-dot::before {
  content:'';
  position:absolute;inset:-5px;
  border-radius:50%;
  border:2px solid var(--c-accent);
  opacity:0;
  animation:rou-pulse 2s ease-out infinite;
}
@keyframes rou-pulse {
  0%{transform:scale(1);opacity:.5}
  70%{transform:scale(1.45);opacity:0}
  100%{transform:scale(1.45);opacity:0}
}
.rou-order-preview .rou-progress-label {
  font-family:var(--font-display);
  font-size:0.75rem;font-weight:600;
  color:var(--c-muted);
  text-align:center;
  transition:color .3s;
}
.rou-order-preview .rou-progress-node.is-done .rou-progress-label {
  color:var(--c-text);
}
.rou-order-preview .rou-progress-node.is-active .rou-progress-label {
  color:var(--c-accent);
  font-weight:700;
}
.rou-order-preview .rou-confirmed-receipt h2 {
  font-size:0.875rem;font-weight:600;margin:0 0 0.5rem;
}
.rou-order-preview .rou-confirmed-items {
  list-style:none;padding:0;margin:0;
  border:1px solid var(--c-border);
  border-radius:var(--radius-card);
  background:var(--c-surface);
  overflow:hidden;
}
.rou-order-preview .rou-confirmed-item {
  display:flex;align-items:center;gap:0.75rem;
  padding:0.75rem 1rem;
}
.rou-order-preview .rou-confirmed-item+.rou-confirmed-item {
  border-top:1px solid color-mix(in srgb, var(--c-border) 60%, transparent);
}
.rou-order-preview .rou-confirmed-item-qty {
  width:1.75rem;height:1.75rem;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;
  background:var(--c-warm);
  font-size:0.75rem;font-weight:600;
  color:var(--c-muted);
}
.rou-order-preview .rou-confirmed-item-name {
  flex:1;min-width:0;
  font-size:0.875rem;font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.rou-order-preview .rou-confirmed-item-price {
  flex-shrink:0;
  font-size:0.875rem;font-weight:600;
  white-space:nowrap;
}
.rou-order-preview .rou-confirmed-totals {
  border:1px solid var(--c-border);
  border-radius:var(--radius-card);
  background:var(--c-surface);
  padding:1rem;
  margin-top:0.75rem;
}
.rou-order-preview .rou-confirmed-totals dl {
  display:flex;flex-direction:column;gap:0.375rem;
  font-size:0.875rem;
}
.rou-order-preview .rou-confirmed-totals dl>div {
  display:flex;align-items:center;justify-content:space-between;
}
.rou-order-preview .rou-confirmed-totals dt {
  color:var(--c-muted);font-weight:400;
}
.rou-order-preview .rou-confirmed-totals dd {
  font-weight:400;
  margin:0;
}
.rou-order-preview .rou-confirmed-totals .is-total {
  border-top:1px solid var(--c-border);
  padding-top:0.5rem;
  margin-top:0.25rem;
}
.rou-order-preview .rou-confirmed-totals .is-total dt {
  font-weight:600;color:var(--c-text);
}
.rou-order-preview .rou-confirmed-totals .is-total dd {
  font-family:var(--font-display);
  font-size:1.125rem;font-weight:600;
  color:var(--c-text);
}
.rou-order-preview .rou-confirmed-shell:not(.rou-pay-shell) .rou-confirmed-items {
  border:0;
  border-radius:1.25rem 1.25rem 0 0;
  background:var(--c-warm);
  padding:0.375rem 0;
}
.rou-order-preview .rou-confirmed-shell:not(.rou-pay-shell) .rou-confirmed-item+.rou-confirmed-item {
  border-top:1px dashed color-mix(in srgb, var(--c-text) 12%, transparent);
}
.rou-order-preview .rou-confirmed-shell:not(.rou-pay-shell) .rou-confirmed-item-qty {
  background:var(--c-surface);
  color:var(--c-text);
}
.rou-order-preview .rou-confirmed-shell:not(.rou-pay-shell) .rou-confirmed-totals {
  margin-top:0;
  border:0;
  border-top:1.5px dashed color-mix(in srgb, var(--c-text) 18%, transparent);
  border-radius:0;
  background:var(--c-warm);
  padding-bottom:1.375rem;
  -webkit-mask:radial-gradient(circle at 50% 100%, #0000 0.3rem, #000 calc(0.3rem + 0.5px)) 50% 100% / 0.875rem 100% repeat-x;
          mask:radial-gradient(circle at 50% 100%, #0000 0.3rem, #000 calc(0.3rem + 0.5px)) 50% 100% / 0.875rem 100% repeat-x;
}
.rou-order-preview .rou-confirmed-shell:not(.rou-pay-shell) .rou-confirmed-totals dl,
.rou-order-preview .rou-confirmed-shell:not(.rou-pay-shell) .rou-confirmed-totals {
  display:flex;flex-direction:column;gap:0.375rem;
  font-size:0.875rem;
}
.rou-order-preview .rou-confirmed-shell:not(.rou-pay-shell) .rou-confirmed-totals > div {
  display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
}
.rou-order-preview .rou-confirmed-shell:not(.rou-pay-shell) .rou-confirmed-totals .is-total dd {
  font-size:1.25rem;font-weight:800;letter-spacing:-0.01em;
}
.rou-order-preview .rou-confirmed-paid-row {
  display:flex;
  justify-content:center;
}
.rou-order-preview .rou-confirmed-paid {
  display:inline-flex;align-items:center;gap:0.375rem;
  padding:0.5rem 1rem;
  border-radius:999px;
  background:color-mix(in srgb, var(--c-success) 12%, var(--c-surface));
  color:var(--c-success);
  font-size:0.8125rem;font-weight:700;
}
.rou-order-preview .rou-confirmed-pay-section {
  border:1px solid var(--c-border);
  border-radius:var(--radius-card);
  background:var(--c-warm);
  padding:1.25rem;
}
.rou-order-preview .rou-confirmed-pay-label {
  font-size:0.875rem;font-weight:600;display:block;margin-bottom:0.75rem;
}
.rou-order-preview .rou-confirmed-pay-modes {
  display:flex;gap:0.5rem;flex-wrap:wrap;margin-bottom:0.625rem;
}
.rou-order-preview .rou-confirmed-pay-mode {
  padding:0.5rem 1rem;
  border:1px solid var(--c-border);
  border-radius:999px;
  background:var(--c-surface);
  color:var(--c-text);
  font:inherit;font-size:0.8125rem;font-weight:600;
  cursor:pointer;
  transition:background .15s,border-color .15s,opacity .15s;
}
.rou-order-preview .rou-confirmed-pay-mode:hover {
  border-color:var(--c-dark);color:var(--c-dark);
}
.rou-order-preview .rou-confirmed-pay-mode.is-active {
  background:var(--c-dark);color:#fff;border-color:var(--c-dark);
}
.rou-order-preview .rou-confirmed-pay-hint {
  font-size:0.75rem;color:var(--c-muted);margin-bottom:0.625rem;
}
.rou-order-preview .rou-confirmed-pay-loading {
  text-align:center;padding:1.25rem;color:var(--c-muted);font-size:0.875rem;
}
.rou-order-preview .rou-confirmed-pay-errors {
  color:var(--c-danger,#dc2626);font-size:0.8125rem;margin-top:0.5rem;min-height:1rem;
}
.rou-order-preview .rou-pay-wechat {
  margin-top:0.75rem;
  display:flex;flex-direction:column;align-items:center;gap:0.75rem;
  padding:1.25rem;
  border:1px solid var(--c-border,rgba(63,63,70,0.12));
  border-radius:16px;
  background:var(--c-surface,#fff);
  text-align:center;
}
.rou-order-preview .rou-pay-wechat .rou-btn {width:100%}
.rou-order-preview .rou-btn--wechat {
  background:#07C160;color:#fff;
  box-shadow:0 4px 14px color-mix(in srgb, #07C160 25%, transparent);
}
.rou-order-preview .rou-btn--wechat:hover {background:#06AD56}
.rou-order-preview .rou-pay-wechat-qr {
  padding:0.625rem;background:#fff;
  border:1px solid var(--c-border,rgba(63,63,70,0.12));
  border-radius:12px;line-height:0;
}
.rou-order-preview .rou-pay-wechat-qr img {width:11.25rem;height:11.25rem;display:block}
.rou-order-preview .rou-pay-wechat-hint {
  margin:0;font-size:0.8125rem;line-height:1.5;color:var(--c-muted);max-width:22rem;
}
@container rou-order (max-width: 640px) {
.rou-order-preview .rou-pay-wechat-qr img {width:9.375rem;height:9.375rem}


}
.rou-order-preview .rou-confirmed-section {
  border:1px solid var(--c-border);
  border-radius:var(--radius-card);
  background:var(--c-surface);
  padding:1rem;
}
.rou-order-preview .rou-confirmed-section h2 {
  font-family:var(--font-display);
  font-size:1rem;font-weight:600;line-height:1.25;
  margin:0;
}
.rou-order-preview .rou-confirmed-section p {
  font-size:0.75rem;color:var(--c-muted);line-height:1.45;
  margin:0.25rem 0 0;
}
.rou-order-preview .rou-confirmed-email-row {
  display:flex;gap:0.5rem;margin-top:0.5rem;
}
.rou-order-preview .rou-confirmed-email-input {
  flex:1;min-width:0;
  padding:0.75rem 1rem;
  border:1px solid var(--c-border);
  border-radius:999px;
  background:var(--c-surface);
  font:inherit;font-size:0.875rem;
  color:var(--c-text);
  outline:none;
  transition:border-color .15s,box-shadow .15s;
}
.rou-order-preview .rou-confirmed-email-input:focus {
  border-color:var(--c-dark);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--c-dark) 10%, transparent);
}
.rou-order-preview .rou-confirmed-email-input::placeholder {color:var(--c-muted)}
.rou-order-preview .rou-confirmed-email-sent {
  display:flex;align-items:flex-start;gap:0.5rem;
  font-size:0.875rem;font-weight:600;
}
.rou-order-preview .rou-confirmed-email-sent svg {width:1rem;height:1rem;flex-shrink:0;margin-top:2px}
.rou-order-preview .rou-confirmed-email-sent-note {
  margin-top:0.375rem;
  font-size:0.75rem;color:var(--c-muted);line-height:1.45;
}
.rou-order-preview .rou-confirmed-review {
  border:1px solid var(--c-border);
  border-radius:var(--radius-card);
  background:var(--c-surface);
  padding:1rem;
}
.rou-order-preview .rou-confirmed-delivery {
  padding:0.75rem 1rem;
  border-radius:var(--radius-card);
  background:var(--c-warm);
  border:1px solid var(--c-border);
  font-size:0.875rem;line-height:1.45;
}
.rou-order-preview .rou-confirmed-delivery strong {
  display:block;margin-bottom:0.25rem;
  font-size:0.75rem;text-transform:uppercase;letter-spacing:0.04em;
  color:var(--c-muted);
}
.rou-order-preview .rou-btn {
  display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;
  padding:0.75rem 1.25rem;
  border:none;border-radius:999px;
  font:inherit;font-size:0.875rem;font-weight:600;
  cursor:pointer;
  text-decoration:none;
  text-align:center;
  transition:background .15s,opacity .15s,transform .1s;
  -webkit-tap-highlight-color:transparent;
  max-width:100%;box-sizing:border-box;
  line-height:1.2;
}
.rou-order-preview .rou-btn:active {transform:scale(.97)}
.rou-order-preview .rou-btn:disabled {opacity:.5;cursor:not-allowed}
.rou-order-preview .rou-btn svg {width:1rem;height:1rem;flex-shrink:0}
.rou-order-preview .rou-btn--primary {
  background:var(--c-dark);color:#fff;
  box-shadow:0 4px 14px color-mix(in srgb, var(--c-dark) 18%, transparent);
}
.rou-order-preview .rou-btn--primary:hover {background:color-mix(in srgb, var(--c-dark) 86%, #fff)}
.rou-order-preview .rou-btn--outline {
  background:transparent;color:var(--c-text);
  border:1px solid var(--c-border);
}
.rou-order-preview .rou-btn--outline:hover {border-color:var(--c-dark);color:var(--c-dark)}
.rou-order-preview .rou-btn--ghost {
  background:transparent;color:var(--c-text);
  border:1px solid var(--c-border);
}
.rou-order-preview .rou-btn--ghost:hover {background:var(--c-warm)}
.rou-order-preview .rou-btn--block {width:100%}
.rou-order-preview .rou-confirmed-actions {
  display:flex;flex-direction:column;gap:0.5rem;
}
.rou-order-preview .rou-confirmed-farewell {
  display:flex;flex-direction:column;align-items:center;gap:0.375rem;
  padding:1.25rem 0 0.25rem;
  text-align:center;
}
.rou-order-preview .rou-confirmed-farewell::before {
  content:'';
  width:2.25rem;height:3px;border-radius:3px;
  background:var(--c-accent);
  margin-bottom:0.625rem;
}
.rou-order-preview .rou-confirmed-closing {
  margin:0;
  text-align:center;
  font-family:var(--font-display);
  font-size:1.5rem;font-weight:800;line-height:1.15;
  letter-spacing:-0.02em;
  color:var(--c-dark);
  text-wrap:balance;
}
.rou-order-preview .rou-confirmed-signoff {
  margin:0;
  font-size:0.8125rem;font-weight:500;font-style:italic;
  color:var(--c-muted);
}
.rou-order-preview .rou-confirmed-footer {
  padding:1rem 1.25rem;
  text-align:center;
  font-size:0.75rem;color:var(--c-muted);
  border-top:1px solid var(--c-border);
}
.rou-order-preview .rou-pay-tip-pills {
  display:flex;flex-wrap:wrap;gap:0.5rem;margin-top:0.5rem;
}
.rou-order-preview .rou-pay-tip-pill {
  padding:0.5rem 1rem;
  border:1px solid var(--c-border);
  border-radius:999px;
  background:var(--c-surface);
  color:var(--c-text);
  font:inherit;font-size:0.875rem;
  cursor:pointer;
  transition:background .15s,border-color .15s,color .15s;
  -webkit-tap-highlight-color:transparent;
}
.rou-order-preview .rou-pay-tip-pill:hover {border-color:var(--c-dark);color:var(--c-dark)}
.rou-order-preview .rou-pay-tip-pill.is-selected {
  background:var(--c-dark);border-color:var(--c-dark);color:var(--c-surface);font-weight:600;
}
.rou-order-preview .rou-pay-tip-pill-value {
  font-size:0.7rem;margin-left:0.375rem;opacity:0.8;
}
.rou-order-preview .rou-pay-methods {
  list-style:none;padding:0;margin:0.5rem 0 0;
  display:flex;flex-direction:column;gap:0.5rem;
}
.rou-order-preview .rou-pay-method {
  display:flex;align-items:center;gap:0.75rem;
  padding:0.75rem 1rem;
  border:1px solid var(--c-border);
  border-radius:var(--radius-card);
  background:var(--c-surface);
  cursor:pointer;
  transition:border-color .15s,background .15s;
  -webkit-tap-highlight-color:transparent;
  width:100%;text-align:left;font:inherit;color:var(--c-text);
}
.rou-order-preview .rou-pay-method:hover {border-color:color-mix(in srgb, var(--c-text) 30%, transparent)}
.rou-order-preview .rou-pay-method.is-selected {border-color:var(--c-dark);background:var(--c-warm)}
.rou-order-preview .rou-pay-method-icon {
  width:2.25rem;height:2.25rem;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;
  background:var(--c-warm);
  color:var(--c-muted);
}
.rou-order-preview .rou-pay-method.is-selected .rou-pay-method-icon {background:color-mix(in srgb, var(--c-dark) 10%, var(--c-surface))}
.rou-order-preview .rou-pay-method-icon svg {width:1rem;height:1rem}
.rou-order-preview .rou-pay-method-info {flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.rou-order-preview .rou-pay-method-label {display:block;font-size:0.875rem;font-weight:600;line-height:1.25}
.rou-order-preview .rou-pay-method-note {display:block;font-size:0.75rem;color:var(--c-muted);line-height:1.3;margin-top:0}
.rou-order-preview .rou-pay-method-radio {
  width:1.25rem;height:1.25rem;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;
  border:1.5px solid var(--c-border);
  background:var(--c-surface);
  transition:border-color .15s,background .15s;
}
.rou-order-preview .rou-pay-method.is-selected .rou-pay-method-radio {
  border-color:var(--c-dark);background:var(--c-dark);color:var(--c-surface);
}
.rou-order-preview .rou-pay-method-radio svg {width:0.75rem;height:0.75rem;opacity:0}
.rou-order-preview .rou-pay-method.is-selected .rou-pay-method-radio svg {opacity:1}
.rou-order-preview .rou-pay-receipt-toggle {
  display:flex;align-items:flex-start;gap:0.75rem;
  padding:0.875rem 1rem;
  border:1px solid var(--c-border);
  border-radius:var(--radius-card);
  background:var(--c-surface);
  cursor:pointer;
  transition:border-color .15s;
  -webkit-tap-highlight-color:transparent;
  margin-top:0.5rem;
}
.rou-order-preview .rou-pay-receipt-toggle:hover {border-color:color-mix(in srgb, var(--c-text) 30%, transparent)}
.rou-order-preview .rou-pay-receipt-toggle.is-on {border-color:var(--c-dark)}
.rou-order-preview .rou-pay-receipt-check {
  width:1.25rem;height:1.25rem;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:0.375rem;
  border:1.5px solid var(--c-border);
  background:var(--c-surface);
  margin-top:2px;
  transition:border-color .15s,background .15s,color .15s;
}
.rou-order-preview .rou-pay-receipt-toggle.is-on .rou-pay-receipt-check {
  border-color:var(--c-dark);background:var(--c-dark);color:var(--c-surface);
}
.rou-order-preview .rou-pay-receipt-check svg {width:0.75rem;height:0.75rem}
.rou-order-preview .rou-pay-receipt-info {flex:1;min-width:0}
.rou-order-preview .rou-pay-receipt-label {font-size:0.875rem;font-weight:600;line-height:1.25}
.rou-order-preview .rou-pay-receipt-desc {font-size:0.75rem;color:var(--c-muted);line-height:1.4;margin-top:2px}
.rou-order-preview .rou-pay-email-wrap {
  margin-top:0.5rem;
  position:relative;
}
.rou-order-preview .rou-pay-email-icon {
  position:absolute;left:1rem;top:50%;transform:translateY(-50%);
  width:1rem;height:1rem;color:var(--c-muted);pointer-events:none;
}
.rou-order-preview .rou-pay-email {
  width:100%;
  padding:0.75rem 1rem 0.75rem 2.75rem;
  border:1px solid var(--c-border);
  border-radius:999px;
  background:var(--c-surface);
  font:inherit;font-size:0.875rem;
  color:var(--c-text);
  outline:none;
  transition:border-color .15s,box-shadow .15s;
}
.rou-order-preview .rou-pay-email:focus {
  border-color:var(--c-dark);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--c-dark) 10%, transparent);
}
.rou-order-preview .rou-pay-email::placeholder {color:var(--c-muted)}
.rou-order-preview .rou-pay-email-privacy {
  margin-top:0.375rem;
  font-size:0.75rem;color:var(--c-muted);line-height:1.4;
}
.rou-order-preview .rou-pay-security {
  display:flex;align-items:flex-start;gap:0.5rem;
  margin-top:0.75rem;
  font-size:0.75rem;color:var(--c-muted);line-height:1.45;
}
.rou-order-preview .rou-pay-security svg {width:0.875rem;height:0.875rem;flex-shrink:0;margin-top:1px}
.rou-order-preview .rou-pay-sticky {
  position:absolute;bottom:0;left:0;right:0;
  z-index:30;
  padding:0.75rem max(0.75rem,env(safe-area-inset-left,0px)) max(0.75rem,env(safe-area-inset-bottom,0px)) max(0.75rem,env(safe-area-inset-right,0px));
  pointer-events:none;
  display:flex;justify-content:center;
}
.rou-order-preview .rou-pay-sticky .rou-btn {
  pointer-events:auto;
  max-width:28rem;width:100%;
  box-shadow:var(--shadow-lg);
  padding:1rem 1.5rem;font-size:1rem;
}
.rou-order-preview .rou-pay-back {
  width:2.5rem;height:2.5rem;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;
  border:1px solid var(--c-border);
  background:transparent;
  color:var(--c-text);
  cursor:pointer;
  transition:background .15s,border-color .15s;
  -webkit-tap-highlight-color:transparent;
}
.rou-order-preview .rou-pay-back:hover {background:var(--c-warm);border-color:color-mix(in srgb, var(--c-text) 30%, transparent)}
.rou-order-preview .rou-pay-back svg {width:1rem;height:1rem}
.rou-order-preview .rou-pay-methods-fieldset {
  border:0;margin:0;padding:0;min-inline-size:0;
}
.rou-order-preview .rou-pay-methods-legend {
  display:block;
  font-family:var(--font-display);
  font-size:1.125rem;font-weight:600;line-height:1.25;
  color:var(--c-text);
  margin:0 0 0.5rem;padding:0;
}
.rou-order-preview .rou-confirmed-pay-modes {margin-top:0.75rem}
.rou-order-preview .rou-payment-element {margin-top:0.75rem}
.rou-order-preview .rou-express-pay {margin-top:0.25rem}
.rou-order-preview .rou-express-pay[hidden] {display:none}
.rou-order-preview #rou-express-pay-buttons {min-height:3rem}
.rou-order-preview .rou-express-pay-or {
  display:flex;align-items:center;gap:0.625rem;
  margin:0.75rem 0;
  color:var(--c-muted);font-size:0.75rem;
}
.rou-order-preview .rou-express-pay-or span {flex:1;height:1px;background:color-mix(in srgb, var(--c-text) 14%, transparent)}
.rou-order-preview .rou-confirmed-pay-loading {margin-top:0.75rem}
.rou-order-preview .rou-pay-wallet-disc {color:var(--c-success);font-weight:700}
.rou-order-preview .rou-confirmed-moment--pay {
  padding:1.375rem 1.25rem 1.25rem;
  border:1px solid color-mix(in srgb, var(--c-accent) 10%, transparent);
  border-radius:var(--radius-card);
}
.rou-order-preview .rou-confirmed-moment--pay h1 {
  font-size:1.375rem;
  margin-top:0.375rem;
}
.rou-order-preview .rou-confirmed-moment--pay > p {
  font-size:0.8125rem;
}
.rou-order-preview .rou-confirmed-moment--pay .rou-confirmed-seal {
  width:2.75rem;height:2.75rem;
}
.rou-order-preview .rou-confirmed-moment--pay .rou-confirmed-seal svg {
  width:1.375rem;height:1.375rem;
}
.rou-order-preview .rou-confirmed-paid--pending {
  background:color-mix(in srgb, var(--c-muted) 12%, var(--c-surface));
  color:var(--c-muted);
}
.rou-order-preview .rou-confirmed-review-cta {margin-top:0.75rem}
.rou-order-preview .rou-guest-empty {
  margin:1.5rem 0 0.75rem;
  text-align:center;
  font-size:0.875rem;line-height:1.5;
  color:var(--c-muted);
}
.rou-order-preview .rou-guest-empty-action {text-align:center;margin-bottom:1.5rem}
.rou-order-preview .rou-status-card.is-awaiting {
  background:color-mix(in srgb, var(--c-accent) 5%, var(--c-warm));
  border-color:color-mix(in srgb, var(--c-accent) 18%, transparent);
}
.rou-order-preview .rou-status-card.is-cancelled {
  background:color-mix(in srgb, var(--c-danger) 6%, var(--c-surface));
  border-color:color-mix(in srgb, var(--c-danger) 24%, transparent);
}
.rou-order-preview .rou-confirmed-steps {margin-bottom:1.25rem}
.rou-order-preview .rou-confirmed-steps ol {
  list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;
}
.rou-order-preview .rou-confirmed-step {
  display:flex;gap:0.875rem;align-items:flex-start;
  min-width:0;
}
.rou-order-preview .rou-confirmed-step-track {
  display:flex;flex-direction:column;align-items:center;align-self:stretch;
  flex:0 0 auto;
}
.rou-order-preview .rou-confirmed-step-dot {
  width:2.5rem;height:2.5rem;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;
  background:var(--c-warm);
  border:1px solid var(--c-border);
  color:var(--c-muted);
}
.rou-order-preview .rou-confirmed-step-dot svg {width:1.125rem;height:1.125rem}
.rou-order-preview .rou-confirmed-step-line {
  width:2px;flex:1;min-height:1.5rem;margin:0.25rem 0;
  border-radius:999px;
  background:var(--c-border);
}
.rou-order-preview .rou-confirmed-step.is-active .rou-confirmed-step-dot {
  background:color-mix(in srgb, var(--c-accent) 10%, var(--c-surface));
  border-color:color-mix(in srgb, var(--c-accent) 28%, transparent);
  color:var(--c-accent);
}
.rou-order-preview .rou-confirmed-step.is-future .rou-confirmed-step-dot {opacity:0.7}
.rou-order-preview .rou-confirmed-step-content {
  flex:1;min-width:0;
  padding:0.125rem 0 1rem;
}
.rou-order-preview .rou-confirmed-step:last-child .rou-confirmed-step-content {padding-bottom:0}
.rou-order-preview .rou-confirmed-step-title {
  margin:0;
  font-family:var(--font-display);
  font-size:0.9375rem;font-weight:600;line-height:1.3;
  color:var(--c-text);
}
.rou-order-preview .rou-confirmed-step-note {
  margin:0.125rem 0 0;
  font-size:0.8125rem;line-height:1.45;
  color:var(--c-muted);
}
.rou-order-preview .rou-confirmed-step-badge {
  display:inline-flex;margin-top:0.375rem;
  padding:0.1875rem 0.5rem;
  border-radius:999px;
  background:color-mix(in srgb, var(--c-accent) 10%, var(--c-surface));
  color:var(--c-accent);
  font-family:var(--font-display);
  font-size:0.6875rem;font-weight:700;line-height:1.4;
}
@media (prefers-reduced-motion:reduce) {
.rou-order-preview .rou-confirmed-shell *,
.rou-order-preview body.rou-pay-shell * {transition-duration:0.01ms !important;animation-duration:0.01ms !important}


}
.rou-order-preview .rou-confirmed-shell button:focus-visible,
.rou-order-preview .rou-confirmed-shell a:focus-visible,
.rou-order-preview .rou-confirmed-shell input:focus-visible,
.rou-order-preview .rou-confirmed-shell textarea:focus-visible,
.rou-order-preview .rou-confirmed-shell select:focus-visible,
.rou-order-preview .rou-confirmed-shell summary:focus-visible {
  outline:none;
  box-shadow:0 0 0 3px color-mix(in srgb, var(--c-accent) 30%, transparent);
}
.rou-order-preview .rou-btn {min-height:var(--touch)}
.rou-order-preview .rou-pay-method {min-height:var(--touch)}
.rou-order-preview .rou-confirmed-pay-mode {min-height:2.75rem}
.rou-order-preview .rou-pay-back {min-width:var(--touch);min-height:var(--touch)}
.rou-order-preview .rou-confirmed-email-input,
.rou-order-preview .rou-pay-email {font-size:16px}
.rou-order-preview .rou-confirmed-item-name,
.rou-order-preview .rou-confirmed-restaurant,
.rou-order-preview .rou-confirmed-meta,
.rou-order-preview .rou-status-card-title,
.rou-order-preview .rou-status-card-note,
.rou-order-preview .rou-pay-method-label,
.rou-order-preview .rou-pay-method-note {overflow-wrap:anywhere}
@container rou-order (max-width: 480px) {
.rou-order-preview :is(.rou-order-shell, .rou-confirmed-shell) {
    --page-inline:max(1rem,env(safe-area-inset-left,0px));
    --page-inline-right:max(1rem,env(safe-area-inset-right,0px));
  }
.rou-order-preview .rou-confirmed-body {padding:1.25rem 1rem 1.5rem}
.rou-order-preview .rou-confirmed-header {padding:0.875rem 1rem}
.rou-order-preview .rou-order-ticket-number {font-size:1.875rem}
.rou-order-preview .rou-confirmed-moment {padding:1.875rem 1.25rem 1.75rem}
.rou-order-preview .rou-confirmed-moment h1 {font-size:1.5rem}
.rou-order-preview .rou-confirmed-seal {width:4rem;height:4rem}
.rou-order-preview .rou-confirmed-seal svg {width:2rem;height:2rem}
.rou-order-preview .rou-status-card {padding:1rem}
.rou-order-preview .rou-confirmed-item {padding:0.625rem 0.875rem}
.rou-order-preview .rou-confirmed-item-name {font-size:0.8125rem}
.rou-order-preview .rou-confirmed-totals {padding:0.875rem}
.rou-order-preview .rou-pay-method {padding:0.625rem 0.875rem}
.rou-order-preview .rou-pay-methods-legend {font-size:0.9375rem}
.rou-order-preview .rou-btn {padding:0.6875rem 1.125rem;font-size:0.8125rem}
.rou-order-preview .rou-confirmed-footer {padding:0.875rem 1rem}
.rou-order-preview .rou-pay-sticky .rou-btn {padding:0.9375rem 1.25rem;font-size:0.9375rem}
.rou-order-preview .rou-confirmed-review {padding:0.875rem}
.rou-order-preview .rou-confirmed-section {padding:0.875rem}
.rou-order-preview .rou-confirmed-delivery {padding:0.625rem 0.875rem}


}
@container rou-order (max-width: 380px) {
.rou-order-preview .rou-order-ticket-number {font-size:1.625rem}
.rou-order-preview .rou-confirmed-moment {padding:1.625rem 1.125rem 1.5rem}
.rou-order-preview .rou-confirmed-moment h1 {font-size:1.3125rem}
.rou-order-preview .rou-confirmed-moment > p {font-size:0.8125rem}
.rou-order-preview .rou-confirmed-seal {width:3.5rem;height:3.5rem}
.rou-order-preview .rou-confirmed-seal svg {width:1.75rem;height:1.75rem}
.rou-order-preview .rou-progress-label {font-size:0.625rem}
.rou-order-preview .rou-progress-dot {width:1.25rem;height:1.25rem}
.rou-order-preview .rou-confirmed-item-name {white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rou-order-preview .rou-pay-method-note {display:none}
.rou-order-preview .rou-pay-method-icon {width:2rem;height:2rem}
.rou-order-preview .rou-confirmed-pay-mode {padding:0.5rem 0.75rem;font-size:0.75rem}
.rou-order-preview .rou-status-card-title {font-size:0.9375rem}
.rou-order-preview .rou-status-card-note {font-size:0.75rem}
.rou-order-preview .rou-confirmed-item-qty {width:1.5rem;height:1.5rem}
.rou-order-preview .rou-btn {padding:0.625rem 0.875rem;font-size:0.8125rem}
.rou-order-preview .rou-pay-sticky .rou-btn {padding:0.875rem 1.125rem;font-size:0.875rem}
.rou-order-preview .rou-confirmed-paid {padding:0.4375rem 0.875rem;font-size:0.75rem}


}
@container rou-order (max-width: 360px) {
.rou-order-preview .rou-confirmed-body {padding:1rem 0.875rem 1.25rem}
.rou-order-preview .rou-confirmed-header {padding:0.75rem 0.875rem}
.rou-order-preview .rou-order-ticket {gap:0.375rem}
.rou-order-preview .rou-order-ticket-number {font-size:1.5rem}
.rou-order-preview .rou-confirmed-moment {padding:1.5rem 1rem 1.375rem}
.rou-order-preview .rou-confirmed-moment h1 {font-size:1.1875rem}
.rou-order-preview .rou-confirmed-moment > p {font-size:0.8125rem}
.rou-order-preview .rou-progress-label {font-size:0.5625rem}
.rou-order-preview .rou-pay-methods-legend {font-size:0.875rem}
.rou-order-preview .rou-pay-method-label {font-size:0.8125rem}
.rou-order-preview .rou-pay-security {font-size:0.6875rem}
.rou-order-preview .rou-confirmed-totals .is-total dd {font-size:1rem}
.rou-order-preview .rou-confirmed-seal {width:3.25rem;height:3.25rem}
.rou-order-preview .rou-confirmed-seal svg {width:1.625rem;height:1.625rem}
.rou-order-preview .rou-status-card {padding:0.875rem}
.rou-order-preview .rou-status-card-icon {width:1.25rem;height:1.25rem}
.rou-order-preview .rou-pay-method-icon {width:1.75rem;height:1.75rem}
.rou-order-preview .rou-pay-method-radio {width:1.125rem;height:1.125rem}


}
@container rou-order (max-width: 767px) {
.rou-order-preview body.rou-pay-shell .rou-confirmed-footer {padding-bottom:calc(4.75rem + env(safe-area-inset-bottom,0px))}


}
@container rou-order (min-width: 768px) {
.rou-order-preview .rou-pay-layout {
    display:grid;
    grid-template-columns:1.1fr 0.9fr;
    gap:1.5rem;
    align-items:start;
  }
.rou-order-preview .rou-pay-side {
    position:sticky;
    top:1.5rem;
  }
.rou-order-preview .rou-pay-sticky {
    position:static;
    padding:0;
    background:transparent;
    box-shadow:none;
  }
.rou-order-preview .rou-pay-sticky .rou-btn {
    max-width:none;
  }
.rou-order-preview .rou-confirmed-body {padding:1.75rem 1.5rem 2rem}
.rou-order-preview .rou-confirmed-header {padding:1.125rem 1.5rem}
.rou-order-preview .rou-confirmed-footer {padding:1.125rem 1.5rem}
.rou-order-preview .rou-confirmed-item {padding:0.875rem 1.25rem}
.rou-order-preview .rou-confirmed-totals {padding:1.25rem}
.rou-order-preview .rou-status-card {padding:1.25rem 1.5rem}
.rou-order-preview .rou-pay-method {padding:0.875rem 1.25rem}
.rou-order-preview .rou-confirmed-moment {padding:2.75rem 2rem 2.5rem}
.rou-order-preview .rou-confirmed-moment h1 {font-size:2rem}
.rou-order-preview .rou-order-ticket-number {font-size:2.5rem}
.rou-order-preview .rou-confirmed-seal {width:5.25rem;height:5.25rem}
.rou-order-preview .rou-confirmed-seal svg {width:2.625rem;height:2.625rem}
.rou-order-preview .rou-confirmed-actions {flex-direction:row;flex-wrap:wrap}
.rou-order-preview .rou-confirmed-actions .rou-btn {flex:1 1 12rem}
.rou-order-preview .rou-confirmed-review {padding:1.25rem}
.rou-order-preview .rou-confirmed-section {padding:1.25rem}


}
@container rou-order (min-width: 1200px) {
.rou-order-preview .rou-pay-layout {grid-template-columns:1.15fr 0.85fr;gap:2rem}
.rou-order-preview .rou-confirmed-body {padding:2rem 1.75rem 2.5rem}


}
@container rou-order (max-width: 380px) {
.rou-order-preview .rou-confirmed-moment:not(.rou-confirmed-moment--pay) {--overhang:3rem;padding:1.875rem 1rem 0}
.rou-order-preview .rou-confirmed-hero .rou-confirmed-seal {width:3.75rem;height:3.75rem}
.rou-order-preview .rou-confirmed-hero .rou-confirmed-seal svg {width:1.875rem;height:1.875rem}
.rou-order-preview .rou-confirmed-hero h1 {font-size:1.5rem}
.rou-order-preview .rou-confirmed-hero p {font-size:0.875rem}
.rou-order-preview .rou-confirmed-ticket .rou-order-ticket-number {font-size:2.5rem}
.rou-order-preview .rou-confirmed-closing {font-size:1.3125rem}


}
@container rou-order (max-width: 340px) {
.rou-order-preview .rou-confirmed-hero h1 {font-size:1.3125rem}
.rou-order-preview .rou-confirmed-ticket {padding:1rem 1rem 1.125rem}
.rou-order-preview .rou-confirmed-ticket-stamp {top:0.625rem;right:0.625rem}


}
@container rou-order (min-width: 768px) {
.rou-order-preview .rou-confirmed-moment:not(.rou-confirmed-moment--pay) {--overhang:3.75rem;padding:3.25rem 2rem 0;border-radius:0 0 2.5rem 2.5rem}
.rou-order-preview .rou-confirmed-hero .rou-confirmed-seal {width:5rem;height:5rem}
.rou-order-preview .rou-confirmed-hero .rou-confirmed-seal svg {width:2.5rem;height:2.5rem}
.rou-order-preview .rou-confirmed-hero h1 {font-size:2.375rem}
.rou-order-preview .rou-confirmed-hero p {font-size:1rem;max-width:26rem}
.rou-order-preview .rou-confirmed-ticket {width:23rem;padding:1.375rem 1.5rem 1.5rem}
.rou-order-preview .rou-confirmed-ticket .rou-order-ticket-number {font-size:3.5rem}
.rou-order-preview .rou-confirmed-shell:not(.rou-pay-shell) .rou-confirmed-body {width:100%;max-width:38rem;margin-inline:auto}
.rou-order-preview .rou-confirmed-closing {font-size:1.75rem}


}
@container rou-order (min-width: 1200px) {
.rou-order-preview .rou-confirmed-hero h1 {font-size:2.75rem}


}
@media (prefers-reduced-motion:reduce) {
.rou-order-preview * {animation-duration:0.01ms!important;transition-duration:0.01ms!important}


}


/* ---------------------------------------------------------------------------
   Preview scaffolding (landing-owned) — keeps the real guest screens faithful
   inside a hero/floor device frame.
   .rou-order-preview = the phone "viewport" for both real screens:
       container queries drive the real breakpoints, and the scoped rules keep
       every element (incl. the pay CTA bar) pinned inside the frame.
   .rou-order-shell / .rou-confirmed-shell = the real <body> of each guest screen.
   --------------------------------------------------------------------------- */
.rou-order-preview{
  position:relative;
  height:100%;
  overflow:hidden;
  background:var(--c-bg, #FFF7ED);
  container-type:inline-size;
  container-name:rou-order;
}
.rou-order-preview .rou-order-shell,
.rou-order-preview .rou-confirmed-shell{
  height:100%;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  scrollbar-width:none;
}
.rou-order-preview .rou-order-shell::-webkit-scrollbar,
.rou-order-preview .rou-confirmed-shell::-webkit-scrollbar{display:none}
.rou-order-preview .rou-order-frame{min-height:100%}
/* The frames emulate an OS status bar + dynamic island; keep them clear.
   Weight matches the real `body.rou-order-shell .rou-header` rule so it wins. */
.rou-order-preview .rou-order-shell .rou-header{padding-top:3.25rem}
.rou-order-preview .rou-confirmed-shell{padding-top:3.25rem}
/* Collision guard: the landing page styles its own .rou-section blocks. */
.rou-order-preview .rou-section{padding:0}
.rou-order-preview .rou-service-btn.is-on{background:var(--c-accent);border-color:var(--c-accent);color:var(--c-surface)}
.rou-order-preview .rou-highlight-pill:empty{display:none}
.rou-order-preview .rou-item-photo{cursor:default}
/* The home indicator floats over the bottom CTA on real phones; leave a seam. */
.rou-order-preview .rou-pay-sticky{padding-bottom:0.45rem;bottom:1.35rem}
/* Pay header marks these as spans. Without a block display they share one line. */
.rou-order-preview .rou-confirmed-restaurant,
.rou-order-preview .rou-confirmed-meta{display:block}
/* Category counts are absolutely positioned in the real UI. Inside the 390px
   canvas the rail is too narrow, so the badge paints over the label and into
   the dish column. Keep the count in the row instead. */
.rou-order-preview .rou-order-shell .rou-cat-rail{
  flex:0 0 6.75rem;
  width:6.75rem;
  max-width:6.75rem;
}
.rou-order-preview .rou-cat-nav a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:0.25rem;
  min-width:0;
  padding-right:0.4rem;
}
.rou-order-preview .rou-cat-label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.rou-order-preview .rou-cat-qty{
  position:static;
  top:auto;
  right:auto;
  flex:0 0 auto;
  margin-left:auto;
}
.rou-order-preview .rou-items-scroller{padding-right:0.55rem}
.rou-order-preview .rou-item-info{min-width:0}
.rou-order-preview .rou-item-foot{min-width:0;max-width:100%}
.rou-order-preview .rou-order-shell .rou-item-top > .rou-item-photo,
.rou-order-preview .rou-order-shell .rou-item-photo,
.rou-order-preview .rou-order-shell .rou-item-photo img{
  width:4.15rem;
  height:4.15rem;
  flex-basis:4.15rem;
}
.rou-order-preview .rou-order-shell .rou-stepper button,
.rou-order-preview .rou-order-shell .rou-stepper .rou-plus,
.rou-order-preview .rou-order-shell .rou-stepper .rou-minus{
  width:1.7rem;
  height:1.7rem;
}
/* The last dish was running under the home indicator, so the photo and plus
   were sliced by the glass. Slightly shorter rows let that dish sit above it. */
.rou-order-preview .rou-order-shell .rou-item{
  padding-top:2px;
  padding-bottom:2px;
}
.rou-order-preview .rou-order-colophon{display:none}
/* The mock frames run narrower than the real page (down to ~155px); compact tier
   so steppers, prices, pills and photos stay on the row instead of overflowing.
   Selectors intentionally outrank the real `body.rou-order-shell …` weight. */
@container rou-order (max-width: 320px){
  .rou-order-preview .rou-order-shell .rou-menu-split-inner{gap:0.35rem}
  .rou-order-preview .rou-order-shell .rou-cat-rail{flex:0 0 3rem;width:3rem;padding-right:0.25rem}
  .rou-order-preview .rou-order-shell .rou-cat-nav{padding:0.35rem 0}
  .rou-order-preview .rou-order-shell .rou-item-top{gap:0.45rem}
  .rou-order-preview .rou-order-shell .rou-item-photo,
  .rou-order-preview .rou-order-shell .rou-item-photo img,
  .rou-order-preview .rou-order-shell .rou-item-top > .rou-item-photo{width:1.9rem;height:1.9rem;flex-basis:1.9rem;border-radius:0.45rem}
  .rou-order-preview .rou-order-shell .rou-item-name{font-size:0.82rem}
  .rou-order-preview .rou-order-shell .rou-item-blurb{font-size:0.68rem}
  .rou-order-preview .rou-order-shell .rou-highlight-pill{font-size:0.58rem;padding:0.08rem 0.3rem}
  .rou-order-preview .rou-confirmed-shell .rou-confirmed-hero h1{font-size:1.05rem}
  .rou-order-preview .rou-confirmed-shell .rou-confirmed-hero{gap:0.4rem}
  .rou-order-preview .rou-order-shell .rou-item-foot{flex-wrap:wrap;align-items:center;gap:0.3rem;margin-top:0.3rem}
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper.active button,
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper button,
  .rou-order-preview .rou-order-shell .rou-stepper button{width:1.7rem;height:1.7rem}
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper.active .rou-qty,
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper .rou-qty,
  .rou-order-preview .rou-order-shell .rou-stepper .rou-qty{width:1.3rem;font-size:0.75rem}
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper:not(.active) .rou-plus,
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper.active .rou-plus,
  .rou-order-preview .rou-order-shell .rou-stepper .rou-plus{width:1.7rem;height:1.7rem}
  .rou-order-preview .rou-order-shell .rou-item-price{font-size:0.82rem}
  .rou-order-preview .rou-order-shell .rou-section-title{font-size:0.6rem;gap:0.35rem;padding:6px 0 4px}
  .rou-order-preview .rou-order-shell .rou-section-title .rou-section-count{flex:0 0 auto}
}
/* Second rung for the hero's short-screen phone (~188px) and landscape phones. */
@container rou-order (max-width: 210px){
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper.active button,
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper button,
  .rou-order-preview .rou-order-shell .rou-stepper button{width:1.45rem;height:1.45rem}
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper.active .rou-qty,
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper .rou-qty,
  .rou-order-preview .rou-order-shell .rou-stepper .rou-qty{width:1.05rem;font-size:0.7rem}
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper:not(.active) .rou-plus,
  .rou-order-preview .rou-order-shell .rou-item.has-photo .rou-stepper.active .rou-plus,
  .rou-order-preview .rou-order-shell .rou-stepper .rou-plus{width:1.45rem;height:1.45rem}
  .rou-order-preview .rou-order-shell .rou-item-name{font-size:0.78rem}
  .rou-order-preview .rou-order-shell .rou-item-price{font-size:0.75rem}
  .rou-order-preview .rou-order-shell .rou-cart-submit{font-size:0.75rem;padding:0.4rem 0.6rem}
}
/* Pay scene is taller than the phone. The sticky button is absolute, so the
   second method and the legal line sat underneath it. Tighten only this scene
   and drop the footer, which otherwise peeks through the button. */
.rou-scene--pay .rou-order-preview .rou-confirmed-body{padding:0.35rem 1rem 0}
.rou-scene--pay .rou-order-preview .rou-confirmed-check{width:2.25rem;height:2.25rem}
.rou-scene--pay .rou-order-preview .rou-confirmed-item{padding-top:0.25rem;padding-bottom:0.25rem}
.rou-scene--pay .rou-order-preview .rou-confirmed-totals{padding:0.35rem 0.75rem;margin-top:0.15rem}
.rou-scene--pay .rou-order-preview .rou-pay-security{margin-top:0.35rem}
.rou-scene--pay .rou-order-preview .rou-confirmed-footer{display:none}


.rou-order-preview.rou-live-preview{
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
  background:#fff7ed;
}
.rou-live-preview__frame{
  display:block;
  width:100%;
  height:100%;
  margin:0;
  border:0;
  background:#fff7ed;
  pointer-events:none;
}
.rou-scene--live{
  background:#fff7ed;
}