.menu-smash-pass {
    width: 100%;
    max-width: 100%;
}

.menu-smash-pass__error,
.menu-smash-pass__empty {
    text-align: center;
    font-size: 0.88rem;
    color: color-mix(in srgb, var(--main-text) 78%, transparent);
    margin: 0.5rem 0;
}

.menu-smash-pass__error {
    color: var(--scheme-accent-2);
}

.menu-smash-pass__reel.hidden,
.menu-smash-pass__error.hidden,
.menu-smash-pass__empty.hidden,
.menu-smash-pass__empty-state.hidden,
.menu-smash-pass__vote-hint.hidden,
.menu-smash-pass__actions.hidden {
    display: none;
}

.menu-smash-pass__empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    box-sizing: border-box;
    border-radius: 1rem;
    background: color-mix(in srgb, var(--scheme-black) 35%, transparent);
    border: 1px dashed color-mix(in srgb, var(--scheme-white) 22%, transparent);
    text-align: center;
    padding: 1rem;
}

.menu-smash-pass__empty-hint {
    margin: 0;
    max-width: 14em;
    font-size: 0.78rem;
    line-height: 1.35;
    color: color-mix(in srgb, var(--scheme-white) 55%, transparent);
}

.menu-smash-pass__empty-state .menu-image-actions--standalone {
    position: static;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    pointer-events: auto;
    border: none;
}

.menu-smash-pass__empty-state .menu-image-add-btn {
    --chip-accent: var(--selected-button-color3);
    --chip-accent-deep: var(--selected-button-color2);
    width: auto;
    height: auto;
    min-height: 2.25rem;
    padding: 0.5em 1em;
    gap: 0.5em;
    font-size: 0.85rem;
    line-height: 1.2;
    border-radius: 999px;
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--chip-accent-deep) 88%, var(--scheme-white)) 0%,
        color-mix(in srgb, var(--chip-accent) 75%, var(--scheme-white)) 100%
    );
    border: 1.5px solid color-mix(in srgb, var(--chip-accent) 55%, var(--scheme-white));
    color: var(--scheme-ink-muted);
    box-shadow: 0 4px 14px color-mix(in srgb, var(--chip-accent-deep) 35%, transparent);
}

.menu-smash-pass__empty-state .menu-image-add-btn:hover {
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--chip-accent-deep) 78%, var(--scheme-white)) 0%,
        color-mix(in srgb, var(--chip-accent) 88%, var(--scheme-white)) 100%
    );
    color: var(--scheme-ink-muted);
    transform: none;
}

.menu-smash-pass__empty-state .menu-image-add-btn .fa {
    font-size: 0.95rem;
}

.menu-smash-pass__empty-state .menu-image-add-btn__label {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    overflow: visible;
    clip: auto;
    white-space: nowrap;
}

.menu-smash-pass__empty-state--community {
    flex: 1 1 auto;
    min-height: 0;
    width: min(100%, 22rem);
    max-width: 22rem;
    margin-inline: auto;
    padding: 1.6rem 1.25rem 1.45rem;
    gap: 0.7rem;
    justify-content: center;
    border-radius: 1.35rem;
    border: 1.5px dashed color-mix(in srgb, var(--hero-border-color, var(--scheme-white)) 55%, transparent);
    background:
        linear-gradient(
            165deg,
            color-mix(in srgb, var(--scheme-button-bg, var(--scheme-accent)) 22%, color-mix(in srgb, var(--scheme-black) 78%, transparent)) 0%,
            color-mix(in srgb, var(--scheme-black) 78%, transparent) 100%
        );
    box-shadow:
        0 1px 0 color-mix(in srgb, var(--scheme-white) 12%, transparent) inset,
        0 14px 32px color-mix(in srgb, var(--scheme-black) 38%, transparent);
}

.menu-smash-pass__empty-visual {
    display: flex;
    align-items: center;
    justify-content: center;
}

