* { -webkit-tap-highlight-color: transparent; }
        body.public-shell .hidden { display: none !important; }
        body { font-family: 'Outfit', sans-serif; -webkit-overflow-scrolling: touch; }
        html { font-size: 16px; }
        body.public-shell { font-size: 1rem; line-height: 1.45; letter-spacing: -0.01em; overscroll-behavior-y: none; background-color: #ffffff; }
        body.public-shell[data-page-type="cardapio"] { padding-bottom: calc(var(--bottom-navigation-height) + 0.75rem); }
        body.public-shell[data-page-type="produto"] .product-detail-scroll {
            padding-bottom: 6rem !important;
        }
        body.public-shell[data-page-type="produto"] .product-detail-footer {
            position: fixed !important;
            bottom: 0 !important;
            width: 100%;
        }
        body.public-shell[data-page-type="checkout"] #custom-checkout-scroll {
            padding-bottom: 6rem;
        }
        body.public-shell[data-page-type="checkout"] .checkout-action-footer {
            position: fixed !important;
            bottom: 0 !important;
            left: 0 !important;
            right: 0 !important;
            width: 100%;
            padding-bottom: calc(1rem + env(safe-area-inset-bottom));
        }
        body.public-shell button { min-height: 44px; }
        body.public-shell button[class~="w-8"],
        body.public-shell button[class~="w-10"] { min-width: 44px; }
        body.public-shell .menu-categories {
            display: flex;
            flex-wrap: nowrap;
            gap: 0.75rem;
            overflow-x: auto;
            padding-bottom: 0.2rem;
            margin-top: 0 !important;
            scrollbar-width: none;
            -ms-overflow-style: none;
        }
        body.public-shell .menu-categories::-webkit-scrollbar {
            display: none;
        }
        body.public-shell .menu-categories .cat-btn {
            flex: 0 0 calc((100% - 3rem) / 5);
            width: calc((100% - 3rem) / 5);
        }
        body.public-shell .cat-btn {
            flex: initial;
            width: 100%;
            min-width: 0 !important;
            min-height: 86px;
            padding: 0 !important;
            border: 0 !important;
            border-radius: 0;
            background: transparent !important;
            box-shadow: none !important;
            overflow: visible;
        }
        body.public-shell .cat-btn .cat-icon {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            max-width: 64px;
            height: auto;
            aspect-ratio: 1;
            border: 1px solid transparent;
            border-radius: 20px;
            background: #f4f4f5;
            font-size: 1.75rem;
            transition: background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
        }
        body.public-shell .cat-btn .category-esfiha-icon {
            width: 1.75rem;
            height: 1.75rem;
            object-fit: contain;
        }
        body.public-shell .cat-btn .category-food-icon {
            display: block;
            width: 1.75rem;
            height: 1.75rem;
            object-fit: contain;
        }
        body.public-shell .ingredient-esfiha-icon,
        body.public-shell .toast-esfiha-icon,
        body.public-shell .toast-food-icon {
            display: block;
            width: 1.4em;
            height: 1.4em;
            object-fit: contain;
        }
        body.public-shell .cat-btn span {
            display: block;
            width: 100%;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            text-align: center;
            font-size: 0.75rem !important;
            line-height: 1.15 !important;
            font-weight: 700;
            color: #1d1d1f;
        }
        body.public-shell .cat-btn.cat-active .cat-icon {
            border-color: var(--accent);
            background: color-mix(in srgb, var(--accent) 12.55%, transparent);
        }
        body.public-shell .cat-btn.cat-active span {
            color: var(--accent);
        }
        body.public-shell .cat-btn:active .cat-icon {
            transform: scale(0.94);
        }
        body.public-shell #tab-menu-content {
            display: flex;
            flex-direction: column;
            gap: 1.25rem;
        }
        body.public-shell #tab-menu-content > * {
            margin-top: 0 !important;
        }
        body.public-shell .menu-header {
            position: relative;
            padding-top: 0.9rem;
            padding-bottom: 0;
        }
        body.public-shell .menu-header-top {
            display: flex;
            min-width: 0;
            align-items: center;
            justify-content: space-between;
            gap: 0.75rem;
        }
        body.public-shell .menu-header-actions {
            display: flex;
            flex: 0 0 auto;
            align-items: center;
            gap: 0.5rem;
        }
        body.public-shell .menu-delivery-kicker {
            display: inline-flex;
            color: var(--accent);
            font-size: 0.58rem;
            line-height: 0.8rem;
            font-weight: 800;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            align-items: center;
            gap: 0.25rem;
        }
        body.public-shell .menu-delivery-kicker svg { width: 0.9rem; height: 0.9rem; }
        body.public-shell .menu-address-value {
            display: flex;
            min-width: 0;
            max-width: 17rem;
            color: #1d1d1f;
            font-size: 0.78rem;
            line-height: 1rem;
            font-weight: 750;
            align-items: center;
            gap: 0.25rem;
        }
        body.public-shell .menu-address-value > span:first-child {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        body.public-shell .menu-address-value svg { width: 0.85rem; height: 0.85rem; flex: 0 0 auto; }
        body.public-shell .menu-cart-button {
            position: relative;
            display: grid;
            width: 2.75rem;
            height: 2.75rem;
            min-width: 2.75rem;
            min-height: 2.75rem !important;
            padding: 0;
            border: 1px solid rgba(29,29,31,0.08);
            border-radius: 0.95rem;
            background: #ffffff;
            color: #1d1d1f;
            box-shadow: 0 5px 16px rgba(16,24,40,0.06);
            place-items: center;
            transition: transform 160ms ease, box-shadow 160ms ease;
        }
        body.public-shell .menu-cart-button:active { transform: scale(0.94); }
        body.public-shell .menu-cart-button > svg { width: 1.3rem; height: 1.3rem; }
        body.public-shell .menu-establishment-logo {
            display: block;
            width: 2.75rem;
            height: 2.75rem;
            flex: 0 0 2.75rem;
            padding: 0.2rem;
            border: 1px solid rgba(29,29,31,0.08);
            border-radius: 0.95rem;
            background: #ffffff;
            object-fit: contain;
            box-shadow: 0 5px 16px rgba(16,24,40,0.06);
        }
        body.public-shell .menu-cart-badge {
            position: absolute;
            top: -0.3rem;
            right: -0.3rem;
            display: grid;
            min-width: 1.05rem;
            height: 1.05rem;
            padding: 0 0.2rem;
            border: 2px solid #ffffff;
            border-radius: 999px;
            background: #df4d58;
            color: #ffffff;
            font-size: 0.55rem;
            line-height: 1;
            font-weight: 800;
            place-items: center;
        }
        body.public-shell .pref-theme-control {
            display: flex;
            align-items: center;
            justify-content: flex-start;
            gap: 0.65rem;
            padding: 0.25rem 0;
        }
        body.public-shell .pref-theme-label {
            color: #b7bdc8;
            font-size: 0.8rem;
            font-weight: 700;
            transition: color 160ms ease;
        }
        body.public-shell .pref-theme-label.is-active {
            color: #1d1d1f;
        }
        body.public-shell .pref-theme-switch {
            position: relative;
            display: block;
            width: 5rem;
            height: 2.5rem;
            min-width: 0 !important;
            min-height: 0 !important;
            padding: 0.25rem !important;
            overflow: hidden;
            border: 0 !important;
            border-radius: 999px;
            background: #78a8f5;
            color: #ffffff;
            box-shadow: inset 0 1px 2px rgba(24, 61, 120, 0.12);
            transition: background-color 180ms ease, box-shadow 180ms ease;
        }
        body.public-shell .pref-theme-switch:focus-visible {
            outline: 2px solid color-mix(in srgb, var(--accent) 65%, white);
            outline-offset: 3px;
        }
        body.public-shell .pref-theme-stars {
            position: absolute;
            top: 0.35rem;
            right: 0.45rem;
            color: rgba(255,255,255,0.95);
            font-size: 0.7rem;
            letter-spacing: 0.05rem;
            line-height: 1;
        }
        body.public-shell .pref-theme-thumb {
            position: relative;
            z-index: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 2rem;
            height: 2rem;
            border-radius: 50%;
            background: #ffffff;
            color: #78a8f5;
            box-shadow: 0 2px 5px rgba(35, 65, 115, 0.2);
            transform: translateX(0);
            transition: transform 180ms ease, background-color 180ms ease, color 180ms ease;
        }
        body.public-shell .pref-theme-thumb svg {
            width: 1.05rem;
            height: 1.05rem;
        }
        body.public-shell .pref-theme-moon { display: none; }
        body.public-shell .pref-theme-switch.is-dark {
            background: #111a2d;
            box-shadow: inset 0 1px 3px rgba(0,0,0,0.4);
        }
        body.public-shell .pref-theme-switch.is-dark .pref-theme-thumb {
            color: #172033;
            transform: translateX(2.5rem);
        }
        body.public-shell .pref-theme-switch.is-dark .pref-theme-sun { display: none; }
        body.public-shell .pref-theme-switch.is-dark .pref-theme-moon { display: block; }
        .dark body.public-shell .pref-theme-label.is-active { color: #f5f5f5; }
        body.public-shell .menu-address {
            display: flex;
            flex: 1 1 auto;
            min-height: 0 !important;
            min-width: 0;
            width: auto;
            max-width: none;
            padding: 0;
            border: 0;
            background: transparent;
            text-align: left;
            cursor: pointer;
            flex-direction: column;
            align-items: flex-start;
            gap: 0.12rem;
            margin-top: 0;
            font-size: 0.78rem !important;
            line-height: 1rem;
            color: #6e6e73;
        }
        body.public-shell .menu-address:focus-visible {
            outline: 2px solid color-mix(in srgb, var(--accent) 62%, white);
            outline-offset: 3px;
            border-radius: 0.35rem;
        }
        body.public-shell .address-switcher {
            position: absolute;
            top: 100%;
            left: 0;
            z-index: 30;
            width: min(18rem, calc(100vw - 2rem));
            margin-top: 0.5rem;
            padding: 0.65rem;
            border: 1px solid rgba(29, 29, 31, 0.08);
            border-radius: 1.25rem;
            background: rgba(255, 255, 255, 0.98);
            box-shadow: 0 16px 40px rgba(16, 24, 40, 0.16);
        }
        body.public-shell .address-switcher-option {
            display: block;
            width: 100%;
            padding: 0.7rem 0.75rem;
            border: 0;
            border-radius: 0.85rem;
            background: transparent;
            color: #1d1d1f;
            text-align: left;
            cursor: pointer;
        }
        body.public-shell .address-switcher-option:hover,
        body.public-shell .address-switcher-option.is-active {
            background: color-mix(in srgb, var(--accent) 10%, transparent);
        }
        body.public-shell .address-switcher-option strong,
        body.public-shell .address-switcher-option span {
            display: block;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        body.public-shell .address-switcher-option strong {
            font-size: 0.72rem;
            font-weight: 750;
        }
        body.public-shell .address-switcher-option span {
            margin-top: 0.15rem;
            color: #7e7e7e;
            font-size: 0.65rem;
            font-weight: 500;
        }
        .dark body.public-shell .address-switcher-option {
            color: #f5f5f5;
        }
        .dark body.public-shell .address-switcher-option strong { color: #f5f5f5; }
        .dark body.public-shell .address-switcher-option span { color: #a0a0a0; }
        .dark body.public-shell .address-switcher {
            border-color: #3a3a3f;
            background: rgba(28, 28, 30, 0.98);
            box-shadow: 0 16px 40px rgba(0, 0, 0, 0.42);
        }
        .dark body.public-shell .address-switcher-option:hover,
        .dark body.public-shell .address-switcher-option.is-active {
            background: color-mix(in srgb, var(--accent) 16%, #242426);
        }
        body.public-shell .address-switcher-manage {
            width: 100%;
            min-height: 0 !important;
            margin-top: 0.45rem;
            padding: 0.65rem 0.75rem;
            border: 1px solid rgba(29, 29, 31, 0.08);
            border-radius: 0.85rem;
            background: #f4f4f5;
            color: #1d1d1f;
            font-size: 0.68rem;
            font-weight: 700;
            text-align: center;
        }
        .dark body.public-shell .address-switcher-manage {
            border-color: #3a3a3f;
            background: #2a2a2d;
            color: #f5f5f7;
        }
        body.public-shell #saved-addresses-list:empty::before {
            content: 'Nenhum endereço cadastrado ainda.';
            display: block;
            padding: 0.8rem;
            border-radius: 0.9rem;
            background: #f8f8f8;
            color: #7e7e7e;
            font-size: 0.7rem;
            font-weight: 600;
            text-align: center;
        }
        body.public-shell .menu-search {
            margin-top: 0 !important;
        }
        body.public-shell .menu-search input {
            height: 56px;
            padding-left: 3rem;
            border: 0 !important;
            border-radius: 999px !important;
            background: #f4f4f5 !important;
            box-shadow: none !important;
            font-weight: 400 !important;
        }
        body.public-shell .menu-search svg {
            left: 1.1rem;
            width: 1.35rem;
            height: 1.35rem;
            color: #1d1d1f;
        }
        body.public-shell .menu-search .menu-search-filter {
            position: absolute;
            top: 50%;
            right: 0.65rem;
            display: grid;
            width: 2rem;
            height: 2rem;
            transform: translateY(-50%);
            border-left: 1px solid rgba(29,29,31,0.08);
            color: var(--accent);
            place-items: center;
        }
        body.public-shell .menu-search .menu-search-filter svg { position: static; width: 1.15rem; height: 1.15rem; }
        body.public-shell .menu-banner {
            border-radius: 24px;
            box-shadow: 0 10px 28px rgba(0,0,0,0.08);
        }
        body.public-shell .menu-banner img {
            height: 156px;
            border-radius: 24px;
        }
        body.public-shell .category-section {
            padding-top: 0.5rem !important;
        }
        body.public-shell .category-section > h2 {
            margin-bottom: 0.5rem !important;
            font-size: 1.25rem !important;
            line-height: 1.5rem !important;
            text-transform: none;
            letter-spacing: -0.02em;
            color: #1d1d1f;
        }
        .dark body.public-shell .category-section > h2 {
            color: #f5f5f5;
        }
        body.public-shell .category-section > h2 > span {
            display: none;
        }
        body.public-shell .category-section > .grid {
            gap: 0 !important;
            min-width: 0;
        }
        body.public-shell .category-section {
            min-width: 0;
        }
        body.public-shell .product-card {
            min-height: 124px;
            padding-top: 1rem;
            padding-bottom: 1rem;
        }
        body.public-shell .product-actions button[class~="w-8"] {
            min-width: 32px;
            min-height: 32px !important;
            font-size: 1rem !important;
            line-height: 1rem !important;
        }
        body.public-shell .product-actions > div { gap: 0.375rem !important; }
        body.public-shell .fav-btn {
            min-width: 32px;
            min-height: 32px !important;
            border-radius: 999px;
            background: rgba(255,255,255,0.94);
            box-shadow: 0 3px 12px rgba(0,0,0,0.12);
        }
        body.public-shell .product-card > .relative.flex-shrink-0 {
            align-self: stretch;
        }
        body.public-shell .product-card > .relative.flex-shrink-0 > img {
            width: 100% !important;
            height: 100% !important;
            min-height: 0;
        }
        body.public-shell input,
        body.public-shell select,
        body.public-shell textarea {
            min-height: 48px;
            font-size: 16px !important;
            line-height: 1.4;
        }
        body.public-shell textarea { min-height: 96px; }
        body.public-shell label { font-size: 12px !important; line-height: 1.35; }
        body.public-shell .fulfillment-tabs {
            display: flex;
            align-items: center;
            width: 100%;
            gap: 0.25rem;
            padding: 4px;
            border-radius: 999px;
            background: #f0f0f2;
        }
        body.public-shell .fulfillment-tab {
            flex: 1 1 0%;
            min-width: 0;
            min-height: 38px !important;
            padding: 0 0.75rem;
            border: 0 !important;
            border-radius: 999px;
            background: transparent !important;
            color: #111214 !important;
            box-shadow: none;
            font-size: 0.75rem !important;
            font-weight: 700;
            line-height: 1;
            transition: background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
        }
        body.public-shell .fulfillment-tab.is-active {
            background: #fff !important;
            box-shadow: 0 2px 7px rgba(22, 24, 29, 0.08), 0 1px 2px rgba(22, 24, 29, 0.04);
        }
        body.public-shell .fulfillment-tab:active {
            transform: scale(0.985);
        }
        .dark body.public-shell .fulfillment-tabs {
            background: #29292c;
        }
        .dark body.public-shell .fulfillment-tab {
            color: #f5f5f5 !important;
        }
        .dark body.public-shell .fulfillment-tab.is-active {
            background: #fff !important;
            color: #111214 !important;
        }
        body.public-shell .checkout-addons {
            margin-top: 0.25rem;
        }
        body.public-shell .checkout-addons-title {
            margin: 0 0 0.55rem 0.15rem;
            color: #77777c;
            font-size: 0.7rem;
            line-height: 1rem;
            font-weight: 800;
            letter-spacing: 0.045em;
            text-transform: uppercase;
        }
        body.public-shell .checkout-addons-track {
            display: flex;
            gap: 0.75rem;
            overflow-x: auto;
            padding: 0.1rem 0 0.25rem;
        }
        body.public-shell .checkout-addon-card {
            display: flex;
            align-items: center;
            flex: 0 0 calc((100% - 0.75rem) / 2);
            min-width: 0;
            height: 64px;
            gap: 0.55rem;
            padding: 0.5rem;
            overflow: hidden;
            border: 1px solid #ececef;
            border-radius: 1rem;
            background: #fff;
        }
        body.public-shell .checkout-addon-image {
            width: 42px;
            height: 42px;
            flex: 0 0 42px;
            border-radius: 0.75rem;
            object-fit: cover;
            background: #f5f5f6;
        }
        body.public-shell .checkout-addon-info {
            min-width: 0;
            flex: 1 1 auto;
        }
        body.public-shell .checkout-addon-info h4 {
            margin: 0;
            overflow: hidden;
            color: #1d1d1f;
            font-size: 0.73rem;
            line-height: 1rem;
            font-weight: 800;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        body.public-shell .checkout-addon-info p {
            margin: 0.15rem 0 0;
            color: var(--accent);
            font-size: 0.7rem;
            line-height: 0.9rem;
            font-weight: 800;
        }
        body.public-shell .checkout-addon-add {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 34px !important;
            min-width: 34px !important;
            height: 34px !important;
            min-height: 34px !important;
            flex: 0 0 34px;
            padding: 0;
            border: 0;
            border-radius: 999px;
            background: var(--accent);
            color: var(--on-accent, #fff);
            font-size: 1.15rem !important;
            font-weight: 500;
            line-height: 1;
            box-shadow: none;
            transition: filter 160ms ease, transform 160ms ease;
        }
        body.public-shell .checkout-addon-add:hover { filter: brightness(0.95); }
        body.public-shell .checkout-addon-add:active { transform: scale(0.92); }
        .dark body.public-shell .checkout-addon-card {
            border-color: #333337;
            background: #242426;
        }
        .dark body.public-shell .checkout-addon-image { background: #303034; }
        .dark body.public-shell .checkout-addon-info h4 { color: #f5f5f5; }
        body.public-shell .text-xs { font-size: 0.8125rem !important; line-height: 1.25rem; }
        body.public-shell .text-sm { font-size: 0.9375rem !important; line-height: 1.375rem; }
        body.public-shell .text-lg { font-size: 1.25rem !important; line-height: 1.5rem; }
        body.public-shell [class~="text-[8px]"],
        body.public-shell [class~="text-[9px]"],
        body.public-shell [class~="text-[10px]"] {
            font-size: 0.75rem !important;
            line-height: 1rem !important;
        }
        body.public-shell [class~="text-[11px]"] {
            font-size: 0.8125rem !important;
            line-height: 1.125rem !important;
        }
        body.public-shell [class~="text-[15px]"] {
            font-size: 1rem !important;
            line-height: 1.25rem !important;
        }
        body.public-shell [class~="rounded-xl"] { border-radius: 16px; }
        body.public-shell [class~="rounded-3xl"] { border-radius: 20px; }
        body.public-shell > nav {
            left: 50%;
            right: auto;
            bottom: 0;
            width: 100%;
            max-width: 28rem;
            transform: translateX(-50%);
            border-radius: 0;
            border-left: 0;
            border-right: 0;
            border-bottom: 0;
            padding: 0 0 env(safe-area-inset-bottom) !important;
            box-shadow: 0 -4px 18px rgba(0,0,0,0.06);
        }
        body.public-shell > nav > div {
            min-height: 64px;
        }
        body.public-shell .pub-nav-btn {
            min-height: 64px;
            gap: 0.125rem;
        }
        body.public-shell .pub-nav-btn .icon-wrapper {
            width: 2rem;
            height: 2rem;
            border-radius: 0.75rem;
        }
        body.public-shell #settings-sheet,
        body.public-shell #cart-modal-sheet { max-height: 92vh; }
        .dark body.public-shell .cat-btn .cat-icon {
            background: #242424;
            border-color: #2a2a2a;
        }
        .dark body.public-shell .cat-btn span { color: #f5f5f5; }
        .dark body.public-shell .cat-btn.cat-active .cat-icon {
            border-color: var(--accent);
            background: color-mix(in srgb, var(--accent) 14.9%, transparent);
        }
        .dark body.public-shell .cat-btn.cat-active span { color: var(--accent); }
        .dark body.public-shell .menu-address-value { color: #f5f5f5; }
        .dark body.public-shell .menu-cart-button {
            border-color: #35353a;
            background: #242426;
            color: #d4d4d8;
        }
        .dark body.public-shell .menu-establishment-logo {
            border-color: #35353a;
            background: #242426;
        }
        .hide-scrollbar::-webkit-scrollbar { display: none; }
        .hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
        .fade-in { animation: fadeIn 0.3s ease-out; }
        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
        /* Leaflet map inside checkout modal */
        #checkout-map { height: 280px; width: 100%; position: relative; z-index: 0; }
        .leaflet-pane, .leaflet-top, .leaflet-bottom { z-index: 1 !important; }
        .leaflet-control-zoom, .leaflet-control-attribution { display: none !important; }
        /* Custom orange marker pulse */
        .map-pin-pulse {
            width: 18px; height: 18px;
            background: var(--accent);
            border: 3px solid white;
            border-radius: 50%;
            position: relative;
            box-shadow: 0 2px 8px rgba(0,0,0,0.15);
        }
        @keyframes pulse-ring {
            0% { transform: scale(0.65); opacity: 0.8; }
            50% { transform: scale(1.3); opacity: 0.45; }
            100% { transform: scale(1.8); opacity: 0; }
        }
        .map-pin-pulse::after {
            content: '';
            position: absolute;
            top: -9px; left: -9px; right: -9px; bottom: -9px;
            border-radius: 50%;
            border: 8px solid rgba(255,122,69,0.4);
            animation: pulse-ring 2s cubic-bezier(0.215, 0.610, 0.355, 1) infinite;
            pointer-events: none;
        }
        /* CEP spinner */
        @keyframes spin { to { transform: rotate(360deg); } }
        .cep-spinner { animation: spin 0.8s linear infinite; }
        /* Bottom nav (public) */
        .pub-nav-btn { color: #7e7e7e; transition: all 0.2s ease; }
        .pub-nav-btn .icon-wrapper { background-color: transparent; color: #7e7e7e; transition: all 0.2s ease; }
        .pub-nav-active { color: var(--accent) !important; }
        .pub-nav-active .icon-wrapper { background-color: transparent; color: var(--accent) !important; }
        .pub-nav-active span { color: var(--accent) !important; font-weight: 700; }

        /* Keep the original list treatment; only normalize the dimensions. */
        body.public-shell .product-card {
            box-sizing: border-box;
            min-height: 128px !important;
            height: 128px !important;
            width: 100%;
            min-width: 0;
            max-width: 100%;
            padding: 12px 0 !important;
            align-items: stretch;
        }
        body.public-shell .product-card > .flex-1 {
            display: flex;
            flex-direction: column;
            justify-content: center;
            min-width: 0;
        }
        body.public-shell .product-image-wrap {
            width: 112px !important;
            height: 104px !important;
            align-self: center !important;
        }
        body.public-shell .product-card-image {
            width: 112px !important;
            height: 104px !important;
            min-height: 0 !important;
            aspect-ratio: 1;
            object-fit: cover;
            border-radius: 18px !important;
        }
        body.public-shell .product-actions--overlay {
            position: absolute;
            left: 2px;
            right: 2px;
            bottom: 2px;
            z-index: 2;
            display: flex;
            justify-content: flex-end;
        }
        body.public-shell .product-actions--overlay > div {
            display: flex;
            align-items: center;
            gap: 4px !important;
            padding: 4px;
            border: 1px solid rgba(255, 255, 255, 0.85);
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.92);
            box-shadow: 0 5px 14px rgba(16, 24, 40, 0.16);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
        }
        body.public-shell .product-actions--overlay button {
            width: 34px !important;
            min-width: 34px !important;
            height: 34px !important;
            min-height: 34px !important;
            border-radius: 999px !important;
            line-height: 1 !important;
        }
        body.public-shell .product-featured-flame {
            display: inline-flex;
            font-size: 0.9rem;
            line-height: 1;
            flex-shrink: 0;
        }
        body.public-shell .detail-favorite-active {
            color: #ef4444 !important;
            border-color: color-mix(in srgb, #ef4444 22%, white) !important;
            background: color-mix(in srgb, #ef4444 7%, white) !important;
        }
        .dark body.public-shell .product-actions--overlay > div {
            border-color: rgba(28, 28, 30, 0.88);
            background: rgba(28, 28, 30, 0.92);
        }
        @media (max-width: 380px) {
            body.public-shell .product-card {
                min-height: 116px !important;
                height: 116px !important;
                padding: 10px 0 !important;
            }
            body.public-shell .product-image-wrap,
            body.public-shell .product-card-image {
                width: 104px !important;
                height: 96px !important;
            }
        }

        /* Product modifier choices */
        body.public-shell .detail-modifier-group {
            padding: 0.85rem;
            border: 1px solid color-mix(in srgb, var(--accent) 16%, #e5e7eb);
            border-radius: 20px;
            background: color-mix(in srgb, var(--accent) 4%, white);
        }
        body.public-shell .detail-modifier-group-heading {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 0.75rem;
            margin-bottom: 0.65rem;
        }
        body.public-shell .detail-modifier-group-heading strong {
            color: var(--charcoal, #1a1a1a);
            font-size: 0.78rem;
            line-height: 1rem;
        }
        body.public-shell .detail-modifier-group-heading small {
            color: var(--muted, #7e7e7e);
            font-size: 0.62rem;
            line-height: 0.85rem;
            text-align: right;
        }
        body.public-shell .detail-modifier-options {
            display: flex;
            flex-direction: column;
            gap: 0.45rem;
        }
        body.public-shell .detail-modifier-option {
            display: flex;
            width: 100%;
            padding: 0.7rem 0.75rem;
            border: 1px solid #e5e7eb;
            border-radius: 14px;
            background: #fff;
            color: var(--charcoal, #1a1a1a);
            text-align: left;
            align-items: center;
            justify-content: space-between;
            gap: 0.75rem;
            transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
        }
        body.public-shell .detail-modifier-option:active { transform: scale(0.985); }
        body.public-shell .detail-modifier-option.is-selected {
            border-color: var(--accent);
            background: color-mix(in srgb, var(--accent) 9%, white);
        }
        body.public-shell .detail-modifier-option-copy { display: flex; min-width: 0; flex-direction: column; gap: 0.18rem; }
        body.public-shell .detail-modifier-option-copy strong { overflow: hidden; font-size: 0.72rem; line-height: 0.95rem; text-overflow: ellipsis; white-space: nowrap; }
        body.public-shell .detail-modifier-option-copy small { color: var(--muted, #7e7e7e); font-size: 0.62rem; line-height: 0.8rem; }
        body.public-shell .detail-modifier-option-check { display: grid; width: 1.65rem; height: 1.65rem; flex: 0 0 1.65rem; border: 1px solid #d1d5db; border-radius: 999px; color: #9ca3af; font-size: 0.8rem; font-weight: 800; place-items: center; }
        body.public-shell .detail-modifier-option.is-selected .detail-modifier-option-check { border-color: var(--accent); background: var(--accent); color: var(--on-accent, #fff); }
        body.public-shell #detail-add-btn:disabled {
            cursor: not-allowed;
            opacity: 0.45;
        }
        body.public-shell #custom-checkout-submit-btn:disabled {
            cursor: not-allowed;
            opacity: 0.45;
        }
        body.public-shell .public-order-success-title { color: #1a1a1a; }
        .dark body.public-shell .public-order-success-title { color: #f5f5f7; }
        .dark body.public-shell .detail-modifier-group { border-color: color-mix(in srgb, var(--accent) 22%, #3f3f46); background: color-mix(in srgb, var(--accent) 7%, #242426); }
        .dark body.public-shell .detail-modifier-group-heading strong { color: #f5f5f7; }
        .dark body.public-shell .detail-modifier-group-heading small { color: #b4b4bc; }
        .dark body.public-shell .detail-modifier-option { border-color: #3f3f46; background: #2a2a2d; color: #f4f4f5; }
        .dark body.public-shell .detail-modifier-option-copy strong { color: #f5f5f7; }
        .dark body.public-shell .detail-modifier-option-copy small { color: #b4b4bc; }
        .dark body.public-shell .detail-modifier-option-check { border-color: #5b5b63; color: #b9bac2; background: #242428; }
        .dark body.public-shell .detail-modifier-option.is-selected { background: color-mix(in srgb, var(--accent) 17%, #2a2a2d); }

        /* Coupons, automatic offers and explicit marketing consent */
        body.public-shell .checkout-coupon-box {
            display: grid;
            gap: 0.55rem;
            padding: 0.85rem;
            border: 1px dashed color-mix(in srgb, var(--accent) 28%, #d1d5db);
            border-radius: 18px;
            background: color-mix(in srgb, var(--accent) 4%, white);
        }
        body.public-shell .checkout-coupon-box > span {
            color: var(--charcoal, #1a1a1a);
            font-size: 0.68rem;
            font-weight: 800;
        }
        body.public-shell .checkout-coupon-fields {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 0.5rem;
        }
        body.public-shell .checkout-coupon-fields input {
            min-width: 0;
            padding: 0.7rem 0.8rem;
            border: 1px solid #e5e7eb;
            border-radius: 13px;
            background: white;
            color: var(--charcoal, #1a1a1a);
            font-size: 0.72rem;
            font-weight: 750;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            outline: none;
        }
        body.public-shell .checkout-coupon-fields input:focus {
            border-color: var(--accent);
            box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
        }
        body.public-shell .checkout-coupon-fields button {
            padding: 0.7rem 0.9rem;
            border-radius: 13px;
            background: var(--accent);
            color: var(--on-accent, #fff);
            font-size: 0.68rem;
            font-weight: 850;
        }
        body.public-shell .checkout-coupon-fields button:disabled {
            cursor: wait;
            opacity: 0.58;
        }
        body.public-shell .checkout-coupon-message {
            min-height: 0;
            color: var(--muted, #7e7e7e);
            font-size: 0.62rem;
            font-weight: 650;
            line-height: 0.9rem;
        }
        body.public-shell .checkout-coupon-message:empty {
            display: none;
        }
        body.public-shell .checkout-coupon-message:not(:empty) {
            min-height: 0.9rem;
        }
        body.public-shell .checkout-coupon-message[data-state="success"] { color: #15803d; }
        body.public-shell .checkout-coupon-message[data-state="error"] { color: #b91c1c; }

        /* Coupon entry button ("N cupons disponíveis para você!") */
        body.public-shell .coupon-entry-btn {
            display: flex;
            align-items: center;
            gap: 0.6rem;
            width: 100%;
            padding: 0.8rem 0.95rem;
            border: 1.5px dashed color-mix(in srgb, var(--accent) 42%, #d1d5db);
            border-radius: 18px;
            background: color-mix(in srgb, var(--accent) 5%, white);
            color: var(--charcoal, #1a1a1a);
            font-size: 0.72rem;
            font-weight: 800;
            transition: transform 0.15s ease, background 0.2s ease, border-color 0.2s ease;
        }
        body.public-shell .coupon-entry-btn[hidden],
        body.public-shell .coupon-applied-chip[hidden] {
            display: none !important;
        }
        body.public-shell .coupon-entry-btn:active { transform: scale(0.98); }
        body.public-shell .coupon-entry-btn:hover {
            background: color-mix(in srgb, var(--accent) 9%, white);
            border-color: color-mix(in srgb, var(--accent) 58%, #d1d5db);
        }
        body.public-shell .coupon-entry-icon { font-size: 1.05rem; line-height: 1; }
        body.public-shell .coupon-entry-chevron {
            color: var(--accent);
            font-size: 1.15rem;
            font-weight: 800;
            line-height: 1;
        }

        /* Applied coupon chip */
        body.public-shell .coupon-applied-chip {
            display: flex;
            align-items: center;
            gap: 0.6rem;
            width: 100%;
            padding: 0.7rem 0.85rem;
            border: 1px solid color-mix(in srgb, var(--accent) 30%, #e5e7eb);
            border-radius: 18px;
            background: color-mix(in srgb, var(--accent) 8%, white);
        }
        body.public-shell .coupon-applied-chip-icon { font-size: 1.05rem; line-height: 1; }
        body.public-shell .coupon-applied-chip-text {
            flex: 1;
            min-width: 0;
            display: flex;
            flex-direction: column;
            gap: 1px;
        }
        body.public-shell .coupon-applied-chip-text strong {
            color: var(--charcoal, #1a1a1a);
            font-size: 0.72rem;
            font-weight: 800;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        body.public-shell .coupon-applied-chip-text small {
            color: #15803d;
            font-size: 0.62rem;
            font-weight: 700;
        }
        body.public-shell .coupon-applied-chip > button {
            width: 1.6rem;
            height: 1.6rem;
            border-radius: 999px;
            background: rgba(0,0,0,0.05);
            color: var(--charcoal, #1a1a1a);
            font-size: 0.62rem;
            font-weight: 800;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: transform 0.15s ease, background 0.2s ease;
        }
        body.public-shell .coupon-applied-chip > button:active { transform: scale(0.88); }

        /* Coupon drawer items */
        body.public-shell .coupon-item {
            display: flex;
            align-items: flex-start;
            gap: 0.7rem;
            width: 100%;
            padding: 0.9rem;
            border: 1px solid #ececf1;
            border-radius: 20px;
            background: #fafafa;
            text-align: left;
            transition: transform 0.15s ease, border-color 0.2s ease, background 0.2s ease;
        }
        body.public-shell .coupon-item:active { transform: scale(0.98); }
        body.public-shell .coupon-item:hover { border-color: color-mix(in srgb, var(--accent) 40%, #ececf1); }
        body.public-shell .coupon-item:disabled { opacity: 0.55; cursor: wait; }
        body.public-shell .coupon-item-icon {
            font-size: 1.35rem;
            line-height: 1;
            padding-top: 0.1rem;
        }
        body.public-shell .coupon-item-body {
            flex: 1;
            min-width: 0;
        }
        body.public-shell .coupon-item-use {
            flex-shrink: 0;
            align-self: center;
            padding: 0.42rem 0.8rem;
            border-radius: 999px;
            background: var(--accent);
            color: var(--on-accent, #fff);
            font-size: 0.62rem;
            font-weight: 850;
        }

        /* Coupon applied popup ("Eba! Cupom Aplicado") */
        body.public-shell .coupon-popup-card {
            transform: scale(0.72) translateY(14px);
            opacity: 0;
            transition: transform 0.38s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.24s ease;
        }
        body.public-shell .coupon-popup-card.is-visible {
            transform: scale(1) translateY(0);
            opacity: 1;
        }
        body.public-shell .coupon-popup-emoji {
            position: absolute;
            top: -1.9rem;
            left: 50%;
            transform: translateX(-50%);
            width: 3.8rem;
            height: 3.8rem;
            border-radius: 999px;
            background: white;
            box-shadow: 0 10px 26px rgba(0,0,0,0.14);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 2rem;
            line-height: 1;
        }
        body.public-shell .coupon-popup-card.is-visible .coupon-popup-emoji {
            animation: couponEmojiPop 0.55s cubic-bezier(0.34, 1.56, 0.64, 1);
        }
        @keyframes couponEmojiPop {
            0% { transform: translateX(-50%) scale(0) rotate(-24deg); }
            70% { transform: translateX(-50%) scale(1.12) rotate(6deg); }
            100% { transform: translateX(-50%) scale(1) rotate(0deg); }
        }
        body.public-shell .checkout-discount-row {
            color: #15803d;
            font-weight: 800;
        }
        body.public-shell .checkout-marketing-consent {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            padding: 0.85rem;
            border: 1px solid color-mix(in srgb, var(--accent) 18%, #e5e7eb);
            border-radius: 16px;
            background: color-mix(in srgb, var(--accent) 3%, white);
            color: var(--muted, #6b7280);
            cursor: pointer;
            font-size: 0.75rem;
            line-height: 1.2rem;
            transition: all 0.2s ease;
        }
        body.public-shell .checkout-marketing-consent:hover {
            border-color: color-mix(in srgb, var(--accent) 35%, #e5e7eb);
            background: color-mix(in srgb, var(--accent) 6%, white);
        }
        body.public-shell .checkout-marketing-consent input {
            display: none;
        }
        body.public-shell .checkout-marketing-consent .toggle-switch {
            position: relative;
            width: 2.5rem;
            height: 1.4rem;
            flex: 0 0 2.5rem;
            border-radius: 999px;
            background: #d1d5db;
            transition: background-color 0.2s ease;
        }
        body.public-shell .checkout-marketing-consent .toggle-switch::after {
            content: '';
            position: absolute;
            top: 0.15rem;
            left: 0.15rem;
            width: 1.1rem;
            height: 1.1rem;
            border-radius: 50%;
            background: white;
            box-shadow: 0 2px 4px rgba(0,0,0,0.2);
            transition: transform 0.2s ease;
        }
        body.public-shell .checkout-marketing-consent input:checked + .toggle-switch {
            background: var(--accent);
        }
        body.public-shell .checkout-marketing-consent input:checked + .toggle-switch::after {
            transform: translateX(1.1rem);
        }
        body.public-shell .checkout-marketing-consent span {
            display: flex;
            flex-direction: column;
            gap: 0.15rem;
            flex: 1;
        }
        body.public-shell .checkout-marketing-consent strong { 
            color: var(--charcoal, #1a1a1a); 
            font-size: 0.82rem;
            font-weight: 700;
        }
        .dark body.public-shell .checkout-marketing-consent strong {
            color: #f5f5f5;
        }
        body.public-shell .checkout-marketing-consent small { 
            margin-top: 0; 
            font-size: 0.7rem;
            line-height: 1rem;
        }
        .dark body.public-shell .checkout-marketing-consent {
            border-color: color-mix(in srgb, var(--accent) 25%, #3f3f46);
            background: color-mix(in srgb, var(--accent) 8%, #242426);
            color: #b4b4bc;
        }
        .dark body.public-shell .checkout-marketing-consent:hover {
            border-color: color-mix(in srgb, var(--accent) 40%, #3f3f46);
            background: color-mix(in srgb, var(--accent) 12%, #242426);
        }
        body.public-shell #custom-step2-discount {
            margin-top: 0.25rem;
            color: #15803d;
            font-size: 0.62rem;
            font-weight: 800;
        }
        .dark body.public-shell .checkout-coupon-box {
            border-color: color-mix(in srgb, var(--accent) 35%, #52525b);
            background: color-mix(in srgb, var(--accent) 8%, #242426);
        }
        .dark body.public-shell .checkout-coupon-box > span,
        .dark body.public-shell .checkout-coupon-fields input { color: #f5f5f7; }
        .dark body.public-shell .checkout-marketing-consent strong { color: #f5f5f7; }
        .dark body.public-shell .checkout-coupon-fields input {
            border-color: #3f3f46;
            background: #2a2a2d;
        }
        .dark body.public-shell .checkout-coupon-message[data-state="success"],
        .dark body.public-shell .checkout-discount-row,
        .dark body.public-shell #custom-step2-discount { color: #4ade80; }
        .dark body.public-shell .checkout-coupon-message[data-state="error"] { color: #f87171; }

        /* Coupons drawer/entry/popup — dark mode */
        .dark body.public-shell .coupon-entry-btn {
            border-color: color-mix(in srgb, var(--accent) 45%, #52525b);
            background: color-mix(in srgb, var(--accent) 10%, #242426);
            color: #f5f5f7;
        }
        .dark body.public-shell .coupon-entry-btn:hover {
            background: color-mix(in srgb, var(--accent) 15%, #242426);
            border-color: color-mix(in srgb, var(--accent) 60%, #52525b);
        }
        .dark body.public-shell .coupon-applied-chip {
            border-color: color-mix(in srgb, var(--accent) 35%, #3f3f46);
            background: color-mix(in srgb, var(--accent) 12%, #242426);
        }
        .dark body.public-shell .coupon-applied-chip-text strong { color: #f5f5f7; }
        .dark body.public-shell .coupon-applied-chip-text small { color: #4ade80; }
        .dark body.public-shell .coupon-applied-chip > button {
            background: rgba(255,255,255,0.08);
            color: #f5f5f7;
        }
        .dark body.public-shell .coupon-item {
            border-color: #3f3f46;
            background: #242426;
        }
        .dark body.public-shell .coupon-item:hover { border-color: color-mix(in srgb, var(--accent) 45%, #3f3f46); }
        .dark body.public-shell .coupon-popup-emoji { background: #2a2a2d; }