/*
 * QRresta Pastel Cafe v1.0.0
 * Kafeler için pastel, renkli, mobil öncelikli QR menü teması.
 * Tüm stiller .qpc-root altında izole edilmiştir.
 */

:root {
    --qpc-font-sans: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    --qpc-font-serif: "Playfair Display", Georgia, "Times New Roman", serif;
    --qpc-font-hand: "Caveat", "Segoe Print", cursive;
}

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

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

.qpc-root {
    --qpc-coral: #ff6f61;
    --qpc-coral-dark: #e9584d;
    --qpc-mint: #72c9bf;
    --qpc-mint-soft: #d8f1ec;
    --qpc-yellow: #ffca55;
    --qpc-lavender: #b99ce6;
    --qpc-rose: #ff9fa5;
    --qpc-paper: #fffaf1;
    --qpc-paper-2: #fffdf8;
    --qpc-ink: #272525;
    --qpc-muted: #78736e;
    --qpc-line: #eee3d6;
    --qpc-white: #fff;
    --qpc-shadow: 0 20px 60px rgba(94, 72, 50, .15);
    position: relative;
    isolation: isolate;
    width: 100%;
    max-width: min(480px, 100vw);
    min-height: 100vh;
    min-height: 100dvh;
    margin: 0 auto;
    overflow-x: clip;
    background:
        radial-gradient(circle at 10% 15%, rgba(255, 202, 85, .11), transparent 24%),
        radial-gradient(circle at 94% 58%, rgba(114, 201, 191, .12), transparent 26%),
        var(--qpc-paper);
    color: var(--qpc-ink);
    font-family: var(--qpc-font-sans);
    font-size: 14px;
    line-height: 1.45;
    box-shadow: var(--qpc-shadow);
}

.qpc-root a {
    color: inherit;
    text-decoration: none;
}

.qpc-root button,
.qpc-root input,
.qpc-root select {
    font: inherit;
}

.qpc-root button,
.qpc-root a,
.qpc-root select {
    -webkit-tap-highlight-color: transparent;
}

.qpc-root button {
    color: inherit;
}

.qpc-root img {
    display: block;
    max-width: 100%;
}

.qpc-root [hidden] {
    display: none !important;
}

.qpc-footer {
    padding: 8px 18px 96px;
    color: var(--qpc-muted);
    font-size: 10px;
    font-weight: 700;
    text-align: center;
}

.qpc-footer a {
    color: var(--qpc-coral-dark);
}

.qpc-root :focus-visible {
    outline: 3px solid color-mix(in srgb, var(--qpc-coral), white 28%);
    outline-offset: 3px;
}

.qpc-page-shell {
    min-height: 100vh;
    min-height: 100dvh;
}

.qpc-main {
    padding: 0 18px calc(104px + env(safe-area-inset-bottom));
}

.qpc-icon {
    width: 21px;
    height: 21px;
    flex: 0 0 auto;
}

/* Topbar / brand */
.qpc-topbar {
    position: relative;
    z-index: 20;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    min-height: 70px;
    gap: 12px;
    padding: calc(16px + env(safe-area-inset-top)) 18px 10px;
}

.qpc-topbar:has(> h1) {
    grid-template-columns: 42px 1fr auto;
}

.qpc-topbar > h1 {
    margin: 0;
    font-family: var(--qpc-font-serif);
    font-size: 25px;
    font-weight: 600;
    line-height: 1;
    text-align: center;
    letter-spacing: -.025em;
}

.qpc-brand {
    display: inline-flex;
    min-width: 0;
    align-items: center;
}

.qpc-logo-image {
    width: auto;
    max-width: 190px;
    height: 48px;
    object-fit: contain;
}

.qpc-logo-wordmark {
    display: grid;
    line-height: 1;
    letter-spacing: .2em;
}

.qpc-logo-wordmark strong {
    overflow: hidden;
    max-width: 220px;
    font-family: var(--qpc-font-serif);
    font-size: 16px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qpc-logo-wordmark small {
    margin-top: 5px;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .32em;
}

.qpc-topbar-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.qpc-circle-button,
.qpc-language-select summary,
.qpc-language-select a {
    display: inline-grid;
    height: 40px;
    place-items: center;
    border: 1px solid rgba(69, 55, 42, .1);
    border-radius: 50%;
    background: rgba(255, 255, 255, .74);
    box-shadow: 0 6px 18px rgba(90, 70, 48, .06);
    cursor: pointer;
    backdrop-filter: blur(12px);
}

.qpc-circle-button {
    width: 40px;
    padding: 0;
}

.qpc-language-select {
    position: relative;
}

.qpc-language-select summary {
    list-style: none;
}

.qpc-language-select summary::-webkit-details-marker {
    display: none;
}

.qpc-language-select[open] summary {
    border-color: rgba(255, 126, 115, .28);
    color: var(--qpc-coral-dark);
}

.qpc-language-menu {
    position: absolute;
    z-index: 80;
    top: calc(100% + 7px);
    right: 0;
    display: grid;
    gap: 6px;
    min-width: 68px;
    padding: 7px;
    border: 1px solid rgba(69, 55, 42, .1);
    border-radius: 17px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 16px 34px rgba(69,55,43,.14);
    backdrop-filter: blur(14px);
}

.qpc-language-menu a {
    grid-template-columns: 1fr;
    width: 100%;
    min-width: 0;
    height: 32px;
    box-shadow: none;
}

.qpc-language-menu a.is-active {
    background: var(--qpc-coral);
    color: white;
}

.qpc-language-select a {
    grid-auto-flow: column;
    grid-template-columns: auto 14px;
    width: auto;
    min-width: 48px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
}

.qpc-language-select summary {
    grid-auto-flow: column;
    grid-template-columns: auto 14px;
    min-width: 48px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
}

.qpc-language-select .qpc-icon {
    width: 13px;
    height: 13px;
}

/* Home */
.qpc-home-page {
    position: relative;
}

.qpc-home-intro {
    position: relative;
    min-height: 174px;
    padding: 13px 4px 12px;
}

.qpc-home-intro::after {
    position: absolute;
    z-index: -1;
    top: 11px;
    right: -20px;
    width: 170px;
    height: 170px;
    background: url("../img/decor/home-leaf.svg") center/contain no-repeat;
    content: "";
    opacity: .95;
}

.qpc-home-intro::before {
    position: absolute;
    z-index: -1;
    top: 5px;
    left: 56%;
    width: 24px;
    height: 40px;
    border-radius: 70% 35% 70% 35%;
    background: #ffd1b8;
    content: "";
    transform: rotate(24deg);
}

.qpc-home-intro h1 {
    max-width: 340px;
    margin: 0;
    font-family: var(--qpc-font-serif);
    font-size: clamp(38px, 10.4vw, 50px);
    font-weight: 600;
    line-height: .98;
    letter-spacing: -.045em;
}

.qpc-home-intro h1 em {
    color: var(--qpc-coral);
    font-style: normal;
}

.qpc-intro-doodle {
    position: absolute;
    bottom: 0;
    left: 4px;
    color: var(--qpc-mint);
    font-family: var(--qpc-font-hand);
    font-size: 24px;
    font-weight: 600;
    transform: rotate(-2deg);
}

.qpc-intro-leaf {
    position: absolute;
    right: 43px;
    bottom: 23px;
    width: 14px;
    height: 14px;
    border: 3px solid var(--qpc-coral);
    border-top: 0;
    border-left: 0;
    transform: rotate(45deg);
}

.qpc-start-card {
    position: relative;
    display: grid;
    min-height: 184px;
    grid-template-columns: 48% 52%;
    overflow: hidden;
    border-radius: 24px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.08), transparent 42%),
        #62b8ae;
    color: white;
    box-shadow: 0 18px 38px rgba(75, 157, 148, .22);
}

