/* Illustrated cabinet with functional reels positioned in the drawn screen. */
.sm-preview{max-width:1100px;margin:auto;color:#fff;container-type:inline-size}.sm-intro{text-align:center;margin-bottom:18px}.sm-test-badge{display:inline-flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.16em;color:#c9b5e0}.sm-test-badge i{width:6px;height:6px;background:#8defff;border-radius:50%;box-shadow:0 0 8px #7cefff}.sm-intro p{font-size:14px;color:#c6bdd4;margin:10px 0}
.sm-photo-viewport{overflow:hidden;border-radius:14px;border:1px solid #65537f;box-shadow:0 18px 45px #0005;background:#080b20}.sm-photo-stage{position:relative;isolation:isolate;width:100%;aspect-ratio:3/2;container-type:inline-size}.sm-preview .sm-scene-image{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;user-select:none;pointer-events:none}.sm-photo-marquee{position:absolute;left:31.3%;top:9.4%;width:37.3%;height:9.7%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5%;pointer-events:none}.sm-preview .sm-photo-marquee img{width:64%;height:56%;object-fit:contain;filter:brightness(.13)}.sm-photo-marquee>span{font:900 clamp(6px,1cqw,12px)/1 system-ui;letter-spacing:.4em;color:#3a264e}
.sm-screen{position:absolute;left:32.45%;top:28.75%;width:35.05%;height:28%;border-radius:2px;overflow:hidden;background:#05051d;box-shadow:inset 0 0 18px #000a;container-type:size}.sm-reels{--sm-reel-pad:8px;--sm-cell:calc(79cqh - 16px);position:absolute;inset:0 0 21%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;background:#05051d}.sm-reel{position:relative;min-width:0;height:100%;overflow:hidden;background:radial-gradient(ellipse at center,#28315c,#050b24 85%);border-right:1px solid #81eafa22}.sm-reel:last-child{border:0}.sm-strip{position:relative;transform:translateY(var(--sm-reel-pad));}.sm-spinning .sm-strip{will-change:transform}.sm-symbol{height:var(--sm-cell);box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:4px 2px;color:#d7f7ff}.sm-preview .sm-symbol-image{display:block;width:clamp(20px,15cqw,58px);height:clamp(20px,15cqw,58px);object-fit:contain;flex-shrink:0;filter:drop-shadow(0 3px 6px #0007)}.sm-preview .sm-symbol-image.sm-card-image{width:clamp(17px,12cqw,44px);height:clamp(26px,18cqw,66px);transform:rotate(-6deg);border-radius:2px}.sm-symbol strong{font:850 clamp(14px,8cqw,32px)/1 system-ui;color:#d6fcff}.sm-symbol>span,.sm-symbol strong span{font:600 clamp(6px,2.6cqw,11px)/1.2 system-ui;color:#bed2ee}.sm-kind-anima strong{font-size:clamp(12px,6cqw,24px)}.sm-reel-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#030519ee,transparent 23% 77%,#030519ee);box-shadow:inset 0 0 8px #0007}.sm-screen-glass{position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(120deg,#73ccff0a,transparent 35%,#ff66cc05),repeating-linear-gradient(0deg,#0001 0 1px,transparent 1px 3px)}
.sm-preview .sm-spin-button{position:absolute;left:16%;bottom:3%;width:68%;height:16%;min-height:0;margin:0;padding:0 3px;display:flex;align-items:center;justify-content:center;border:1px solid #77efffb3;border-radius:3px;background:linear-gradient(#274e6c,#123047);color:#cffcff;font:750 clamp(7px,3.2cqw,13px)/1 system-ui;box-shadow:0 0 9px #2aeaff28;cursor:pointer;z-index:3;transition:background .2s}.sm-preview .sm-spin-button:not(:disabled):hover{background:#285f79}.sm-preview .sm-spin-button:disabled{color:#9eacca;border-color:#605e86;cursor:default;background:#161b35}.sm-preview .sm-photo-joystick{position:absolute;left:36.7%;top:57.4%;width:6.2%;height:8.7%;min-height:0;margin:0;padding:0;border:0;border-radius:50%;background:transparent;box-shadow:none;cursor:pointer;z-index:3}.sm-preview .sm-photo-joystick:not(:disabled):hover{background:radial-gradient(ellipse,#ff71bb33,transparent 70%)}.sm-preview .sm-photo-joystick:disabled{cursor:default}.sm-preview button:focus-visible{outline:2px solid #b6fbff;outline-offset:3px}.sm-spinning .sm-photo-joystick{box-shadow:0 0 14px #fa53b750}.sm-stopped{box-shadow:inset 0 0 0 1px #85efff6b}.sm-landing{animation:sm-land .5s ease-out}.sm-celebrate .sm-screen{animation:sm-win .9s ease-out}
.sm-timing{display:flex;justify-content:center;align-items:center;gap:8px;margin:19px 0 0;font-size:11px;color:#c8bedb}.sm-timing i{width:5px;height:5px;background:#72efda;border-radius:50%;box-shadow:0 0 7px #72efda}.sm-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:670px;margin:18px auto 0}.sm-results:empty{display:none}.sm-result{display:flex;align-items:center;gap:9px;padding:14px 10px;border:1px solid #546283;border-radius:10px;background:linear-gradient(135deg,#23364c,#21182e);animation:sm-result-in .4s ease-out var(--result-delay) both;min-width:0}.sm-preview .sm-result img{width:30px;height:38px;object-fit:contain;flex-shrink:0}.sm-result>div{min-width:0}.sm-result span{display:block;font-size:9px;color:#b9b2cc;margin-bottom:4px}.sm-result strong{font-size:clamp(11px,2.2cqw,14px);color:#caf7ff}.sm-preview .sm-status{text-align:center;font-size:12px;color:#c5b9d4;line-height:1.6;margin:15px 0 10px;min-height:20px}.sm-preview .sm-reset{display:block;margin:8px auto;font-size:12px}.sm-preview .sm-reset[hidden]{display:none}.sm-reward-guide{max-width:670px;margin:25px auto 0;border-top:1px solid #67537655;padding-top:20px}.sm-preview .sm-reward-guide h3{text-align:center;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#b9a7c8;margin:0 0 14px}.sm-reward-guide>div{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}.sm-reward-guide>div>span{display:flex;align-items:center;gap:6px;padding:6px 9px;border:1px solid #60547377;border-radius:7px;background:#1d1728;font-size:10px;color:#dbd0e2}.sm-preview .sm-reward-guide img{width:20px;height:24px;object-fit:contain}.sm-preview .sm-test-note{max-width:650px;margin:18px auto 0;font-size:11px;color:#a597b1;text-align:center;line-height:1.7}.sm-paused *,.sm-paused *::before,.sm-paused *::after{animation-play-state:paused!important}
@keyframes sm-land{from{filter:brightness(1.8)}to{filter:brightness(1)}}@keyframes sm-win{35%{box-shadow:inset 0 0 20px #80eaff77,0 0 25px #e25bff99}}@keyframes sm-result-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
/* Keep screen coordinates aligned to the illustration while cropping closer on phones. */
@media(max-width:600px){.sm-photo-viewport{aspect-ratio:3/4;border-radius:10px}.sm-photo-stage{width:200%;margin-left:-50%}.sm-results{gap:5px}.sm-result{flex-direction:column;text-align:center;padding:10px 4px;gap:5px}.sm-intro p{font-size:12px}.sm-preview .sm-status{font-size:11px}.sm-test-badge{font-size:8px}.sm-photo-marquee>span{letter-spacing:.25em}}
@media(prefers-reduced-motion:reduce){.sm-preview *,.sm-preview *::before,.sm-preview *::after{animation:none!important;transition:none!important}}

/* Local light pulses follow the tubes in the illustration; no video or render loop. */
.sm-decor-neons{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;fill:none;stroke-linecap:round;stroke-linejoin:round}.sm-neon-tube{stroke:currentColor;stroke-width:3;filter:drop-shadow(0 0 5px currentColor);animation:sm-neon-glow 9s ease-in-out infinite;opacity:.2}.sm-neon-dimmer{stroke:#050720;stroke-width:7;animation:sm-neon-dip 9s ease-in-out infinite;opacity:0}.sm-neon-cabinet-pink path{animation-duration:11s;animation-delay:-3.6s}.sm-neon-street path{animation-duration:13s;animation-delay:-7.4s}.sm-neon-street .sm-neon-tube{stroke-width:2}
@keyframes sm-neon-glow{0%,38%,46%,74%,100%{opacity:.15}40%,44%{opacity:.65}42%{opacity:.05}78%,84%{opacity:.55}90%{opacity:.2}}
@keyframes sm-neon-dip{0%,38%,46%,74%,100%{opacity:0}40%,44%{opacity:0}42%{opacity:.55}78%,84%{opacity:0}90%{opacity:.2}}
.sm-kind-dust strong{color:#ffb8df}.sm-symbol[data-rarity="0"] strong{color:#d9e0e9}.sm-symbol[data-rarity="1"] strong{color:#70b9ff}.sm-symbol[data-rarity="2"] strong{color:#d194ff}.sm-symbol[data-rarity="3"] strong{color:#ffe771}.sm-symbol[data-rarity="4"] strong{color:#ffad61;font-size:clamp(7px,3.3cqw,14px)}
.sm-reward-guide>.sm-loot-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:start}.sm-loot-group{border:1px solid #5a5274;border-radius:9px;background:#191727;overflow:hidden}.sm-loot-group summary{display:flex;justify-content:space-between;gap:8px;padding:13px 10px;color:#e0d8ef;font-size:12px;cursor:pointer;list-style:none}.sm-loot-group summary::before{content:'+';color:#9aefff}.sm-loot-group[open] summary::before{content:'−'}.sm-loot-group summary strong{color:#a2f0ff;margin-left:auto}.sm-loot-group>div{border-top:1px solid #5a527455;padding:6px}.sm-loot-row{display:flex;align-items:center;gap:5px;padding:6px 2px;font-size:10px;color:#c8c0d9}.sm-preview .sm-loot-row img{width:17px;height:21px}.sm-loot-row b{margin-left:auto;color:#c8efff;font-size:10px;white-space:nowrap}@media(max-width:500px){.sm-reward-guide>.sm-loot-groups{grid-template-columns:1fr}.sm-loot-group summary{font-size:12px}.sm-loot-row{font-size:12px;padding:7px}.sm-loot-row b{font-size:12px}}
.sm-preview button.sm-result{margin:0;color:#caf7ff;cursor:pointer;justify-content:center;background:linear-gradient(135deg,#23364c,#21182e);box-shadow:none}.sm-result{justify-content:center}.sm-result>strong{font-size:18px}.sm-reel[role="button"]{cursor:pointer}.sm-reel[role="button"]:focus-visible{outline:2px solid #b4faff;outline-offset:-3px}.sm-kind-card .sm-symbol-image{max-height:55%}

nav button.arcade-available{border-radius:12px;overflow:hidden;color:#ffe67b;border-color:#f8ce47;background:#564215;animation:arcade-tab-yellow 1.5s ease-in-out infinite}
@keyframes arcade-tab-yellow{0%,100%{background:#564215;color:#ffe67b;box-shadow:0 0 3px #ffce3a30}50%{background:#f5cf50;color:#271d05;box-shadow:0 0 15px #ffd13b80}}
.sm-photo-marquee>#slotAvailability{letter-spacing:.09em;font-size:clamp(6px,1.15cqw,14px);text-align:center;font-variant-numeric:tabular-nums;white-space:nowrap}
@media(prefers-reduced-motion:reduce){nav button.arcade-available{animation:none}}

.sm-screen-countdown{position:absolute;left:3%;bottom:3%;width:94%;height:16%;display:flex;align-items:center;justify-content:center;box-sizing:border-box;background:#161b35;border:1px solid #ffe367;color:#ffe367;z-index:4;font:750 clamp(6px,3.1cqw,13px)/1 monospace;font-variant-numeric:tabular-nums;white-space:nowrap}.sm-screen-countdown[hidden],.sm-spinning .sm-screen-countdown{display:none}

@property --arcade-neon-angle{syntax:"<angle>";initial-value:0deg;inherits:false}nav button.arcade-available{position:relative;isolation:isolate;overflow:visible;background:#201b30;color:#e9e2ff;border-color:transparent;animation:none;box-shadow:none}nav button.arcade-available::before{content:"";position:absolute;inset:-2px;padding:2px;border-radius:14px;background:conic-gradient(from var(--arcade-neon-angle),#36caff,transparent 25%,#ac52ff 50%,transparent 75%,#36caff);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;animation:arcade-neon-orbit 3s linear infinite;filter:drop-shadow(0 0 3px #765bff)}@keyframes arcade-neon-orbit{to{--arcade-neon-angle:360deg}}@media(prefers-reduced-motion:reduce){nav button.arcade-available::before{animation:none}}
