.arcane-wheel{aspect-ratio:1;isolation:isolate;margin-top:12px;position:relative;container-type:inline-size}.arcane-wheel__assembly{isolation:isolate;position:absolute;inset:0}.arcane-wheel__frame,.arcane-wheel__hub,.arcane-wheel__pointer,.arcane-wheel__energy{pointer-events:none;background-position:50%;background-repeat:no-repeat;background-size:contain;position:absolute}.arcane-wheel__disc{transform-origin:50%;backface-visibility:hidden;contain:layout style paint;border-radius:50%;position:absolute;inset:10%}.arcane-wheel__disc svg{display:block}.arcane-wheel__frame{z-index:2;background-image:var(--wheel-frame,url(/assets/lucky-wheel/arcane/frame.webp));filter:drop-shadow(0 4px 8px #080013bb);inset:0}.arcane-wheel__energy{background-image:var(--wheel-orbit,url(/assets/lucky-wheel/arcane/energy.webp));transition:opacity .7s}.arcane-wheel__energy--back{z-index:-1;opacity:.4;animation:24s linear infinite arcane-orbit;inset:-5%}.arcane-wheel__energy--front{z-index:3;opacity:.22;animation:16s linear infinite reverse arcane-orbit;inset:-1%}.arcane-wheel[data-spinning=true] .arcane-wheel__energy--back{opacity:1}.arcane-wheel[data-spinning=true] .arcane-wheel__energy--front{opacity:.65}.arcane-wheel__hub{z-index:4;background-image:var(--wheel-hub,url(/assets/lucky-wheel/arcane/hub.webp));filter:drop-shadow(0 3px 5px #1c002dc9);inset:37%}.arcane-wheel[data-spinning=true] .arcane-wheel__hub{animation:1.4s ease-in-out infinite arcane-hub-breathe}.arcane-wheel__pointer-anchor{aspect-ratio:1;z-index:5;pointer-events:none;width:23%;position:absolute;top:-4%;left:38.5%}.arcane-wheel__pointer{transform-origin:50% 24%;background-image:var(--wheel-pointer,url(/assets/lucky-wheel/arcane/pointer.webp));filter:drop-shadow(0 3px 4px #21002bab);inset:0}.arcane-wheel__prize-label{font-family:var(--font-lobby-primary), "Noto Sans Thai Variable", sans-serif;paint-order:stroke fill;stroke:#420652;stroke-width:1.7px;stroke-linejoin:round;filter:drop-shadow(0 1.5px #21002c99)}.arcane-wheel__winning-sector{opacity:.25;animation:.65s ease-out arcane-win}.arcane-wheel[data-winning=true] .arcane-wheel__energy{opacity:1}.arcane-wheel-button{aspect-ratio:3;background:var(--wheel-spin-button,url(/assets/lucky-wheel/arcane/spin-button.webp)) center / contain no-repeat;color:#fff0ac;width:min(270px,82%);font:inherit;text-shadow:0 2px #8b2b08,0 0 12px #ffbc3870;cursor:pointer;-webkit-tap-highlight-color:transparent;border:0;margin:4px auto 0;padding:0 24px 6px;font-size:clamp(18px,3.5vw,25px);font-weight:900;transition:transform .18s,filter .18s;display:block;position:relative}.arcane-wheel-button:not(:disabled):hover{filter:brightness(1.15)drop-shadow(0 0 12px #d73cff66);transform:translateY(-2px)scale(1.025)}.arcane-wheel-button:not(:disabled):active{transform:scale(.96)}.arcane-wheel-button:focus-visible{outline-offset:3px;border-radius:40px;outline:2px solid #fff0ac}.arcane-wheel-button:disabled{cursor:not-allowed;filter:saturate(.35)brightness(.7)}.arcane-wheel-button[aria-busy=true]{filter:saturate(.8);font-size:18px}@keyframes arcane-orbit{to{transform:rotate(360deg)}}@keyframes arcane-hub-breathe{50%{transform:scale(1.055)}}@keyframes arcane-win{0%,to{opacity:.15}40%{opacity:.65}}@media (prefers-reduced-motion:reduce){.arcane-wheel *,.arcane-wheel-button{transition:none!important;animation:none!important}.arcane-wheel__energy--back{opacity:.25!important}.arcane-wheel__energy--front{opacity:.1!important}}
.wheel-scene{isolation:isolate;color:#fff3d4;text-align:center;width:min(100%,540px);min-height:720px;font-family:var(--font-lobby-primary), "Noto Sans Thai Variable", sans-serif;background:#160b28;padding:42px 24px 32px;position:relative;overflow:hidden}.wheel-scene__depth{z-index:-4;pointer-events:none;transform:translate3d(calc(var(--scene-x,0px) * -.4), calc(var(--scene-y,0px) * -.4), 0);transition:transform .6s ease-out;position:absolute;inset:-14px}.wheel-scene__background{background:var(--wheel-background) center / cover no-repeat;animation:24s ease-in-out infinite alternate wheel-background-drift;position:absolute;inset:0}.wheel-scene__motion-toggle{color:#fff3d4;min-height:36px;font:inherit;cursor:pointer;background:#160b28b8;border:1px solid #f1d29e70;border-radius:20px;margin-top:10px;padding:4px 12px;font-size:11px}.wheel-scene__motion-toggle:focus-visible{outline-offset:3px;outline:2px solid #fff3d4}.wheel-scene[data-motion=paused] .wheel-scene__background{animation-play-state:paused}.wheel-scene[data-motion=paused] .wheel-scene__depth{transition:none;transform:none}.wheel-scene[data-motion=paused] .arcane-wheel__energy,.wheel-scene[data-motion=paused] .arcane-wheel__hub{animation:none}.wheel-scene[data-motion=paused] .arcane-wheel__assembly{transform:none!important}@keyframes wheel-background-drift{0%{transform:scale(1.025)translate(-3px,-2px)}to{transform:scale(1.04)translate(3px,3px)}}@media (prefers-reduced-motion:reduce){.wheel-scene__background{animation:none}.wheel-scene__depth{transition:none;transform:none}}.wheel-scene:before{content:"";z-index:-1;background:linear-gradient(#09041ccc 0%,#09041c30 38%,#09041c10 65%,#09041ce6 100%);position:absolute;inset:0}.wheel-scene__header{margin-bottom:30px}.wheel-scene__header p{margin:0}.wheel-scene__eyebrow{font-size:15px;font-weight:700}.wheel-scene__header h2{color:#fff3d4;text-shadow:0 3px 3px #230812;margin:4px 0;font-size:clamp(28px,7vw,38px);font-weight:900;line-height:1.3}.wheel-scene__subtitle{color:#fff0d2;font-size:14px}.wheel-scene__header .wheel-scene__entitlement{color:#fff3d4;background:#180b20d9;border:1px solid #edc47380;border-radius:20px;margin-top:14px;padding:6px 16px;font-size:13px;display:inline-block}.wheel-scene__wheel{width:100%;margin:0 auto}.wheel-scene__action{margin-top:12px;position:relative}.wheel-scene__action .arcane-wheel-button{width:min(330px,88%)}.wheel-scene__result{min-height:24px;margin:10px 0 4px;font-size:15px;font-weight:700}.wheel-scene__demo{color:#fff0d2;margin:0;font-size:11px}.wheel-scene__close{z-index:6;background:var(--wheel-close) center / contain no-repeat;cursor:pointer;border:0;width:44px;height:44px;position:absolute;top:12px;right:12px}.wheel-scene__close:hover{filter:brightness(1.15)}.wheel-scene__close:focus-visible{outline-offset:2px;border-radius:50%;outline:3px solid #fff3d4}.wheel-skin-preview{width:100%;max-width:1024px;margin:auto}.wheel-skin-picker{flex-wrap:wrap;justify-content:center;gap:8px;padding:20px 12px;display:flex}.wheel-skin-picker button{color:#f6ecff;cursor:pointer;font:inherit;background:#241c30;border:1px solid #756887;border-radius:30px;align-items:center;gap:8px;padding:6px 12px 6px 6px;font-size:13px;display:flex}.wheel-skin-picker img{object-fit:cover;border-radius:50%;width:32px;height:32px}.wheel-skin-picker button[aria-pressed=true]{color:#fff4d6;background:#594126;border-color:#ffd381}.wheel-skin-picker button:focus-visible{outline-offset:3px;outline:3px solid #ffd381}.wheel-skin-picker button:hover{background:#42324e}.wheel-skin-preview>.wheel-scene{margin:auto}.wheel-skin-gallery{background:#100a19;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:24px;max-width:1440px;margin:auto;padding:24px;display:grid}.wheel-skin-gallery .wheel-scene{margin:auto}.wheel-asset-gallery{color:#fff3d4;background:#160f23;max-width:1200px;margin:auto;padding:24px}.wheel-asset-gallery h2{margin:32px 0 16px}.wheel-asset-gallery__parts{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;display:grid}.wheel-asset-gallery figure{background:#30233f;border:1px solid #5c4b6e;border-radius:12px;margin:0;padding:12px}.wheel-asset-gallery img{object-fit:contain;width:100%;height:140px;display:block}.wheel-asset-gallery figcaption{text-align:center;margin-top:12px;font-size:13px}.wheel-preview-closed{text-align:center;color:#fff3d4;place-content:center;min-height:300px;display:grid}.wheel-preview-closed button{color:#fff3d4;font:inherit;cursor:pointer;background:#594126;border:1px solid #ffd381;border-radius:8px;padding:12px 24px}@media (max-width:420px){.wheel-scene{min-height:620px;padding:52px 14px 28px}.wheel-scene__header{margin-bottom:26px}.wheel-scene__action{margin-top:18px}.wheel-skin-gallery{padding:12px}}.wheel-scene__foreground{z-index:1;pointer-events:none;transform:translate3d(var(--scene-x,0px), var(--scene-y,0px), 0);transition:transform .6s ease-out,opacity .5s;position:absolute;inset:0}.wheel-scene__prop{width:25%;position:absolute;bottom:12%;left:-11%}.wheel-scene__prop--right{width:21%;bottom:28%;left:auto;right:-10%}.wheel-scene__prop img{width:100%;filter:blur(var(--scene-near-blur,.8px)) drop-shadow(0 5px 8px #12062280);transform-origin:50% 15%;animation:10s ease-in-out infinite alternate wheel-prop-float;display:block}.wheel-scene__prop--right img{animation-duration:12s;animation-delay:-3s}.wheel-scene[data-skin=chinese-new-year] .wheel-scene__prop,.wheel-scene[data-skin=christmas] .wheel-scene__prop{top:5%;bottom:auto}.wheel-scene[data-skin=chinese-new-year] .wheel-scene__prop img,.wheel-scene[data-skin=christmas] .wheel-scene__prop img{animation-name:wheel-prop-sway}.wheel-scene[data-skin=songkran] .wheel-scene__prop img{animation-duration:8s}.wheel-scene{--trail-back:hue-rotate(0deg);--trail-front:hue-rotate(0deg)}.wheel-scene[data-skin=new-year]{--trail-back:hue-rotate(115deg) saturate(1.4);--trail-front:hue-rotate(80deg) saturate(1.2)}.wheel-scene[data-skin=loy-krathong]{--trail-back:hue-rotate(-140deg);--trail-front:hue-rotate(25deg)}.wheel-scene[data-skin=songkran]{--trail-back:hue-rotate(-95deg) saturate(1.3);--trail-front:hue-rotate(-70deg) saturate(.6)}.wheel-scene[data-skin=christmas]{--trail-back:hue-rotate(-140deg) saturate(1.3);--trail-front:hue-rotate(75deg) saturate(1.4)}.wheel-scene[data-skin=chinese-new-year]{--trail-back:hue-rotate(75deg) saturate(1.6);--trail-front:hue-rotate(115deg) saturate(1.5)}.wheel-scene .arcane-wheel__energy{background-image:url(/assets/lucky-wheel/arcane/energy.webp)}.wheel-scene .arcane-wheel__energy--back{opacity:.4;filter:var(--trail-back);inset:-5%}.wheel-scene .arcane-wheel__energy--front{opacity:.22;filter:var(--trail-front);inset:-1%}.wheel-scene .arcane-wheel[data-spinning=true] .arcane-wheel__energy--back{opacity:.65}.wheel-scene .arcane-wheel[data-spinning=true] .arcane-wheel__energy--front{opacity:.4}.wheel-scene .arcane-wheel[data-winning=true] .arcane-wheel__energy--back{opacity:.65}.wheel-scene .arcane-wheel[data-winning=true] .arcane-wheel__energy--front{opacity:.4}.wheel-scene .arcane-wheel__hub{animation:none}.wheel-scene[data-spinning=true] .wheel-scene__background,.wheel-scene[data-spinning=true] .wheel-scene__prop img{animation-play-state:paused}.wheel-scene[data-spinning=true] .wheel-scene__foreground{opacity:.35}.wheel-scene[data-motion=paused] .wheel-scene__prop img{animation-play-state:paused}.wheel-scene[data-motion=paused] .wheel-scene__foreground{transition:none;transform:none}@keyframes wheel-prop-float{0%{transform:translateY(2px)rotate(-1deg)}to{transform:translateY(-3px)rotate(1deg)}}@keyframes wheel-prop-sway{0%{transform:rotate(-2deg)}to{transform:rotate(2deg)}}@media (prefers-reduced-motion:reduce){.wheel-scene__prop img{animation:none}.wheel-scene__foreground{transition:none;transform:none}}.wheel-scene[data-skin=halloween]{--trail-back:hue-rotate(15deg) saturate(1.5);--trail-front:hue-rotate(30deg) saturate(1.4);--ambient-animation:wheel-cloud-drift;--ambient-duration:20s}.wheel-scene__title-art{width:min(100%,390px);height:auto;margin:0 auto;display:block}.wheel-scene[data-skin=halloween]:before{background:linear-gradient(#18032e20 0%,#18032e10 65%,#18032ed9 100%)}.wheel-scene[data-skin=halloween] .wheel-scene__header{margin-bottom:16px}.wheel-scene[data-skin=halloween] .wheel-scene__distant{display:none}.wheel-scene[data-skin=halloween] .wheel-scene__prop img{filter:drop-shadow(0 8px 18px #080412aa)}.wheel-scene[data-skin=halloween] .arcane-wheel__prize-label{stroke:#230d36}.wheel-scene[data-skin=voxel]{--trail-back:hue-rotate(-95deg) saturate(1.3);--trail-front:hue-rotate(-140deg) saturate(1.2)}.wheel-scene[data-skin=voxel] .arcane-wheel__prize-label{stroke:#17331e}.wheel-scene{--scene-far-blur:.35px;--scene-atmosphere-blur:1.3px;--scene-mid-blur:0px;--scene-near-blur:.8px;--ambient-animation:wheel-crystal-drift;--ambient-duration:12s}.wheel-scene[data-depth=off]{--scene-far-blur:0px;--scene-atmosphere-blur:0px;--scene-mid-blur:0px;--scene-near-blur:0px}.wheel-scene__background{filter:blur(var(--scene-far-blur))}.wheel-scene__atmosphere,.wheel-scene__midground{pointer-events:none;transition:transform .7s ease-out,opacity .7s;position:absolute;inset:-12px}.wheel-scene__atmosphere{z-index:-3;transform:translate3d(calc(var(--scene-x,0px) * -.2), calc(var(--scene-y,0px) * -.2), 0)}.wheel-scene__midground{z-index:-2;transform:translate3d(calc(var(--scene-x,0px) * .45), calc(var(--scene-y,0px) * .45), 0)}.wheel-scene__distant,.wheel-scene__ambient{width:17%;position:absolute;top:7%;left:2%}.wheel-scene__ambient--1{width:13%;top:18%;left:auto;right:0}.wheel-scene__distant{opacity:.45;width:8%;top:2%;left:28%}.wheel-scene__distant--1{width:5%;top:28%;left:auto;right:7%}.wheel-scene__ambient img,.wheel-scene__distant img{width:100%;height:auto;animation:var(--ambient-animation) var(--ambient-duration) ease-in-out infinite;display:block}.wheel-scene__ambient img{filter:blur(var(--scene-mid-blur))}.wheel-scene__distant img{filter:blur(var(--scene-atmosphere-blur));animation-duration:calc(var(--ambient-duration) * 1.5);animation-delay:-5s}.wheel-scene__ambient--1 img,.wheel-scene__distant--1 img{animation-delay:-7s}.wheel-scene__header,.wheel-scene__wheel{z-index:2;position:relative}.wheel-scene__action{z-index:2}.wheel-scene[data-skin=new-year]{--ambient-animation:wheel-firework-bloom;--ambient-duration:10s}.wheel-scene[data-skin=new-year] .wheel-scene__ambient{width:31%;top:1%;left:-8%}.wheel-scene[data-skin=new-year] .wheel-scene__ambient--1{width:26%;top:12%;left:auto;right:-8%}.wheel-scene[data-skin=loy-krathong]{--ambient-animation:wheel-lantern-rise;--ambient-duration:20s}.wheel-scene[data-skin=songkran]{--ambient-animation:wheel-water-flow;--ambient-duration:7s}.wheel-scene[data-skin=songkran] .wheel-scene__ambient{width:24%;top:32%;left:-7%}.wheel-scene[data-skin=songkran] .wheel-scene__ambient--1{top:58%;left:auto;right:-7%}.wheel-scene[data-skin=christmas]{--ambient-animation:wheel-snow-fall;--ambient-duration:17s}.wheel-scene[data-skin=christmas] .wheel-scene__ambient{width:6%}.wheel-scene[data-skin=christmas] .wheel-scene__distant{width:3%}.wheel-scene[data-skin=chinese-new-year]{--ambient-animation:wheel-blossom-sway;--ambient-duration:11s}.wheel-scene[data-skin=chinese-new-year] .wheel-scene__ambient{width:27%;top:1%;left:-6%}.wheel-scene[data-skin=chinese-new-year] .wheel-scene__ambient--1{width:22%;top:21%;left:auto;right:-6%}.wheel-scene[data-skin=voxel]{--ambient-animation:wheel-cloud-drift;--ambient-duration:28s}.wheel-scene[data-skin=voxel] .wheel-scene__ambient{width:27%;top:0;left:-9%}.wheel-scene[data-skin=voxel] .wheel-scene__ambient--1{width:23%;top:19%;left:auto;right:-7%}@keyframes wheel-crystal-drift{0%,to{opacity:.75;transform:translateY(4px)rotate(-3deg)}50%{opacity:1;transform:translate(4px,-10px)rotate(4deg)}}@keyframes wheel-firework-bloom{0%,12%,to{opacity:0;transform:scale(.4)}30%{opacity:.8}65%{opacity:.25;transform:scale(1)}82%{opacity:0;transform:scale(1.07)}}@keyframes wheel-lantern-rise{0%{opacity:0;transform:translate(-4px,36px)rotate(-3deg)}20%,70%{opacity:.85}to{opacity:0;transform:translate(9px,-68px)rotate(4deg)}}@keyframes wheel-water-flow{0%,to{opacity:.5;transform:translateY(8px)scaleY(.94)}50%{opacity:.9;transform:translate(3px,-5px)scaleY(1.03)}}@keyframes wheel-snow-fall{0%{opacity:0;transform:translate(-8px,-25px)rotate(0)}15%,80%{opacity:.7}to{opacity:0;transform:translate(25px,430px)rotate(110deg)}}@keyframes wheel-blossom-sway{0%,to{transform:rotate(-4deg)translate(0,0)}50%{transform:rotate(4deg)translate(3px,4px)}}@keyframes wheel-cloud-drift{0%,to{transform:translate(-15px)}50%{transform:translate(18px,3px)}}.wheel-scene[data-motion=paused] .wheel-scene__ambient img,.wheel-scene[data-motion=paused] .wheel-scene__distant img,.wheel-scene[data-spinning=true] .wheel-scene__ambient img,.wheel-scene[data-spinning=true] .wheel-scene__distant img{animation-play-state:paused}.wheel-scene[data-motion=paused] .wheel-scene__atmosphere,.wheel-scene[data-motion=paused] .wheel-scene__midground{transition:none;transform:none}.wheel-scene[data-spinning=true] .wheel-scene__midground,.wheel-scene[data-spinning=true] .wheel-scene__atmosphere{opacity:.4}@media (prefers-reduced-motion:reduce){.wheel-scene__ambient img,.wheel-scene__distant img{animation:none}.wheel-scene__atmosphere,.wheel-scene__midground{transition:none;transform:none}}
