.lucky-wheel{position:relative;width:min(100%,var(--design-wheel,450px));aspect-ratio:1;margin:30px auto 42px;isolation:isolate}
.variant-rotor{position:absolute;width:80%;height:80%;left:10%;top:10%;transition:transform 4.3s cubic-bezier(.15,.7,.05,1);filter:drop-shadow(0 12px 20px #0008);z-index:2}
.orbital-system,.marquee-frame{position:absolute;inset:0;pointer-events:none}
.orbit-ring{position:absolute;inset:1%;border:1px solid #9df6ff55;border-radius:50%;box-shadow:inset 0 0 16px #66ddff16,0 0 14px #66ddff26;animation:orbital-drift 32s linear infinite}
.orbit-ring:after{content:'';position:absolute;inset:-2px;border-radius:50%;border:3px solid transparent;border-top-color:#9cecff;border-left-color:#9cecff22;filter:drop-shadow(0 0 5px #76deff)}
.orbit-ring i,.marquee-bulb{position:absolute;left:50%;top:50%;width:var(--dot-size,6px);height:var(--dot-size,6px);border-radius:50%;background:#e9ffff;box-shadow:0 0 5px 2px #a3eeff,0 0 16px 5px #46bfee66;transform:translate(-50%,-50%) rotate(var(--dot-angle)) translateY(calc(var(--orbit-radius) * -1))}
.orbit-ring-0{--orbit-radius:calc(var(--design-wheel,450px) * .49)}
.orbit-ring-1{inset:5%;--orbit-radius:calc(var(--design-wheel,450px) * .45);animation:orbital-drift 24s linear infinite reverse;border-style:dashed;border-color:#a797ff66;transform:rotate(30deg)}
.orbit-ring-1 i{background:#f3deff;box-shadow:0 0 6px 2px #c79eff,0 0 16px 5px #a973ff44}
.orbit-ring-2{inset:9%;--orbit-radius:calc(var(--design-wheel,450px) * .41);animation-duration:40s;border-color:#6fcfff55}
.orbit-ring-2:after{border-width:1px;border-top-color:#fff}
.orbit-haze{position:absolute;inset:-3%;border-radius:50%;background:radial-gradient(ellipse,#53bdff20 35%,#7083ff16 56%,transparent 72%);z-index:-1}
.variant-pointer{position:absolute;z-index:5;left:50%;top:5%;transform:translateX(-50%);font-size:36px;color:#edfcff;text-shadow:0 0 8px #66d7ff,0 0 20px #4b9eff;line-height:1}
.variant-hub{position:absolute;z-index:4;left:37%;top:37%;width:26%;height:26%;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle at 35% 20%,#235365,#071822 70%);border:2px solid #c2f4ff;box-shadow:0 0 0 6px #6de0ff24,0 0 24px #66d9ff66,inset 0 0 18px #82f6ff33;color:#e7fcff}
.variant-hub>span{font-size:24px;line-height:1}.variant-hub strong{font-size:clamp(9px,1.2vw,13px);max-width:85%;overflow-wrap:anywhere}.variant-hub small{font-size:7px;letter-spacing:1.5px;margin-top:5px}.variant-hub img{width:65%;max-height:65%;object-fit:contain}
.wheel-style-caption{position:absolute;top:100%;left:0;width:100%;text-align:center;color:#a3d8ed;font-size:9px;letter-spacing:2px;padding-top:14px}
.lucky-wheel--studio .marquee-frame{inset:2%;border:8px solid #765327;border-radius:50%;background:radial-gradient(circle,transparent 61%,#171018 62%,#463021 67%,#ffe6a6 68%,#694a29 70%,#171018 72%);box-shadow:0 0 0 2px #e4bb65,0 14px 30px #0009,inset 0 0 22px #000}
.marquee-bulb{--dot-size:8px;background:#fff4c4;box-shadow:0 0 4px 2px #fff3b4,0 0 12px 3px #ffc76477;animation:marquee-glow 3.6s ease-in-out infinite;transform:translate(-50%,-50%) rotate(var(--dot-angle)) translateY(calc(var(--design-wheel,410px) * -.445))}
.marquee-ticks{position:absolute;inset:6%;border-radius:50%;background:repeating-conic-gradient(#ffe6a6 0deg 1deg,transparent 1deg 6deg);mask:radial-gradient(circle,transparent 67%,#000 68%,#000 70%,transparent 71%);animation:orbital-drift 60s linear infinite}
.lucky-wheel--studio .variant-rotor{width:76%;height:76%;left:12%;top:12%}
.lucky-wheel--studio .variant-pointer{top:6%;font-size:32px;color:#ffedb8;text-shadow:0 2px 0 #714b22,0 0 10px #f7ce7c;filter:drop-shadow(0 3px 3px #000)}
.lucky-wheel--studio .variant-hub{left:36%;top:36%;width:28%;height:28%;border:5px double #ffe3a1;background:radial-gradient(circle at 40% 25%,#59432e,#20151c 72%);box-shadow:0 0 0 4px #261921,0 8px 14px #0007,inset 0 0 10px #eac67744;color:#ffe9b4}
.lucky-wheel--studio .variant-hub>span{font-size:20px;color:#ffd075}
.lucky-wheel--studio .wheel-style-caption{color:#e6c28c;letter-spacing:3px}
.stage-foot{position:absolute;width:40%;height:12%;bottom:-5%;left:30%;background:linear-gradient(#5d4024,#171018 55%,#b48b46 58%,#2d1f20 70%);clip-path:polygon(24% 0,76% 0,100% 100%,0 100%);z-index:-1}
@keyframes orbital-drift{to{transform:rotate(360deg)}}
.wheel-reward-label{font-family:Arial,"Noto Sans Myanmar",sans-serif;font-variant-numeric:tabular-nums;letter-spacing:.2px;filter:drop-shadow(0 1px 1px #0005)}
.lucky-wheel{margin:16px auto 28px}
.variant-rotor,.lucky-wheel--studio .variant-rotor{width:92%;height:92%;left:4%;top:4%}
.orbit-ring-1{inset:2.5%}.orbit-ring-2{inset:4%}
.orbit-ring:after{border-width:2px}.orbit-ring-2:after{border-width:1px}
.variant-pointer{top:1%;font-size:30px}
.variant-hub,.lucky-wheel--studio .variant-hub{left:39%;top:39%;width:22%;height:22%;box-shadow:0 0 0 3px #6de0ff24,0 4px 12px #0006}
.variant-hub>span{font-size:18px}.variant-hub small{font-size:6px;letter-spacing:.7px;margin-top:3px}
.lucky-wheel--studio .variant-hub{border-width:3px;box-shadow:0 0 0 2px #261921,0 4px 10px #0007,inset 0 0 10px #eac67744}
.lucky-wheel--studio .variant-hub>span{font-size:16px}
.lucky-wheel--studio .marquee-frame{inset:1%;border-width:3px;background:radial-gradient(circle,transparent 65%,#241b18 66%,#8c6738 69%,#171018 71%);box-shadow:0 0 0 1px #e4bb65,0 8px 20px #0007}
.marquee-ticks{inset:3%;mask:radial-gradient(circle,transparent 68%,#000 69%,#000 71%,transparent 72%);opacity:.7}
.lucky-wheel--studio .variant-pointer{top:1%;font-size:27px}
.marquee-bulb{--dot-size:6px;z-index:3}
.stage-foot{height:7%;bottom:-2%;width:32%;left:34%}
.wheel-style-caption{padding-top:8px;font-size:8px;letter-spacing:1px}
.luckyspin-variant-aurora .spin-panel,.luckyspin-variant-studio .spin-panel{padding:20px 16px;border-color:#ffffff0b}
.luckyspin-variant-aurora .spin-caption,.luckyspin-variant-studio .spin-caption{margin-bottom:12px}
@media(max-width:600px){.luckyspin-variant-aurora .spin-panel,.luckyspin-variant-studio .spin-panel{padding:16px 10px}.luckyspin-variant-aurora .design-intro,.luckyspin-variant-studio .design-intro{margin:16px auto}.variant-hub strong{font-size:9px}.variant-hub small{font-size:5px}.variant-hub>span{font-size:16px}}
.orbit-ring i,.marquee-bulb{transform:translate(-50%,-50%)}
@keyframes marquee-glow{0%,100%{opacity:.45;box-shadow:0 0 3px #ffc76444}45%,65%{opacity:1;box-shadow:0 0 5px 2px #fff4b9,0 0 13px 3px #ffcb6b77}}
@media(max-width:600px){.lucky-wheel{--design-wheel:min(100vw - 64px,410px)!important}.variant-hub strong{font-size:10px}.variant-pointer{font-size:30px}.marquee-bulb{--dot-size:6px}}
@media(prefers-reduced-motion:reduce){.orbit-ring,.marquee-ticks,.marquee-bulb{animation:none}.variant-rotor{transition-duration:.01s!important}}