.menu-smash-pass__empty-icon {
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--scheme-white);
    background:
        radial-gradient(circle at 30% 25%, color-mix(in srgb, var(--scheme-white) 42%, transparent), transparent 50%),
        linear-gradient(160deg, var(--scheme-button-bg, var(--scheme-accent)) 0%, var(--scheme-accent) 100%);
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--scheme-white) 32%, transparent) inset,
        0 0 22px color-mix(in srgb, var(--scheme-button-bg, var(--scheme-accent)) 45%, transparent);
    font-size: 1.7rem;
}

.menu-smash-pass__empty-title {
    margin: 0;
    font-size: clamp(1.45rem, 6vw, 1.85rem);
    font-weight: 800;
    letter-spacing: 0.02em;
    line-height: 1.15;
    color: var(--hero-text-color, var(--scheme-white));
}

.menu-smash-pass__empty-lead {
    margin: 0;
    max-width: 16rem;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
    color: var(--hero-text-color, var(--scheme-white));
}

.menu-smash-pass__empty-state--community .menu-smash-pass__empty-hint {
    max-width: 17rem;
    font-size: 0.86rem;
    line-height: 1.45;
    color: color-mix(in srgb, var(--hero-text-color, var(--scheme-white)) 72%, transparent);
}

.menu-smash-pass__empty-cta.menu-add-photo-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    width: auto;
    height: auto;
    min-height: 2.85rem;
    margin-top: 0.35rem;
    padding: 0.7rem 1.25rem;
    border-radius: 999px;
    border: 1.5px solid color-mix(in srgb, var(--hero-border-color, var(--scheme-white)) 60%, transparent);
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--scheme-button-bg, var(--scheme-accent)) 88%, var(--scheme-white)) 0%,
        color-mix(in srgb, var(--scheme-accent) 75%, var(--scheme-white)) 100%
    );
    color: var(--scheme-ink-muted, #1a1a1a);
    font: inherit;
    font-size: 0.95rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    cursor: pointer;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--scheme-black) 32%, transparent);
}

.menu-smash-pass__empty-cta:hover,
.menu-smash-pass__empty-cta:focus-visible {
    transform: translateY(-1px);
    outline: none;
}

.menu-smash-pass__empty-cta-icon {
    display: inline-flex;
    font-size: 1rem;
}

.menu-smash-pass__empty-cta-label {
    white-space: nowrap;
}

.menu-smash-pass__progress {
    text-align: center;
    margin: 0 0 0.45rem;
    font-size: 0.75rem !important;
    color: color-mix(in srgb, var(--main-text) 65%, transparent);
}

.menu-smash-pass__vote-hint {
    text-align: center;
    margin: 0 0 0.35rem;
    font-size: 0.72rem;
    line-height: 1.3;
    color: color-mix(in srgb, var(--main-text) 52%, transparent);
    flex-shrink: 0;
}

.menu-smash-pass__stack {
    position: relative;
    width: 100%;
    max-width: 18rem;
    margin-inline: auto;
    aspect-ratio: 3 / 4;
    min-height: 0;
    max-height: 100%;
    touch-action: pan-y;
    user-select: none;
}

.menu-smash-pass-card {
    position: absolute;
    inset: 0;
    border-radius: 1rem;
    max-width: calc(100vw - 1em);
    margin: .5em auto;
    overflow: hidden;
    background: var(--scheme-black);
    box-shadow: 3px 3px 5px color-mix(in srgb, var(--scheme-black) 38%, transparent);
    border: 3px solid color-mix(in srgb, var(--scheme-white) 14%, transparent);
    cursor: grab;
    touch-action: pan-y;
    will-change: transform;
    transition: transform 0.28s ease, opacity 0.28s ease;
    display: flex;
    flex-direction: column;
}

.menu-smash-pass-card.is-unrated {
    border-color: color-mix(in srgb, var(--scheme-button-bg) 45%, transparent);
}

.menu-smash-pass-card.is-rated-smash {
    border-color: color-mix(in srgb, var(--scheme-accent) 55%, transparent);
}

.menu-smash-pass-card.is-rated-pass {
    border-color: color-mix(in srgb, var(--scheme-accent-2) 55%, transparent);
}

.menu-smash-pass-card.is-behind {
    transform: scale(0.94) translateY(8px);
    opacity: 0.55;
    z-index: 1;
    pointer-events: none;
}

