.spin-root{container-type:inline-size;container-name:spinroot;font-family:var(--spin-font-body);color:var(--spin-text);background:var(--spin-bg);-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;isolation:isolate}.spin-display{font-family:var(--spin-font-display);letter-spacing:.005em}.spin-h1{font-size:2.15rem;font-size:clamp(1.9rem,9.4cqw,2.7rem)}@container spinroot (min-width: 860px){.spin-h1{font-size:3.4rem}}.spin-root :focus-visible{outline:3px solid var(--spin-accent);outline-offset:3px}.spin-root [tabindex="-1"]:focus-visible{outline:none}.spin-layout{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "wheel" "panel" "info";row-gap:18px}.spin-area-head{grid-area:head}.spin-area-wheel{grid-area:wheel;justify-self:center;width:min(90%,460px)}.spin-area-panel{grid-area:panel}.spin-area-info{grid-area:info}@container spinroot (min-width: 860px){.spin-layout{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);grid-template-rows:auto auto 1fr;grid-template-areas:"wheel head" "wheel panel" "wheel info";column-gap:56px;row-gap:22px}.spin-area-wheel{position:sticky;top:28px;align-self:start;width:min(100%,540px);margin-top:8px}}.spin-marquee{overflow:hidden;background:var(--spin-primary);color:var(--spin-primary-text);border-bottom:2px solid var(--spin-accent)}.spin-marquee-track{display:flex;width:max-content;animation:spin-marquee 32s linear infinite}@keyframes spin-marquee{to{transform:translate(-50%)}}.spin-beams{position:absolute;top:-10%;right:-20%;bottom:30%;left:-20%;background:conic-gradient(from 148deg at 18% 0%,transparent 0deg,rgba(255,255,255,var(--spin-beam)) 9deg,transparent 20deg),conic-gradient(from 190deg at 82% 0%,transparent 0deg,rgba(255,255,255,var(--spin-beam)) 10deg,transparent 22deg);-webkit-mask-image:linear-gradient(180deg,#000 20%,transparent 95%);mask-image:linear-gradient(180deg,#000 20%,transparent 95%);transform-origin:50% 0;animation:spin-beam-sway 16s ease-in-out infinite alternate}@keyframes spin-beam-sway{0%{transform:rotate(-2.5deg)}to{transform:rotate(2.5deg)}}.spin-emoji-col{position:absolute;top:0;height:100%;width:0;animation-name:spin-emoji-fall;animation-timing-function:linear;animation-iteration-count:infinite;will-change:transform}.spin-emoji{position:absolute;top:-3em;left:0;transform:translate(-50%);animation:spin-emoji-sway 5s ease-in-out infinite alternate;-webkit-user-select:none;user-select:none}@keyframes spin-emoji-fall{0%{transform:translateY(-4%)}to{transform:translateY(112%)}}@keyframes spin-emoji-sway{0%{transform:translate(-80%) rotate(-14deg)}to{transform:translate(-20%) rotate(14deg)}}.spin-wheel-rim{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:radial-gradient(circle at 50% 50%,transparent 62%,rgba(0,0,0,.35) 64.5%,transparent 67%),conic-gradient(from 20deg,var(--spin-accent-dark),var(--spin-accent),var(--spin-accent-light),var(--spin-accent),var(--spin-accent-dark),var(--spin-accent),var(--spin-accent-light),var(--spin-accent),var(--spin-accent-dark));box-shadow:0 calc(var(--wheel) * .05) calc(var(--wheel) * .1) var(--spin-shadow),0 0 0 calc(var(--wheel) * .008) #00000040,inset 0 0 calc(var(--wheel) * .02) #00000073}.spin-wheel-rotor{position:absolute;top:7%;right:7%;bottom:7%;left:7%;border-radius:50%;will-change:transform;box-shadow:0 0 0 calc(var(--wheel) * .006) #00000059}.spin-wheel-gloss{position:absolute;top:7%;right:7%;bottom:7%;left:7%;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse 70% 55% at 32% 18%,rgba(255,255,255,.2),transparent 60%)}.spin-wheel-hub{position:absolute;left:50%;top:50%;width:21%;height:21%;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,var(--spin-primary),var(--spin-primary-dark));box-shadow:0 0 0 calc(var(--wheel) * .014) var(--spin-accent),0 0 0 calc(var(--wheel) * .022) #0000004d,0 calc(var(--wheel) * .02) calc(var(--wheel) * .04) #00000073;font-size:calc(var(--wheel) * .095);line-height:1}.spin-wheel-hub>span{filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}[data-state=spinning] .spin-wheel-hub>span{animation:spin-hub-bob .5s ease-in-out infinite alternate}[data-state=win] .spin-wheel-hub>span{animation:spin-hub-pop .6s cubic-bezier(.2,1.8,.4,1) both}@keyframes spin-hub-bob{to{transform:scale(1.12)}}@keyframes spin-hub-pop{0%{transform:scale(.6)}to{transform:scale(1)}}.spin-wheel-pointer{position:absolute;left:50%;top:-6.2%;width:12.5%;height:15.8%;transform:translate(-50%);transform-origin:50% 29.6%;filter:drop-shadow(0 calc(var(--wheel) * .012) calc(var(--wheel) * .012) rgba(0,0,0,.45));z-index:3}.spin-bulb{position:absolute;width:max(5px,calc(var(--wheel) * .028));height:max(5px,calc(var(--wheel) * .028));transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 35% 35%,#ffffff,var(--spin-accent-light) 45%,var(--spin-accent));box-shadow:0 0 calc(var(--wheel) * .03) var(--spin-accent-glow);opacity:.5}[data-state=idle] .spin-bulb{animation:spin-twinkle 1.8s ease-in-out infinite}[data-state=idle] .spin-bulb[data-odd="1"]{animation-delay:-.9s}[data-state=spinning] .spin-bulb{animation:spin-chase .36s linear infinite;animation-delay:calc(var(--phase) * -.12s)}[data-state=win] .spin-bulb{animation:spin-flash .5s steps(1,end) infinite}[data-state=win] .spin-bulb[data-odd="1"]{animation-delay:-.25s}@keyframes spin-twinkle{0%,to{opacity:.35}50%{opacity:1}}@keyframes spin-chase{0%,30%{opacity:1}36%,to{opacity:.22}}@keyframes spin-flash{0%{opacity:1}50%{opacity:.25}}.spin-win-wedge{animation:spin-wedge-glow .9s ease-in-out infinite alternate}.spin-dim{animation:spin-fade-in .4s ease-out both}@keyframes spin-wedge-glow{0%{stroke-opacity:.5}to{stroke-opacity:1}}@keyframes spin-fade-in{0%{opacity:0}}.spin-cta{position:relative;overflow:hidden;background:var(--spin-primary);color:var(--spin-primary-text);box-shadow:0 6px 0 var(--spin-primary-dark),0 16px 30px var(--spin-primary-glow);transition:transform .08s ease,box-shadow .08s ease,filter .2s ease;touch-action:manipulation}.spin-cta:hover:not(:disabled){filter:brightness(1.06)}.spin-cta:active:not(:disabled){transform:translateY(5px);box-shadow:0 1px 0 var(--spin-primary-dark),0 6px 14px var(--spin-primary-glow)}.spin-cta:disabled{cursor:progress;filter:saturate(.75)}.spin-cta:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);transform:translate(-120%);animation:spin-shine 3.4s ease-in-out infinite 1s}.spin-cta:disabled:after{animation:none}@keyframes spin-shine{0%{transform:translate(-120%)}45%,to{transform:translate(120%)}}.spin-press{transition:transform .08s ease;touch-action:manipulation}.spin-press:active:not(:disabled){transform:scale(.97)}.spin-seg-thumb{transition:transform .28s cubic-bezier(.3,1.4,.5,1),opacity .2s}.spin-ticket{filter:drop-shadow(0 14px 22px var(--spin-shadow))}.spin-ticket-top,.spin-ticket-bottom{background:var(--spin-accent);color:var(--spin-on-accent)}.spin-ticket-top{border-radius:22px 22px 0 0;-webkit-mask:radial-gradient(circle at 0 100%,transparent 12px,#000 12.5px) left / 51% 100% no-repeat,radial-gradient(circle at 100% 100%,transparent 12px,#000 12.5px) right / 51% 100% no-repeat;mask:radial-gradient(circle at 0 100%,transparent 12px,#000 12.5px) left / 51% 100% no-repeat,radial-gradient(circle at 100% 100%,transparent 12px,#000 12.5px) right / 51% 100% no-repeat}.spin-ticket-bottom{border-radius:0 0 22px 22px;-webkit-mask:radial-gradient(circle at 0 0,transparent 12px,#000 12.5px) left / 51% 100% no-repeat,radial-gradient(circle at 100% 0,transparent 12px,#000 12.5px) right / 51% 100% no-repeat;mask:radial-gradient(circle at 0 0,transparent 12px,#000 12.5px) left / 51% 100% no-repeat,radial-gradient(circle at 100% 0,transparent 12px,#000 12.5px) right / 51% 100% no-repeat}.spin-ticket-perf{position:absolute;left:20px;right:20px;top:-1px;border-top:2px dashed var(--spin-on-accent-soft);opacity:.55}.spin-pop{animation:spin-pop-in .55s cubic-bezier(.2,1.4,.4,1) both}@keyframes spin-pop-in{0%{opacity:0;transform:translateY(14px) scale(.94)}}.spin-rise{animation:spin-rise-in .45s ease-out both}@keyframes spin-rise-in{0%{opacity:0;transform:translateY(10px)}}.spin-spinner{width:1.1em;height:1.1em;border-radius:50%;border:3px solid currentColor;border-right-color:transparent;animation:spin-rotate .7s linear infinite}@keyframes spin-rotate{to{transform:rotate(360deg)}}.spin-static *,.spin-static *:before,.spin-static *:after{animation:none!important}@media (prefers-reduced-motion: reduce){.spin-root *,.spin-root *:before,.spin-root *:after{animation:none!important;transition-duration:.01ms!important}.spin-root [data-state=win] .spin-bulb{opacity:1}}