/*
 * QRresta À La Carte Ivory v1.0.0
 * Mobil-first, framework bağımsız à la carte restoran teması.
 * Scope: .qrai-root
 */
:root {
    --qrai-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
    --qrai-sans: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

.qrai-document {
    margin: 0;
    min-height: 100%;
    overflow-x: hidden;
    background: #e9e3d8;
}

.qrai-root,
.qrai-root *,
.qrai-root *::before,
.qrai-root *::after { box-sizing: border-box; }

.qrai-root {
    position: relative;
    width: min(100%, 480px);
    min-height: 100vh;
    min-height: 100dvh;
    margin: 0 auto;
    overflow-x: clip;
    background: var(--qrai-bg, #f5f1e8);
    color: var(--qrai-ink, #211f1a);
    font-family: var(--qrai-sans);
    font-size: 14px;
    line-height: 1.5;
    isolation: isolate;
    box-shadow: 0 20px 70px rgba(56, 48, 34, .16);
}

.qrai-root::before {
    position: fixed;
    z-index: -1;
    inset: 0;
    width: min(100%, 480px);
    margin: 0 auto;
    background-image: url("../img/decor/paper-grain.svg");
    opacity: .34;
    pointer-events: none;
    content: "";
}

.qrai-root a { color: inherit; text-decoration: none; }
.qrai-root button,
.qrai-root input,
.qrai-root select,
.qrai-root textarea { font: inherit; }
.qrai-root button { color: inherit; }
.qrai-root button,
.qrai-root a { -webkit-tap-highlight-color: transparent; }
.qrai-root img { display: block; max-width: 100%; }
.qrai-root [hidden] { display: none !important; }
.qrai-root :focus-visible { outline: 2px solid var(--qrai-gold); outline-offset: 3px; }

.qrai-icon { width: 20px; height: 20px; flex: 0 0 auto; }
.qrai-header-spacer { width: 42px; height: 42px; flex: 0 0 42px; }
.qrai-root button:disabled { cursor: not-allowed; opacity: .45; }
.qrai-scroll {
    min-height: 100vh;
    min-height: 100dvh;
    padding-bottom: calc(78px + env(safe-area-inset-bottom));
}
.qrai-view-product .qrai-scroll { padding-bottom: calc(151px + env(safe-area-inset-bottom)); }
.qrai-page { min-height: 100vh; padding: 0 18px 34px; }

/* Shared topbar */
.qrai-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 78px;
    padding: calc(14px + env(safe-area-inset-top)) 0 10px;
}
.qrai-brand { display: inline-flex; align-items: center; min-width: 0; }
.qrai-wordmark { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.qrai-wordmark > i { display: grid; width: 38px; height: 42px; place-items: center; }
.qrai-wordmark > i img { width: 30px; height: 38px; object-fit: contain; }
.qrai-wordmark > span { display: grid; min-width: 0; text-align: center; }
.qrai-wordmark strong {
    overflow: hidden;
    max-width: 190px;
    font-family: var(--qrai-serif);
    font-size: 22px;
    font-weight: 600;
    line-height: .9;
    letter-spacing: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.qrai-wordmark small { margin-top: 5px; color: var(--qrai-gold); font-size: 7px; font-weight: 800; letter-spacing: 0; }
.qrai-logo-image { display: block; width: 122px; height: 48px; }
.qrai-logo-image img { width: 100%; height: 100%; object-fit: contain; object-position: left center; }
.qrai-topbar-actions { position: relative; display: flex; align-items: center; gap: 8px; }
.qrai-icon-button {
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    padding: 0;
    border: 1px solid var(--qrai-line);
    border-radius: 50%;
    background: rgba(255,253,248,.84);
    cursor: pointer;
    box-shadow: 0 7px 20px rgba(52,43,28,.06);
}
.qrai-language-trigger {
    display: inline-flex;
    height: 40px;
    align-items: center;
    gap: 5px;
    padding: 0 12px;
    border: 1px solid var(--qrai-line);
    border-radius: 999px;
    background: rgba(255,253,248,.84);
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
}
.qrai-language-trigger .qrai-icon:first-child { width: 15px; height: 15px; }
.qrai-language-trigger .qrai-icon:last-child { width: 12px; height: 12px; }
.qrai-language-menu {
    position: absolute;
    z-index: 40;
    top: 48px;
    right: 0;
    display: grid;
    min-width: 128px;
    overflow: hidden;
    padding: 5px;
    border: 1px solid var(--qrai-line);
    border-radius: 16px;
    background: var(--qrai-surface);
    box-shadow: 0 18px 50px rgba(34,30,22,.15);
}
.qrai-language-menu button { padding: 10px 12px; border: 0; border-radius: 11px; background: transparent; text-align: left; cursor: pointer; }
.qrai-language-menu button.is-active { background: var(--qrai-olive); color: #fff; }

/* Bottom navigation */
.qrai-bottom-nav {
    position: fixed;
    z-index: 60;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    width: min(100%, 480px);
    min-height: 68px;
    margin: 0 auto;
    padding: 7px 8px calc(7px + env(safe-area-inset-bottom));
    grid-template-columns: repeat(5, 1fr);
    border-top: 1px solid rgba(127,111,76,.18);
    background: rgba(255,253,248,.94);
    backdrop-filter: blur(18px) saturate(1.2);
    box-shadow: 0 -10px 34px rgba(52,43,28,.08);
}
.qrai-nav-item {
    position: relative;
    display: grid;
    min-width: 0;
    min-height: 53px;
    place-items: center;
    align-content: center;
    gap: 3px;
    padding: 0;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: #807a70;
    font-size: 8px;
    font-weight: 700;
    cursor: pointer;
}
.qrai-bottom-nav > button.qrai-nav-item { width: 100%; appearance: none; font-family: inherit; }
.qrai-nav-item > .qrai-icon { width: 20px; height: 20px; }
.qrai-nav-item > span { font: 700 8px/1.15 var(--qrai-sans); }
.qrai-nav-item.is-active { color: var(--qrai-olive); }
.qrai-nav-item.is-disabled { color: #aaa49a; opacity: .48; cursor: not-allowed; }
.qrai-nav-item.is-active::before {
    position: absolute;
    top: 0;
    width: 20px;
    height: 2px;
    border-radius: 10px;
    background: var(--qrai-gold);
    content: "";
}
.qrai-nav-badge {
    position: absolute;
    top: 3px;
    right: calc(50% - 19px);
    display: grid;
    min-width: 16px;
    height: 16px;
    place-items: center;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--qrai-danger);
    color: #fff;
    font-size: 8px;
}

/* Home */
.qrai-welcome-splash {
    position: fixed;
    z-index: 210;
    inset: 0;
    display: grid;
    width: min(100%,480px);
    margin: 0 auto;
    place-items: center;
    padding: 38px 32px;
    background: linear-gradient(180deg,#fffdf8 0%,#f5f1e8 58%,#eee7da 100%);
    color: var(--qrai-ink);
    pointer-events: none;
    animation: qrai-welcome-splash-away 2.35s cubic-bezier(.22,.78,.22,1) forwards;
}
.qrai-welcome-splash::before,
.qrai-welcome-splash::after {
    position: absolute;
    left: 50%;
    content: "";
    transform: translateX(-50%);
}
.qrai-welcome-splash::before {
    bottom: calc(50% - 132px);
    width: 116px;
    height: 2px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(164,132,67,.18);
}
.qrai-welcome-splash::after {
    bottom: calc(50% - 132px);
    width: 116px;
    height: 2px;
    border-radius: 999px;
    background: var(--qrai-gold);
    transform: translateX(-50%) scaleX(0);
    transform-origin: left center;
    animation: qrai-welcome-splash-line 1.55s cubic-bezier(.22,.78,.28,1) .28s forwards;
}
.qrai-welcome-splash.is-skipped { display: none; }
.qrai-welcome-splash.is-done { opacity: 0; visibility: hidden; pointer-events: none; }
.qrai-welcome-splash-logo {
    position: relative;
    display: grid;
    min-width: 0;
    place-items: center;
    padding: 24px 20px 44px;
    transform: scale(.86);
    animation: qrai-welcome-logo-rise 1.75s cubic-bezier(.18,.84,.22,1) forwards;
}
.qrai-welcome-splash-logo::before {
    position: absolute;
    top: 0;
    left: 50%;
    width: min(260px,72vw);
    height: 1px;
    background: linear-gradient(90deg,transparent,rgba(164,132,67,.42),transparent);
    content: "";
    opacity: 0;
    transform: translateX(-50%) scaleX(.5);
    animation: qrai-welcome-logo-line 1.25s ease-out .15s forwards;
}
.qrai-welcome-splash-logo .qrai-logo-image { position: relative; z-index: 2; width: min(286px,74vw); height: 126px; }
.qrai-welcome-splash-logo .qrai-logo-image img { object-position: center; filter: drop-shadow(0 20px 42px rgba(68,55,32,.22)); }
.qrai-welcome-splash-logo .qrai-wordmark { position: relative; z-index: 2; flex-direction: column; gap: 13px; text-align: center; }
.qrai-welcome-splash-logo .qrai-wordmark > i { width: 76px; height: 82px; }
.qrai-welcome-splash-logo .qrai-wordmark > i img { width: 62px; height: 78px; }
.qrai-welcome-splash-logo .qrai-wordmark strong { max-width: min(360px,78vw); font-size: 48px; line-height: .92; }
.qrai-welcome-splash-logo .qrai-wordmark small { font-size: 9px; }
.qrai-welcome-splash::before,
.qrai-welcome-splash::after,
.qrai-welcome-splash-logo::before { display: none; }
.qrai-home-page {
    position: relative;
    min-height: calc(100vh - 78px);
    min-height: calc(100dvh - 78px);
    overflow: visible;
    padding: 0 18px 28px;
    background: #fbfaf7;
    color: var(--qrai-ink);
}
.qrai-home-header {
    position: relative;
    z-index: 4;
    display: flex;
    min-height: 50px;
    align-items: center;
    justify-content: space-between;
    padding-top: env(safe-area-inset-top);
    border-bottom: 0;
}
.qrai-home-header.is-actions-only { justify-content: flex-end; }
.qrai-home-header.is-with-meta { align-items: flex-start; justify-content: space-between; gap: 10px; padding-top: calc(8px + env(safe-area-inset-top)); }
.qrai-home-top-meta {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 6px;
    padding-top: 2px;
}
.qrai-home-top-meta:empty { display: none; }
.qrai-home-top-meta > span {
    position: relative;
    display: grid;
    min-width: 0;
    min-height: 38px;
    align-items: center;
    padding: 7px 9px;
    grid-template-columns: 16px minmax(0,1fr);
    column-gap: 6px;
    overflow: hidden;
    border: 1px solid var(--qrai-line);
    border-radius: 8px;
    background: #fff;
}
.qrai-home-top-meta > span::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(180deg,var(--qrai-olive),var(--qrai-gold));
    content: "";
    display: none;
    opacity: .72;
}
.qrai-home-top-meta > span:nth-child(2) {
    border-color: var(--qrai-line);
    background: #fff;
}
.qrai-home-top-meta .qrai-icon { width: 14px; height: 14px; grid-row: 1 / 3; color: var(--qrai-gold); }
.qrai-home-top-meta small { overflow: hidden; color: var(--qrai-muted); font-size: 6px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.qrai-home-top-meta strong { overflow: hidden; color: var(--qrai-ink); font-size: 9px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.qrai-home-brand { display: inline-flex; min-width: 0; align-items: center; }
.qrai-home-brand .qrai-wordmark { opacity: .48; transform: scale(.88); transform-origin: left center; }
.qrai-home-brand .qrai-wordmark strong { color: var(--qrai-ink); font-size: 23px; }
.qrai-home-brand .qrai-wordmark small { color: var(--qrai-gold); }
.qrai-home-brand .qrai-logo-image { width: 92px; height: 37px; opacity: .52; }
.qrai-home-actions { position: relative; display: flex; gap: 8px; }
.qrai-home-header.is-with-meta .qrai-home-actions { flex: 0 0 auto; padding-top: 2px; }
.qrai-home-round,
.qrai-home-language {
    display: inline-flex;
    height: 38px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 11px;
    border: 1px solid var(--qrai-line);
    border-radius: 999px;
    background: #fff;
    color: var(--qrai-ink);
    cursor: pointer;
}
.qrai-home-round { width: 38px; padding: 0; }
.qrai-home-language { font-size: 10px; font-weight: 800; }
.qrai-home-language .qrai-icon { width: 14px; height: 14px; }
.qrai-language-menu.is-home { top: 43px; color: var(--qrai-ink); }
.qrai-home-logo-focus {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 150px;
    margin: 0 -18px 15px;
    padding: 20px 18px 18px;
    overflow: hidden;
    border-top: 1px solid rgba(164,132,67,.15);
    border-bottom: 1px solid rgba(164,132,67,.18);
    background: linear-gradient(180deg,#fffdf8 0%,#fbfaf7 100%);
    animation: qrai-home-logo-focus-in .72s cubic-bezier(.2,.78,.26,1) .24s both;
}
.qrai-home-logo-focus::before,
.qrai-home-logo-focus::after {
    position: absolute;
    left: 50%;
    width: 72px;
    height: 2px;
    border-radius: 999px;
    background: var(--qrai-gold);
    content: "";
    opacity: .58;
    transform: translateX(-50%);
}
.qrai-home-logo-focus::before { top: 14px; display: none; }
.qrai-home-logo-focus::after { bottom: 14px; display: none; }
.qrai-home-logo-focus .qrai-logo-image { width: min(278px,72vw); height: 112px; }
.qrai-home-logo-focus .qrai-logo-image img { object-position: center; filter: drop-shadow(0 16px 32px rgba(68,55,32,.16)); }
.qrai-home-logo-focus .qrai-wordmark { flex-direction: column; gap: 9px; }
.qrai-home-logo-focus .qrai-wordmark > i { width: 58px; height: 62px; }
.qrai-home-logo-focus .qrai-wordmark > i img { width: 48px; height: 60px; }
.qrai-home-logo-focus .qrai-wordmark strong { max-width: min(350px,78vw); font-size: 40px; line-height: .94; text-align: center; }
.qrai-home-logo-focus .qrai-wordmark small { font-size: 8px; text-align: center; }
.qrai-home-intro {
    padding: 8px 2px 15px;
    text-align: left;
}
.qrai-home-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--qrai-gold);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0;
}
.qrai-home-kicker::before { width: 28px; height: 1px; background: var(--qrai-gold); content: ""; }
.qrai-home-intro h1 {
    max-width: 360px;
    margin: 6px 0 0;
    font-family: var(--qrai-serif);
    font-size: 44px;
    font-weight: 600;
    line-height: .96;
    letter-spacing: 0;
}
.qrai-home-greeting-row {
    display: flex;
    max-width: 370px;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
}
.qrai-home-greeting-row h1 {
    min-width: 0;
    margin: 0;
    color: var(--qrai-ink);
    font-size: 46px;
    font-weight: 700;
    line-height: .92;
    text-wrap: balance;
}
.qrai-home-time-toggle {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.qrai-home-time-toggle:active .qrai-home-time-icons { transform: scale(.94); }
.qrai-home-time-icons {
    position: relative;
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    transition: transform .18s ease;
}
.qrai-home-time-scene {
    position: absolute;
    display: block;
    width: 40px;
    height: 40px;
    overflow: hidden;
    border: 1px solid rgba(164,132,67,.22);
    border-radius: 50%;
    background: linear-gradient(180deg,#fff6d8 0%,#fffdf8 55%,#ece5d5 100%);
    color: var(--qrai-gold);
    opacity: 0;
    transform: translateY(6px) scale(.82) rotate(-8deg);
    transition: opacity .25s ease, transform .32s cubic-bezier(.22,.78,.28,1);
    box-shadow: 0 12px 25px rgba(68,55,32,.09);
}
.qrai-home-time-scene.is-day { background: linear-gradient(180deg,#fff1b8 0%,#fffdf8 62%,#f1ead9 100%); }
.qrai-home-time-scene.is-evening { background: linear-gradient(180deg,#ffe0bc 0%,#fff0d6 56%,#e9dfd1 100%); }
.qrai-home-time-scene.is-night { background: linear-gradient(180deg,#48513d 0%,#6a7544 100%); border-color: rgba(255,253,248,.2); }
.qrai-home-time-scene.is-active {
    opacity: 1;
    transform: translateY(0) scale(1) rotate(0);
    animation: qrai-home-time-scene-breathe 3.2s ease-in-out .2s infinite;
}
.qrai-time-sun {
    position: absolute;
    z-index: 2;
    left: 50%;
    bottom: 12px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #d9a236;
    box-shadow: 0 0 0 5px rgba(217,162,54,.16);
    transform: translateX(-50%);
}
.qrai-time-rays {
    position: absolute;
    z-index: 1;
    left: 50%;
    bottom: 8px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: repeating-conic-gradient(from 0deg,rgba(217,162,54,.42) 0 10deg,transparent 10deg 25deg);
    opacity: .75;
    transform: translateX(-50%);
}
.qrai-time-horizon {
    position: absolute;
    z-index: 3;
    right: 7px;
    bottom: 12px;
    left: 7px;
    height: 2px;
    border-radius: 999px;
    background: rgba(106,117,68,.42);
}
.qrai-home-time-scene.is-morning .qrai-time-sun { animation: qrai-home-sunrise 2.4s cubic-bezier(.22,.78,.28,1) infinite; }
.qrai-home-time-scene.is-morning .qrai-time-rays { animation: qrai-home-rays-wake 2.4s ease-in-out infinite; }
.qrai-home-time-scene.is-day .qrai-time-sun { bottom: 15px; background: #d5a12f; animation: qrai-home-sun-pulse 2.6s ease-in-out infinite; }
.qrai-home-time-scene.is-day .qrai-time-rays { bottom: 5px; animation: qrai-home-rays-spin 7s linear infinite; }
.qrai-home-time-scene.is-evening .qrai-time-sun { bottom: 9px; background: #c78342; animation: qrai-home-sunset 3s ease-in-out infinite; }
.qrai-home-time-scene.is-evening .qrai-time-rays { bottom: 5px; opacity: .48; animation: qrai-home-rays-wake 3s ease-in-out infinite reverse; }
.qrai-home-time-scene.is-evening .qrai-time-horizon { background: rgba(122,89,59,.5); }
.qrai-time-moon {
    position: absolute;
    top: 9px;
    left: 12px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff5cf;
    box-shadow: 0 0 14px rgba(255,245,207,.35);
    animation: qrai-home-moon-float 3s ease-in-out infinite;
}
.qrai-time-moon::after {
    position: absolute;
    top: -1px;
    right: -5px;
    width: 15px;
    height: 17px;
    border-radius: 50%;
    background: #566241;
    content: "";
}
.qrai-time-star {
    position: absolute;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #fff7d7;
    box-shadow: 0 0 8px rgba(255,247,215,.65);
    animation: qrai-home-star-twinkle 1.8s ease-in-out infinite;
}
.qrai-time-star.is-one { top: 9px; right: 10px; }
.qrai-time-star.is-two { right: 14px; bottom: 12px; animation-delay: .55s; }
.qrai-home-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    margin-top: 11px;
    padding-top: 10px;
    justify-content: center;
    border-top: 1px solid var(--qrai-line);
}
.qrai-home-meta > span {
    display: grid;
    min-width: 0;
    align-items: center;
    padding-right: 18px;
    grid-template-columns: 18px minmax(0,1fr);
    column-gap: 7px;
}
.qrai-home-meta > span + span { padding-left: 18px; border-left: 1px solid var(--qrai-line); }
.qrai-home-meta .qrai-icon { width: 16px; height: 16px; grid-row: 1 / 3; color: var(--qrai-gold); }
.qrai-home-meta small { color: var(--qrai-muted); font-size: 7px; font-weight: 700; }
.qrai-home-meta strong { font-size: 9px; font-weight: 800; }
.qrai-home-selection { min-width: 0; }
.qrai-home-selection-head { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.qrai-home-selection-head > div { display: grid; gap: 2px; }
.qrai-home-selection-head span { color: var(--qrai-gold); font-size: 7px; font-weight: 800; text-transform: uppercase; }
.qrai-home-selection-head h2 { margin: 0; font-family: var(--qrai-serif); font-size: 27px; font-weight: 600; line-height: 1; }
.qrai-home-selection-head > strong { flex: 0 0 auto; padding-bottom: 2px; color: var(--qrai-muted); font-size: 8px; font-weight: 700; }
.qrai-home-selection-head > strong span { color: var(--qrai-olive); font-size: 11px; }
.qrai-home-slider { position: relative; min-width: 0; }
.qrai-home-slider-track { display: flex; overflow-x: auto; border: 1px solid rgba(91,77,49,.18); border-radius: 8px; background: #e8e4db; box-shadow: 0 14px 34px rgba(47,39,27,.11); scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; }
.qrai-home-slider-track::-webkit-scrollbar { display: none; }
.qrai-home-slide { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; scroll-snap-stop: always; }
.qrai-home-slide > a { display: grid; min-height: 374px; grid-template-rows: auto minmax(94px,auto); background: #fff; color: var(--qrai-ink); }
.qrai-home-slide-media { position: relative; display: block; overflow: hidden; aspect-ratio: 4 / 3; background: #e8e4db; }
.qrai-home-slide-media > img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.qrai-home-slide > a:hover .qrai-home-slide-media > img { transform: scale(1.025); }
.qrai-home-slide-media > small { position: absolute; top: 12px; left: 12px; display: inline-flex; align-items: center; gap: 5px; padding: 7px 9px; border: 1px solid rgba(255,255,255,.68); border-radius: 999px; background: rgba(255,255,255,.92); color: var(--qrai-olive); font-size: 7px; font-weight: 800; }
.qrai-home-slide-media > small .qrai-icon { width: 12px; height: 12px; color: var(--qrai-gold); }
.qrai-home-slide-copy { display: grid; align-content: center; gap: 5px; min-width: 0; padding: 10px 14px 12px; }
.qrai-home-slide-title { display: flex; min-width: 0; align-items: baseline; justify-content: space-between; gap: 12px; }
.qrai-home-slide-title strong { min-width: 0; overflow: hidden; font-family: var(--qrai-serif); font-size: 22px; font-weight: 600; line-height: 1.05; text-overflow: ellipsis; white-space: nowrap; }
.qrai-home-slide-title b { flex: 0 0 auto; color: var(--qrai-olive); font-size: 12px; font-weight: 800; }
.qrai-home-slide-description { display: -webkit-box; overflow: hidden; color: var(--qrai-muted); font-size: 8px; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
.qrai-home-slide-link { display: inline-flex; align-items: center; justify-content: flex-end; gap: 5px; color: var(--qrai-gold); font-size: 8px; font-weight: 800; }
.qrai-home-slide-link .qrai-icon { width: 14px; height: 14px; }
.qrai-home-slider-arrow { position: absolute; z-index: 2; top: 32%; display: none; width: 36px; height: 36px; place-items: center; padding: 0; border: 1px solid rgba(91,77,49,.18); border-radius: 50%; background: rgba(255,255,255,.94); color: var(--qrai-ink); box-shadow: 0 8px 22px rgba(32,28,21,.16); cursor: pointer; transform: translateY(-50%); }
.qrai-home-slider-arrow.is-prev { left: 10px; }
.qrai-home-slider-arrow.is-next { right: 10px; }
.qrai-home-slider-arrow .qrai-icon { width: 16px; height: 16px; }
.qrai-home-slider-dots { display: flex; min-height: 22px; align-items: center; justify-content: center; gap: 6px; padding-top: 8px; }
.qrai-home-slider-dots button { width: 6px; height: 6px; padding: 0; border: 0; border-radius: 50%; background: #cfc8bb; cursor: pointer; transition: width .2s ease, border-radius .2s ease, background .2s ease; }
.qrai-home-slider-dots button.is-active { width: 22px; border-radius: 999px; background: var(--qrai-olive); }
.qrai-home-selection-empty { display: flex; min-height: 110px; align-items: center; justify-content: space-between; padding: 18px; border: 1px solid var(--qrai-line); border-radius: 8px; background: #fff; color: var(--qrai-ink); font-family: var(--qrai-serif); font-size: 22px; }
.qrai-home-selection-empty .qrai-icon { width: 20px; height: 20px; color: var(--qrai-gold); }
.qrai-home-highlights { display: grid; margin-top: 12px; grid-template-columns: repeat(3,minmax(0,1fr)); border-top: 1px solid var(--qrai-line); border-bottom: 1px solid var(--qrai-line); }
.qrai-home-highlights a,
.qrai-home-highlights button {
    display: flex;
    min-width: 0;
    min-height: 64px;
    align-items: center;
    gap: 7px;
    padding: 9px 8px;
    border: 0;
    background: transparent;
    color: var(--qrai-ink);
    text-align: left;
    cursor: pointer;
}
.qrai-home-highlights > * + * { border-left: 1px solid var(--qrai-line); }
.qrai-home-highlights .qrai-icon { width: 17px; height: 17px; color: var(--qrai-gold); }
.qrai-home-highlights span { display: grid; min-width: 0; }
.qrai-home-highlights small { color: var(--qrai-muted); font-size: 6px; font-weight: 700; }
.qrai-home-highlights strong { overflow: hidden; font-family: var(--qrai-serif); font-size: 13px; font-weight: 600; line-height: 1.05; }

/* Page headings */
.qrai-page-header {
    display: grid;
    min-height: 78px;
    align-items: center;
    padding: calc(14px + env(safe-area-inset-top)) 0 8px;
    grid-template-columns: 44px minmax(0,1fr) 44px;
    gap: 10px;
}
.qrai-page-header > div { min-width: 0; text-align: center; }
.qrai-page-header > div > span { color: var(--qrai-gold); font-size: 8px; font-weight: 800; letter-spacing: 0; }
.qrai-page-header h1 { overflow: hidden; margin: 1px 0 0; font-family: var(--qrai-serif); font-size: 29px; font-weight: 600; line-height: 1; text-overflow: ellipsis; white-space: nowrap; }
.qrai-page-heading { position: relative; padding: 10px 0 14px; text-align: center; }
.qrai-eyebrow { color: var(--qrai-gold); font-size: 8px; font-weight: 800; letter-spacing: 0; }
.qrai-page-heading h1 { margin: 4px 0 5px; font-family: var(--qrai-serif); font-size: 42px; font-weight: 600; line-height: 1; }
.qrai-page-heading p { max-width: 330px; margin: 0 auto; color: var(--qrai-muted); font-size: 11px; line-height: 1.65; }
.qrai-page-heading > img { width: 172px; margin: 10px auto 0; }

/* Search */
.qrai-search-box {
    display: flex;
    min-height: 48px;
    align-items: center;
    gap: 9px;
    padding: 0 14px;
    border: 1px solid var(--qrai-line);
    border-radius: 15px;
    background: rgba(255,253,248,.82);
    box-shadow: 0 8px 26px rgba(58,48,32,.045);
}
.qrai-search-box > .qrai-icon { width: 17px; height: 17px; color: var(--qrai-muted); }
.qrai-search-box input { flex: 1; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; color: var(--qrai-ink); font-size: 16px; }
.qrai-search-box input::placeholder { color: #9b958a; }
.qrai-search-box button { display: grid; width: 30px; height: 30px; place-items: center; padding: 0; border: 0; border-radius: 50%; background: var(--qrai-surface-alt); cursor: pointer; }
.qrai-search-box button .qrai-icon { width: 14px; height: 14px; }
.qrai-category-search { margin-bottom: 14px; }

/* Categories */
.qrai-categories-page { padding-right: 18px; padding-left: 18px; background: #fbfaf7; }
.qrai-categories-topbar {
    position: relative;
    display: flex;
    min-height: 72px;
    align-items: center;
    justify-content: space-between;
    padding-top: env(safe-area-inset-top);
    border-bottom: 1px solid var(--qrai-line);
}
.qrai-categories-brand { display: inline-flex; min-width: 0; align-items: center; }
.qrai-categories-brand .qrai-logo-image { width: 118px; height: 46px; }
.qrai-categories-brand .qrai-wordmark strong { font-size: 22px; }
.qrai-categories-intro { padding: 22px 0 17px; }
.qrai-categories-intro h1 { margin: 0 0 4px; font-family: var(--qrai-serif); font-size: 43px; font-weight: 600; line-height: .98; }
.qrai-categories-intro p { max-width: 310px; margin: 0; color: var(--qrai-muted); font-size: 10px; line-height: 1.55; }
.qrai-categories-language-wrap { position: relative; }
.qrai-categories-language {
    display: inline-flex;
    height: 34px;
    align-items: center;
    justify-content: flex-end;
    gap: 3px;
    padding: 0 2px 0 10px;
    border: 0;
    background: transparent;
    font-size: 9px;
    font-weight: 800;
    cursor: pointer;
}
.qrai-categories-language .qrai-icon { width: 11px; height: 11px; }
.qrai-categories-language-wrap .qrai-language-menu { top: 38px; }
.qrai-category-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.qrai-category-card {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    border: 1px solid rgba(91,77,49,.19);
    border-radius: 8px;
    background: #26291f;
    box-shadow: 0 8px 20px rgba(47,39,27,.09);
    isolation: isolate;
}
.qrai-category-card > img,
.qrai-category-card > video { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.qrai-category-card > .qrai-category-video,
.qrai-category-card > .qrai-category-video-poster { position: absolute; inset: 0; }
.qrai-category-video { z-index: 0; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .18s ease, transform .5s ease; -webkit-appearance: none; }
.qrai-category-video-poster { z-index: 0; opacity: 1; visibility: visible; transition: opacity .18s ease, transform .5s ease; }
.qrai-category-video.is-playing { opacity: 1; visibility: visible; }
.qrai-category-video.is-playing + .qrai-category-video-poster { opacity: 0; visibility: hidden; }
.qrai-category-video::-webkit-media-controls,
.qrai-category-video::-webkit-media-controls-panel,
.qrai-category-video::-webkit-media-controls-play-button,
.qrai-category-video::-webkit-media-controls-start-playback-button,
.qrai-category-video::-webkit-media-controls-overlay-play-button { display: none !important; opacity: 0 !important; -webkit-appearance: none !important; }
.qrai-category-card:hover > img,
.qrai-category-card:hover > video { transform: scale(1.045); }
.qrai-category-shade { position: absolute; z-index: 1; inset: 0; background: linear-gradient(180deg, rgba(8,9,6,.15) 0%, rgba(8,9,6,.03) 36%, rgba(8,9,6,.84) 100%); }
.qrai-category-index { position: absolute; z-index: 2; top: 11px; left: 11px; color: rgba(255,255,255,.92); font-family: var(--qrai-serif); font-size: 15px; font-weight: 600; text-shadow: 0 1px 8px rgba(0,0,0,.25); }
.qrai-category-copy { position: absolute; z-index: 2; right: 34px; bottom: 13px; left: 12px; display: grid; color: #fff; text-align: left; }
.qrai-category-copy strong { display: -webkit-box; overflow: hidden; font-family: var(--qrai-serif); font-size: 19px; font-weight: 600; line-height: 1.02; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: normal; }
.qrai-category-arrow { position: absolute; z-index: 2; right: 11px; bottom: 14px; display: grid; width: 23px; height: 23px; place-items: center; border: 1px solid rgba(255,255,255,.48); border-radius: 50%; color: #fff; }
.qrai-category-arrow .qrai-icon { width: 12px; height: 12px; }

/* Menu */
.qrai-menu-header { margin-bottom: 2px; }
.qrai-category-strip { display: flex; gap: 8px; overflow-x: auto; margin: 12px -18px 0; padding: 0 18px 8px; scrollbar-width: none; }
.qrai-category-strip::-webkit-scrollbar { display: none; }
.qrai-category-strip button { display: inline-flex; flex: 0 0 auto; min-height: 46px; align-items: center; gap: 8px; padding: 4px 13px 4px 4px; border: 1px solid var(--qrai-line); border-radius: 11px; background: rgba(255,253,248,.82); color: var(--qrai-muted); font-size: 10px; font-weight: 700; cursor: pointer; }
.qrai-category-strip button.is-active { border-color: var(--qrai-olive); background: var(--qrai-olive); color: #fff; }
.qrai-category-strip-thumb { position: relative; display: grid; width: 36px; height: 36px; flex: 0 0 36px; place-items: center; overflow: hidden; border-radius: 8px; background: #e8e1d5; }
.qrai-category-strip-thumb img,
.qrai-category-strip-thumb video { display: block; width: 100%; height: 100%; object-fit: cover; }
.qrai-category-strip-thumb .qrai-category-video,
.qrai-category-strip-thumb .qrai-category-video-poster { position: absolute; inset: 0; }
.qrai-category-strip-all { background: rgba(167,139,77,.14); color: var(--qrai-gold); }
.qrai-category-strip-all .qrai-icon { width: 14px; height: 14px; }
.qrai-category-strip button.is-active .qrai-category-strip-all { background: rgba(255,255,255,.18); color: #fff; }
.qrai-category-strip-label { max-width: 126px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qrai-menu-toolbar {
    display: grid;
    align-items: center;
    gap: 7px;
    margin-top: 6px;
    padding: 8px;
    grid-template-columns: auto minmax(0,1fr) auto;
    border: 1px solid var(--qrai-line);
    border-radius: 15px;
    background: rgba(255,253,248,.78);
}
.qrai-toolbar-button,
.qrai-sort-control,
.qrai-view-switch { height: 36px; border: 1px solid var(--qrai-line); border-radius: 10px; background: var(--qrai-surface); }
.qrai-toolbar-button { position: relative; display: inline-flex; align-items: center; gap: 5px; padding: 0 10px; cursor: pointer; }
.qrai-toolbar-button .qrai-icon { width: 14px; height: 14px; }
.qrai-toolbar-button span { font-size: 9px; font-weight: 700; }
.qrai-toolbar-button b { position: absolute; top: -5px; right: -5px; display: grid; min-width: 16px; height: 16px; place-items: center; border-radius: 99px; background: var(--qrai-danger); color: #fff; font-size: 8px; }
.qrai-sort-control { position: relative; display: flex; min-width: 0; align-items: center; gap: 5px; padding: 0 7px; }
.qrai-sort-control .qrai-icon { width: 13px; height: 13px; }
.qrai-sort-control select { width: 100%; min-width: 0; padding: 0 13px 0 0; border: 0; outline: 0; background: transparent; color: var(--qrai-ink); font-size: 9px; font-weight: 700; appearance: none; }
.qrai-sort-control .qrai-icon:last-child { position: absolute; right: 7px; pointer-events: none; }
.qrai-view-switch { display: grid; grid-template-columns: repeat(3,31px); padding: 2px; }
.qrai-view-switch button { display: grid; place-items: center; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--qrai-muted); cursor: pointer; }
.qrai-view-switch button.is-active { background: var(--qrai-olive); color: #fff; }
.qrai-view-switch .qrai-icon { width: 14px; height: 14px; }
.qrai-menu-section-head { display: flex; align-items: center; justify-content: space-between; margin: 17px 2px 9px; }
.qrai-menu-section-head span { font-size: 9px; font-weight: 800; letter-spacing: 0; }
.qrai-menu-section-head strong { color: var(--qrai-muted); font-size: 9px; font-weight: 600; }

.qrai-product-list { display: grid; gap: 10px; }
.qrai-product-card {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    border: 1px solid var(--qrai-line);
    border-radius: 16px;
    background: rgba(255,253,248,.91);
    box-shadow: 0 7px 22px rgba(58,48,32,.045);
}
.qrai-product-image { display: block; overflow: hidden; background: #e8e1d5; }
.qrai-product-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.qrai-product-card:hover .qrai-product-image img { transform: scale(1.025); }
.qrai-product-body { min-width: 0; }
.qrai-product-badges { position: absolute; z-index: 5; top: 9px; left: 9px; right: 9px; display: flex; flex-wrap: wrap; gap: 4px; margin: 0; pointer-events: none; }
.qrai-product-badges span { padding: 3px 6px; border: 1px solid rgba(124,104,52,.18); border-radius: 999px; background: rgba(255,253,248,.92); box-shadow: 0 6px 16px rgba(58,48,32,.1); color: #7c6834; font-size: 7px; font-weight: 800; line-height: 1; }
.qrai-product-title { display: -webkit-box; overflow: hidden; padding-bottom: 1px; font-family: var(--qrai-serif); font-size: 20px; font-weight: 600; line-height: 1.12; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.qrai-product-body > p { display: -webkit-box; overflow: hidden; margin: 5px 0 0; color: var(--qrai-muted); font-size: 9px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.qrai-product-meta { display: flex; gap: 8px; margin-top: 6px; color: #8c867b; font-size: 7px; }
.qrai-product-meta span + span::before { margin-right: 8px; content: "•"; }
.qrai-product-footer { display: flex; min-height: 34px; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; }
.qrai-product-footer strong { color: var(--qrai-olive); font-size: 13px; font-weight: 800; }
.qrai-add-button { position: relative; isolation: isolate; overflow: hidden; display: grid; width: 34px; min-width: 34px; max-width: 34px; height: 34px; min-height: 34px; max-height: 34px; flex: 0 0 34px; box-sizing: border-box; place-items: center; padding: 0; border: 0; border-radius: 10px; background: var(--qrai-olive); color: #fff; line-height: 1; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.qrai-add-button:active,
.qrai-add-button.is-adding,
.qrai-add-button.is-added { background: var(--qrai-olive); filter: none; opacity: 1; }
.qrai-list-add-icon,
.qrai-list-add-check { position: relative; z-index: 2; display: grid; grid-area: 1 / 1; place-items: center; transition: opacity .16s ease, transform .2s ease; }
.qrai-list-add-icon .qrai-icon,
.qrai-list-add-check .qrai-icon { width: 16px; height: 16px; }
.qrai-list-add-check { opacity: 0; transform: scale(.55) rotate(-18deg); }
.qrai-list-add-check .qrai-icon path { stroke-dasharray: 24; stroke-dashoffset: 24; }
.qrai-list-add-basket { position: absolute; z-index: 1; bottom: 7px; left: 50%; width: 18px; height: 11px; border: 1.7px solid rgba(255,255,255,.78); border-top: 0; border-radius: 3px 3px 6px 6px; opacity: 0; transform: translateX(-50%) translateY(8px) scale(.75); pointer-events: none; }
.qrai-list-add-basket::before { content: ""; position: absolute; top: -7px; left: 4px; width: 8px; height: 8px; border: 1.7px solid rgba(255,255,255,.78); border-bottom: 0; border-radius: 8px 8px 0 0; }
.qrai-list-add-basket i { position: absolute; top: 4px; left: 3px; width: 10px; height: 1.7px; border-radius: 999px; background: rgba(255,255,255,.7); transform: scaleX(0); transform-origin: left center; }
.qrai-list-add-drop { position: absolute; z-index: 2; top: 9px; left: 14px; width: 7px; height: 7px; border-radius: 50%; background: #fff; opacity: 0; transform: translateY(-10px) scale(.35); pointer-events: none; }
.qrai-add-button.is-adding .qrai-list-add-icon { opacity: 0; transform: rotate(135deg) scale(.35); }
.qrai-add-button.is-adding .qrai-list-add-basket { animation: qrai-list-add-basket .52s cubic-bezier(.18,.9,.28,1) both; }
.qrai-add-button.is-adding .qrai-list-add-basket i { animation: qrai-list-add-basket-fill .52s ease-out both; }
.qrai-add-button.is-adding .qrai-list-add-drop { animation: qrai-list-add-drop .52s cubic-bezier(.22,.82,.24,1) both; }
.qrai-add-button.is-added .qrai-list-add-icon { opacity: 0; transform: scale(.35) rotate(90deg); }
.qrai-add-button.is-added .qrai-list-add-basket,
.qrai-add-button.is-added .qrai-list-add-drop { opacity: 0; }
.qrai-add-button.is-added .qrai-list-add-check { opacity: 1; transform: scale(1) rotate(0deg); }
.qrai-add-button.is-added .qrai-list-add-check .qrai-icon path { animation: qrai-list-add-check .34s ease-out .04s forwards; }
.qrai-card-allergens { display: none; }

@keyframes qrai-list-add-basket {
    0% { opacity: 0; transform: translateX(-50%) translateY(8px) scale(.75); }
    18% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
    76% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
    100% { opacity: 0; transform: translateX(-50%) translateY(2px) scale(.82); }
}

@keyframes qrai-list-add-basket-fill {
    0%, 42% { transform: scaleX(0); }
    78%, 100% { transform: scaleX(1); }
}

@keyframes qrai-list-add-drop {
    0% { opacity: 0; transform: translateY(-10px) scale(.35); }
    22% { opacity: 1; transform: translateY(-8px) scale(1); }
    68% { opacity: 1; transform: translateY(8px) scale(.72); }
    100% { opacity: 0; transform: translateY(10px) scale(.45); }
}

@keyframes qrai-list-add-check {
    0% { stroke-dashoffset: 24; }
    100% { stroke-dashoffset: 0; }
}

/* horizontal/default */
.qrai-product-list.is-view-horizontal { min-width: 0; grid-template-columns: minmax(0,1fr); }
.qrai-product-list.is-view-horizontal .qrai-product-card { display: grid; width: 100%; min-width: 0; height: 164px; grid-template-columns: 126px minmax(0,1fr); }
.qrai-product-list.is-view-horizontal .qrai-product-image { height: 100%; min-height: 0; align-self: stretch; }
.qrai-product-list.is-view-horizontal .qrai-product-body { display: flex; min-height: 0; height: 100%; flex-direction: column; overflow: hidden; box-sizing: border-box; padding: 11px 12px 9px; }
.qrai-product-list.is-view-horizontal .qrai-product-title { font-size: 18px; line-height: 1.14; }
.qrai-product-list.is-view-horizontal .qrai-product-body > p { -webkit-line-clamp: 1; }
.qrai-product-list.is-view-horizontal .qrai-product-footer { margin-top: auto; padding-top: 5px; }
.qrai-product-list.is-view-horizontal .qrai-card-allergens { display: block; width: 100%; min-width: 0; max-width: 100%; height: 32px; max-height: 32px; flex: 0 0 32px; overflow: hidden; box-sizing: border-box; margin-top: 5px; padding-top: 5px; border-top: 1px solid var(--qrai-line); }
.qrai-product-list.is-view-horizontal .qrai-card-allergen-list { display: flex; width: 100%; min-width: 0; max-width: 100%; height: 26px; flex-wrap: nowrap; align-items: center; gap: 5px; overflow: hidden; }
.qrai-product-list.is-view-horizontal .qrai-card-allergen { display: grid; width: 25px; height: 25px; flex: 0 0 25px; place-items: center; padding: 0; border: 1px solid rgba(139,120,72,.2); border-radius: 7px; background: rgba(236,229,212,.55); }
.qrai-product-list.is-view-horizontal .qrai-card-allergen i { display: grid; width: 17px; height: 17px; place-items: center; overflow: visible; color: var(--qrai-olive); font-style: normal; line-height: 1; }
.qrai-product-list.is-view-horizontal .qrai-card-allergen i img,
.qrai-product-list.is-view-horizontal .qrai-card-allergen i svg { display: block; width: 17px; height: 17px; object-fit: contain; }
.qrai-product-list.is-view-horizontal .qrai-card-allergen i b { font-size: 8px; }
/* grid */
.qrai-product-list.is-view-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.qrai-product-list.is-view-grid .qrai-product-card { display: flex; height: 248px; flex-direction: column; }
.qrai-product-list.is-view-grid .qrai-product-image { height: 118px; min-height: 118px; flex: 0 0 118px; aspect-ratio: auto; }
.qrai-product-list.is-view-grid .qrai-product-body { display: flex; min-height: 0; flex: 1 1 auto; flex-direction: column; overflow: hidden; padding: 10px; }
.qrai-product-list.is-view-grid .qrai-product-title { font-size: 17px; }
.qrai-product-list.is-view-grid .qrai-product-body > p { -webkit-line-clamp: 2; }
.qrai-product-list.is-view-grid .qrai-product-footer { min-height: 42px; margin-top: auto; padding-top: 8px; }
.qrai-product-list.is-view-grid .qrai-product-footer strong { display: flex; min-height: 34px; align-items: center; line-height: 1.2; }
/* compact */
.qrai-product-list.is-view-compact .qrai-product-card { display: grid; height: 96px; grid-template-columns: 86px minmax(0,1fr); }
.qrai-product-list.is-view-compact .qrai-product-image { height: 100%; min-height: 0; align-self: stretch; }
.qrai-product-list.is-view-compact .qrai-product-body { display: flex; min-height: 0; height: 100%; flex-direction: column; overflow: hidden; box-sizing: border-box; padding: 9px 10px; }
.qrai-product-list.is-view-compact .qrai-product-title { font-size: 17px; }
.qrai-product-list.is-view-compact .qrai-product-body > p,
.qrai-product-list.is-view-compact .qrai-product-badges { display: none; }
.qrai-product-list.is-view-compact .qrai-product-meta { margin-top: 4px; }
.qrai-product-list.is-view-compact .qrai-product-footer { min-height: 30px; margin-top: auto; padding-top: 6px; }
.qrai-product-list.is-view-compact .qrai-add-button { width: 30px; min-width: 30px; max-width: 30px; height: 30px; min-height: 30px; max-height: 30px; flex-basis: 30px; }

.qrai-cart-pill {
    position: sticky;
    z-index: 20;
    bottom: calc(72px + env(safe-area-inset-bottom));
    display: flex;
    min-height: 54px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 15px 0 -10px;
    padding: 9px 13px;
    border-radius: 16px;
    background: var(--qrai-olive);
    color: #fff;
    box-shadow: 0 15px 35px rgba(61,69,40,.24);
}
.qrai-cart-pill span { display: inline-flex; align-items: center; gap: 6px; font-size: 10px; }
.qrai-cart-pill > .qrai-icon { width: 16px; height: 16px; }

/* Product detail */
.qrai-product-page { min-height: 100vh; background: var(--qrai-bg); }
.qrai-product-hero { position: relative; height: min(50vh, 440px); min-height: 360px; overflow: hidden; background: var(--qrai-bg); }
.qrai-product-hero > img { width: 100%; height: 100%; object-fit: contain; object-position: center; background: var(--qrai-bg); }
.qrai-product-hero::after { display: none; }
.qrai-hero-button { position: absolute; z-index: 4; top: calc(16px + env(safe-area-inset-top)); display: grid; width: 42px; height: 42px; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.45); border-radius: 50%; background: rgba(255,253,248,.86); color: var(--qrai-ink); backdrop-filter: blur(12px); cursor: pointer; }
.qrai-hero-button.is-back { left: 16px; }
.qrai-hero-tools { position: absolute; z-index: 4; top: 0; right: 16px; }
.qrai-hero-tools .qrai-hero-button { position: relative; top: calc(16px + env(safe-area-inset-top)); display: inline-grid; margin-left: 6px; }
.qrai-hero-button.is-active { background: var(--qrai-danger); color: #fff; }
.qrai-gallery-dots { position: absolute; z-index: 4; bottom: 14px; left: 50%; display: flex; gap: 5px; transform: translateX(-50%); }
.qrai-gallery-dots i { width: 5px; height: 5px; border-radius: 50%; background: rgba(33,31,26,.24); }
.qrai-gallery-dots i.is-active { width: 18px; border-radius: 9px; background: var(--qrai-olive); }
.qrai-representative-badge { position: absolute; z-index: 4; right: 14px; bottom: 14px; max-width: calc(100% - 28px); padding: 7px 9px; border: 1px solid rgba(119,103,55,.2); border-radius: 7px; background: rgba(255,253,248,.9); box-shadow: 0 5px 18px rgba(48,42,29,.12); color: var(--qrai-ink); font-size: 9px; font-weight: 700; line-height: 1.2; backdrop-filter: blur(10px); }
.qrai-product-sheet { position: relative; z-index: 5; margin-top: -1px; padding: 20px 18px 32px; border-radius: 0; background: var(--qrai-bg); }
.qrai-product-label { display: inline-flex; align-items: center; gap: 5px; padding: 6px 9px; border: 1px solid #d9cda9; border-radius: 999px; color: #80692e; font-size: 8px; font-weight: 800; }
.qrai-product-label .qrai-icon { width: 12px; height: 12px; }
.qrai-product-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-top: 12px; }
.qrai-product-title-row h1 { max-width: 72%; margin: 0; font-family: var(--qrai-serif); font-size: 32px; font-weight: 600; line-height: .95; }
.qrai-product-title-row > strong { color: var(--qrai-olive); font-size: 18px; white-space: nowrap; }
.qrai-product-description { margin: 9px 0 0; color: var(--qrai-muted); font-size: 10px; line-height: 1.65; }
.qrai-product-ingredients { display: grid; align-items: start; margin-top: 14px; padding: 11px 0; grid-template-columns: 26px minmax(0,1fr); gap: 9px; border-top: 1px solid var(--qrai-line); border-bottom: 1px solid var(--qrai-line); }
.qrai-product-ingredients > i { display: grid; width: 26px; height: 26px; place-items: center; color: var(--qrai-olive); font-style: normal; }
.qrai-product-ingredients > i .qrai-icon { width: 18px; height: 18px; }
.qrai-product-ingredients > div { min-width: 0; }
.qrai-product-ingredients strong { display: block; font-size: 9px; font-weight: 800; }
.qrai-product-ingredients p { margin: 3px 0 0; color: var(--qrai-muted); font-size: 9px; line-height: 1.55; white-space: pre-line; overflow-wrap: anywhere; }
.qrai-product-facts { display: grid; margin-top: 17px; padding: 12px 0; grid-template-columns: repeat(var(--qrai-fact-count,3),1fr); border-top: 1px solid var(--qrai-line); border-bottom: 1px solid var(--qrai-line); }
.qrai-product-facts > span { display: flex; align-items: center; justify-content: center; gap: 7px; min-width: 0; padding: 0 5px; border-right: 1px solid var(--qrai-line); }
.qrai-product-facts > span:last-child { border-right: 0; }
.qrai-product-facts .qrai-icon { width: 19px; height: 19px; color: var(--qrai-gold); }
.qrai-product-facts b { display: grid; font-size: 10px; line-height: 1.2; }
.qrai-product-facts small { color: var(--qrai-muted); font-size: 7px; font-weight: 500; }
.qrai-product-tags { margin-top: 16px; }
.qrai-product-tags > strong { display: block; margin-bottom: 8px; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.qrai-product-tags > div { display: flex; flex-wrap: wrap; gap: 6px; }
.qrai-product-tags span { display: inline-flex; align-items: center; min-height: 28px; padding: 6px 9px; border: 1px solid var(--qrai-line); border-radius: 7px; background: var(--qrai-surface); color: var(--qrai-muted); font-size: 9px; font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
.qrai-option-section { margin-top: 20px; }
.qrai-section-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 9px; }
.qrai-section-title h2 { margin: 0; font-size: 10px; font-weight: 800; letter-spacing: 0; text-transform: uppercase; }
.qrai-section-title small { color: var(--qrai-muted); font-size: 7px; }
.qrai-segmented { display: grid; gap: 7px; grid-template-columns: repeat(3,minmax(0,1fr)); }
.qrai-segmented button { display: grid; min-width: 0; min-height: 44px; padding: 5px; place-content: center; gap: 2px; border: 1px solid var(--qrai-line); border-radius: 10px; background: var(--qrai-surface); color: var(--qrai-muted); font-size: 9px; line-height: 1.2; overflow-wrap: anywhere; cursor: pointer; }
.qrai-segmented button small { color: var(--qrai-ink); font-size: 8px; font-weight: 800; }
.qrai-segmented button.is-active { border-color: var(--qrai-olive); background: var(--qrai-olive); color: #fff; box-shadow: 0 8px 18px rgba(61,69,40,.14); }
.qrai-segmented button.is-active small { color: #fff; }
.qrai-extra-list { display: grid; }
.qrai-extra-list label { display: grid; min-height: 42px; align-items: center; grid-template-columns: 20px minmax(0,1fr) auto; gap: 9px; border-bottom: 1px solid var(--qrai-line); cursor: pointer; }
.qrai-extra-list input { position: absolute; opacity: 0; pointer-events: none; }
.qrai-extra-list i { display: grid; width: 18px; height: 18px; place-items: center; border: 1px solid #bbb4a8; border-radius: 4px; color: transparent; }
.qrai-extra-list i .qrai-icon { width: 12px; height: 12px; }
.qrai-extra-list input:checked + i { border-color: var(--qrai-olive); background: var(--qrai-olive); color: #fff; }
.qrai-extra-list span { font-size: 10px; }
.qrai-extra-list b { font-size: 9px; font-weight: 700; }
.qrai-allergen-list { display: flex; gap: 8px; overflow-x: auto; padding: 2px 0 4px; scrollbar-width: none; }
.qrai-allergen-list::-webkit-scrollbar { display: none; }
.qrai-allergen { display: grid; width: 66px; min-height: 60px; flex: 0 0 66px; place-items: center; align-content: center; gap: 5px; padding: 6px 4px; border: 0; border-radius: 10px; background: transparent; color: var(--qrai-ink); text-align: center; }
.qrai-allergen-icon { display: grid; width: 28px; height: 28px; place-items: center; color: var(--qrai-olive); font-style: normal; }
.qrai-allergen-icon img,
.qrai-allergen-icon .allergen-custom-icon,
.qrai-allergen-icon svg { display: block; width: 22px; height: 22px; object-fit: contain; }
.qrai-allergen-icon b { display: grid; width: 22px; height: 22px; place-items: center; border: 1px solid var(--qrai-line); border-radius: 50%; font-size: 8px; }
.qrai-allergen small { display: -webkit-box; max-width: 100%; overflow: hidden; color: var(--qrai-muted); font-size: 7px; font-weight: 700; line-height: 1.2; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.qrai-related-section { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--qrai-line); }
.qrai-related-title { margin-bottom: 11px; }
.qrai-related-title h2 { font-family: var(--qrai-serif); font-size: 19px; font-weight: 600; text-transform: none; }
.qrai-related-title small { padding: 4px 7px; border: 1px solid var(--qrai-line); border-radius: 6px; background: var(--qrai-surface); font-size: 8px; font-weight: 700; }
.qrai-related-scroll { display: flex; gap: 10px; overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; margin: 0 -18px; padding: 1px 18px 8px; scroll-snap-type: x proximity; scrollbar-width: none; }
.qrai-related-scroll::-webkit-scrollbar { display: none; }
.qrai-related-card { display: grid; min-height: 96px; flex: 0 0 min(74vw,280px); align-items: center; padding: 8px; grid-template-columns: 80px minmax(0,1fr) 28px; gap: 10px; border: 1px solid var(--qrai-line); border-radius: 8px; background: var(--qrai-surface); scroll-snap-align: start; }
.qrai-related-card > img { width: 80px; height: 80px; border-radius: 6px; background: var(--qrai-bg); object-fit: cover; }
.qrai-related-card > span { display: grid; min-width: 0; align-content: center; }
.qrai-related-card > span small { overflow: hidden; color: var(--qrai-gold); font-size: 7px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.qrai-related-card > span strong { display: -webkit-box; overflow: hidden; margin-top: 3px; font-family: var(--qrai-serif); font-size: 16px; font-weight: 600; line-height: 1.05; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.qrai-related-card > span b { margin-top: 7px; color: var(--qrai-olive); font-size: 10px; }
.qrai-related-card > i { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: var(--qrai-olive); color: #fff; font-style: normal; }
.qrai-related-card > i .qrai-icon { width: 14px; height: 14px; }
.qrai-product-action-bar {
    position: fixed;
    z-index: 65;
    right: 0;
    bottom: calc(68px + env(safe-area-inset-bottom));
    left: 0;
    display: grid;
    width: min(100%,480px);
    margin: 0 auto;
    padding: 10px 14px;
    grid-template-columns: 112px minmax(0,1fr);
    gap: 9px;
    border-top: 1px solid var(--qrai-line);
    background: rgba(245,241,232,.96);
    backdrop-filter: blur(18px);
}
.qrai-quantity-control { display: grid; min-height: 51px; align-items: center; grid-template-columns: 1fr 28px 1fr; border: 1px solid var(--qrai-line); border-radius: 13px; background: var(--qrai-surface); }
.qrai-quantity-control button { display: grid; height: 100%; place-items: center; padding: 0; border: 0; background: transparent; cursor: pointer; }
.qrai-quantity-control .qrai-icon { width: 15px; height: 15px; }
.qrai-quantity-control b { text-align: center; }
.qrai-detail-add { position: relative; isolation: isolate; overflow: hidden; display: flex; min-width: 0; min-height: 51px; align-items: center; justify-content: space-between; gap: 8px; padding: 0 16px; border: 0; border-radius: 13px; background: var(--qrai-olive); color: #fff; cursor: pointer; box-shadow: 0 9px 24px rgba(61,69,40,.22); transition: transform .18s ease; -webkit-tap-highlight-color: transparent; }
.qrai-detail-add:disabled { opacity: 1; cursor: default; }
.qrai-detail-add:active,
.qrai-detail-add[aria-disabled="true"],
.qrai-detail-add.is-adding,
.qrai-detail-add.is-added { background: var(--qrai-olive); filter: none; opacity: 1; }
.qrai-detail-add-fill { position: absolute; z-index: 0; right: 16px; bottom: 7px; left: 16px; overflow: hidden; height: 2px; border-radius: 999px; background: rgba(255,255,255,.2); opacity: 0; pointer-events: none; }
.qrai-detail-add-fill::after { content: ""; position: absolute; inset: 0; width: 42%; border-radius: inherit; background: rgba(255,255,255,.76); transform: translateX(-120%); }
.qrai-detail-add-chef { position: relative; z-index: 1; display: block; overflow: visible; width: 0; height: 27px; flex: 0 0 auto; opacity: 0; transform-origin: center bottom; transition: width .22s ease, margin .22s ease, opacity .18s ease; }
.qrai-detail-add-chef i { position: absolute; display: block; pointer-events: none; }
.qrai-chef-hat { top: 0; left: 5px; width: 18px; height: 8px; border-radius: 8px 8px 4px 4px; background: #fff; box-shadow: -4px 2px 0 -1px #fff, 4px 2px 0 -1px #fff; }
.qrai-chef-head { top: 8px; left: 9px; width: 10px; height: 9px; border-radius: 50%; background: #f5d7b7; }
.qrai-chef-body { top: 16px; left: 7px; width: 14px; height: 8px; border-radius: 5px 5px 6px 6px; background: #fff; }
.qrai-chef-body::before { content: ""; position: absolute; top: 3px; right: -5px; width: 8px; height: 3px; border-radius: 999px; background: #fff; transform-origin: left center; }
.qrai-chef-leg { bottom: 0; width: 9px; height: 3px; border-radius: 999px; background: #fff; transform-origin: 2px 50%; }
.qrai-chef-leg.is-left { left: 7px; }
.qrai-chef-leg.is-right { left: 14px; }
.qrai-detail-add-mark { position: relative; z-index: 1; display: grid; overflow: hidden; width: 0; height: 26px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; background: rgba(255,255,255,.14); opacity: 0; transform: scale(.55) rotate(-16deg); transition: width .24s ease, margin .24s ease, opacity .18s ease, transform .24s cubic-bezier(.2,1.35,.35,1); }
.qrai-detail-add-mark .qrai-icon { width: 14px; height: 14px; }
.qrai-detail-add-mark .qrai-icon path { stroke-dasharray: 24; stroke-dashoffset: 0; }
.qrai-detail-add-copy { position: relative; z-index: 1; flex: 1 1 auto; min-width: 0; overflow: hidden; font-size: 11px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; transition: transform .2s ease, opacity .2s ease; }
.qrai-detail-add strong { position: relative; z-index: 1; flex: 0 0 auto; max-width: 120px; overflow: hidden; font-size: 11px; white-space: nowrap; transition: max-width .24s ease, opacity .18s ease, transform .18s ease; }
.qrai-detail-add.is-adding { justify-content: center; transform: translateY(-1px); }
.qrai-detail-add.is-adding .qrai-detail-add-fill { opacity: 1; }
.qrai-detail-add.is-adding .qrai-detail-add-fill::after { animation: qrai-detail-add-road .92s ease-in-out infinite; }
.qrai-detail-add.is-adding .qrai-detail-add-chef { width: 30px; margin-right: 9px; opacity: 1; animation: qrai-chef-runner .38s ease-in-out infinite; }
.qrai-detail-add.is-adding .qrai-chef-body::before { animation: qrai-chef-arm .38s ease-in-out infinite; }
.qrai-detail-add.is-adding .qrai-chef-leg.is-left { animation: qrai-chef-left-leg .38s ease-in-out infinite; }
.qrai-detail-add.is-adding .qrai-chef-leg.is-right { animation: qrai-chef-right-leg .38s ease-in-out infinite; }
.qrai-detail-add.is-adding strong { max-width: 0; opacity: 0; transform: translateX(10px); }
.qrai-detail-add.is-added { justify-content: center; gap: 8px; }
.qrai-detail-add.is-added .qrai-detail-add-chef { width: 0; margin-right: 0; opacity: 0; }
.qrai-detail-add.is-added .qrai-detail-add-mark { width: 26px; margin-right: 0; opacity: 1; transform: scale(1) rotate(0deg); }
.qrai-detail-add.is-added .qrai-detail-add-mark .qrai-icon path { stroke-dashoffset: 24; animation: qrai-detail-add-check .42s ease-out .08s forwards; }
.qrai-detail-add.is-added .qrai-detail-add-copy { flex: 0 1 auto; transform: translateY(0); }
.qrai-detail-add.is-added .qrai-detail-add-copy:empty { display: none; }
.qrai-detail-add.is-added strong { max-width: 0; opacity: 0; transform: translateX(10px); }

@keyframes qrai-detail-add-road {
    0% { transform: translateX(-120%); }
    100% { transform: translateX(260%); }
}

@keyframes qrai-chef-runner {
    0%, 100% { transform: translateY(0) rotate(-2deg); }
    50% { transform: translateY(-2px) rotate(2deg); }
}

@keyframes qrai-chef-arm {
    0%, 100% { transform: rotate(24deg); }
    50% { transform: rotate(-18deg); }
}

@keyframes qrai-chef-left-leg {
    0%, 100% { transform: rotate(28deg); }
    50% { transform: rotate(-24deg); }
}

@keyframes qrai-chef-right-leg {
    0%, 100% { transform: rotate(-24deg); }
    50% { transform: rotate(28deg); }
}

@keyframes qrai-detail-add-check {
    0% { stroke-dashoffset: 24; }
    100% { stroke-dashoffset: 0; }
}

/* Cart */
.qrai-cart-table-note { display: flex; align-items: center; gap: 9px; margin: 5px 0 14px; padding: 11px 12px; border: 1px solid #ddd2b8; border-radius: 12px; background: #ece5d4; color: #5f583f; font-size: 9px; }
.qrai-cart-table-note .qrai-icon { width: 16px; height: 16px; }
.qrai-cart-list { display: grid; gap: 9px; }
.qrai-cart-item { position: relative; display: grid; min-height: 100px; align-items: center; padding: 10px; grid-template-columns: 82px minmax(0,1fr) auto; gap: 11px; border: 1px solid var(--qrai-line); border-radius: 15px; background: var(--qrai-surface); }
.qrai-cart-item > img { width: 82px; height: 82px; border-radius: 12px; object-fit: cover; }
.qrai-cart-item > div:not(.qrai-cart-item-side) { min-width: 0; }
.qrai-cart-item > div:not(.qrai-cart-item-side) strong,
.qrai-cart-item-main strong { display: block; font-family: var(--qrai-serif); font-size: 18px; line-height: 1; }
.qrai-cart-item > div:not(.qrai-cart-item-side) small,
.qrai-cart-item-main small { display: block; overflow: hidden; margin-top: 5px; color: var(--qrai-muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.qrai-cart-item > b { align-self: start; color: var(--qrai-olive); font-size: 10px; }
.qrai-cart-item-side { display: grid; height: 100%; align-content: space-between; justify-items: end; }
.qrai-cart-item-side > strong { color: var(--qrai-olive); font-size: 10px; }
.qrai-cart-controls { display: grid; align-items: center; grid-template-columns: 28px 25px 28px; border: 1px solid var(--qrai-line); border-radius: 9px; }
.qrai-cart-controls button { display: grid; height: 28px; place-items: center; padding: 0; border: 0; background: transparent; cursor: pointer; }
.qrai-cart-controls .qrai-icon { width: 12px; height: 12px; }
.qrai-cart-controls b { text-align: center; font-size: 9px; }
.qrai-cart-remove { position: absolute; top: 6px; right: 6px; display: none; width: 26px; height: 26px; place-items: center; padding: 0; border: 0; border-radius: 50%; background: #f1e9df; color: var(--qrai-danger); cursor: pointer; }
.qrai-cart-remove .qrai-icon { width: 13px; height: 13px; }
.qrai-order-summary { margin-top: 15px; padding: 16px; border: 1px solid var(--qrai-line); border-radius: 17px; background: var(--qrai-surface); }
.qrai-order-note { display: grid; gap: 7px; margin-bottom: 12px; color: var(--qrai-muted); font-size: 9px; font-weight: 700; }
.qrai-order-note textarea { width: 100%; min-height: 74px; resize: vertical; padding: 10px 11px; border: 1px solid var(--qrai-line); border-radius: 10px; outline: 0; background: var(--qrai-bg); color: var(--qrai-ink); font-size: 10px; line-height: 1.5; }
.qrai-order-note textarea:focus { border-color: var(--qrai-olive); box-shadow: 0 0 0 2px rgba(61,69,40,.1); }

@media (max-width: 768px) {
    .qrai-order-note textarea { font-size: 16px; }
}
.qrai-order-summary > div { display: flex; align-items: center; justify-content: space-between; min-height: 31px; color: var(--qrai-muted); font-size: 9px; }
.qrai-order-summary > div strong { color: var(--qrai-ink); }
.qrai-order-summary > div.is-total { margin-top: 7px; padding-top: 11px; border-top: 1px solid var(--qrai-line); color: var(--qrai-ink); font-size: 12px; font-weight: 800; }
.qrai-order-summary > div.is-total strong { color: var(--qrai-olive); font-size: 18px; }
.qrai-checkout-button,
.qrai-primary-button { display: flex; width: 100%; min-height: 50px; align-items: center; justify-content: center; gap: 8px; margin-top: 13px; border: 0; border-radius: 12px; background: var(--qrai-olive); color: #fff; font-size: 10px; font-weight: 800; cursor: pointer; }
.qrai-checkout-button .qrai-icon,
.qrai-primary-button .qrai-icon { width: 15px; height: 15px; }
.qrai-checkout-button.is-processing { background: var(--qrai-olive); opacity: 1; }
.qrai-order-animation { position: fixed; z-index: 160; inset: 0; display: grid; width: min(100%,480px); margin: 0 auto; place-items: center; padding: 24px; background: rgba(245,241,232,.72); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .22s ease, visibility .22s ease; backdrop-filter: blur(12px); }
.qrai-order-animation.is-visible { opacity: 1; visibility: visible; pointer-events: auto; }
.qrai-order-animation-card { position: relative; display: grid; width: min(100%,330px); min-height: 380px; place-items: center; align-content: center; gap: 22px; overflow: hidden; padding: 34px 24px 30px; border: 1px solid rgba(139,120,72,.18); border-radius: 26px; background: var(--qrai-surface); background: radial-gradient(circle at 50% 34%, rgba(239,139,52,.18), transparent 31%), linear-gradient(145deg,#fffdf8,#efe7d7 72%); color: var(--qrai-ink); box-shadow: 0 28px 80px rgba(68,55,32,.22); }
.qrai-order-ring { position: absolute; width: 230px; height: 230px; border: 1px solid rgba(167,139,77,.18); border-radius: 50%; opacity: .75; }
.qrai-order-ring.is-one { animation: qrai-order-ring 1.7s ease-out infinite; }
.qrai-order-ring.is-two { width: 170px; height: 170px; animation: qrai-order-ring 1.7s ease-out .35s infinite; }
.qrai-order-scene { position: relative; z-index: 2; display: grid; width: 210px; height: 190px; place-items: center; }
.qrai-oven-heat { position: absolute; top: 8px; width: 42px; height: 78px; border-radius: 50%; border-left: 2px solid rgba(255,188,107,.34); opacity: 0; transform: translateY(24px) scale(.8); }
.qrai-oven-heat.is-one { left: 58px; }
.qrai-oven-heat.is-two { right: 58px; height: 66px; }
.qrai-order-oven { position: absolute; bottom: 20px; left: 50%; width: 160px; height: 118px; border-radius: 28px 28px 20px 20px; background: linear-gradient(145deg,#fff7ec,#d9c6ad 48%,#9d7a58); box-shadow: inset 0 4px 0 rgba(255,255,255,.48), inset 0 -9px 18px rgba(55,32,17,.24), 0 22px 42px rgba(0,0,0,.3); transform: translateX(-50%); }
.qrai-order-oven::before { content: ""; position: absolute; top: 14px; right: 18px; left: 18px; height: 10px; border-radius: 999px; background: rgba(64,43,28,.28); box-shadow: 23px 0 0 -2px rgba(64,43,28,.2), -23px 0 0 -2px rgba(64,43,28,.2); }
.qrai-oven-lamp { position: absolute; top: 14px; right: 22px; width: 8px; height: 8px; border-radius: 50%; background: #ef8b34; box-shadow: 0 0 18px rgba(239,139,52,.9); }
.qrai-oven-handle { position: absolute; top: 33px; left: 34px; width: 92px; height: 7px; border-radius: 999px; background: rgba(71,45,28,.5); box-shadow: inset 0 1px 0 rgba(255,255,255,.25); }
.qrai-oven-mouth { position: absolute; right: 24px; bottom: 17px; left: 24px; height: 56px; overflow: hidden; border: 3px solid rgba(60,37,23,.55); border-radius: 12px 12px 16px 16px; background: radial-gradient(circle at 50% 86%, rgba(255,196,83,.95), rgba(228,67,27,.58) 38%, rgba(24,14,10,.92) 78%); box-shadow: inset 0 0 24px rgba(255,87,31,.62), 0 0 24px rgba(239,101,35,.42); }
.qrai-oven-fire { position: absolute; bottom: -7px; width: 28px; height: 44px; border-radius: 50% 50% 46% 46%; background: linear-gradient(180deg,#fff2a8 0%,#ff9a32 43%,#e6401f 100%); filter: drop-shadow(0 0 8px rgba(255,139,42,.78)); transform-origin: center bottom; }
.qrai-oven-fire.is-one { left: 20px; }
.qrai-oven-fire.is-two { left: 50%; width: 34px; height: 52px; margin-left: -17px; }
.qrai-oven-fire.is-three { right: 18px; height: 38px; }
.qrai-oven-ember { position: absolute; bottom: 9px; width: 5px; height: 5px; border-radius: 50%; background: #ffd083; opacity: .8; }
.qrai-oven-ember.is-one { left: 32px; }
.qrai-oven-ember.is-two { right: 34px; }
.qrai-oven-tray { position: absolute; z-index: 2; right: 32px; bottom: 35px; left: 32px; height: 9px; border-radius: 999px; background: #3d2b20; transform: translateX(-92px); opacity: 0; }
.qrai-oven-tray::before { content: ""; position: absolute; top: -13px; left: 21px; width: 54px; height: 14px; border-radius: 999px 999px 8px 8px; background: #d8a257; box-shadow: inset 0 -4px 0 rgba(98,54,24,.18); }
.qrai-oven-tray i,
.qrai-oven-tray b { position: absolute; top: -19px; width: 8px; height: 8px; border-radius: 50%; background: #fff1b8; }
.qrai-oven-tray i { left: 34px; }
.qrai-oven-tray b { left: 51px; }
.qrai-order-animation-copy { position: relative; z-index: 2; display: grid; gap: 7px; text-align: center; }
.qrai-order-animation-copy strong { font-family: var(--qrai-serif); font-size: 28px; font-weight: 700; line-height: 1; }
.qrai-order-animation-copy span { color: var(--qrai-muted); font-size: 10px; font-weight: 700; }
.qrai-order-animation.is-sending .qrai-order-oven { animation: qrai-oven-body .9s ease-in-out infinite; }
.qrai-order-animation.is-sending .qrai-oven-heat { animation: qrai-oven-heat-rise 1.35s ease-out infinite; }
.qrai-order-animation.is-sending .qrai-oven-heat.is-two { animation-delay: .26s; }
.qrai-order-animation.is-sending .qrai-oven-fire { animation: qrai-oven-fire .42s ease-in-out infinite; }
.qrai-order-animation.is-sending .qrai-oven-fire.is-two { animation-delay: .08s; }
.qrai-order-animation.is-sending .qrai-oven-fire.is-three { animation-delay: .16s; }
.qrai-order-animation.is-sending .qrai-oven-ember { animation: qrai-oven-ember 1.05s ease-out infinite; }
.qrai-order-animation.is-sending .qrai-oven-ember.is-two { animation-delay: .32s; }
.qrai-order-animation.is-sending .qrai-oven-tray { animation: qrai-oven-tray 1.45s cubic-bezier(.22,.78,.22,1) infinite; }
.qrai-order-animation.is-success .qrai-oven-heat { animation: qrai-oven-heat-rise 1.2s ease-out infinite; }
.qrai-order-animation.is-success .qrai-order-oven { animation: qrai-oven-success .58s ease-out forwards; }
.qrai-order-animation.is-success .qrai-oven-fire { animation: qrai-oven-fire .5s ease-in-out infinite; }
.qrai-order-animation.is-success .qrai-oven-tray { opacity: 0; }
.qrai-order-animation.is-success .qrai-order-animation-card::after { content: ""; position: absolute; z-index: 1; inset: 44% auto auto 50%; width: 24px; height: 24px; border-radius: 50%; background: rgba(239,139,52,.2); transform: translate(-50%,-50%) scale(.2); animation: qrai-order-success-bloom .72s ease-out forwards; pointer-events: none; }

@keyframes qrai-order-ring {
    0% { opacity: .6; transform: scale(.7); }
    100% { opacity: 0; transform: scale(1.35); }
}

@keyframes qrai-oven-body {
    0%, 100% { transform: translateX(-50%) translateY(0); }
    50% { transform: translateX(-50%) translateY(-2px); }
}

@keyframes qrai-oven-heat-rise {
    0% { opacity: 0; transform: translateY(28px) scale(.72); }
    28% { opacity: .72; }
    100% { opacity: 0; transform: translateY(-34px) scale(1.18); }
}

@keyframes qrai-oven-fire {
    0%, 100% { transform: translateY(0) scaleX(.92) scaleY(1); }
    45% { transform: translateY(-5px) scaleX(1.08) scaleY(1.18); }
    72% { transform: translateY(-2px) scaleX(.98) scaleY(.95); }
}

@keyframes qrai-oven-ember {
    0% { opacity: 0; transform: translateY(0) scale(.7); }
    24% { opacity: 1; }
    100% { opacity: 0; transform: translateY(-34px) translateX(10px) scale(.35); }
}

@keyframes qrai-oven-tray {
    0% { opacity: 0; transform: translateX(-92px); }
    18% { opacity: 1; }
    58% { opacity: 1; transform: translateX(0); }
    76% { opacity: 1; transform: translateX(0); }
    100% { opacity: 0; transform: translateX(34px); }
}

@keyframes qrai-oven-success {
    0% { opacity: 1; transform: translateX(-50%) scale(1); filter: brightness(1); }
    100% { opacity: .42; transform: translateX(-50%) scale(.86); filter: brightness(1.28); }
}

@keyframes qrai-order-success-bloom {
    0% { opacity: .72; transform: translate(-50%,-50%) scale(.2); }
    100% { opacity: 0; transform: translate(-50%,-50%) scale(16); }
}
.qrai-cart-empty { display: grid; min-height: 380px; place-items: center; align-content: center; padding: 30px; text-align: center; }
.qrai-cart-empty > .qrai-icon { width: 54px; height: 54px; color: var(--qrai-gold); }
.qrai-cart-empty h2 { margin: 15px 0 5px; font-family: var(--qrai-serif); font-size: 28px; }
.qrai-cart-empty p { margin: 0; color: var(--qrai-muted); font-size: 10px; }

/* Services */
.qrai-service-cover { position: relative; display: grid; min-height: 172px; place-items: center; overflow: hidden; border-radius: 19px; background: #171914 var(--qrai-service-cover) center / cover no-repeat; color: #fff; }
.qrai-service-cover::before { position: absolute; inset: 0; background: rgba(11,13,9,.55); content: ""; }
.qrai-service-cover > div { position: relative; display: grid; text-align: center; }
.qrai-service-cover span { color: #d9c690; font-size: 8px; font-weight: 800; letter-spacing: 0; }
.qrai-service-cover strong { margin-top: 3px; font-family: var(--qrai-serif); font-size: 27px; font-weight: 600; letter-spacing: 0; }
.qrai-services-grid { display: grid; margin-top: 12px; grid-template-columns: repeat(2,1fr); gap: 9px; }
.qrai-services-grid button,
.qrai-services-grid a { display: grid; min-height: 126px; place-items: center; align-content: center; gap: 6px; padding: 12px 8px; border: 1px solid var(--qrai-line); border-radius: 16px; background: var(--qrai-surface); text-align: center; cursor: pointer; }
.qrai-services-grid .qrai-icon { width: 29px; height: 29px; color: var(--qrai-gold); }
.qrai-services-grid strong { font-family: var(--qrai-serif); font-size: 17px; line-height: 1; }
.qrai-services-grid small { color: var(--qrai-muted); font-size: 7px; }
.qrai-contact-card { margin-top: 13px; padding: 16px; border: 1px solid var(--qrai-line); border-radius: 18px; background: var(--qrai-surface); }
.qrai-contact-card h2 { margin: 0 0 8px; font-family: var(--qrai-serif); font-size: 23px; }
.qrai-contact-card > a { display: grid; min-height: 54px; align-items: center; grid-template-columns: 28px minmax(0,1fr) 18px; gap: 9px; border-bottom: 1px solid var(--qrai-line); }
.qrai-contact-card > a > .qrai-icon:first-child { color: var(--qrai-gold); }
.qrai-contact-card > a > .qrai-icon:last-child { width: 13px; height: 13px; color: var(--qrai-muted); }
.qrai-contact-card > a span { display: grid; min-width: 0; }
.qrai-contact-card > a small { color: var(--qrai-muted); font-size: 7px; }
.qrai-contact-card > a strong { overflow: hidden; font-size: 9px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.qrai-contact-social { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.qrai-contact-social span,
.qrai-contact-social a { display: inline-flex; align-items: center; gap: 5px; padding: 8px 10px; border-radius: 999px; background: #eee8dc; color: #6e675a; font-size: 8px; }
.qrai-contact-social .qrai-icon { width: 14px; height: 14px; }

/* Sheets */
.qrai-sheet-backdrop { position: fixed; z-index: 80; inset: 0; width: min(100%,480px); margin: 0 auto; background: rgba(20,19,16,.46); opacity: 0; transition: opacity .22s ease; }
.qrai-sheet-backdrop.is-open { opacity: 1; }
.qrai-bottom-sheet { position: fixed; z-index: 90; right: 0; bottom: 0; left: 0; width: min(100%,480px); max-height: 88vh; margin: 0 auto; overflow-y: auto; padding: 9px 18px calc(22px + env(safe-area-inset-bottom)); border-radius: 25px 25px 0 0; background: var(--qrai-bg); box-shadow: 0 -22px 65px rgba(35,30,21,.22); transform: translateY(105%); transition: transform .28s cubic-bezier(.2,.8,.2,1); }
.qrai-bottom-sheet.is-open { transform: translateY(0); }
.qrai-sheet-handle { width: 42px; height: 4px; margin: 0 auto 12px; border-radius: 10px; background: #cfc7b9; }
.qrai-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.qrai-sheet-head span { color: var(--qrai-gold); font-size: 8px; font-weight: 800; letter-spacing: 0; }
.qrai-sheet-head h2 { margin: 2px 0 0; font-family: var(--qrai-serif); font-size: 28px; line-height: 1; }
.qrai-sheet-action-grid { display: grid; margin-top: 16px; grid-template-columns: repeat(2,1fr); gap: 9px; }
.qrai-sheet-action { display: grid; min-height: 135px; place-items: center; align-content: center; gap: 6px; padding: 12px; border: 1px solid var(--qrai-line); border-radius: 16px; background: var(--qrai-surface); text-align: center; cursor: pointer; }
.qrai-sheet-action .qrai-icon { width: 30px; height: 30px; color: var(--qrai-gold); }
.qrai-sheet-action strong { font-family: var(--qrai-serif); font-size: 18px; }
.qrai-sheet-action small { color: var(--qrai-muted); font-size: 7px; }
.qrai-service-animation { position: fixed; z-index: 155; inset: 0; display: grid; width: min(100%,480px); margin: 0 auto; place-items: center; padding: 24px; background: rgba(245,241,232,.7); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .22s ease, visibility .22s ease; backdrop-filter: blur(12px); }
.qrai-service-animation.is-visible { opacity: 1; visibility: visible; pointer-events: auto; }
.qrai-service-animation-card { position: relative; display: grid; width: min(100%,315px); min-height: 322px; place-items: center; align-content: center; gap: 18px; overflow: hidden; padding: 31px 23px 28px; border: 1px solid rgba(139,120,72,.18); border-radius: 24px; background: linear-gradient(145deg,#fffdf8,#efe8da 72%); color: var(--qrai-ink); box-shadow: 0 26px 76px rgba(68,55,32,.22); }
.qrai-service-wave { position: absolute; inset: 34px auto auto 50%; width: 188px; height: 188px; border: 1px solid rgba(164,132,67,.16); border-radius: 50%; opacity: 0; transform: translateX(-50%) scale(.74); pointer-events: none; }
.qrai-service-wave.is-two { width: 228px; height: 228px; border-color: rgba(61,69,40,.12); animation-delay: .28s; }
.qrai-service-animation.is-visible .qrai-service-wave { animation: qrai-service-soft-wave 1.55s ease-out infinite; }
.qrai-service-scene { position: relative; z-index: 2; width: 164px; height: 137px; }
.qrai-service-scene::before { position: absolute; right: 18px; bottom: 22px; left: 18px; height: 7px; border-radius: 999px; background: linear-gradient(90deg,transparent,#d8cbb6 18%,#b7a77f 50%,#d8cbb6 82%,transparent); content: ""; opacity: .75; }
.qrai-service-symbol { position: absolute; top: 20px; left: 50%; display: grid; width: 80px; height: 80px; place-items: center; border: 1px solid rgba(164,132,67,.22); border-radius: 23px; background: #fffaf0; color: var(--qrai-gold); box-shadow: 0 16px 35px rgba(103,86,48,.17); opacity: 0; transform: translate(-50%,14px) scale(.82); }
.qrai-service-symbol .qrai-icon { width: 42px; height: 42px; }
.qrai-service-animation.is-waiter .qrai-service-symbol-waiter,
.qrai-service-animation.is-bill .qrai-service-symbol-bill,
.qrai-service-animation.is-valet .qrai-service-symbol-valet { opacity: 1; transform: translate(-50%,0) scale(1); }
.qrai-service-animation.is-waiter .qrai-service-symbol-waiter { animation: qrai-service-pop .56s cubic-bezier(.2,.85,.28,1.2) both; }
.qrai-service-animation.is-waiter .qrai-service-symbol-waiter .qrai-icon { animation: qrai-service-bell .62s ease-in-out infinite; transform-origin: 50% 8%; }
.qrai-service-animation.is-bill .qrai-service-symbol-bill { animation: qrai-service-bill .95s cubic-bezier(.22,.78,.28,1) infinite; }
.qrai-service-animation.is-bill .qrai-service-symbol-bill::after { position: absolute; right: 10px; bottom: 10px; width: 23px; height: 23px; border: 2px solid var(--qrai-olive); border-radius: 50%; color: var(--qrai-olive); content: ""; opacity: 0; transform: scale(.6); animation: qrai-service-stamp .95s ease-out infinite; }
.qrai-service-animation.is-valet .qrai-service-symbol-valet { animation: qrai-service-car 1.15s cubic-bezier(.2,.8,.26,1) infinite; }
.qrai-service-animation.is-valet .qrai-service-symbol-valet::after { position: absolute; right: -29px; width: 33px; height: 3px; border-radius: 999px; background: linear-gradient(90deg,rgba(164,132,67,.4),transparent); content: ""; animation: qrai-service-headlight 1.15s ease-out infinite; }
.qrai-service-signal { position: absolute; top: 0; left: 50%; width: 136px; height: 70px; transform: translateX(-50%); pointer-events: none; }
.qrai-service-signal i { position: absolute; right: 50%; bottom: 0; width: 38px; height: 38px; border: 2px solid rgba(164,132,67,.28); border-bottom: 0; border-radius: 44px 44px 0 0; opacity: 0; transform: translateX(50%) scale(.58); }
.qrai-service-signal i:nth-child(2) { width: 58px; height: 58px; animation-delay: .16s; }
.qrai-service-signal i:nth-child(3) { width: 78px; height: 78px; animation-delay: .32s; }
.qrai-service-animation.is-visible .qrai-service-signal i { animation: qrai-service-signal 1.15s ease-out infinite; }
.qrai-service-route { position: absolute; right: 19px; bottom: 17px; left: 19px; height: 3px; overflow: hidden; border-radius: 999px; background: rgba(164,132,67,.18); }
.qrai-service-route i { display: block; width: 42%; height: 100%; border-radius: inherit; background: var(--qrai-olive); opacity: .38; transform: translateX(-105%); }
.qrai-service-animation.is-visible .qrai-service-route i { animation: qrai-service-route 1.05s ease-in-out infinite; }
.qrai-service-animation-copy { position: relative; z-index: 2; display: grid; gap: 7px; text-align: center; }
.qrai-service-animation-copy strong { font-family: var(--qrai-serif); font-size: 27px; font-weight: 700; line-height: 1.05; }
.qrai-service-animation-copy span { max-width: 245px; color: var(--qrai-muted); font-size: 10px; font-weight: 700; line-height: 1.45; }
@keyframes qrai-service-soft-wave {
    0% { opacity: .8; transform: translateX(-50%) scale(.72); }
    100% { opacity: 0; transform: translateX(-50%) scale(1.16); }
}
@keyframes qrai-service-pop {
    0% { opacity: 0; transform: translate(-50%,18px) scale(.76); }
    70% { opacity: 1; transform: translate(-50%,-5px) scale(1.06); }
    100% { opacity: 1; transform: translate(-50%,0) scale(1); }
}
@keyframes qrai-service-bell {
    0%, 100% { transform: rotate(0); }
    24% { transform: rotate(-12deg); }
    50% { transform: rotate(10deg); }
    72% { transform: rotate(-6deg); }
}
@keyframes qrai-service-bill {
    0%, 100% { transform: translate(-50%,0) scale(1); }
    48% { transform: translate(-50%,-8px) scale(1.02); }
}
@keyframes qrai-service-stamp {
    0%, 38% { opacity: 0; transform: scale(.55); }
    52% { opacity: .95; transform: scale(1.12); }
    100% { opacity: 0; transform: scale(1.28); }
}
@keyframes qrai-service-car {
    0% { opacity: 0; transform: translate(-82%,5px) scale(.9); }
    22%, 72% { opacity: 1; transform: translate(-50%,0) scale(1); }
    100% { opacity: 0; transform: translate(-18%,-2px) scale(.96); }
}
@keyframes qrai-service-headlight {
    0%, 20% { opacity: 0; transform: scaleX(.35); }
    40%, 74% { opacity: .9; transform: scaleX(1); }
    100% { opacity: 0; transform: scaleX(.45); }
}
@keyframes qrai-service-signal {
    0% { opacity: .9; transform: translateX(50%) scale(.45); }
    100% { opacity: 0; transform: translateX(50%) scale(1.18); }
}
@keyframes qrai-service-route {
    0% { transform: translateX(-110%); }
    100% { transform: translateX(250%); }
}
.qrai-link-sheet { background: #fff; }
.qrai-link-action-grid { display: grid; gap: 7px; margin-top: 16px; }
.qrai-link-action {
    display: grid;
    min-height: 62px;
    align-items: center;
    padding: 9px 11px;
    grid-template-columns: 38px minmax(0,1fr) 17px;
    gap: 10px;
    border: 1px solid var(--qrai-line);
    border-radius: 8px;
    background: #fff;
    text-align: left;
    cursor: pointer;
}
.qrai-link-action > .qrai-icon:first-child { width: 38px; height: 38px; padding: 10px; border-radius: 50%; background: #f2eee5; color: var(--qrai-gold); }
.qrai-link-action > .qrai-icon:last-child { width: 14px; height: 14px; color: var(--qrai-muted); }
.qrai-link-action > span { display: grid; min-width: 0; }
.qrai-link-action strong { overflow: hidden; font-family: var(--qrai-serif); font-size: 17px; font-weight: 600; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.qrai-link-action small { overflow: hidden; margin-top: 2px; color: var(--qrai-muted); font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.qrai-link-address { display: grid; align-items: start; margin-top: 12px; padding: 12px 3px 0; grid-template-columns: 20px minmax(0,1fr); gap: 8px; border-top: 1px solid var(--qrai-line); }
.qrai-link-address .qrai-icon { width: 17px; height: 17px; color: var(--qrai-gold); }
.qrai-link-address span { display: grid; }
.qrai-link-address small { color: var(--qrai-muted); font-size: 7px; }
.qrai-link-address strong { font-size: 9px; font-weight: 600; line-height: 1.55; }
.qrai-survey-sheet { background: #fff; }
.qrai-survey-description { margin: 9px 0 0; color: var(--qrai-muted); font-size: 9px; line-height: 1.55; }
.qrai-survey-form { display: grid; gap: 11px; margin-top: 16px; }
.qrai-survey-question { min-width: 0; margin: 0; padding: 12px; border: 1px solid var(--qrai-line); border-radius: 10px; }
.qrai-survey-question legend { padding: 0 5px; font-family: var(--qrai-serif); font-size: 17px; font-weight: 600; }
.qrai-survey-rating { display: grid; grid-template-columns: repeat(5,1fr); gap: 7px; }
.qrai-survey-rating input,
.qrai-survey-options input { position: absolute; opacity: 0; pointer-events: none; }
.qrai-survey-rating span { display: grid; min-height: 42px; place-items: center; border: 1px solid var(--qrai-line); border-radius: 8px; background: var(--qrai-surface); color: var(--qrai-muted); font-size: 11px; font-weight: 800; cursor: pointer; }
.qrai-survey-rating input:checked + span { border-color: var(--qrai-olive); background: var(--qrai-olive); color: #fff; }
.qrai-survey-options { display: grid; gap: 7px; }
.qrai-survey-options span { display: flex; min-height: 42px; align-items: center; padding: 8px 11px; border: 1px solid var(--qrai-line); border-radius: 8px; background: var(--qrai-surface); font-size: 9px; font-weight: 700; cursor: pointer; }
.qrai-survey-options input:checked + span { border-color: var(--qrai-olive); box-shadow: inset 0 0 0 1px var(--qrai-olive); color: var(--qrai-olive); }
.qrai-survey-question textarea { width: 100%; min-height: 92px; resize: vertical; padding: 11px; border: 1px solid var(--qrai-line); border-radius: 8px; outline: 0; background: var(--qrai-surface); color: var(--qrai-ink); font: 500 10px/1.5 var(--qrai-sans); }
.qrai-survey-question textarea:focus { border-color: var(--qrai-olive); box-shadow: 0 0 0 3px color-mix(in srgb, var(--qrai-olive) 12%, transparent); }
.qrai-survey-form .qrai-primary-button { margin-top: 1px; }
.qrai-table-sheet-copy { margin: 12px 0 0; color: var(--qrai-muted); font-size: 10px; line-height: 1.6; }
.qrai-table-sheet form { display: grid; gap: 4px; margin-top: 14px; }
.qrai-table-sheet form label { display: grid; gap: 7px; color: var(--qrai-muted); font-size: 9px; font-weight: 700; }
.qrai-table-sheet form input { width: 100%; min-height: 50px; padding: 0 13px; border: 1px solid var(--qrai-line); border-radius: 12px; outline: 0; background: var(--qrai-surface); color: var(--qrai-ink); font-size: 15px; }
.qrai-table-sheet form input:focus { border-color: var(--qrai-olive); box-shadow: 0 0 0 3px rgba(61,69,40,.1); }
[dir="rtl"] .qrai-root { direction: rtl; }
[dir="rtl"] .qrai-product-card,
[dir="rtl"] .qrai-contact-card,
[dir="rtl"] .qrai-cart-item { text-align: right; }
.qrai-filter-options { display: grid; gap: 8px; margin-top: 15px; }
.qrai-filter-options label { position: relative; cursor: pointer; }
.qrai-filter-options input { position: absolute; opacity: 0; }
.qrai-filter-options span { display: grid; min-height: 60px; align-items: center; padding: 9px 12px; grid-template-columns: 28px minmax(0,1fr); column-gap: 9px; border: 1px solid var(--qrai-line); border-radius: 13px; background: var(--qrai-surface); }
.qrai-filter-options span .qrai-icon { grid-row: 1 / 3; color: var(--qrai-gold); }
.qrai-filter-options b { font-size: 10px; }
.qrai-filter-options small { color: var(--qrai-muted); font-size: 7px; }
.qrai-filter-options input:checked + span { border-color: var(--qrai-olive); box-shadow: inset 0 0 0 1px var(--qrai-olive); }
.qrai-price-filter { display: grid; margin-top: 17px; grid-template-columns: 1fr auto; gap: 9px; font-size: 9px; font-weight: 700; }
.qrai-price-filter output { color: var(--qrai-olive); }
.qrai-price-filter input { width: 100%; grid-column: 1 / -1; accent-color: var(--qrai-olive); }
.qrai-sheet-buttons { display: grid; margin-top: 18px; grid-template-columns: 110px 1fr; gap: 8px; }
.qrai-secondary-button { min-height: 49px; border: 1px solid var(--qrai-line); border-radius: 12px; background: var(--qrai-surface); cursor: pointer; }
.qrai-sheet-buttons .qrai-primary-button { margin: 0; }

/* Empty + toast */
.qrai-empty-search { display: grid; min-height: 260px; place-items: center; align-content: center; color: var(--qrai-muted); text-align: center; }
.qrai-empty-search .qrai-icon { width: 38px; height: 38px; color: var(--qrai-gold); }
.qrai-empty-search strong { margin-top: 10px; color: var(--qrai-ink); font-family: var(--qrai-serif); font-size: 24px; }
.qrai-empty-search p { margin: 4px 0 0; font-size: 9px; }
.qrai-wifi-notice { position: fixed; z-index: 126; bottom: calc(72px + env(safe-area-inset-bottom)); left: 50%; display: grid; width: max-content; max-width: calc(100% - 32px); min-height: 42px; align-items: center; padding: 7px 12px 7px 8px; grid-template-columns: 28px minmax(0,1fr); gap: 8px; border: 1px solid rgba(164,132,67,.16); border-radius: 999px; background: rgba(255,253,248,.97); color: var(--qrai-ink); box-shadow: 0 12px 30px rgba(68,55,32,.15); opacity: 0; pointer-events: none; transform: translate(-50%,10px) scale(.98); transition: opacity .18s ease, transform .18s ease, visibility .18s ease; visibility: hidden; backdrop-filter: blur(10px); }
.qrai-wifi-notice.is-visible { opacity: 1; transform: translate(-50%,0) scale(1); visibility: visible; }
.qrai-wifi-notice-icon { position: relative; display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: #f2eadb; color: var(--qrai-gold); }
.qrai-wifi-notice-icon .qrai-icon { position: relative; z-index: 2; width: 15px; height: 15px; }
.qrai-wifi-notice-icon i { position: absolute; inset: 5px; border: 1px solid rgba(164,132,67,.32); border-radius: 50%; opacity: 0; transform: scale(.82); }
.qrai-wifi-notice.is-visible .qrai-wifi-notice-icon i { animation: qrai-wifi-notice-ring 1.15s ease-out infinite; }
.qrai-wifi-notice-copy { display: grid; min-width: 0; gap: 2px; }
.qrai-wifi-notice-copy strong { overflow: hidden; font-size: 11px; font-weight: 800; line-height: 1.05; text-overflow: ellipsis; white-space: nowrap; }
.qrai-wifi-notice-copy small { overflow: hidden; color: var(--qrai-muted); font-size: 9px; font-weight: 700; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.qrai-toast { position: fixed; z-index: 120; right: 16px; bottom: calc(82px + env(safe-area-inset-bottom)); left: 16px; width: min(calc(100% - 32px),448px); margin: 0 auto; padding: 12px 15px; border-radius: 12px; background: #22251a; color: #fff; font-size: 10px; font-weight: 700; text-align: center; opacity: 0; pointer-events: none; transform: translateY(15px); transition: opacity .2s ease, transform .2s ease; }
.qrai-toast.is-visible { opacity: 1; transform: translateY(0); }

.qrai-theme-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 3px; padding: 20px 16px 9px; color: var(--qrai-muted); font-size: 8px; line-height: 1.4; text-align: center; }
.qrai-theme-footer a { color: var(--qrai-olive); font-weight: 800; }

/* Motion */
@keyframes qrai-pulse { 0%{transform:scale(1)} 45%{transform:scale(.88)} 100%{transform:scale(1)} }
@keyframes qrai-swipe-back-arrive { 0%{opacity:.92;transform:translate3d(-18px,0,0)} 100%{opacity:1;transform:translate3d(0,0,0)} }
@keyframes qrai-wifi-notice-ring { 0%{opacity:.8;transform:scale(.82)} 100%{opacity:0;transform:scale(1.42)} }
@keyframes qrai-welcome-splash-away {
    0%, 68% { opacity: 1; visibility: visible; }
    100% { opacity: 0; visibility: hidden; }
}
@keyframes qrai-welcome-logo-rise {
    0% { opacity: 0; transform: translateY(18px) scale(.84); filter: blur(4px); }
    46% { opacity: 1; transform: translateY(0) scale(1.04); filter: blur(0); }
    100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}
@keyframes qrai-welcome-logo-line {
    0% { opacity: 0; transform: translateX(-50%) scaleX(.5); }
    100% { opacity: 1; transform: translateX(-50%) scaleX(1); }
}
@keyframes qrai-welcome-splash-line {
    0% { transform: translateX(-50%) scaleX(0); }
    58% { transform: translateX(-50%) scaleX(1); }
    100% { opacity: .78; transform: translateX(-50%) scaleX(1); }
}
@keyframes qrai-home-logo-focus-in {
    0% { opacity: 0; transform: translateY(16px) scale(.94); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes qrai-home-time-scene-breathe {
    0%, 100% { transform: translateY(0) scale(1); box-shadow: 0 12px 25px rgba(68,55,32,.09); }
    50% { transform: translateY(-2px) scale(1.04); box-shadow: 0 16px 30px rgba(68,55,32,.13); }
}
@keyframes qrai-home-sunrise {
    0%, 100% { transform: translate(-50%,8px) scale(.88); }
    48%, 70% { transform: translate(-50%,-3px) scale(1); }
}
@keyframes qrai-home-sunset {
    0%, 100% { transform: translate(-50%,-2px) scale(1); }
    54% { transform: translate(-50%,8px) scale(.92); }
}
@keyframes qrai-home-sun-pulse {
    0%, 100% { transform: translateX(-50%) scale(.96); box-shadow: 0 0 0 5px rgba(217,162,54,.15); }
    50% { transform: translateX(-50%) scale(1.08); box-shadow: 0 0 0 8px rgba(217,162,54,.1); }
}
@keyframes qrai-home-rays-spin {
    0% { transform: translateX(-50%) rotate(0); }
    100% { transform: translateX(-50%) rotate(360deg); }
}
@keyframes qrai-home-rays-wake {
    0%, 100% { opacity: .34; transform: translateX(-50%) scale(.82) rotate(-8deg); }
    50% { opacity: .78; transform: translateX(-50%) scale(1) rotate(10deg); }
}
@keyframes qrai-home-moon-float {
    0%, 100% { transform: translateY(1px); }
    50% { transform: translateY(-3px); }
}
@keyframes qrai-home-star-twinkle {
    0%, 100% { opacity: .35; transform: scale(.75); }
    50% { opacity: 1; transform: scale(1.2); }
}
.qrai-root .is-pulsing { animation: qrai-pulse .3s ease; }
.qrai-swipe-back-preview {
    position: fixed;
    z-index: 0;
    inset: 0;
    width: min(100%, 480px);
    min-height: 100vh;
    min-height: 100dvh;
    margin: 0 auto;
    overflow: hidden;
    background: var(--qrai-bg, #f5f1e8);
    box-shadow: inset -24px 0 42px rgba(42,36,25,.12);
    opacity: 0;
    pointer-events: none;
    transform: translate3d(0,0,0);
    transform-origin: left center;
    transition: visibility .01s linear;
    visibility: hidden;
}
.qrai-swipe-back-preview.is-active {
    opacity: 1;
    visibility: visible;
}
.qrai-swipe-back-preview iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    border: 0;
    background: var(--qrai-bg, #f5f1e8);
    pointer-events: none;
}
.qrai-swipe-back-preview::after {
    position: absolute;
    inset: 0 0 0 auto;
    width: 34px;
    background: linear-gradient(90deg, rgba(245,241,232,0), rgba(42,36,25,.1));
    content: "";
}
.qrai-root[data-qrai-swipe-back-ready="true"] { z-index: 1; }
.qrai-root.is-swipe-back-dragging,
.qrai-root.is-swipe-back-cancelling,
.qrai-root.is-swipe-back-completing { z-index: 2; will-change: transform; box-shadow: -14px 0 42px rgba(42,36,25,.22); }
.qrai-root.is-swipe-back-dragging { transition: none; }
.qrai-root.is-swipe-back-cancelling { transition: transform .24s cubic-bezier(.22,.78,.28,1), box-shadow .24s ease; }
.qrai-root.is-swipe-back-completing { pointer-events: none; transition: transform .22s cubic-bezier(.32,.72,.18,1); }
.qrai-root.is-swipe-back-arriving { animation: qrai-swipe-back-arrive .3s cubic-bezier(.22,.78,.28,1); }

@media (prefers-reduced-motion: reduce) {
    .qrai-welcome-splash { animation-duration: .28s; }
    .qrai-welcome-splash-logo,
    .qrai-welcome-splash-logo::before,
    .qrai-welcome-splash::after,
    .qrai-home-logo-focus,
    .qrai-home-time-scene.is-active,
    .qrai-home-time-scene * { animation: none; }
}

@media (max-width: 370px) {
    .qrai-page { padding-right: 13px; padding-left: 13px; }
    .qrai-categories-page { padding-right: 16px; padding-left: 16px; }
    .qrai-category-grid { gap: 7px; }
    .qrai-category-copy strong { font-size: 17px; }
    .qrai-menu-toolbar { grid-template-columns: auto minmax(0,1fr); }
    .qrai-view-switch { grid-column: 1 / -1; width: 100%; grid-template-columns: repeat(3,1fr); }
    .qrai-product-list.is-view-horizontal .qrai-product-card { height: 160px; grid-template-columns: 105px minmax(0,1fr); }
    .qrai-product-list.is-view-horizontal .qrai-product-image { height: 100%; min-height: 0; }
    .qrai-product-list.is-view-horizontal .qrai-product-body { min-height: 0; }
    .qrai-home-page { padding-right: 14px; padding-left: 14px; }
    .qrai-home-header.is-with-meta { gap: 8px; }
    .qrai-home-top-meta { gap: 5px; }
    .qrai-home-top-meta > span { min-height: 36px; padding: 6px 7px; column-gap: 5px; }
    .qrai-home-top-meta strong { font-size: 8px; }
    .qrai-home-logo-focus { min-height: 132px; margin-right: -14px; margin-left: -14px; }
    .qrai-home-logo-focus .qrai-logo-image { width: min(238px,74vw); height: 96px; }
    .qrai-home-logo-focus .qrai-wordmark strong { font-size: 34px; }
    .qrai-home-intro h1 { font-size: 40px; }
    .qrai-home-greeting-row h1 { font-size: 41px; }
    .qrai-home-time-toggle { width: 38px; height: 38px; flex-basis: 38px; }
    .qrai-home-time-icons { width: 38px; height: 38px; flex-basis: 38px; }
    .qrai-home-time-scene { width: 36px; height: 36px; }
    .qrai-time-sun { width: 15px; height: 15px; }
    .qrai-time-rays { width: 27px; height: 27px; }
    .qrai-home-meta > span { padding-right: 10px; }
    .qrai-home-meta > span + span { padding-left: 10px; }
    .qrai-home-highlights a,
    .qrai-home-highlights button { gap: 5px; padding-right: 5px; padding-left: 5px; }
    .qrai-home-highlights strong { font-size: 12px; }
}

@media (min-width: 481px) {
    .qrai-root { border-radius: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .qrai-root *, .qrai-root *::before, .qrai-root *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Form controls inherit root color; primary actions must remain white. */
.qrai-root .qrai-detail-add,
.qrai-root .qrai-checkout-button,
.qrai-root .qrai-primary-button {
    color: #fff !important;
}

/* Sold-out state */
.qrai-product-image {
    position: relative;
}

.qrai-sold-out-badge {
    position: absolute;
    z-index: 6;
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    justify-content: center;
    padding: 5px 9px;
    border: 1px solid rgba(255,255,255,.58);
    border-radius: 6px;
    background: var(--qrai-olive);
    color: #fff;
    box-shadow: 0 7px 18px rgba(58,29,24,.18);
    font-size: 8px;
    font-weight: 800;
    line-height: 1;
    backdrop-filter: blur(8px);
}

.qrai-product-image .qrai-sold-out-badge {
    top: 8px;
    right: 8px;
}

.qrai-home-slide-media .qrai-sold-out-badge {
    top: 12px;
    right: 12px;
}

.qrai-product-hero .qrai-sold-out-badge {
    bottom: 14px;
    left: 14px;
}

.qrai-product-card.is-sold-out .qrai-product-image img {
    filter: saturate(.78) brightness(.92);
}