.menu-smash-pass-card.is-top {
    z-index: 2;
}

.menu-smash-pass-card.is-dragging {
    cursor: grabbing;
    transition: none;
}

.menu-smash-pass-card.is-snapping-back {
    transition: transform 0.28s cubic-bezier(0.34, 1.4, 0.64, 1);
}

.menu-smash-pass-card.is-exiting {
    pointer-events: none;
    transition: transform 0.32s ease-out, opacity 0.32s ease-out;
}

.menu-smash-pass-card.is-exit-smash {
    transform: translate(115%, -6%) rotate(14deg) !important;
    opacity: 0;
}

.menu-smash-pass-card.is-exit-pass {
    transform: translate(-115%, -6%) rotate(-14deg) !important;
    opacity: 0;
}

.menu-smash-pass-card__stamp {
    position: absolute;
    top: 1rem;
    z-index: 4;
    padding: 0.3rem 0.6rem;
    border-radius: 8px;
    font-size: large;
    font-weight: 800;
    letter-spacing: 0.08em;
    border: 3px solid currentColor;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.12s ease;
}

.menu-smash-pass-card__stamp--smash {
    left: 0.85rem;
    background: var(--scheme-accent);
    color: var(--scheme-white);
    border-color: var(--scheme-accent);
    transform: rotate(-12deg);
    opacity: var(--smash-stamp-opacity, 0);
}

.menu-smash-pass-card__stamp--pass {
    right: 0.85rem;
    color: var(--scheme-white);
    background: var(--scheme-accent-2);
    border-color: var(--scheme-accent-2);
    transform: rotate(12deg);
    opacity: var(--pass-stamp-opacity, 0);
}

.menu-smash-pass-card__media {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    background: var(--scheme-black);
    cursor: grab;
}

.menu-smash-pass-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    pointer-events: none;
}

.menu-smash-pass-card__info {
    flex-shrink: 0;
    position: relative;
    pointer-events: none;
    z-index: 3;
    padding: 0.55rem 3rem 0.6rem;
    background: linear-gradient(transparent, color-mix(in srgb, var(--scheme-black) 82%, transparent));
    color: var(--scheme-white);
}

.menu-smash-pass-card__title {
    margin: 0 0 0.1rem;
    font-size: 0.92rem;
    font-weight: 700;
    text-transform: capitalize;
}

.menu-smash-pass-card__title-link {
    color: inherit;
    text-decoration: none;
    position: relative;
    z-index: 2;
}

.menu-smash-pass-card__title-link:hover,
.menu-smash-pass-card__title-link:focus-visible {
    color: var(--scheme-button-bg);
    text-decoration: underline;
    outline: none;
}

.menu-smash-pass-card__counts {
    display: flex;
    gap: .25em;
    text-wrap-mode: nowrap;
    position: absolute;
    bottom: 0em;
    right: 0em;
    background: color-mix(in srgb, var(--scheme-black) 87%, transparent);
    padding: .2em 0.5em;
    width: -webkit-fill-available;
    font-size: medium;
    justify-content: space-between;
    flex-direction: row-reverse;
}

.menu-smash-pass-card__counts span {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    width: max-content;
}

button.menu-smash-pass-card__dislikes {
    border: none;
    background: transparent;
    color: var(--scheme-accent-deep);
    text-shadow: -1px -1px color-mix(in srgb, var(--scheme-black) 67%, transparent), 1px 1px color-mix(in srgb, var(--scheme-black) 67%, transparent),1px -1px color-mix(in srgb, var(--scheme-black) 67%, transparent), -1px 1px color-mix(in srgb, var(--scheme-black) 67%, transparent);
    font: inherit;
    font-size: inherit;
    font-weight: bolder;
    line-height: inherit;
    pointer-events: all;
    cursor: pointer;
    padding: 0;
    -webkit-tap-highlight-color: transparent;
}

button.menu-smash-pass-card__dislikes:hover,
button.menu-smash-pass-card__dislikes:focus-visible {
    color: var(--scheme-accent-2);
    outline: none;
    text-decoration: underline;
}

