/* Nature and Minimal. Kept separate from the original theme definitions. */
html[data-design="nature"] {
    --primary: #213f32; --secondary: #536d53; --accent: #879765;
    --bg: #f2f3ea; --cream: #e8eddf; --card-bg: #fdfef9; --white: #fdfef9;
    --text-main: #243e30; --text-muted: #61715e; --eda-orange: #355c40;
    --border-color: #d7dfcd; --input-bg: #edf1e6; --summary-bg: #f0f3e9;
    --header-bg: #f7f9f0ed; --nav-bg: #f7f9f0f2;
    --gradient-primary: linear-gradient(125deg, #203e30, #49674b);
    --gradient-btn: linear-gradient(120deg, #355c40, #264a36);
    --gradient-accent: linear-gradient(90deg, #a4b585, #d4ddba);
    --hero-bg: #e7edda; --hero-ink: #345638; --hero-border: #d2dec1;
    --on-action: #f7faef; --on-feature: #f5f8ec; --feature-muted: #d2ddc5;
    --modifier-selected-bg: #e0ead5; --chip-bg: #edf1e6; --dropdown-hover: #edf1e6;
    --card-shadow: 0 3px 5px #294a2703, 0 12px 32px #294a2709;
    --shadow-lg: 0 18px 45px #294a271b; --checkout-shadow: 0 5px 14px #294a2712;
    --cart-bar-shadow: 0 10px 28px #203e3033; --input-focus-ring: 0 0 0 3px #87976535;
    --radius: 22px; --radius-lg: 28px; --radius-btn: 14px; --radius-chip: 30px;
    --font-display: 'Playfair Display', Georgia, serif;
}
html[data-design="minimal"] {
    --primary: #292d2a; --secondary: #5f695c; --accent: #6c7a61;
    --bg: #f7f7f2; --cream: #eeefe8; --card-bg: #ffffff; --white: #ffffff;
    --text-main: #292d2a; --text-muted: #696e64; --eda-orange: #414d39;
    --border-color: #e0e3d9; --input-bg: #f2f3ed; --summary-bg: #f6f7f2;
    --header-bg: #fcfcf8ed; --nav-bg: #fcfcf8f2;
    --gradient-primary: linear-gradient(125deg, #292f28, #4c5545);
    --gradient-btn: linear-gradient(120deg, #363e31, #282f25);
    --gradient-accent: linear-gradient(90deg, #869276, #cbd4bd);
    --hero-bg: #eeefe6; --hero-ink: #4a5540; --hero-border: #e0e3d5;
    --on-action: #ffffff; --on-feature: #f5f7ed; --feature-muted: #d5dccb;
    --modifier-selected-bg: #e8edde; --chip-bg: #f2f3ed; --dropdown-hover: #f2f3ed;
    --card-shadow: 0 3px 12px #252d2004;
    --shadow-lg: 0 16px 36px #252d2012; --checkout-shadow: 0 4px 12px #252d200c;
    --cart-bar-shadow: 0 10px 24px #252d2026; --input-focus-ring: 0 0 0 3px #6c7a6125;
    --radius: 14px; --radius-lg: 20px; --radius-btn: 10px; --radius-chip: 10px;
    --font-display: 'Inter', sans-serif;
}

/* The extra illustration is decorative and absent from the other editions. */
.theme-art, .theme-art > svg { display: none; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) {
    --input-border: 1px solid var(--border-color);
    --card-border: 1px solid var(--border-color);
    --image-placeholder: var(--input-bg);
    --shadow: var(--card-shadow);
    --header-shadow: none; --nav-shadow: 0 -4px 24px #00000005;
    --overlay-bg: #121b1499; --nav-border-radius: 0;
}
html[data-design="nature"] body {
    background-image: radial-gradient(ellipse at 0 15%, #c2d1a832, transparent 50%), radial-gradient(ellipse at 100% 60%, #d8dfc335, transparent 50%);
}
html[data-design="minimal"] body { background-image: none; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) #app-container { background: transparent; }


html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.header, .nav-container) {
    border: 0; border-block: 1px solid var(--border-color);
    box-shadow: none; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .logo {
    font-family: var(--font-display); font-size: 22px; font-weight: 500;
    letter-spacing: -.6px; text-transform: none; color: var(--text-main);
    background: none; -webkit-text-fill-color: currentColor;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.logo-icon, .auth-logo-icon, .user-avatar) {
    background: var(--input-bg); color: var(--text-main); border: 1px solid var(--border-color);
    box-shadow: none; border-radius: 50%;
}
html[data-design="minimal"] :is(.logo-icon, .user-avatar) { border-radius: 12px; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-intro {
    position: relative; isolation: isolate; overflow: hidden;
    background: var(--hero-bg); border: 1px solid var(--hero-border); border-radius: var(--radius-lg);
    padding: 32px 26px 34px; margin: 4px 0 26px; min-height: 240px;
    animation: atelier-arrive .65s cubic-bezier(.2,.7,.2,1) backwards;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-intro > :is(h1, p) {
    position: relative; z-index: 1; max-width: 73%;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-intro .eyebrow {
    color: var(--secondary); font-size: 9px; font-weight: 600; letter-spacing: 1.8px; max-width: 85%;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-intro h1 {
    font: 400 clamp(32px, 6vw, 44px)/1.12 var(--font-display);
    letter-spacing: -1.4px; margin: 22px 0 16px; text-wrap: balance;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-intro p:last-child {
    font-size: 12px; line-height: 1.7; max-width: 65%;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .theme-art {
    display: block; position: absolute; inset: 0 0 0 auto; width: 42%;
    pointer-events: none; color: var(--hero-ink); z-index: 0;
}
.theme-art svg { position: absolute; height: 100%; width: 100%; right: -14px; bottom: -16px; }
[data-design="nature"] .theme-art-nature,
[data-design="minimal"] .theme-art-minimal { display: block; }
.theme-leaves { transform-origin: 115px 300px; animation: atelier-sway 9s ease-in-out infinite alternate; }
.theme-steam { animation: atelier-steam 4s ease-in-out infinite; }
.theme-cup { animation: atelier-breathe 7s ease-in-out infinite; }
html[data-design="nature"] .menu-intro { background: radial-gradient(ellipse at 95% 100%, #c9d8b6, transparent 70%), var(--hero-bg); }
html[data-design="minimal"] .menu-intro { border-color: transparent; }
html[data-design="minimal"] .menu-intro h1 { font-weight: 500; letter-spacing: -1.8px; }

html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-header {
    background: transparent; margin: 0 0 16px; padding: 0; border: 0;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.menu-search input, .input-group input, .form-group input, .form-group select, .form-group textarea) {
    border: 1px solid var(--border-color); border-radius: var(--radius-btn);
    background: var(--card-bg); color: var(--text-main); box-shadow: none;
    transition: border-color .2s ease, box-shadow .2s ease;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) input::placeholder { color: var(--text-muted); opacity: 1; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.menu-search input, .input-group input, .form-group input, .form-group select, .form-group textarea):focus {
    border-color: var(--accent); box-shadow: var(--input-focus-ring);
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.category-chip, .modifier-option, .delivery-option, .saved-card) {
    background: var(--input-bg); border: 1px solid var(--border-color); color: var(--text-main);
    box-shadow: none; border-radius: var(--radius-btn); font-weight: 500; text-transform: none; letter-spacing: 0;
    transition: background .25s ease, border-color .25s ease, transform .25s ease;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .category-chip { border-radius: var(--radius-chip); font-size: 13px; padding: 10px 18px; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.category-chip.active, .profile-tab.active) {
    background: var(--gradient-btn); color: var(--on-action); border-color: transparent; box-shadow: none;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.modifier-option.selected, .delivery-option.active, .saved-card.selected) {
    background: var(--modifier-selected-bg); border-color: var(--accent); color: var(--text-main); box-shadow: none;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-category-title {
    font-family: var(--font-display); font-size: 23px; font-weight: 500; letter-spacing: -.5px;
    text-transform: none; color: var(--text-main); border-bottom: 1px solid var(--border-color); padding: 8px 0 14px;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.menu-item, .history-card, .promotion-item, .design-card, .qr-section, .auth-box) {
    background: var(--card-bg); border: 1px solid var(--border-color); border-radius: var(--radius);
    box-shadow: var(--card-shadow);
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item {
    min-width: 0; animation: atelier-arrive .55s cubic-bezier(.2,.7,.2,1) backwards;
    transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease, border-color .3s ease;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item:nth-child(3n+2) { animation-delay: .06s; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item:nth-child(3n+3) { animation-delay: .12s; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item-image {
    height: 165px; background: var(--input-bg); border-bottom: 1px solid var(--border-color);
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item-image img { transition: transform .7s cubic-bezier(.2,.7,.2,1); }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item-title {
    font-family: var(--font-display); font-size: 18px; font-weight: 500; color: var(--text-main); letter-spacing: -.3px;
}
html[data-design="minimal"] .menu-item-title { font-size: 15px; font-weight: 600; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item-desc { color: var(--text-muted); font-size: 12px; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item-price {
    color: var(--text-main); font-size: 19px; font-weight: 600; letter-spacing: -.6px; font-variant-numeric: tabular-nums;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.menu-item-badge, .menu-item-badge.hit, .menu-item-badge.new) {
    background: var(--card-bg); color: var(--text-main); border: 1px solid var(--border-color);
    border-radius: 7px; box-shadow: 0 2px 8px #00000008; font: 600 9px 'Inter', sans-serif;
    letter-spacing: 1px; padding: 6px 9px;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.auth-btn, .add-to-cart-btn, .checkout-btn, .add-modifiers-btn, .add-to-home-btn-bonus) {
    background: var(--gradient-btn); color: var(--on-action); border: 1px solid transparent;
    border-radius: var(--radius-btn); box-shadow: var(--checkout-shadow);
    font-weight: 600; letter-spacing: 0; text-transform: none;
    transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .add-to-cart-btn { font-size: 12px; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.checkout-btn, .auth-btn, .add-to-cart-btn):disabled {
    background: var(--input-bg); color: var(--text-muted); border-color: var(--border-color); box-shadow: none; cursor: not-allowed;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .cart-bar {
    background: var(--gradient-btn); color: var(--on-action); border: 1px solid #ffffff20;
    border-radius: 18px; box-shadow: var(--cart-bar-shadow);
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .cart-bar-btn { color: inherit; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .cart-bar-count { color: inherit; background: #ffffff18; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .nav-item {
    color: var(--text-muted); border-radius: 14px; letter-spacing: 0;
    transition: color .2s ease, background .2s ease;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .nav-item.active { color: var(--eda-orange); background: var(--input-bg); text-shadow: none; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .nav-item span:last-child { font-size: 11px; font-weight: 500; text-transform: none; letter-spacing: 0; }

/* Carry the palette through profile, modifiers, cart and checkout. */
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.modal, .modifiers-content) {
    background: var(--card-bg); border: 1px solid var(--border-color); border-image: none;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0; box-shadow: var(--shadow-lg);
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.modal-header, .modifiers-header, .cart-summary) { background: var(--summary-bg); border-color: var(--border-color); }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .modifiers-content {
    display: flex; flex-direction: column; padding: 20px; max-height: 85dvh; overflow: hidden;
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .modifiers-header { flex-shrink: 0; background: transparent; gap: 12px; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) #modifiers-container { overflow-y: auto; min-height: 0; overscroll-behavior: contain; padding: 2px 3px; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .modifiers-footer { gap: 16px; flex-shrink: 0; border-color: var(--border-color) !important; padding-bottom: env(safe-area-inset-bottom); }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .modifiers-footer > div { flex-shrink: 0; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .modifiers-footer > div > div:first-child { color: var(--text-muted) !important; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .modifiers-footer .add-modifiers-btn { width: auto; flex: 1; margin: 0; padding: 15px 12px; font-size: 14px; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) #modifiers-total { white-space: nowrap; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.modal-title, .modifiers-title) { font-family: var(--font-display); color: var(--text-main); letter-spacing: -.4px; text-shadow: none; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.modal-close, .qty-btn, .utensils-btn) { background: var(--input-bg); color: var(--text-main); border-color: var(--border-color); border-radius: 10px; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.form-group label, .auth-logo p, .design-card-desc, .cart-item-modifiers, .delivery-option-desc, .card-expiry, .empty-state) { color: var(--text-muted); text-transform: none; letter-spacing: 0; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.profile-header, .bonus-header) {
    background: var(--gradient-primary); border: 1px solid var(--border-color); border-radius: var(--radius-lg);
    margin: 0 0 22px; color: var(--on-feature); box-shadow: var(--card-shadow);
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.profile-name, .profile-bonus-count, .bonus-count) { color: var(--on-feature); text-shadow: none; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.profile-phone, .profile-email) { color: var(--feature-muted); }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.user-dropdown, .profile-tabs, .design-hint, .checkbox-group, .save-card-checkbox, .offline-content) {
    background: var(--card-bg); border: 1px solid var(--border-color); color: var(--text-main); border-radius: var(--radius-btn); box-shadow: var(--card-shadow);
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .dropdown-item { color: var(--text-main); }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .dropdown-item:hover { background: var(--dropdown-hover); }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .profile-tab.active { border-radius: 10px; letter-spacing: 0; text-transform: none; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .auth-container { background: var(--gradient-primary); }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .auth-logo h1 { color: var(--text-main); background: none; -webkit-text-fill-color: currentColor; letter-spacing: -.5px; text-transform: none; }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .notification.success { background: var(--gradient-btn); color: var(--on-action); }

/* Theme swatches mirror the finished palettes, including from another active theme. */
.design-preview:is(.nature-preview, .minimal-preview) { position: relative; isolation: isolate; overflow: hidden; }
.design-preview.nature-preview { background: radial-gradient(ellipse at 100% 0, #bdcfa3, transparent 70%), #e7edda; }
.design-preview.minimal-preview { background: linear-gradient(120deg, #f5f5ef, #e5e8db); }
.design-preview:is(.nature-preview, .minimal-preview)::after { content: ''; position: absolute; z-index: -1; pointer-events: none; }
.design-preview.nature-preview::after { width: 75px; height: 120px; right: -4px; bottom: -35px; background: #54734345; border-radius: 100% 0 100% 0; transform: rotate(-25deg); }
.design-preview.minimal-preview::after { width: 64px; height: 100px; right: 10px; bottom: -22px; border: 1px solid #7b856855; border-radius: 50px 50px 0 0; transform: rotate(15deg); }
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .design-card.selected { border-color: var(--accent); box-shadow: 0 0 0 2px var(--modifier-selected-bg); }

@keyframes atelier-arrive { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes atelier-sway { from { transform: rotate(-3deg); } to { transform: rotate(4deg); } }
@keyframes atelier-steam { 0%, 100% { opacity: .35; transform: translateY(3px); } 50% { opacity: .8; transform: translateY(-4px); } }
@keyframes atelier-breathe { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@media (hover: hover) and (pointer: fine) {
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item:hover { transform: translateY(-4px); border-color: var(--accent); box-shadow: var(--shadow-lg); }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item:hover img { transform: scale(1.045); }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.auth-btn, .add-to-cart-btn, .checkout-btn, .add-modifiers-btn, .add-to-home-btn-bonus):not(:disabled):hover { transform: translateY(-2px); filter: brightness(1.07); box-shadow: var(--checkout-shadow); }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.category-chip, .modifier-option):hover { border-color: var(--accent); box-shadow: none; }
}
html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) :is(.auth-btn, .add-to-cart-btn, .checkout-btn, .add-modifiers-btn):not(:disabled):active { transform: scale(.97); }
@media (hover: none) {
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item:hover { transform: none; box-shadow: var(--card-shadow); border-color: var(--border-color); }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item:hover img { transform: none; }
}
@media (min-width: 700px) {
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .modal { border-radius: var(--radius-lg); }
}
@media (max-width: 480px) {
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-intro { padding: 28px 20px; min-height: 228px; }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-intro h1 { max-width: 80%; font-size: 32px; }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-intro .eyebrow { max-width: 100%; font-size: 8px; letter-spacing: 1.2px; }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .theme-art { width: 46%; opacity: .7; right: -22px; }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-intro p:last-child { max-width: 72%; }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item-image { height: 140px; }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item-content { padding: 13px; }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item-footer .add-to-cart-btn { padding: 10px 12px; }
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) .menu-item-title { font-size: 16px; }
    html[data-design="minimal"] .menu-item-title { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) *,
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) *::before,
    html:is([data-design="nature"], [data-design="minimal"], [data-design="bluehour"], [data-design="cherry"]) *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
/* Rick & Morty: layered space, portal illustration and readable control surfaces. */
.rm-coffee-portal{display:none}
html[data-design="dark"]{--primary:#19382c;--secondary:#a7ca97;--accent:#c0f56e;--bg:#081210;--cream:#172d24;--card-bg:#10251f;--text-main:#eff8e9;--text-muted:#afc2b6;--border-color:#355344;--input-bg:#10271f;--summary-bg:#142b24;--header-bg:#0b1b17f2;--nav-bg:#0b1b17f5;--button-text:#f1ffe8;--gradient-btn:linear-gradient(120deg,#d2ff84,#93df68)}
html[data-design="dark"] body{background-color:#081210;background-image:radial-gradient(ellipse at 6% 12%,#78c73625,transparent 35%),radial-gradient(ellipse at 95% 60%,#794ed62b,transparent 43%),radial-gradient(circle at 20px 30px,#d8ffb13d 1px,transparent 1.7px),radial-gradient(circle at 70px 90px,#b4e6d32b .8px,transparent 1.6px),linear-gradient(150deg,#081611,#111425 60%,#081b16)!important;background-size:auto,auto,130px 160px,190px 230px,auto;background-attachment:fixed;background-repeat:no-repeat,no-repeat,repeat,repeat,no-repeat}
html[data-design="dark"] #app-container{background:transparent}
html[data-design="dark"] .menu-intro{min-height:280px;padding:30px 28px;isolation:isolate;background:radial-gradient(ellipse at 88% 55%,#88d84335,transparent 45%),linear-gradient(115deg,#132b20 5%,#112019 50%,#172139);border:1px solid #88b95a55;box-shadow:inset 0 1px #d2ff8420,0 18px 45px #0003}
html[data-design="dark"] .menu-intro::after{display:none}html[data-design="dark"] .menu-intro h1{max-width:62%;font-weight:650;color:#effcde;letter-spacing:-1px;text-shadow:none}html[data-design="dark"] .menu-intro>p{max-width:58%;color:#b9d0b6}html[data-design="dark"] .menu-intro .eyebrow{color:#c0f56e;font-size:9px;letter-spacing:1.6px}
html[data-design="dark"] .rm-coffee-portal{display:block;position:absolute;z-index:0;width:210px;height:235px;right:24px;top:26px;pointer-events:none}
.rm-portal-rings{position:absolute;inset:0 0 25px;border-radius:48% 52% 44% 56%;border:2px solid #b9fc66;background:repeating-radial-gradient(ellipse at 50% 50%,#a4ed5538 0 5px,#173d2220 9px 16px,#a9ef634d 20px 22px,transparent 26px 32px);box-shadow:inset 0 0 32px #aff55380,0 0 25px #a8f34d30,0 0 0 8px #a0e84a0d;animation:rm-orbit 22s linear infinite}
.rm-coffee-portal svg{position:absolute;width:100px;height:125px;left:55px;top:35px;filter:drop-shadow(0 10px 10px #0007);transform:rotate(-12deg)}.rm-coffee-portal>span{position:absolute;bottom:0;width:100%;text-align:center;font-size:7px;letter-spacing:1.4px;font-weight:700;color:#bbdf8b}
html[data-design="dark"] :is(.growth-combo,.menu-item,.growth-coupon,.growth-referral-card){background:linear-gradient(145deg,#192f26,#10221e);border:1px solid #40604180;box-shadow:inset 0 1px #dcffb00a,0 8px 24px #0002}
html[data-design="dark"] :is(.growth-button:not(.secondary),.growth-badge){background:linear-gradient(120deg,#d2ff84,#96df66);color:#102414;box-shadow:0 3px 14px #95e65e15}html[data-design="dark"] .growth-eyebrow{color:#b9ee80}html[data-design="dark"] .growth-combo-bottom strong{color:#d1fa9d}
html[data-design="dark"] .menu-category-title{color:#d4f5b2;text-shadow:none}html[data-design="dark"] .growth-carousel-controls button{background:#162e25;border-color:#517647;color:#cefa9e}
html[data-design="dark"] #main-nav .nav-item.active{color:#c4f480}html[data-design="dark"] #main-nav .nav-item.active .growth-nav-icon{filter:drop-shadow(0 0 6px #bdff6550)}
html[data-design="dark"] #bonus-content .loyalty-qr-card{background:linear-gradient(160deg,#1a3328,#10231f);border-color:#6e9c4659}html[data-design="dark"] .loyalty-qr-frame{box-shadow:0 0 0 5px #a9ee5c08,0 0 30px #b1f57412}
@keyframes rm-orbit{to{transform:rotate(360deg)}}
@media(min-width:1000px){html[data-design="dark"] .rm-coffee-portal{right:70px;width:245px;height:255px;top:16px}.rm-coffee-portal svg{left:70px;top:44px}}
@media(max-width:600px){html[data-design="dark"] .menu-intro{padding:24px 20px;min-height:270px}html[data-design="dark"] .menu-intro h1{max-width:66%;font-size:29px}html[data-design="dark"] .menu-intro>p{max-width:60%;font-size:12px}html[data-design="dark"] .rm-coffee-portal{width:150px;height:185px;right:-18px;top:78px;opacity:.9}.rm-coffee-portal svg{width:80px;height:100px;left:35px;top:28px}.rm-coffee-portal>span{display:none}}
@media(prefers-reduced-motion:reduce){.rm-portal-rings{animation:none}}
html[data-design="dark"] .header .logo{display:flex!important;align-items:center;gap:10px;color:#e3f8cb;font-family:inherit;font-size:20px;letter-spacing:-.5px;text-shadow:none}html[data-design="dark"] .header .logo img{height:42px!important;padding:4px;background:#d8ebc7;border-radius:12px}html[data-design="dark"] .user-avatar{background:linear-gradient(135deg,#d2ff84,#96df66);color:#132617;box-shadow:0 0 0 4px #b8f2690b}

/* Blue Hour and Cherry Velvet editions. */
html[data-design="bluehour"] {
    --primary: #173b99; --secondary: #45649a; --accent: #3462ce;
    --bg: #f0f3f9; --cream: #e3eafa; --card-bg: #ffffff; --white: #ffffff;
    --text-main: #172e5a; --text-muted: #5c6b85; --eda-orange: #214db3;
    --border-color: #d3ddee; --input-bg: #e9eef8; --summary-bg: #f3f6fc;
    --header-bg: #f5f8fced; --nav-bg: #f5f8fcf2;
    --gradient-primary: linear-gradient(125deg, #143485, #315ac2);
    --gradient-btn: linear-gradient(120deg, #234cb1, #173b99);
    --gradient-accent: linear-gradient(90deg, #5379d2, #bbcffa);
    --hero-bg: #dce7fc; --hero-ink: #315bc0; --hero-border: #c5d5f2;
    --on-action: #ffffff; --on-feature: #f4f7ff; --feature-muted: #d4dff8;
    --modifier-selected-bg: #dce6fa; --chip-bg: #e9eef8; --dropdown-hover: #e9eef8;
    --card-shadow: 0 3px 12px #252d2004;
    --shadow-lg: 0 16px 36px #252d2012; --checkout-shadow: 0 4px 12px #252d200c;
    --cart-bar-shadow: 0 10px 24px #252d2026; --input-focus-ring: 0 0 0 3px #6c7a6125;
    --radius: 8px; --radius-lg: 12px; --radius-btn: 8px; --radius-chip: 8px;
    --font-display: 'Inter', sans-serif;
}
html[data-design="cherry"] {
    --primary: #70243c; --secondary: #915066; --accent: #b55673;
    --bg: #fcf4f3; --cream: #f3e3e5; --card-bg: #fffafa; --white: #fffafa;
    --text-main: #532535; --text-muted: #84616c; --eda-orange: #8c294a;
    --border-color: #ead3d9; --input-bg: #f8eaed; --summary-bg: #fcf0f2;
    --header-bg: #fff8f8ed; --nav-bg: #fff8f8f2;
    --gradient-primary: linear-gradient(125deg, #642038, #923d58);
    --gradient-btn: linear-gradient(120deg, #8a2949, #692039);
    --gradient-accent: linear-gradient(90deg, #c47c91, #f0c4cf);
    --hero-bg: #f2dce2; --hero-ink: #983d5b; --hero-border: #e7c2ce;
    --on-action: #fff9fb; --on-feature: #fff5f7; --feature-muted: #eed0db;
    --modifier-selected-bg: #f2dce5; --chip-bg: #f8eaed; --dropdown-hover: #f8eaed;
    --card-shadow: 0 3px 12px #252d2004;
    --shadow-lg: 0 16px 36px #252d2012; --checkout-shadow: 0 4px 12px #252d200c;
    --cart-bar-shadow: 0 10px 24px #252d2026; --input-focus-ring: 0 0 0 3px #6c7a6125;
    --radius: 24px; --radius-lg: 30px; --radius-btn: 20px; --radius-chip: 30px;
    --font-display: 'Playfair Display', Georgia, serif;
}

html[data-design="bluehour"] body { background-image: linear-gradient(90deg, #214db305 1px, transparent 1px); background-size: 48px 48px; }
html[data-design="cherry"] body { background-image: radial-gradient(ellipse at top right, #efc5d54d, transparent 60%); }
html[data-design="bluehour"] .menu-intro { background: linear-gradient(125deg, #edf3ff, #d7e4fc); border-top: 4px solid #214db3; }
html[data-design="bluehour"] .menu-intro h1 { font-weight: 700; letter-spacing: -1.7px; }
html[data-design="bluehour"] .menu-category-title { font: 600 20px 'Inter', sans-serif; }
html[data-design="bluehour"] .menu-item-title { font: 600 16px/1.45 'Inter', sans-serif; }
html[data-design="bluehour"] .menu-item-image { border-radius: 0 0 40px 0; }
html[data-design="bluehour"] .logo { font-weight: 700; letter-spacing: -1px; }
html[data-design="cherry"] .menu-intro { background: radial-gradient(ellipse at bottom right, #eab8ca, transparent 70%), #f5e2e7; }
html[data-design="cherry"] .menu-intro h1 { font-style: italic; }
html[data-design="cherry"] .menu-category-title { font-size: 27px; }
html[data-design="cherry"] .menu-item-image { margin: 9px 9px 0; border-radius: 17px; border: 0; }
html[data-design="cherry"] .menu-item-price { color: #8c294a; }
html:is([data-design="bluehour"], [data-design="cherry"]) .theme-art svg { right: -5px; bottom: -8px; }
[data-design="bluehour"] .theme-art-bluehour, [data-design="cherry"] .theme-art-cherry { display: block; }
.design-preview.bluehour-preview { background: repeating-linear-gradient(90deg, transparent 0 19px, #ffffff22 20px 21px), linear-gradient(125deg, #173b99, #7199ee); }
.design-preview.cherry-preview { background: radial-gradient(circle at 80% 90%, #be718e 0 24%, transparent 25%), linear-gradient(125deg, #f7e2e8, #e6aec2); }
@media (max-width: 480px) {
 html[data-design="bluehour"] .menu-item-title { font-size: 14px; }
 html[data-design="cherry"] .menu-item-image { margin: 7px 7px 0; }
}