.bsmp-popup {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.28s ease, visibility 0.28s ease;
}

.bsmp-popup.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.bsmp-popup__overlay {
    position: absolute;
    inset: 0;
    background: var(--bsmp-overlay, rgba(15, 12, 30, 0.72));
    backdrop-filter: blur(5px);
}

.bsmp-popup__dialog {
    position: relative;
    width: min(100%, 390px);
    overflow: hidden;
    border-radius: 18px;
    background: var(--bsmp-dialog, #26215c);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34);
    color: var(--bsmp-text, #fff);
    text-align: center;
    transform: translateY(16px) scale(0.98);
    transition: transform 0.28s cubic-bezier(0.18, 0.85, 0.25, 1.06);
}

.bsmp-popup.is-visible .bsmp-popup__dialog {
    transform: translateY(0) scale(1);
}

.bsmp-popup__close {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 4;
    display: flex;
    width: 30px;
    height: 30px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
    color: var(--bsmp-text, #fff);
    cursor: pointer;
    font: 24px/1 Arial, sans-serif;
}

.bsmp-popup__close:hover,
.bsmp-popup__close:focus-visible {
    background: rgba(255, 255, 255, 0.28);
    outline: none;
}

.bsmp-popup__intro {
    padding: 32px 24px 8px;
}

.bsmp-popup__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 12px;
    padding: 5px 14px;
    border-radius: 8px;
    background: var(--bsmp-badge, #534ab7);
    color: var(--bsmp-text, #eeedfe);
    font: 500 12px/1.4 Arial, sans-serif;
    letter-spacing: 0.4px;
}

.bsmp-popup__title {
    margin: 0 0 4px;
    color: var(--bsmp-text, #fff);
    font: 700 23px/1.2 Arial, sans-serif;
    letter-spacing: 0;
}

.bsmp-popup__subtitle {
    margin: 0;
    color: var(--bsmp-muted, #cecbf6);
    font: 400 14px/1.45 Arial, sans-serif;
}

.bsmp-machine {
    position: relative;
    margin: 20px 24px 10px;
    perspective: 620px;
    perspective-origin: 88% 58%;
}

.bsmp-machine__frame {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-right: 46px;
    padding: 14px;
    border-radius: 12px;
    background: var(--bsmp-frame, #ef9f27);
}

.bsmp-reel {
    position: relative;
    flex: 1 1 0;
    height: 92px;
    min-width: 0;
    overflow: hidden;
    border-radius: 8px;
    background: var(--bsmp-reel, #faeeda);
    box-shadow: inset 0 8px 16px rgba(99, 56, 6, 0.16), inset 0 -7px 13px rgba(99, 56, 6, 0.12);
}

.bsmp-reel:before,
.bsmp-reel:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    z-index: 5;
    height: 18px;
    pointer-events: none;
}

.bsmp-reel:before {
    top: 0;
    background: linear-gradient(to bottom, rgba(250, 238, 218, 0.85), rgba(250, 238, 218, 0));
    background: linear-gradient(to bottom, color-mix(in srgb, var(--bsmp-reel, #faeeda) 85%, transparent), transparent);
}

.bsmp-reel:after {
    bottom: 0;
    background: linear-gradient(to top, rgba(250, 238, 218, 0.85), rgba(250, 238, 218, 0));
    background: linear-gradient(to top, color-mix(in srgb, var(--bsmp-reel, #faeeda) 85%, transparent), transparent);
}

.bsmp-reel__strip {
    position: absolute;
    inset: 0 0 auto;
    will-change: transform;
}

.bsmp-reel__cell {
    display: flex;
    height: 92px;
    align-items: center;
    justify-content: center;
}

.bsmp-symbol {
    display: block;
    width: 48px;
    height: 48px;
}

.bsmp-lever {
    position: absolute;
    right: -2px;
    bottom: 6px;
    width: 42px;
    height: 108px;
    padding: 0;
    border: 0 !important;
    appearance: none;
    background: transparent !important;
    box-shadow: none !important;
    color: inherit;
    cursor: default;
    filter: none !important;
    text-shadow: none !important;
    perspective: 360px;
    perspective-origin: 50% 86%;
    transform-style: preserve-3d;
    -webkit-tap-highlight-color: transparent;
}

.bsmp-lever:hover,
.bsmp-lever:focus,
.bsmp-lever:active,
.bsmp-lever:focus-visible {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: inherit !important;
    filter: none !important;
    outline: none !important;
    text-shadow: none !important;
    transform: none !important;
	cursor: pointer;
}

.bsmp-lever:hover .bsmp-lever__base,
.bsmp-lever:focus .bsmp-lever__base,
.bsmp-lever:active .bsmp-lever__base {
    transform: translateX(-50%) rotateX(42deg) translateZ(-5px);
}

.bsmp-lever:hover .bsmp-lever__pivot,
.bsmp-lever:focus .bsmp-lever__pivot,
.bsmp-lever:active .bsmp-lever__pivot {
    transform: translateX(-50%) translateZ(12px);
}

.bsmp-lever:hover .bsmp-lever__arm,
.bsmp-lever:focus .bsmp-lever__arm,
.bsmp-lever:active .bsmp-lever__arm {
    transform: rotateX(0deg) translateY(0) translateZ(12px);
}

.bsmp-lever:hover .bsmp-lever__arm.is-pulled,
.bsmp-lever:focus .bsmp-lever__arm.is-pulled,
.bsmp-lever:active .bsmp-lever__arm.is-pulled {
    transform: rotateX(-56deg) translateY(18px) translateZ(8px) scaleY(0.94);
}

.bsmp-lever__base,
.bsmp-lever__pivot,
.bsmp-lever__arm,
.bsmp-lever__rod,
.bsmp-lever__knob {
    position: absolute;
    display: block;
}

.bsmp-lever__base {
    bottom: 1px;
    left: 50%;
    width: 31px;
    height: 19px;
    border-radius: 8px;
    background: linear-gradient(135deg, #77756e 0%, #3b3a36 52%, #20201e 100%);
    box-shadow: 0 7px 11px rgba(0, 0, 0, 0.24), 0 2px 0 rgba(255, 255, 255, 0.14) inset;
    transform: translateX(-50%) rotateX(42deg) translateZ(-5px);
    transform-style: preserve-3d;
    z-index: 2;
}

.bsmp-lever__base:before,
.bsmp-lever__base:after {
    content: "";
    position: absolute;
    display: block;
}

.bsmp-lever__base:before {
    inset: 4px 6px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.28);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.12);
}

.bsmp-lever__base:after {
    left: 4px;
    right: 4px;
    bottom: -5px;
    height: 7px;
    border-radius: 0 0 8px 8px;
    background: #252522;
    transform: rotateX(-42deg);
    transform-origin: 50% 0;
}

.bsmp-lever__pivot {
    bottom: 9px;
    left: 50%;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: radial-gradient(circle at 34% 26%, #d4d1c7 0 13%, #8f8d85 34%, #55534d 68%, #2c2c29 100%);
    box-shadow: 0 5px 9px rgba(0, 0, 0, 0.28), -3px -2px 5px rgba(255, 255, 255, 0.16) inset, 4px 5px 7px rgba(0, 0, 0, 0.26) inset;
    transform: translateX(-50%) translateZ(12px);
    z-index: 5;
}

.bsmp-lever__arm {
    bottom: 17px;
    left: 50%;
    width: 28px;
    height: 78px;
    margin-left: -14px;
    transform-origin: 50% 96%;
    transform: rotateX(0deg) translateY(0) translateZ(12px);
    transform-style: preserve-3d;
    transition: transform 0.46s cubic-bezier(0.18, 0.85, 0.25, 1.07);
    z-index: -4;
}

.bsmp-lever__arm.is-pulled {
    transform: rotateX(-56deg) translateY(18px) translateZ(8px) scaleY(0.94);
}

.bsmp-lever__rod {
    bottom: 0;
    left: 11px;
    width: 7px;
    height: 78px;
    border-radius: 999px;
    background: linear-gradient(90deg, #3e3d39 0%, #77756e 24%, #a5a29a 46%, #5b5a55 72%, #2f2f2c 100%);
    box-shadow: 0 6px 11px rgba(0, 0, 0, 0.2), 2px 0 0 rgba(255, 255, 255, 0.14) inset, -2px 0 0 rgba(0, 0, 0, 0.22) inset;
    transform: translateZ(6px);
}

.bsmp-lever__rod:after {
    content: "";
    position: absolute;
    left: 2px;
    top: 7px;
    width: 2px;
    height: 64px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.2);
}

.bsmp-lever__knob {
    top: -13px;
    left: 1px;
    box-sizing: border-box;
    width: 27px;
    height: 27px;
    border: 3px solid #992b2b;
    border-radius: 999px;
    background: radial-gradient(circle at 32% 24%, #ffaaa3 0 12%, var(--bsmp-lever-knob, #e24b4a) 35%, #b53131 72%, #721d1d 100%);
    box-shadow: 0 9px 14px rgba(0, 0, 0, 0.24), -5px -5px 9px rgba(255, 255, 255, 0.18) inset, 5px 6px 9px rgba(0, 0, 0, 0.26) inset;
    transform: translateZ(12px);
}

.bsmp-lever__knob:after {
    content: "";
    position: absolute;
    top: 5px;
    left: 6px;
    width: 7px;
    height: 5px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.42);
    transform: rotate(-22deg);
}

.bsmp-win-message {
    min-height: 22px;
    margin-bottom: 8px;
    color: var(--bsmp-win, #5dcaa5);
    font: 600 15px/1.45 Arial, sans-serif;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.bsmp-win-message.is-visible {
    opacity: 1;
}

.bsmp-actions {
    padding: 8px 24px 28px;
}

.bsmp-spin-button,
.bsmp-claim__link {
    display: inline-flex;
    width: 100%;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-sizing: border-box;
    border: 0;
    border-radius: 12px;
    background: var(--bsmp-primary, #5dcaa5);
    color: var(--bsmp-primary-text, #04342c);
    cursor: pointer;
    font: 700 16px/1.2 Arial, sans-serif;
    text-decoration: none;
}

.bsmp-spin-button:hover,
.bsmp-spin-button:focus-visible,
.bsmp-claim__link:hover,
.bsmp-claim__link:focus-visible {
    filter: brightness(1.04);
    outline: none;
}

.bsmp-spin-button.is-spinning {
    background: #9fe1cb;
    background: color-mix(in srgb, var(--bsmp-primary, #5dcaa5) 65%, #ffffff);
    cursor: wait;
}

.bsmp-spin-button__icon {
    width: 18px;
    height: 18px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 999px;
}

.bsmp-spin-button.is-spinning .bsmp-spin-button__icon {
    animation: bsmp-spin 0.85s linear infinite;
}

.bsmp-popup__note {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 14px 0 0;
    color: var(--bsmp-note, #afa9ec);
    font: 400 12px/1.45 Arial, sans-serif;
}

.bsmp-claim {
    margin: 8px 24px 28px;
    padding: 18px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.09);
}

.bsmp-claim[hidden] {
    display: none;
}

.bsmp-claim__title {
    margin: 0 0 6px;
    color: var(--bsmp-claim, #fac775);
    font: 700 21px/1.2 Arial, sans-serif;
}

.bsmp-claim__text {
    margin: 0 0 14px;
    color: var(--bsmp-muted, #eeedfe);
    font: 400 14px/1.45 Arial, sans-serif;
}

.bsmp-claim__link {
    background: var(--bsmp-claim, #fac775);
    color: var(--bsmp-claim-text, #633806);
}

body.bsmp-popup-open {
    overflow: hidden;
}

@keyframes bsmp-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 420px) {
    .bsmp-popup {
        padding: 12px;
    }

    .bsmp-popup__intro {
        padding-inline: 18px;
    }

    .bsmp-machine {
        margin-inline: 18px;
    }

    .bsmp-machine__frame {
        gap: 8px;
        margin-right: 40px;
        padding: 12px;
    }

    .bsmp-actions,
    .bsmp-claim {
        margin-inline: 18px;
        padding-inline: 0;
    }

    .bsmp-claim {
        padding: 16px;
    }
}