button.menu-smash-pass-card__dislikes:disabled {
    opacity: 0.55;
    cursor: wait;
}

.menu-smash-pass__actions {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 0.65rem;
    flex-shrink: 0;
}

.menu-smash-pass__btn {
    min-width: 6.5rem;
    justify-content: center;
    gap: 0.45em;
    padding: 0.55em 0.9em;
    color: var(--scheme-white);
    border-color: color-mix(in srgb, var(--scheme-white) 28%, transparent);
}

.menu-smash-pass__btn .contact-cta__icon {
    width: 2rem;
    height: 2rem;
    background: color-mix(in srgb, var(--scheme-white) 20%, transparent);
    color: var(--scheme-white);
}

.menu-smash-pass__btn .contact-cta__title {
    color: var(--scheme-white);
}

.menu-smash-pass__btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none;
}

.menu-smash-pass__btn--pass {
    background: linear-gradient(135deg, var(--scheme-accent-deep) 0%, var(--scheme-accent-deep) 100%);
    border-color: var(--scheme-accent-2);
    color: var(--scheme-white);
    box-shadow: 0 4px 16px color-mix(in srgb, var(--scheme-accent-deep) 35%, transparent), 0 0 0 1px color-mix(in srgb, var(--scheme-white) 12%, transparent) inset;
}

.menu-smash-pass__btn--pass:hover,
.menu-smash-pass__btn--pass:focus-visible {
    background: linear-gradient(135deg, var(--scheme-accent-deep) 0%, var(--scheme-accent-2) 100%);
    border-color: var(--scheme-accent-2);
    color: var(--scheme-white);
    box-shadow: 0 6px 20px color-mix(in srgb, var(--scheme-accent-deep) 45%, transparent), 0 0 0 1px color-mix(in srgb, var(--scheme-white) 20%, transparent) inset;
}

.menu-smash-pass__btn--smash {
    background: linear-gradient(135deg, var(--scheme-accent) 0%, var(--scheme-accent) 100%);
    border-color: var(--scheme-accent);
    color: var(--scheme-white);
    box-shadow: 0 4px 16px color-mix(in srgb, var(--scheme-accent) 35%, transparent), 0 0 0 1px color-mix(in srgb, var(--scheme-white) 12%, transparent) inset;
}

.menu-smash-pass__btn--smash:hover,
.menu-smash-pass__btn--smash:focus-visible {
    background: linear-gradient(135deg, var(--scheme-accent) 0%, var(--scheme-accent) 100%);
    border-color: var(--scheme-accent);
    color: var(--scheme-white);
    box-shadow: 0 6px 20px color-mix(in srgb, var(--scheme-accent) 45%, transparent), 0 0 0 1px color-mix(in srgb, var(--scheme-white) 20%, transparent) inset;
}

.hero-content .menu-smash-pass__empty,
.hero-content .menu-smash-pass__empty-state {
    color: color-mix(in srgb, var(--hero-text-color) 78%, transparent);
    border-color: color-mix(in srgb, var(--hero-border-color) 40%, transparent);
}

.hero-content .menu-smash-pass-card {
    border-color: color-mix(in srgb, var(--hero-border-color) 35%, transparent);
}

.hero-content .menu-smash-pass__btn,
.hero-content .menu-smash-pass__btn--pass,
.hero-content .menu-smash-pass__btn--smash,
.hero-content .menu-smash-pass__btn--pass:hover,
.hero-content .menu-smash-pass__btn--pass:focus-visible,
.hero-content .menu-smash-pass__btn--smash:hover,
.hero-content .menu-smash-pass__btn--smash:focus-visible {
    border-color: var(--hero-border-color);
}

.hero-content .menu-smash-pass__btn--pass .contact-cta__icon,
.hero-content .menu-smash-pass__btn--smash .contact-cta__icon,
.menu-smash-pass__btn--pass .contact-cta__icon,
.menu-smash-pass__btn--smash .contact-cta__icon {
    background: color-mix(in srgb, var(--scheme-white) 22%, transparent);
    color: var(--scheme-white);
}

