.booth-body {
    color: var(--theme-text-body, #fff3ea);
    background-color: var(--theme-bg, #6a3354);
    background-image:
        radial-gradient(ellipse 70% 40% at 50% 0%, var(--theme-glow-soft, rgba(196, 90, 134, 0.28)), transparent 58%),
        linear-gradient(180deg, var(--theme-overlay, rgba(58, 22, 48, 0.28)), var(--theme-overlay-deep, rgba(36, 14, 30, 0.52))),
        var(--booth-photo, none),
        linear-gradient(180deg, var(--theme-bg-mid, #8d4a6e) 0%, var(--theme-bg, #6a3354) 48%, var(--theme-bg-deep, #3a1630) 100%);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.booth-body.theme-gold {
    --theme-bg: #d4a017;
    --theme-bg-mid: #f3e0a8;
    --theme-bg-deep: #7a5614;
    --theme-overlay: rgba(255, 244, 210, 0.22);
    --theme-overlay-deep: rgba(90, 62, 16, 0.28);
    --theme-glow-soft: rgba(255, 248, 220, 0.55);
    background-image:
        radial-gradient(ellipse 90% 50% at 50% -8%, rgba(255, 252, 235, 0.75), transparent 58%),
        radial-gradient(circle at 12% 88%, rgba(139, 105, 20, 0.28), transparent 42%),
        radial-gradient(circle at 88% 72%, rgba(212, 160, 23, 0.22), transparent 38%),
        linear-gradient(180deg, var(--theme-overlay), var(--theme-overlay-deep)),
        var(--booth-photo, none),
        linear-gradient(180deg, #f8edc4 0%, #e8c15a 36%, #c9a227 68%, #7a5614 100%);
}

.booth {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    padding: calc(0.35rem + env(safe-area-inset-top)) 0.7rem calc(0.4rem + env(safe-area-inset-bottom));
    box-sizing: border-box;
    overflow: hidden;
}

.booth-lantern {
    position: absolute;
    top: 0.2rem;
    width: 1.7rem;
    height: 2.4rem;
    border-radius: 50% 50% 46% 46%;
    background: radial-gradient(circle at 35% 30%, var(--theme-lantern-light), var(--theme-lantern) 58%, var(--theme-lantern-dark));
    box-shadow: 0 0.55rem 0 -0.28rem var(--theme-lantern-dark), 0 10px 16px rgba(0, 0, 0, 0.28);
    z-index: 3;
}

.booth-lantern::before {
    content: '';
    position: absolute;
    left: 50%;
    top: -0.55rem;
    width: 2px;
    height: 0.55rem;
    background: var(--theme-accent);
    transform: translateX(-50%);
}

.booth-lantern-l { left: 0.85rem; }
.booth-lantern-r { right: 0.85rem; }

.booth-sign {
    position: relative;
    z-index: 2;
    justify-self: center;
    flex-shrink: 0;
    width: min(72%, 22rem);
    margin: 0.85rem auto 0.25rem;
    padding: 0.55rem 0.85rem 0.55rem;
    text-align: center;
    color: var(--theme-text);
    background: linear-gradient(180deg, var(--theme-card), var(--theme-primary-dark));
    border: 4px solid var(--theme-accent);
    box-shadow:
        inset 0 0 0 2px var(--theme-accent-dark),
        0 10px 18px rgba(0, 0, 0, 0.28);
}

.booth-rope {
    position: absolute;
    top: -1.15rem;
    width: 3px;
    height: 1.15rem;
    background: repeating-linear-gradient(var(--theme-accent), var(--theme-accent) 4px, var(--theme-primary-dark) 4px, var(--theme-primary-dark) 6px);
}

.booth-rope-l { left: 18%; }
.booth-rope-r { right: 18%; }

.booth-eyebrow {
    margin: 0 0 0.1rem;
    font-family: 'ZCOOL XiaoWei', serif;
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    color: var(--theme-accent);
}

.booth-sign h1 {
    margin: 0;
    font-family: Fredoka, 'ZCOOL XiaoWei', sans-serif;
    font-size: clamp(1.45rem, 6.4vw, 2.05rem);
    letter-spacing: 0.04em;
    line-height: 1;
    text-shadow: 0 2px 0 var(--theme-on-accent);
}

.booth-sub {
    margin: 0.2rem 0 0;
    font-family: 'Ma Shan Zheng', 'ZCOOL XiaoWei', serif;
    font-size: clamp(1.15rem, 4.6vw, 1.55rem);
    color: var(--theme-text-soft);
}

.booth-coin {
    position: absolute;
    top: calc(0.45rem + env(safe-area-inset-top));
    right: 0.55rem;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 3.7rem;
    height: 3.7rem;
    padding: 0;
    border: 3px solid var(--theme-coin-rim);
    border-radius: 50%;
    color: var(--theme-on-accent);
    background:
        radial-gradient(circle at 35% 30%, var(--theme-coin-light), var(--theme-coin) 46%, var(--theme-coin-dark));
    box-shadow: 0 5px 0 var(--theme-coin-rim), 0 8px 12px rgba(0, 0, 0, 0.28);
    cursor: default;
}

.booth-coin strong {
    font-family: Fredoka, sans-serif;
    font-size: 1.15rem;
    line-height: 1;
}

.booth-coin small {
    margin-top: 0.08rem;
    font-size: 0.48rem;
    letter-spacing: 0.08em;
    font-weight: 700;
}

.winner-board {
    position: relative;
    z-index: 3;
    flex-shrink: 0;
    width: 100%;
    margin-top: 0.15rem;
    overflow: hidden;
    font-family: 'ZCOOL XiaoWei', serif;
}

.winner-board-head {
    display: none;
}

.winner-track {
    overflow: hidden;
    padding: 0.28rem 0;
    background: linear-gradient(180deg, var(--theme-primary-dark), var(--theme-bg-deep));
    border-top: 2px solid var(--theme-accent);
    border-bottom: 2px solid var(--theme-accent);
    mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}

.winner-board ul {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    width: max-content;
    margin: 0;
    padding: 0 0.6rem;
    list-style: none;
    animation: winnerMarquee 22s linear infinite;
}

.winner-board li {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
    padding: 0.22rem 0.75rem;
    border: 1px solid var(--theme-accent);
    border-radius: 999px;
    background: var(--theme-card);
    box-shadow: inset 0 0 0 1px var(--theme-accent-soft);
    white-space: nowrap;
}

.winner-board li b {
    color: var(--theme-text);
    font-size: 0.78rem;
}

.winner-board li span {
    color: var(--theme-text-soft);
    font-size: 0.72rem;
    max-width: 8.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

.winner-board li.is-empty {
    color: #fff;
    background: transparent;
    border-style: dashed;
}

.booth-floor {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    min-height: 0;
    width: 100%;
}

.egg-platter {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    width: min(100%, 36rem);
    flex: 0 1 auto;
    height: auto;
    max-height: 100%;
    aspect-ratio: 1.22 / 1;
    padding: 0 2% 12%;
    box-sizing: border-box;
}

.platter-rim {
    position: absolute;
    left: 6%;
    right: 6%;
    bottom: 4%;
    height: 22%;
    border-radius: 50%;
    background:
        radial-gradient(ellipse at 50% 40%, rgba(255, 236, 179, 0.55), transparent 42%),
        linear-gradient(180deg, #f3d27a 0%, #c9a227 38%, #8a6414 76%, #5c420c 100%);
    box-shadow:
        inset 0 8px 10px rgba(255, 255, 255, 0.28),
        inset 0 -10px 14px rgba(0, 0, 0, 0.28),
        0 16px 22px rgba(0, 0, 0, 0.32);
    z-index: 0;
}

.egg-btn {
    position: relative;
    z-index: 2;
    display: block;
    width: 34%;
    height: 78%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}

.egg-btn-0 {
    width: 31%;
    height: 70%;
    transform: rotate(-7deg) translate(8%, 10%);
}

.egg-btn-1 {
    width: 38%;
    height: 82%;
    z-index: 3;
    transform: translateY(-2%);
}

.egg-btn-2 {
    width: 31%;
    height: 70%;
    transform: rotate(7deg) translate(-8%, 10%);
}

.egg-btn.is-disabled {
    pointer-events: none;
}

.egg-sprite {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center bottom;
    filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.4));
    transform-origin: 50% 90%;
    transition: transform 0.16s ease;
}

.egg-btn:not(.is-open):not(.is-cracking):hover .egg-sprite,
.egg-btn:not(.is-open):not(.is-cracking):focus .egg-sprite {
    transform: translateY(-8px) scale(1.04);
}

.egg-btn.is-cracking .egg-sprite {
    animation: eggHit 0.2s ease-in-out 2;
}

.egg-btn.is-open .egg-sprite {
    opacity: 0.22;
    transform: scale(0.9) rotate(-6deg);
}

.egg-crack {
    position: absolute;
    inset: 22% 24% 18%;
    pointer-events: none;
    opacity: 0;
    background:
        linear-gradient(118deg, transparent 46%, #fff6d0 48%, #6d4c0f 50%, transparent 52%),
        linear-gradient(64deg, transparent 40%, #fff6d0 46%, transparent 52%);
    mix-blend-mode: screen;
}

.egg-btn.is-open .egg-crack,
.egg-btn.is-cracking .egg-crack {
    opacity: 0.95;
}

.egg-prize {
    position: absolute;
    left: 50%;
    top: 18%;
    width: 58%;
    transform: translateX(-50%);
    pointer-events: none;
}

.egg-prize .prize-img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    object-fit: contain;
    filter: drop-shadow(0 0 10px rgba(255, 213, 79, 0.85));
}

.egg-btn.is-open .egg-prize {
    animation: prizePop 0.38s ease-out;
}

.booth-hammer {
    position: absolute;
    right: 0;
    bottom: 16%;
    width: clamp(4.2rem, 18vw, 7.2rem);
    z-index: 5;
    pointer-events: none;
    transform-origin: 80% 90%;
    filter: drop-shadow(0 8px 8px rgba(0, 0, 0, 0.4));
    animation: hammerIdle 2.4s ease-in-out infinite;
}

.booth-hammer.is-swinging {
    animation: hammerSmash 0.5s ease-in forwards;
}

.booth-prompt {
    position: relative;
    z-index: 2;
    margin: 0.35rem 0 0;
    padding: 0.2rem 0.9rem;
    font-family: 'Ma Shan Zheng', 'ZCOOL XiaoWei', serif;
    font-size: clamp(1.05rem, 4.2vw, 1.4rem);
    color: var(--theme-text);
    text-shadow: 0 2px 0 var(--theme-on-accent);
    cursor: pointer;
}

.booth.no-tokens .egg-btn {
    opacity: 0.45;
    pointer-events: none;
}

.booth.no-tokens .booth-prompt {
    color: #fff;
}

@keyframes eggHit {
    0%, 100% { transform: rotate(0) scale(1); }
    30% { transform: rotate(-9deg) scale(0.95); }
    70% { transform: rotate(8deg) scale(1.05); }
}

@keyframes prizePop {
    from { opacity: 0; transform: translate(-50%, 16px) scale(0.4); }
    to { opacity: 1; transform: translate(-50%, 0) scale(1); }
}

@keyframes hammerIdle {
    0%, 100% { transform: rotate(12deg) translateY(0); }
    50% { transform: rotate(18deg) translateY(-6px); }
}

@keyframes hammerSmash {
    0% { transform: translate(30px, -50px) rotate(40deg); }
    60% { transform: translate(0, 8px) rotate(-26deg); }
    100% { transform: translate(0, 0) rotate(-12deg); }
}

@keyframes winnerMarquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

@media (min-width: 760px) {
    .booth {
        display: grid;
        grid-template-columns: 11.2rem minmax(0, 1fr);
        grid-template-rows: auto 1fr;
        max-width: 76rem;
        padding-left: 1rem;
        padding-right: 1.2rem;
    }

    .booth-sign {
        grid-column: 1 / -1;
        width: min(42%, 24rem);
        margin-top: 1.15rem;
        padding: 0.7rem 1rem 0.75rem;
    }

    .booth-coin {
        width: 4.3rem;
        height: 4.3rem;
        right: 0.9rem;
    }

    .winner-board {
        grid-column: 1;
        grid-row: 2;
        align-self: stretch;
        width: 10.6rem;
        margin: 0.4rem 0 1rem;
        display: flex;
        flex-direction: column;
        background:
            linear-gradient(180deg, var(--theme-primary-dark) 0 2.4rem, var(--theme-text-soft) 2.4rem);
        border: 3px solid var(--theme-accent);
        box-shadow: 5px 7px 0 rgba(0, 0, 0, 0.18);
        overflow: hidden;
    }

    .winner-board-head {
        display: block;
        flex-shrink: 0;
        padding: 0.55rem 0.4rem 0.45rem;
        color: var(--theme-text);
        font-size: 0.92rem;
        letter-spacing: 0.16em;
        text-align: center;
        text-shadow: 0 1px 0 var(--theme-on-accent);
    }

    .winner-track {
        flex: 1;
        min-height: 0;
        padding: 0.55rem 0.45rem 0.7rem;
        background: transparent;
        border: 0;
        mask-image: linear-gradient(180deg, transparent, #000 8%, #000 92%, transparent);
    }

    .winner-board ul {
        display: block;
        width: auto;
        padding: 0;
        animation: winnerMarqueeY 18s linear infinite;
    }

    .winner-board li {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.08rem;
        width: 100%;
        margin-bottom: 0.45rem;
        padding: 0.4rem 0.45rem 0.4rem 0.55rem;
        border-radius: 0.35rem;
        border: 1px solid var(--theme-accent-dark);
        border-left: 4px solid var(--theme-primary);
        background: rgba(255, 255, 255, 0.92);
        box-shadow: none;
        white-space: normal;
    }

    .winner-board li b {
        color: var(--theme-primary-dark);
        font-size: 0.78rem;
    }

    .winner-board li span {
        color: var(--theme-card-inner);
        font-size: 0.7rem;
        max-width: 100%;
    }

    .winner-board li.is-empty {
        color: var(--theme-primary);
        text-align: center;
        align-items: center;
        border-left-color: var(--theme-accent);
    }

    .booth-floor {
        grid-column: 2;
        grid-row: 2;
        justify-content: center;
    }

    .egg-platter {
        width: min(100%, 40rem);
        max-height: 34rem;
        flex: 0 1 auto;
        height: min(62dvh, 32rem);
        aspect-ratio: auto;
    }

    .booth-hammer {
        right: 4%;
        width: clamp(6rem, 16vw, 9.5rem);
    }
}

@media (max-width: 759px) {
    .booth {
        padding-top: calc(0.15rem + env(safe-area-inset-top));
        padding-bottom: env(safe-area-inset-bottom);
    }

    .booth-sign {
        width: min(78%, 22rem);
        margin: 0.55rem auto 0.2rem;
        padding: 0.45rem 0.7rem 0.5rem;
    }

    .booth-sign h1 {
        font-size: clamp(1.2rem, 6.6vw, 1.6rem);
    }

    .booth-sub {
        font-size: clamp(0.95rem, 4.8vw, 1.25rem);
    }

    .booth-floor {
        justify-content: stretch;
        min-height: 0;
    }

    .egg-platter {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-evenly;
        flex: 1 1 auto;
        width: 100%;
        height: auto;
        min-height: 0;
        max-height: none;
        aspect-ratio: unset;
        padding: 0.15rem 0 0.35rem;
    }

    .platter-rim {
        left: 16%;
        right: 16%;
        bottom: 0;
        height: 10%;
        opacity: 0.85;
    }

    .egg-btn,
    .egg-btn-0,
    .egg-btn-1,
    .egg-btn-2 {
        width: min(62vw, 16rem);
        height: auto;
        flex: 1 1 0;
        max-height: 31%;
        transform: none;
    }

    .egg-sprite {
        object-position: center;
    }

    .booth-hammer {
        right: 0.1rem;
        top: 46%;
        bottom: auto;
        width: clamp(3.4rem, 16vw, 5.2rem);
    }

    .booth-prompt {
        margin: 0.05rem 0 0.2rem;
        flex-shrink: 0;
    }
}

@keyframes winnerMarqueeY {
    from { transform: translateY(0); }
    to { transform: translateY(-50%); }
}