.qpc-start-card::after {
    position: absolute;
    right: -32px;
    bottom: -48px;
    width: 130px;
    height: 130px;
    border: 22px solid rgba(255, 255, 255, .15);
    border-radius: 50%;
    content: "";
}

.qpc-start-copy {
    position: relative;
    z-index: 2;
    display: flex;
    gap: 11px;
    align-items: flex-start;
    padding: 24px 4px 22px 17px;
}

.qpc-start-icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border: 1px solid rgba(255,255,255,.42);
    border-radius: 13px;
    background: rgba(255,255,255,.12);
}

.qpc-start-icon .qpc-icon {
    width: 25px;
    height: 25px;
}

.qpc-start-copy h2 {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.035em;
}

.qpc-start-copy p {
    max-width: 155px;
    margin: 9px 0 0;
    color: rgba(255,255,255,.88);
    font-size: 11px;
    line-height: 1.55;
}

.qpc-start-copy small {
    display: inline-flex;
    margin-top: 9px;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(255,255,255,.16);
    font-size: 9px;
    font-weight: 800;
}

.qpc-start-card > img {
    width: 100%;
    height: 100%;
    min-height: 184px;
    object-fit: cover;
}

.qpc-start-card > a {
    position: absolute;
    z-index: 4;
    right: 12px;
    bottom: 12px;
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border: 5px solid rgba(255,250,241,.9);
    border-radius: 50%;
    background: white;
    color: var(--qpc-ink);
    box-shadow: 0 8px 22px rgba(46, 72, 67, .18);
}

.qpc-home-section {
    margin-top: 20px;
}

.qpc-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.qpc-section-head h2 {
    margin: 0;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: -.025em;
}

.qpc-section-head a,
.qpc-section-head button {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--qpc-muted);
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
}

.qpc-section-head .qpc-icon {
    width: 13px;
    height: 13px;
}