.hero-content .menu-smash-pass__btn--pass .contact-cta__title,
.hero-content .menu-smash-pass__btn--smash .contact-cta__title,
.menu-smash-pass__btn--pass .contact-cta__title,
.menu-smash-pass__btn--smash .contact-cta__title {
    color: var(--scheme-white);
}

/* Intro reel slide: stack + actions + share in one viewport */
.hero-content.menu-reels-slide--intro .menu-smash-pass__reel:not(.hidden) {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.hero-content.menu-reels-slide--intro .menu-smash-pass__progress {
    flex-shrink: 0;
    margin: 0 0 0.25rem;
    font-size: 0.68rem !important;
}

.hero-content.menu-reels-slide--intro .menu-smash-pass__vote-hint {
    margin: 0 0 0.2rem;
    font-size: 0.66rem;
}

.hero-content.menu-reels-slide--intro .menu-smash-pass__stack {
    flex: 1 1 auto;
    min-height: 0;
    width: min(90vw, 20rem);
    max-width: 20rem;
    height: 100%;
    max-height: 100%;
    aspect-ratio: unset;
}

.hero-content.menu-reels-slide--intro .menu-smash-pass-card__title {
    font-size: 0.82rem;
}

.hero-content.menu-reels-slide--intro .menu-smash-pass-card__title-link:hover,
.hero-content.menu-reels-slide--intro .menu-smash-pass-card__title-link:focus-visible {
    color: var(--scheme-button-bg);
}

.hero-content.menu-reels-slide--intro .menu-smash-pass__actions {
    margin-top: 0.45rem;
}

.hero-content.menu-reels-slide--intro .menu-smash-pass__btn {
    min-width: 5.75rem;
    padding: 0.45em 0.8em;
}

.hero-content.menu-reels-slide--intro .social-share-btn-container .contact-cta--share {
}

.hero-content.menu-reels-slide--intro .social-share-btn-container .contact-cta__hint {
    display: none;
}

/* Per-item empty photo placeholder: same footprint as smash stack */
.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass__empty-state:not(.hidden) {
    flex: 0 0 auto;
    width: min(78vw, 16rem, 100cqw, 100cqh);
    max-width: 100%;
    max-height: 100%;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
    height: auto;
}

/* Per-item smash pass on menu reel cards: largest 1:1 square that fits slide height */
.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass__reel:not(.hidden) {
    flex: 1 1 0;
    min-height: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding-inline: 0.5rem;
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass__stack {
    flex: 0 0 auto;
    max-width: 100%;
    max-height: 100%;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
    height: auto;
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass-card {
    overflow: hidden;
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass-card__media {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    align-items: stretch;
    justify-content: center;
    overflow: hidden;
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass-card__img-stage {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass-card__img--backdrop {
    position: absolute;
    inset: -10%;
    width: 120%;
    height: 120%;
    object-fit: cover;
    object-position: center;
    filter: blur(20px) saturate(1.12);
    transform: scale(1.06);
    opacity: 0.78;
    pointer-events: none;
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass-card__img--front {
    position: relative;
    z-index: 1;
    object-fit: contain;
    object-position: center;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    pointer-events: none;
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass-card.is-behind .menu-smash-pass-card__img--front {
    object-fit: contain;
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass-card__stamp {
    top: 1.65rem;
    padding: 0.2rem 0.45rem;
    border-width: 2px;
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass-card__info--compact {
    padding: 0.25rem 0.4rem 0.35rem;
    position: absolute;
    bottom: 0px;
    right: 0;
    width: -webkit-fill-available;
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass-card__counts {
    font-size: large;
    font-weight: bolder;
    text-shadow: -1px -1px color-mix(in srgb, var(--scheme-black) 67%, transparent), 1px 1px color-mix(in srgb, var(--scheme-black) 67%, transparent), 1px -1px color-mix(in srgb, var(--scheme-black) 67%, transparent), -1px 1px color-mix(in srgb, var(--scheme-black) 67%, transparent);
    gap: 0.45rem;
}

.menu-smash-pass-card.is-local .menu-smash-pass-card__stamp {
    display: none;
}

/* Add-photo card: client theme accents (not fixed indigo) */
.menu-smash-pass-card--add-photo {
    --add-photo-accent: var(--button-color1);
    --add-photo-accent-deep: var(--button-color2);
    --add-photo-surface: var(--button-color1);
    --add-photo-ink: var(--button-text-color1);
    border-color: color-mix(in srgb, var(--add-photo-accent) 55%, color-mix(in srgb, var(--scheme-white) 28%, transparent));
    background:
        linear-gradient(
            165deg,
            color-mix(in srgb, var(--add-photo-accent-deep) 42%, var(--add-photo-surface)) 0%,
            color-mix(in srgb, var(--add-photo-surface) 88%, var(--scheme-black)) 48%,
            color-mix(in srgb, var(--main-bg) 92%, var(--scheme-black)) 100%
        );
    box-shadow:
        0 1px 0 color-mix(in srgb, var(--add-photo-accent) 28%, transparent) inset,
        0 0 0 1px color-mix(in srgb, var(--add-photo-accent) 18%, transparent),
        0 12px 28px color-mix(in srgb, var(--scheme-black) 38%, transparent),
        0 0 28px color-mix(in srgb, var(--add-photo-accent) 22%, transparent);
    cursor: grab;
}

.menu-smash-pass-card--add-photo.is-dragging {
    cursor: grabbing;
}

.menu-smash-pass-card__add-photo-media {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.menu-smash-pass-card__add-photo-bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(
            circle at 20% 18%,
            color-mix(in srgb, var(--add-photo-accent) 38%, transparent),
            transparent 42%
        ),
        radial-gradient(
            circle at 82% 78%,
            color-mix(in srgb, var(--add-photo-accent-deep) 32%, transparent),
            transparent 46%
        ),
        linear-gradient(145deg, color-mix(in srgb, var(--scheme-white) 6%, transparent), transparent 55%);
    pointer-events: none;
}

.menu-smash-pass-card__add-photo-body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 1.25rem 1rem 1rem;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
}

.menu-smash-pass-card__add-photo-ring {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4.25rem;
    height: 4.25rem;
    border-radius: 999px;
    color: var(--add-photo-ink);
    background:
        radial-gradient(circle at 30% 25%, color-mix(in srgb, var(--add-photo-ink) 42%, transparent), transparent 50%),
        linear-gradient(
            160deg,
            var(--add-photo-accent) 0%,
            var(--add-photo-accent-deep) 100%
        );
    border: 1.5px solid color-mix(in srgb, var(--add-photo-accent) 70%, color-mix(in srgb, var(--scheme-white) 40%, transparent));
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--scheme-white) 28%, transparent) inset,
        0 0 0 6px color-mix(in srgb, var(--add-photo-accent) 16%, transparent),
        0 10px 28px color-mix(in srgb, var(--scheme-black) 35%, transparent),
        0 0 24px color-mix(in srgb, var(--add-photo-accent) 40%, transparent);
    font-size: 1.65rem;
}

.menu-smash-pass-card__add-photo-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: var(--add-photo-ink) !important;
}

.menu-smash-pass-card__add-photo-hint {
    margin: 0;
    max-width: 13em;
    font-size: 0.78rem;
    line-height: 1.35;
    color: color-mix(in srgb, var(--add-photo-ink) 72%, transparent) !important;
}

.menu-smash-pass-card__add-photo-swipe {
    margin: 0;
    font-size: 0.72rem;
    line-height: 1.3;
    color: color-mix(in srgb, var(--add-photo-ink) 58%, transparent);
}

.menu-smash-pass-card--add-photo .menu-image-actions--standalone {
    position: static;
    display: flex;
    justify-content: center;
    margin: 0.15rem 0 0;
    padding: 0;
    pointer-events: auto;
}

.menu-smash-pass-card--add-photo .menu-image-add-btn {
    min-height: 2.35rem;
    padding: 0.55em 1.15em;
    gap: 0.45em;
    font-size: 0.82rem;
    font-weight: 700;
    border-radius: 999px;
    background: linear-gradient(
        135deg,
        var(--add-photo-accent-deep) 0%,
        var(--add-photo-accent) 100%
    );
    border: 1.5px solid color-mix(in srgb, var(--add-photo-ink) 35%, transparent);
    color: var(--add-photo-ink);
    box-shadow:
        0 1px 0 color-mix(in srgb, var(--scheme-white) 35%, transparent) inset,
        0 8px 22px color-mix(in srgb, var(--add-photo-accent-deep) 40%, transparent);
}

.menu-smash-pass-card--add-photo .menu-image-add-btn:hover,
.menu-smash-pass-card--add-photo .menu-image-add-btn:focus-visible {
    background: linear-gradient(
        135deg,
        var(--add-photo-accent) 0%,
        var(--add-photo-accent-deep) 100%
    );
    color: var(--add-photo-ink);
    transform: translateY(-1px);
    outline: none;
}

.menu-smash-pass-card--add-photo .menu-image-add-btn .fa {
    font-size: 0.95rem;
}

.menu-smash-pass-card__info--add-photo {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.45rem 0.65rem 0.55rem;
    background: linear-gradient(
        to top,
        color-mix(in srgb, var(--add-photo-surface) 92%, var(--scheme-black)),
        transparent
    );
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass-card--add-photo .menu-smash-pass-card__add-photo-media {
    min-height: 0;
}

.menu-item-card.menu-reels-slide .menu-item-smash-pass .menu-smash-pass-card--add-photo .menu-smash-pass-card__info--add-photo {
    width: 100%;
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass-card--add-photo,
.single-page-item-card .menu-smash-pass--single-page .menu-smash-pass-card--add-photo,
.menu-item-card.expanded .menu-smash-pass--single-page .menu-smash-pass-card--add-photo {
    border-color: color-mix(in srgb, var(--selected-button-color3) 55%, color-mix(in srgb, var(--scheme-white) 28%, transparent));
}

/* Smash-or-pass in reels item modal */
.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass__empty-state:not(.hidden) {
    flex: 0 0 auto;
    width: min(68vw, 14rem);
    max-width: 14rem;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
    height: auto;
    max-height: min(68vw, 14rem);
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass__reel:not(.hidden) {
    flex: 0 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    width: 100%;
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass__stack {
    flex: 0 0 auto;
    max-width: 100%;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
    height: auto;
    max-height: min(68vw, 14rem);
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass-card {
    overflow: hidden;
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass-card__media {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    align-items: stretch;
    justify-content: center;
    overflow: hidden;
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass-card__img-stage {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass-card__img--backdrop {
    position: absolute;
    inset: -10%;
    width: 120%;
    height: 120%;
    object-fit: cover;
    object-position: center;
    filter: blur(20px) saturate(1.12);
    transform: scale(1.06);
    opacity: 0.78;
    pointer-events: none;
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass-card__img--front {
    position: relative;
    z-index: 1;
    object-fit: contain;
    object-position: center;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    pointer-events: none;
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass-card.is-behind .menu-smash-pass-card__img--front {
    object-fit: contain;
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass-card__info--compact {
    padding: 0.35rem 0.5rem 0.45rem;
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass-card__counts {
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass__vote-hint {
    margin: 0.35rem 0 0;
    font-size: 0.72rem;
    text-align: center;
    opacity: 0.75;
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass__actions {
    margin-top: 0.45rem;
    width: 100%;
    max-width: 18rem;
}

.menu-reels-item-modal__data .menu-smash-pass--modal .menu-smash-pass__btn {
    min-width: 5.75rem;
    padding: 0.45em 0.8em;
}

.main--home .menu-smash-pass-card__counts {
    bottom: .6em;
    background: none;
    pointer-events: none;
}

/* Card-level add photo button: left of favorite, same look as heart control */
.menu-add-photo-btn {
    --add-photo-outline: color-mix(in srgb, var(--scheme-white) 45%, transparent);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.65rem;
    height: 1.65rem;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    color: var(--add-photo-outline);
    cursor: pointer;
    box-shadow: none;
    transition:
        transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
        color 0.2s ease;
}

.menu-add-photo-btn:hover {
    transform: scale(1.08);
    color: color-mix(in srgb, var(--scheme-white) 70%, transparent);
}

.menu-add-photo-btn:active {
    transform: scale(0.94);
}

.menu-smash-pass__empty-cta.menu-add-photo-btn:hover,
.menu-smash-pass__empty-cta.menu-add-photo-btn:focus-visible {
    transform: translateY(-1px);
    color: var(--scheme-ink-muted, #1a1a1a);
    outline: none;
}

.menu-smash-pass__empty-cta.menu-add-photo-btn:active {
    transform: translateY(0);
}

.menu-add-photo-btn:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--scheme-white) 60%, transparent);
    outline-offset: 2px;
}

.menu-add-photo-btn__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
    pointer-events: none;
}

.menu-add-photo-btn__svg {
    width: 1.35rem;
    height: 1.35rem;
    display: block;
}

.menu-add-photo-btn__svg path,
.menu-add-photo-btn__svg circle {
    fill: none;
    stroke: currentColor;
}

.menu-item-card > .menu-add-photo-btn {
    position: absolute;
    top: 0.7em;
    right: 0.35em;
    z-index: var(--ttms-z-card-controls, 8);
}

.menu-item-card > .menu-add-photo-btn:has(+ .menu-favorite-btn) {
    right: calc(0.35em + 1.65rem + 0.35rem);
}

/* Item detail (single page + inline expanded card): smash-or-pass replaces carousel */
:is(.single-page-item-card .single-page-content, .menu-item-card.expanded .expanded-item-details)
    > .menu-item-smash-pass.menu-smash-pass--single-page {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 0 1rem;
    position: relative;
}

:is(.single-page-item-card, .menu-item-card.expanded) .menu-smash-pass--single-page .menu-smash-pass__empty-state:not(.hidden) {
    flex: 0 0 auto;
    width: min(100%, 28rem);
    max-width: 100%;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
    height: auto;
    max-height: min(72dvh, calc(100dvh - 8em));
    min-height: 280px;
}

:is(.single-page-item-card, .menu-item-card.expanded) .menu-smash-pass--single-page .menu-smash-pass__reel:not(.hidden) {
    flex: 0 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    width: 100%;
}

:is(.single-page-item-card, .menu-item-card.expanded) .menu-smash-pass--single-page .menu-smash-pass__stack {
    flex: 0 0 auto;
    width: min(100%, 28rem);
    max-width: 100%;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
    height: auto;
    max-height: min(72dvh, calc(100dvh - 8em));
    min-height: 280px;
}

:is(.single-page-item-card, .menu-item-card.expanded) .menu-smash-pass--single-page .menu-smash-pass-card {
    overflow: hidden;
}

:is(.single-page-item-card, .menu-item-card.expanded) .menu-smash-pass--single-page .menu-smash-pass-card__media {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    align-items: stretch;
    justify-content: center;
    overflow: hidden;
}

:is(.single-page-item-card, .menu-item-card.expanded) .menu-smash-pass--single-page .menu-smash-pass-card__img-stage {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

:is(.single-page-item-card, .menu-item-card.expanded) .menu-smash-pass--single-page .menu-smash-pass-card__img--backdrop {
    position: absolute;
    inset: -10%;
    width: 120%;
    height: 120%;
    object-fit: cover;
    object-position: center;
    filter: blur(20px) saturate(1.12);
    transform: scale(1.06);
    opacity: 0.78;
    pointer-events: none;
}

:is(.single-page-item-card, .menu-item-card.expanded) .menu-smash-pass--single-page .menu-smash-pass-card__img--front {
    position: relative;
    z-index: 1;
    object-fit: contain;
    object-position: center;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    pointer-events: none;
}

:is(.single-page-item-card, .menu-item-card.expanded) .menu-smash-pass--single-page .menu-smash-pass-card.is-behind .menu-smash-pass-card__img--front {
    object-fit: contain;
}

:is(.single-page-item-card, .menu-item-card.expanded) .menu-smash-pass--single-page .menu-smash-pass-card__info--compact {
    padding: 0.35rem 0.5rem 0.45rem;
}

.single-page-item-card .single-page-content > .menu-favorite-btn {
    display: none;
}