.qpc-category-tiles {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 2px 2px 10px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.qpc-category-tiles::-webkit-scrollbar { display: none; }

.qpc-category-tile {
    display: grid;
    flex: 0 0 74px;
    min-height: 82px;
    place-items: center;
    align-content: center;
    gap: 7px;
    border-radius: 17px;
    color: #fff;
    text-align: center;
    scroll-snap-align: start;
    box-shadow: 0 10px 20px rgba(90,70,50,.08);
}

.qpc-category-tile .qpc-icon {
    width: 29px;
    height: 29px;
}

.qpc-category-tile span {
    overflow: hidden;
    width: 100%;
    padding: 0 4px;
    font-size: 8px;
    font-weight: 800;
    line-height: 1.15;
    text-overflow: ellipsis;
}

.qpc-category-tile.is-coral { background: linear-gradient(145deg, #ff8b75, #fb6e65); }
.qpc-category-tile.is-rose { background: linear-gradient(145deg, #ffb0b5, #f48995); }
.qpc-category-tile.is-yellow { background: linear-gradient(145deg, #ffd269, #f7b82b); }
.qpc-category-tile.is-mint { background: linear-gradient(145deg, #89d1c6, #59b3aa); }
.qpc-category-tile.is-lavender { background: linear-gradient(145deg, #c6b2ec, #a98bd8); }

.qpc-quick-service-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.qpc-quick-service-grid button {
    display: grid;
    min-height: 82px;
    place-items: center;
    align-content: center;
    gap: 7px;
    padding: 9px 4px;
    border: 0;
    border-radius: 17px;
    color: white;
    cursor: pointer;
    box-shadow: 0 10px 20px rgba(90,70,50,.07);
}

.qpc-quick-service-grid .qpc-icon {
    width: 27px;
    height: 27px;
}

.qpc-quick-service-grid span {
    font-size: 8px;
    font-weight: 800;
    line-height: 1.15;
}

.qpc-quick-service-grid .is-mint { background: linear-gradient(145deg, #8bd1c7, #62bab0); }
.qpc-quick-service-grid .is-yellow { background: linear-gradient(145deg, #ffd46d, #f1b631); }
.qpc-quick-service-grid .is-lavender { background: linear-gradient(145deg, #c5b0e8, #a789d4); }
.qpc-quick-service-grid .is-coral { background: linear-gradient(145deg, #ffab91, #f98773); }

.qpc-favorite-section {
    margin-top: 18px;
}

.qpc-favorite-slider {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding: 2px 2px 12px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.qpc-favorite-slider::-webkit-scrollbar { display: none; }

.qpc-favorite-card {
    position: relative;
    display: grid;
    flex: 0 0 min(100%, 390px);
    min-height: 166px;
    grid-template-columns: 54% 46%;
    overflow: hidden;
    border: 1px solid #f3c5ad;
    border-radius: 23px;
    background:
        url("../img/decor/pastel-drops.svg") 125% 145%/175px auto no-repeat,
        rgba(255,255,255,.72);
    scroll-snap-align: start;
}

.qpc-favorite-copy {
    position: relative;
    z-index: 2;
    padding: 16px 4px 15px 15px;
}

.qpc-favorite-copy small {
    color: var(--qpc-muted);
    font-size: 9px;
}

.qpc-favorite-copy h2 {
    overflow: hidden;
    margin: 3px 0 4px;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qpc-favorite-copy p {
    display: -webkit-box;
    overflow: hidden;
    margin: 0 0 9px;
    color: var(--qpc-muted);
    font-size: 9px;
    line-height: 1.4;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.qpc-favorite-copy strong {
    font-size: 14px;
    font-weight: 800;
}

.qpc-favorite-image {
    align-self: end;
    height: 154px;
    margin-top: 10px;
}

.qpc-favorite-image img {
    width: 100%;
    height: 100%;
    border-radius: 58% 0 0 0;
    object-fit: cover;
}

.qpc-favorite-add {
    position: absolute;
    z-index: 4;
    display: grid;
    width: 31px;
    height: 31px;
    place-items: center;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
}

.qpc-favorite-add {
    right: 11px;
    bottom: 11px;
    background: var(--qpc-coral);
    color: #fff;
}

.qpc-favorite-add .qpc-icon {
    width: 17px;
    height: 17px;
}

/* Menu */
.qpc-menu-page {
    padding-top: 2px;
}

.qpc-menu-search {
    display: grid;
    grid-template-columns: 22px 1fr 31px;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    margin: 4px 0 10px;
    padding: 0 9px 0 14px;
    border: 1px solid var(--qpc-line);
    border-radius: 17px;
    background: rgba(255,255,255,.86);
    box-shadow: 0 8px 24px rgba(88,68,46,.06);
}

.qpc-menu-search input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--qpc-ink);
    font-size: 16px;
}

.qpc-menu-search input::placeholder { color: #aaa29a; }

.qpc-menu-search:focus-within {
    border-color: var(--qpc-line);
    box-shadow: 0 8px 24px rgba(88,68,46,.06);
}

.qpc-menu-search input:focus,
.qpc-menu-search input:focus-visible,
.qpc-menu-search button:focus,
.qpc-menu-search button:focus-visible,
.qpc-sort-control:focus-within,
.qpc-sort-control select:focus,
.qpc-sort-control select:focus-visible {
    outline: 0 !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
}

.qpc-menu-search button {
    display: grid;
    width: 31px;
    height: 31px;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: #f7f1e9;
    cursor: pointer;
}

.qpc-menu-search button .qpc-icon { width: 15px; height: 15px; }

.qpc-category-chips {
    display: flex;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    margin: 0 -4px;
    padding: 6px 4px 12px;
    overscroll-behavior-x: contain;
    scroll-padding-inline: 4px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
}

.qpc-category-chips::-webkit-scrollbar { display: none; }

.qpc-category-chips button {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    min-height: 40px;
    padding: 0 14px;
    border: 1px solid rgba(87, 70, 50, .11);
    border-radius: 12px;
    background: rgba(255, 253, 248, .94);
    color: #5e5751;
    font-size: 10.5px;
    font-weight: 800;
    cursor: pointer;
    scroll-snap-align: start;
    box-shadow: 0 3px 10px rgba(94, 72, 50, .07);
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease, transform .18s ease;
}

.qpc-category-chips button::before {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: var(--qpc-coral);
    box-shadow: 0 0 0 3px rgba(255, 111, 97, .12);
    content: "";
}

.qpc-category-chips button:nth-child(5n+2)::before { background: var(--qpc-yellow); box-shadow: 0 0 0 3px rgba(255, 202, 85, .16); }
.qpc-category-chips button:nth-child(5n+3)::before { background: var(--qpc-lavender); box-shadow: 0 0 0 3px rgba(185, 156, 230, .14); }
.qpc-category-chips button:nth-child(5n+4)::before { background: var(--qpc-mint); box-shadow: 0 0 0 3px rgba(114, 201, 191, .14); }
.qpc-category-chips button:nth-child(5n+5)::before { background: var(--qpc-rose); box-shadow: 0 0 0 3px rgba(255, 159, 165, .14); }

@media (hover: hover) {
    .qpc-category-chips button:hover {
        border-color: rgba(255, 111, 97, .3);
        background: #fff;
        box-shadow: 0 7px 16px rgba(94, 72, 50, .11);
        transform: translateY(-1px);
    }
}

.qpc-category-chips button:focus-visible {
    outline: 2px solid rgba(255, 111, 97, .55);
    outline-offset: 2px;
}

.qpc-category-chips button.is-active {
    border-color: var(--qpc-ink);
    background: var(--qpc-ink);
    color: #fff;
    box-shadow: 0 8px 18px rgba(39, 37, 37, .18);
    transform: translateY(-1px);
}

.qpc-category-chips button.is-active::before {
    background: var(--qpc-coral);
    box-shadow: 0 0 0 4px rgba(255, 111, 97, .2);
}

.qpc-menu-toolbar {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 1px 0 14px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    padding-bottom: 2px;
    scrollbar-width: none;
}

.qpc-menu-toolbar::-webkit-scrollbar {
    display: none;
}

.qpc-filter-button,
.qpc-view-switcher,
.qpc-sort-control {
    flex: 0 0 auto;
    min-height: 35px;
    border: 1px solid var(--qpc-line);
    border-radius: 12px;
    background: rgba(255,255,255,.82);
}

.qpc-filter-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0 9px;
    cursor: pointer;
}

.qpc-filter-button .qpc-icon { width: 15px; height: 15px; }
.qpc-filter-button span { font-size: 9px; font-weight: 800; }
.qpc-filter-button b {
    position: absolute;
    top: 2px;
    right: 2px;
    display: grid;
    min-width: 17px;
    height: 17px;
    padding: 0 5px;
    place-items: center;
    border-radius: 50%;
    background: var(--qpc-coral);
    color: white;
    font-size: 8px;
}

.qpc-view-switcher {
    display: grid;
    min-width: 176px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 3px;
}

.qpc-view-switcher button {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 0 5px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--qpc-muted);
    cursor: pointer;
}

.qpc-view-switcher button .qpc-icon { width: 14px; height: 14px; }
.qpc-view-switcher button span { overflow: hidden; font-size: 8px; font-weight: 800; text-overflow: ellipsis; }
.qpc-view-switcher button.is-active { background: var(--qpc-coral); color: #fff; }

.qpc-sort-control {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 0 7px;
}

.qpc-sort-control span { color: var(--qpc-muted); font-size: 7px; }
.qpc-sort-control select {
    max-width: 66px;
    padding: 0 13px 0 0;
    border: 0;
    outline: 0;
    appearance: none;
    background: transparent;
    color: var(--qpc-ink);
    font-size: 8px;
    font-weight: 800;
    cursor: pointer;
}
.qpc-sort-control .qpc-icon { position: absolute; right: 5px; width: 11px; height: 11px; pointer-events: none; }

.qpc-products-wrap { position: relative; }

.qpc-products-grid {
    display: grid;
    gap: 11px;
    scroll-margin-top: 120px;
}

.qpc-products-grid.is-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.qpc-product-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(91,72,52,.09);
    border-radius: 17px;
    background: rgba(255,255,255,.88);
    box-shadow: 0 10px 26px rgba(83,63,42,.08);
    transition: transform .2s ease, opacity .2s ease, box-shadow .2s ease;
}

.qpc-product-card:hover { transform: translateY(-2px); box-shadow: 0 15px 30px rgba(83,63,42,.12); }

.qpc-products-grid.is-grid .qpc-product-card {
    display: grid;
    grid-template-rows: 118px 1fr;
    min-height: 272px;
}

.qpc-product-thumb {
    position: relative;
    display: block;
    min-width: 0;
    overflow: hidden;
    background: #f4eee7;
}

.qpc-product-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s ease;
}

.qpc-product-card:hover .qpc-product-thumb img { transform: scale(1.035); }

.qpc-product-thumb em {
    position: absolute;
    top: 8px;
    left: 8px;
    max-width: calc(100% - 16px);
    overflow: hidden;
    padding: 4px 7px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--qpc-coral), white 12%);
    color: white;
    font-size: 7px;
    font-style: normal;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(91,53,42,.14);
}

.qpc-product-copy {
    display: grid;
    min-width: 0;
    align-content: stretch;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    padding: 10px 10px;
}

.qpc-product-copy > strong {
    overflow: hidden;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qpc-product-copy > p {
    display: -webkit-box;
    overflow: hidden;
    min-height: 46px;
    margin: 5px 0 7px;
    color: var(--qpc-muted);
    font-size: 9px;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.qpc-product-meta {
    display: none;
    gap: 7px;
    color: var(--qpc-muted);
}

.qpc-product-meta small {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: 7px;
}

.qpc-product-meta .qpc-icon { width: 11px; height: 11px; }

.qpc-products-grid.is-grid .qpc-product-meta {
    display: flex;
    align-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 5px;
    min-height: 18px;
    margin-bottom: 4px;
}

.qpc-products-grid.is-grid .qpc-product-meta small {
    min-height: 18px;
    padding: 3px 6px;
    border: 1px solid rgba(91, 72, 52, .08);
    border-radius: 6px;
    background: rgba(249, 244, 237, .92);
    color: var(--qpc-muted);
    font-size: 7px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.qpc-products-grid.is-grid .qpc-product-meta small:first-child .qpc-icon {
    color: var(--qpc-mint);
}

.qpc-products-grid.is-grid .qpc-product-meta small:last-child .qpc-icon {
    color: var(--qpc-coral);
}

.qpc-product-copy > b {
    align-self: end;
    padding-right: 39px;
    font-size: 19px;
    font-weight: 800;
    line-height: 31px;
}

.qpc-card-add {
    position: absolute;
    right: 10px;
    bottom: 10px;
    display: grid;
    width: 31px;
    height: 31px;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: var(--qpc-coral);
    color: white;
    cursor: pointer;
    box-shadow: 0 8px 17px rgba(255,111,97,.25);
}

.qpc-card-add .qpc-icon { width: 17px; height: 17px; }

/* Horizontal card mode */
.qpc-products-grid.is-horizontal {
    grid-template-columns: 1fr;
}

.qpc-products-grid.is-horizontal .qpc-product-card {
    display: grid;
    min-height: 142px;
    grid-template-columns: 43% 57%;
}

.qpc-products-grid.is-horizontal .qpc-product-thumb { min-height: 142px; }
.qpc-products-grid.is-horizontal .qpc-product-copy { padding: 14px 13px 10px; }
.qpc-products-grid.is-horizontal .qpc-product-copy > strong { font-size: 14px; white-space: normal; }
.qpc-products-grid.is-horizontal .qpc-product-copy > p { min-height: 47px; font-size: 9.5px; -webkit-line-clamp: 3; }
.qpc-products-grid.is-horizontal .qpc-product-meta { display: flex; }
.qpc-products-grid.is-horizontal .qpc-product-copy > b { margin-top: 8px; font-size: 19px; }

/* Compact card mode */
.qpc-products-grid.is-compact {
    grid-template-columns: 1fr;
    gap: 8px;
}

.qpc-products-grid.is-compact .qpc-product-card {
    display: grid;
    min-height: 86px;
    grid-template-columns: 84px 1fr;
    border-radius: 14px;
}

.qpc-products-grid.is-compact .qpc-product-thumb { min-height: 86px; }
.qpc-products-grid.is-compact .qpc-product-thumb em { display: none; }
.qpc-products-grid.is-compact .qpc-product-copy { padding: 12px 44px 10px 11px; }
.qpc-products-grid.is-compact .qpc-product-copy > strong { font-size: 12px; }
.qpc-products-grid.is-compact .qpc-product-copy > p { min-height: auto; margin: 4px 0 5px; font-size: 8px; -webkit-line-clamp: 1; }
.qpc-products-grid.is-compact .qpc-product-meta { display: flex; }
.qpc-products-grid.is-compact .qpc-product-copy > b { padding-right: 0; font-size: 13px; line-height: 1; }
.qpc-products-grid.is-compact .qpc-card-add { right: 9px; bottom: 50%; transform: translateY(50%); }

.qpc-no-results {
    display: grid;
    min-height: 280px;
    place-items: center;
    align-content: center;
    padding: 30px;
    text-align: center;
}
.qpc-no-results > span { display: grid; width: 64px; height: 64px; place-items: center; border-radius: 22px; background: var(--qpc-mint-soft); color: var(--qpc-mint); }
.qpc-no-results > span .qpc-icon { width: 29px; height: 29px; }
.qpc-no-results h2 { margin: 14px 0 5px; font-size: 17px; }
.qpc-no-results p { margin: 0; color: var(--qpc-muted); font-size: 11px; }
.qpc-no-results button { margin-top: 14px; padding: 10px 14px; border: 0; border-radius: 999px; background: var(--qpc-coral); color: white; font-weight: 800; cursor: pointer; }

.qpc-featured-pill {
    display: flex;
    width: 220px;
    min-height: 42px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 14px auto 0;
    padding: 0 13px;
    border: 1px solid #ffb6a9;
    border-radius: 999px;
    background: rgba(255,255,255,.84);
    color: var(--qpc-coral-dark);
    font-size: 11px;
    font-weight: 800;
}
.qpc-featured-pill .qpc-icon { width: 17px; height: 17px; }

/* Product detail */
.qpc-view-product {
    background: var(--qpc-paper-2);
}

.qpc-product-page {
    padding: 0 0 calc(181px + env(safe-area-inset-bottom));
}

.qpc-product-hero {
    position: relative;
    height: 420px;
    overflow: hidden;
    background: #f2e9dd;
}

.qpc-product-hero > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.qpc-product-hero::after {
    position: absolute;
    right: -35px;
    bottom: -22px;
    width: 180px;
    height: 105px;
    background: url("../img/decor/product-wave.svg") center/cover no-repeat;
    content: "";
    opacity: .9;
}

.qpc-product-float,
.qpc-product-float-group {
    position: absolute;
    z-index: 5;
    top: calc(18px + env(safe-area-inset-top));
}

.qpc-product-float {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid rgba(255,255,255,.6);
    border-radius: 50%;
    background: rgba(255,255,255,.9);
    color: var(--qpc-ink);
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(69,55,43,.14);
    backdrop-filter: blur(12px);
}

.qpc-product-float.is-left { left: 18px; }
.qpc-product-float-group { right: 18px; display: flex; gap: 9px; }
.qpc-product-float-group .qpc-product-float { position: static; }
.qpc-product-float.is-active { background: var(--qpc-coral); color: white; }

.qpc-image-counter {
    position: absolute;
    z-index: 5;
    right: 17px;
    bottom: 18px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.92);
    font-size: 10px;
    font-weight: 800;
}

.qpc-representative-badge {
    position: absolute;
    z-index: 5;
    bottom: 48px;
    left: 16px;
    max-width: calc(100% - 88px);
    padding: 7px 9px;
    border: 1px solid rgba(76, 43, 37, .12);
    border-radius: 7px;
    background: rgba(255, 250, 246, .9);
    box-shadow: 0 5px 18px rgba(76, 43, 37, .12);
    color: var(--qpc-text);
    font-size: 9px;
    font-weight: 700;
    line-height: 1.2;
    backdrop-filter: blur(10px);
}

.qpc-product-sheet {
    position: relative;
    z-index: 4;
    min-height: 520px;
    margin-top: -32px;
    padding: 23px 18px 30px;
    border-radius: 31px 31px 0 0;
    background:
        url("../img/decor/sparkles.svg") 100% 12%/115px auto no-repeat,
        var(--qpc-paper-2);
    box-shadow: 0 -12px 35px rgba(59,45,31,.08);
}

.qpc-product-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 10px;
    border-radius: 999px;
    background: #eee2ff;
    color: #8062b8;
    font-size: 9px;
    font-weight: 800;
}
.qpc-product-badge .qpc-icon { width: 13px; height: 13px; }

.qpc-product-sheet > h1 {
    margin: 13px 0 8px;
    font-family: var(--qpc-font-serif);
    font-size: clamp(31px, 8.3vw, 39px);
    font-weight: 600;
    line-height: 1.03;
    letter-spacing: -.04em;
}

.qpc-product-sheet > p {
    max-width: 390px;
    margin: 0;
    color: var(--qpc-muted);
    font-size: 12px;
    line-height: 1.65;
}

.qpc-product-price {
    display: block;
    margin-top: 10px;
    color: var(--qpc-coral);
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -.04em;
}

.qpc-product-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.qpc-product-stats span {
    display: grid;
    min-height: 69px;
    grid-template-columns: 25px 1fr;
    grid-template-rows: auto auto;
    align-items: center;
    padding: 10px;
    border: 1px solid var(--qpc-line);
    border-radius: 15px;
    background: rgba(255,255,255,.76);
}
.qpc-product-stats .qpc-icon { grid-row: 1 / 3; color: var(--qpc-coral); }
.qpc-product-stats span:nth-child(2) .qpc-icon { color: #75aa61; }
.qpc-product-stats span:nth-child(3) .qpc-icon { color: #e5a427; }
.qpc-product-stats b { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.qpc-product-stats small { color: var(--qpc-muted); font-size: 7.5px; }

.qpc-option-section {
    padding-top: 19px;
}

.qpc-option-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.qpc-option-head h2 { margin: 0; font-size: 13px; font-weight: 800; }
.qpc-option-head small { color: var(--qpc-muted); font-size: 8px; }

.qpc-segmented-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}
.qpc-segmented-options button {
    display: grid;
    min-height: 42px;
    padding: 0 8px;
    place-content: center;
    gap: 2px;
    border: 1px solid var(--qpc-line);
    border-radius: 13px;
    background: rgba(255,255,255,.6);
    color: var(--qpc-muted);
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
}
.qpc-segmented-options button small { color: var(--qpc-ink); font-size: 8px; font-weight: 800; }
.qpc-segmented-options button.is-active { border-color: var(--qpc-coral); background: var(--qpc-coral); color: white; box-shadow: 0 8px 18px rgba(255,111,97,.2); }
.qpc-segmented-options button.is-active small { color: white; }

.qpc-extra-options {
    display: grid;
    gap: 5px;
}
.qpc-extra-options button {
    display: grid;
    min-height: 37px;
    grid-template-columns: 23px 1fr auto;
    align-items: center;
    gap: 8px;
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}
.qpc-extra-options button i {
    display: grid;
    width: 21px;
    height: 21px;
    place-items: center;
    border: 1px solid #bdb7b0;
    border-radius: 6px;
    color: transparent;
}
.qpc-extra-options button i .qpc-icon { width: 14px; height: 14px; }
.qpc-extra-options button span { font-size: 11px; }
.qpc-extra-options button b { color: var(--qpc-muted); font-size: 10px; }
.qpc-extra-options button.is-active i { border-color: var(--qpc-coral); background: var(--qpc-coral); color: white; }
.qpc-extra-options button.is-active b { color: var(--qpc-coral-dark); }

.qpc-allergen-list {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 2px 2px 10px;
    scrollbar-width: none;
}
.qpc-allergen-list::-webkit-scrollbar { display: none; }
.qpc-allergen-list span { display: grid; min-width: 74px; min-height: 66px; place-items: center; align-content: center; gap: 5px; border: 1px solid rgba(234,223,210,.9); border-radius: 16px; background: rgba(255,255,255,.48); }
.qpc-allergen-list b { color: var(--qpc-coral); font-size: 14px; }
.qpc-allergen-list img { width: 24px; height: 24px; object-fit: contain; }
.qpc-allergen-list small { max-width: 62px; color: var(--qpc-muted); font-size: 8px; font-weight: 800; line-height: 1.15; text-align: center; }

.qpc-service-disabled,
.qpc-service-disabled:hover {
    cursor: not-allowed;
    opacity: .48;
    filter: grayscale(.15);
}

.qpc-option-backdrop {
    position: fixed;
    z-index: 70;
    inset: 0;
    background: rgba(35,27,23,.34);
    backdrop-filter: blur(4px);
}

.qpc-menu-option-sheet {
    position: fixed;
    z-index: 75;
    right: 50%;
    bottom: 0;
    display: grid;
    width: min(100%, 480px);
    max-height: min(78vh, 620px);
    gap: 16px;
    overflow-y: auto;
    padding: 10px 18px calc(22px + env(safe-area-inset-bottom));
    border-radius: 28px 28px 0 0;
    background: var(--qpc-paper-2);
    box-shadow: 0 -18px 50px rgba(69,55,43,.2);
    transform: translateX(50%);
}

.qpc-menu-option-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.qpc-menu-option-head small {
    color: var(--qpc-coral-dark);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}

.qpc-menu-option-head h2 {
    margin: 3px 0 0;
    font-family: var(--qpc-font-serif);
    font-size: 23px;
    font-weight: 600;
    line-height: 1.08;
}

.qpc-menu-option-head button {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border: 1px solid var(--qpc-line);
    border-radius: 50%;
    background: white;
    color: var(--qpc-ink);
    font-size: 22px;
    cursor: pointer;
}

.qpc-menu-option-sheet h3 {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 900;
}

.qpc-menu-option-row,
.qpc-menu-extra-list {
    display: grid;
    gap: 8px;
}

.qpc-menu-option-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.qpc-menu-option-row button,
.qpc-menu-extra-list button {
    min-height: 42px;
    border: 1px solid var(--qpc-line);
    border-radius: 14px;
    background: rgba(255,255,255,.72);
    color: var(--qpc-muted);
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
}

.qpc-menu-option-row button.is-active,
.qpc-menu-extra-list button.is-active {
    border-color: var(--qpc-coral);
    background: #fff0eb;
    color: var(--qpc-coral-dark);
}

.qpc-menu-extra-list button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 13px;
    text-align: left;
}

.qpc-menu-extra-list b {
    color: var(--qpc-coral-dark);
    font-size: 10px;
    white-space: nowrap;
}

.qpc-menu-option-submit {
    min-height: 50px;
    border: 0;
    border-radius: 16px;
    background: var(--qpc-coral);
    color: white !important;
    font-size: 14px;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 12px 24px rgba(255,111,97,.22);
}

.qpc-product-dock {
    position: fixed;
    z-index: 60;
    right: 50%;
    bottom: calc(72px + env(safe-area-inset-bottom));
    display: grid;
    width: min(calc(100% - 24px), 456px);
    min-height: 70px;
    grid-template-columns: 110px 1fr;
    gap: 10px;
    padding: 9px;
    border: 1px solid rgba(91,72,52,.12);
    border-radius: 22px;
    background: rgba(255,253,248,.94);
    transform: translateX(50%);
    box-shadow: 0 15px 38px rgba(73,55,39,.18);
    backdrop-filter: blur(18px);
}

.qpc-quantity-control {
    display: grid;
    grid-template-columns: 32px 1fr 32px;
    align-items: center;
    border: 1px solid var(--qpc-line);
    border-radius: 16px;
    background: white;
}
.qpc-quantity-control button { display: grid; width: 32px; height: 45px; place-items: center; border: 0; background: transparent; cursor: pointer; }
.qpc-quantity-control button .qpc-icon { width: 15px; height: 15px; }
.qpc-quantity-control strong { text-align: center; }

.qpc-add-product-button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 16px;
    border: 0;
    border-radius: 16px;
    background: linear-gradient(110deg, var(--qpc-coral), #ff8b74);
    color: white;
    cursor: pointer;
    box-shadow: 0 9px 22px rgba(255,111,97,.24);
}
.qpc-add-product-button span { font-size: 13px; font-weight: 800; }
.qpc-add-product-button strong { font-size: 12px; white-space: nowrap; }

/* Cart */
.qpc-cart-heading {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 12px 2px 18px;
}
.qpc-cart-heading > span { display: grid; width: 52px; height: 52px; flex: 0 0 52px; place-items: center; border-radius: 18px; background: #ffe1d7; color: var(--qpc-coral); }
.qpc-cart-heading > span .qpc-icon { width: 25px; height: 25px; }
.qpc-cart-heading h1 { margin: 0 0 3px; font-size: 17px; }
.qpc-cart-heading p { margin: 0; color: var(--qpc-muted); font-size: 10px; }

.qpc-cart-items { display: grid; gap: 9px; }

.qpc-cart-item {
    display: grid;
    min-height: 94px;
    grid-template-columns: 82px 1fr auto;
    align-items: center;
    gap: 11px;
    padding: 9px;
    border: 1px solid var(--qpc-line);
    border-radius: 18px;
    background: rgba(255,255,255,.8);
    box-shadow: 0 8px 22px rgba(87,66,44,.06);
}
.qpc-cart-item-image { width: 82px; height: 76px; overflow: hidden; border-radius: 13px; }
.qpc-cart-item-image img { width: 100%; height: 100%; object-fit: cover; }
.qpc-cart-item-copy { min-width: 0; }
.qpc-cart-item-copy strong { display: block; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.qpc-cart-item-copy small { display: -webkit-box; overflow: hidden; margin: 4px 0 7px; color: var(--qpc-muted); font-size: 8px; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
.qpc-cart-item-copy b { font-size: 11px; }
.qpc-cart-item-actions { display: grid; justify-items: end; gap: 9px; }
.qpc-order-note { display: grid; gap: 8px; margin: 14px 0 0; font-size: 11px; font-weight: 800; color: var(--qpc-ink); }
.qpc-order-note textarea { width: 100%; min-height: 76px; resize: vertical; border: 1px solid var(--qpc-line); border-radius: 16px; padding: 12px 14px; background: rgba(255,255,255,.72); color: var(--qpc-ink); font: 600 16px/1.35 Manrope, sans-serif; outline: none; }
.qpc-order-note textarea:focus { border-color: var(--qpc-coral); box-shadow: 0 0 0 3px rgba(255,126,115,.16); }
.qpc-cart-remove { display: grid; width: 28px; height: 28px; place-items: center; border: 0; border-radius: 9px; background: #fff0ec; color: var(--qpc-coral); cursor: pointer; }
.qpc-cart-remove .qpc-icon { width: 14px; height: 14px; }
.qpc-cart-qty { display: grid; grid-template-columns: 25px 25px 25px; align-items: center; border: 1px solid var(--qpc-line); border-radius: 11px; overflow: hidden; }
.qpc-cart-qty button { width: 25px; height: 27px; border: 0; background: transparent; cursor: pointer; }
.qpc-cart-qty strong { text-align: center; font-size: 10px; }

.qpc-cart-empty { display: grid; min-height: 320px; place-items: center; align-content: center; padding: 30px; text-align: center; }
.qpc-cart-empty > span { display: grid; width: 70px; height: 70px; place-items: center; border-radius: 24px; background: var(--qpc-mint-soft); color: var(--qpc-mint); }
.qpc-cart-empty h2 { margin: 16px 0 5px; font-size: 18px; }
.qpc-cart-empty p { margin: 0; color: var(--qpc-muted); font-size: 11px; }
.qpc-cart-empty a { margin-top: 15px; padding: 11px 16px; border-radius: 999px; background: var(--qpc-coral); color: white; font-weight: 800; }

.qpc-order-summary {
    margin-top: 15px;
    padding: 16px;
    border: 1px solid var(--qpc-line);
    border-radius: 21px;
    background: rgba(255,255,255,.82);
}
.qpc-summary-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.qpc-summary-head h2 { margin: 0; font-size: 15px; }
.qpc-summary-head span { color: var(--qpc-muted); font-size: 9px; }
.qpc-order-summary dl { display: grid; gap: 9px; margin: 0; }
.qpc-order-summary dl > div { display: flex; justify-content: space-between; gap: 15px; color: var(--qpc-muted); font-size: 10px; }
.qpc-order-summary dt, .qpc-order-summary dd { margin: 0; }
.qpc-order-summary .is-total { padding-top: 11px; border-top: 1px dashed var(--qpc-line); color: var(--qpc-ink); font-size: 14px; font-weight: 800; }
.qpc-checkout-button { display: flex; width: 100%; min-height: 49px; align-items: center; justify-content: center; gap: 8px; margin-top: 14px; border: 0; border-radius: 15px; background: var(--qpc-coral); color: white; font-weight: 800; cursor: pointer; }
.qpc-checkout-button .qpc-icon { width: 18px; height: 18px; }

/* Bottom navigation */
.qpc-bottom-nav {
    position: fixed;
    z-index: 70;
    right: 50%;
    bottom: 0;
    display: grid;
    width: min(100%, 480px);
    min-height: calc(72px + env(safe-area-inset-bottom));
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: start;
    padding: 8px 9px env(safe-area-inset-bottom);
    border-top: 1px solid rgba(96,74,52,.1);
    background: rgba(255,253,248,.94);
    transform: translateX(50%);
    box-shadow: 0 -12px 32px rgba(73,56,40,.1);
    backdrop-filter: blur(18px);
}

.qpc-nav-item {
    position: relative;
    display: grid;
    min-width: 0;
    min-height: 55px;
    place-items: center;
    align-content: center;
    gap: 3px;
    padding: 3px;
    border: 0;
    border-radius: 16px;
    background: transparent;
    color: #69645f;
    cursor: pointer;
}
.qpc-nav-item .qpc-icon { width: 21px; height: 21px; }
.qpc-nav-item span { font-size: 8px; font-weight: 700; }
.qpc-nav-item.is-active { color: var(--qpc-coral); }
.qpc-nav-item.is-active::before { position: absolute; top: -8px; width: 30px; height: 3px; border-radius: 999px; background: var(--qpc-coral); content: ""; }
.qpc-nav-item b { position: absolute; top: 3px; right: 20%; display: grid; min-width: 17px; height: 17px; place-items: center; padding: 0 4px; border: 2px solid var(--qpc-paper-2); border-radius: 999px; background: var(--qpc-coral); color: white; font-size: 7px; }

/* Sheets */
.qpc-sheet-backdrop,
.qpc-table-backdrop,
.qpc-filter-backdrop {
    position: fixed;
    z-index: 88;
    inset: 0;
    background: rgba(55,44,34,.3);
    backdrop-filter: blur(3px);
}

.qpc-service-sheet,
.qpc-table-sheet,
.qpc-filter-sheet,
.qpc-link-sheet,
.qpc-survey-panel {
    position: fixed;
    z-index: 90;
    right: 50%;
    bottom: 0;
    width: min(100%, 480px);
    padding: 10px 18px calc(24px + env(safe-area-inset-bottom));
    border-radius: 29px 29px 0 0;
    background: var(--qpc-paper-2);
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translate(50%, 110%);
    box-shadow: 0 -24px 60px rgba(64,48,34,.2);
    transition: transform .27s ease, opacity .2s ease, visibility 0s linear .27s;
}
.qpc-service-sheet.is-open,
.qpc-table-sheet.is-open,
.qpc-filter-sheet.is-open,
.qpc-link-sheet.is-open,
.qpc-survey-panel.is-open { visibility: visible; opacity: 1; pointer-events: auto; transform: translate(50%, 0); transition-delay: 0s; }

.qpc-sheet-handle { width: 42px; height: 4px; margin: 0 auto 16px; border-radius: 999px; background: #d6cec5; }
.qpc-sheet-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 13px; }
.qpc-sheet-head small { color: var(--qpc-coral); font-size: 8px; font-weight: 800; letter-spacing: .11em; }
.qpc-sheet-head h2 { margin: 4px 0 0; font-size: 19px; line-height: 1.15; }
.qpc-sheet-head p { max-width: 310px; margin: 7px 0 0; color: var(--qpc-muted); font-size: 10px; line-height: 1.45; }
.qpc-sheet-head > button { display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid var(--qpc-line); border-radius: 50%; background: white; cursor: pointer; }
.qpc-sheet-head > button .qpc-icon { width: 17px; height: 17px; }

.qpc-sheet-actions { display: grid; gap: 8px; margin-top: 17px; }
.qpc-sheet-actions > button { display: grid; min-height: 68px; grid-template-columns: 48px 1fr; align-items: center; gap: 12px; padding: 9px; border: 1px solid var(--qpc-line); border-radius: 17px; background: white; text-align: left; cursor: pointer; }
.qpc-sheet-actions i { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 14px; }
.qpc-sheet-actions i.is-mint { background: var(--qpc-mint-soft); color: #4aa99e; }
.qpc-sheet-actions i.is-yellow { background: #fff0c4; color: #d79a19; }
.qpc-sheet-actions i.is-lavender { background: #efe7fb; color: #9471cb; }
.qpc-sheet-actions i.is-coral { background: #ffe2da; color: var(--qpc-coral); }
.qpc-sheet-actions span { display: grid; }
.qpc-sheet-actions strong { font-size: 12px; }
.qpc-sheet-actions small { margin-top: 3px; color: var(--qpc-muted); font-size: 9px; }

.qpc-table-sheet { z-index: 96; }
.qpc-table-backdrop { z-index: 94; }
.qpc-table-form { display: grid; gap: 10px; margin-top: 18px; }
.qpc-table-form label { display: grid; gap: 7px; color: var(--qpc-ink); font-size: 11px; font-weight: 800; }
.qpc-table-form input {
    width: 100%;
    min-height: 50px;
    border: 1px solid var(--qpc-line);
    border-radius: 15px;
    padding: 0 14px;
    background: white;
    color: var(--qpc-ink);
    font: 700 16px/1 Manrope, sans-serif;
    outline: none;
}
.qpc-table-form input:focus { border-color: var(--qpc-coral); box-shadow: 0 0 0 3px rgba(255,126,115,.16); }
.qpc-table-error { color: #c3473c; font-size: 10px; font-weight: 700; }
.qpc-table-form > button {
    display: flex;
    min-height: 50px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    border-radius: 15px;
    background: var(--qpc-coral);
    color: white;
    font: 800 12px/1 Manrope, sans-serif;
    cursor: pointer;
}
.qpc-table-form > button .qpc-icon { width: 17px; height: 17px; }

.qpc-survey-form {
    display: grid;
    gap: 12px;
    margin-top: 17px;
    max-height: min(62vh, 520px);
    overflow-y: auto;
    padding-right: 3px;
}

.qpc-survey-question {
    margin: 0;
    padding: 12px;
    border: 1px solid var(--qpc-line);
    border-radius: 16px;
    background: white;
}

.qpc-survey-question legend {
    padding: 0 4px;
    color: var(--qpc-ink);
    font-size: 12px;
    font-weight: 800;
}

.qpc-survey-rating,
.qpc-survey-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.qpc-survey-rating label,
.qpc-survey-options label {
    cursor: pointer;
}

.qpc-survey-rating input,
.qpc-survey-options input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.qpc-survey-rating span,
.qpc-survey-options span {
    display: grid;
    min-height: 34px;
    place-items: center;
    padding: 0 12px;
    border: 1px solid var(--qpc-line);
    border-radius: 999px;
    background: #fffaf3;
    color: var(--qpc-muted);
    font-size: 11px;
    font-weight: 800;
}

.qpc-survey-rating input:checked + span,
.qpc-survey-options input:checked + span {
    border-color: var(--qpc-coral);
    background: var(--qpc-coral);
    color: white;
}

.qpc-survey-question textarea {
    width: 100%;
    min-height: 82px;
    margin-top: 10px;
    padding: 11px;
    border: 1px solid var(--qpc-line);
    border-radius: 13px;
    background: #fffaf3;
    color: var(--qpc-ink);
    font: inherit;
    font-size: 16px;
    resize: vertical;
}

.qpc-survey-submit {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    border-radius: 15px;
    background: var(--qpc-coral);
    color: white;
    font-weight: 800;
    cursor: pointer;
}

.qpc-filter-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 18px; }
.qpc-filter-options button { display: flex; min-height: 58px; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid var(--qpc-line); border-radius: 16px; background: white; color: var(--qpc-muted); cursor: pointer; }
.qpc-filter-options button .qpc-icon { color: var(--qpc-coral); }
.qpc-filter-options button span { font-size: 10px; font-weight: 800; }
.qpc-filter-options button.is-active { border-color: var(--qpc-coral); background: #fff0eb; color: var(--qpc-coral-dark); }
.qpc-filter-apply { width: 100%; min-height: 48px; margin-top: 14px; border: 0; border-radius: 15px; background: var(--qpc-coral); color: white !important; font-weight: 800; cursor: pointer; }

/* Toast and states */
.qpc-toast {
    position: fixed;
    z-index: 120;
    right: 50%;
    bottom: calc(87px + env(safe-area-inset-bottom));
    max-width: min(calc(100% - 36px), 420px);
    padding: 11px 15px;
    border-radius: 999px;
    background: #2f2c2a;
    color: white;
    font-size: 10px;
    font-weight: 700;
    opacity: 0;
    pointer-events: none;
    transform: translate(50%, 12px);
    transition: opacity .2s ease, transform .2s ease;
    box-shadow: 0 12px 28px rgba(52,41,31,.2);
}
.qpc-toast.is-visible { opacity: 1; transform: translate(50%, 0); }
.qpc-pulse { animation: qpc-pulse .42s ease; }
@keyframes qpc-pulse { 50% { transform: scale(.88); } }

@media (max-width: 390px) {
    .qpc-main { padding-right: 14px; padding-left: 14px; }
    .qpc-topbar { padding-right: 14px; padding-left: 14px; }
    .qpc-home-intro h1 { font-size: 38px; }
    .qpc-category-tiles { gap: 6px; }
    .qpc-category-tile { min-height: 75px; border-radius: 15px; }
    .qpc-category-tile .qpc-icon { width: 25px; height: 25px; }
    .qpc-quick-service-grid { gap: 6px; }
    .qpc-quick-service-grid button { min-height: 76px; }
    .qpc-menu-toolbar { gap: 5px; }
    .qpc-filter-button { padding: 0 7px; }
    .qpc-filter-button span { display: none; }
    .qpc-view-switcher button span { font-size: 7px; }
    .qpc-sort-control span { display: none; }
    .qpc-sort-control select { max-width: 57px; }
    .qpc-products-grid.is-grid .qpc-product-card { grid-template-rows: 104px 1fr; min-height: 229px; }
    .qpc-product-hero { height: 375px; }
    .qpc-product-sheet { padding-right: 14px; padding-left: 14px; }
    .qpc-product-dock { width: calc(100% - 16px); grid-template-columns: 98px 1fr; }
    .qpc-add-product-button { padding: 0 12px; }
}

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

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

/* Sold-out state */
.qpc-favorite-image {
    position: relative;
    display: block;
    overflow: hidden;
}

.qpc-sold-out-badge {
    position: absolute;
    z-index: 7;
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    justify-content: center;
    padding: 5px 9px;
    border: 1px solid rgba(255,255,255,.68);
    border-radius: 999px;
    background: rgba(224,78,72,.86);
    color: #fff;
    box-shadow: 0 8px 18px rgba(148,56,51,.18);
    font-size: 7px;
    font-weight: 900;
    line-height: 1;
    backdrop-filter: blur(8px);
}

.qpc-product-thumb .qpc-sold-out-badge {
    top: 8px;
    right: 8px;
}

.qpc-product-hero .qpc-sold-out-badge {
    bottom: 18px;
    left: 14px;
    padding-right: 11px;
    padding-left: 11px;
    font-size: 8px;
}

.qpc-favorite-image .qpc-sold-out-badge {
    top: 10px;
    right: 9px;
}

.qpc-start-card .qpc-sold-out-badge.is-start-card {
    top: 12px;
    right: 12px;
}

.qpc-product-card.is-sold-out .qpc-product-thumb img {
    filter: saturate(.72) brightness(.92);
}

.qpc-product-page.is-sold-out {
    padding-bottom: calc(92px + env(safe-area-inset-bottom));
}
