/*!
 * Spin the Wheel — stylesheet (v3 — pixel-perfect responsive)
 *
 * Layout: Always vertically stacked (wheel centered, controls below).
 * The wheel fills ~90% of viewport width on mobile, scaling up to 650px
 * on desktop. Hub is ~22% of wheel diameter. Segment text scales
 * proportionally. All sizing uses the wheel wrapper width as the
 * reference unit so everything stays proportional at every breakpoint.
 */@property --sw-spin-angle{syntax: "<angle>"; inherits: true; initial-value: 0deg;}.spin-wheel-section{--sw-orange: #eb7507;--sw-orange-dark: #d96c0f;--sw-orange-light: #ffb066;--sw-white: #ffffff;--sw-ink: #1a1a1a;--sw-ink-soft: #5a5148;--sw-pointer: #eb7507;--sw-btn-bg: #eb7507;--sw-btn-text: #ffffff;--sw-popup-bg: #ffffff;--sw-wheel-size: min(90vw, 340px);--sw-unit: calc(var(--sw-wheel-size) / 100);--sw-hub-size: calc(var(--sw-unit) * 20);--sw-border-width: calc(var(--sw-unit) * 1.1);--sw-segment-angle: 60deg;--sw-shadow-wheel: 0 0 0 var(--sw-border-width) var(--sw-orange), 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .08);display:block;position:relative;padding:1.5rem 1rem 2rem;background:var(--sw-section-bg, #fdf1e4);color:var(--sw-ink);overflow:hidden;font-family:inherit}.spin-wheel-section,.spin-wheel-section *,.spin-wheel-section *:before,.spin-wheel-section *:after{box-sizing:border-box}.spin-wheel-container{max-width:100%;margin-inline:auto;padding-inline:0;display:flex;flex-direction:column;align-items:center}.spin-wheel-header{text-align:center;margin-bottom:1rem}.spin-wheel-heading{margin:0 0 .25em;font-size:clamp(1.25rem,1rem + 2vw,2rem);font-weight:700;letter-spacing:-.01em;line-height:1.2;color:var(--sw-ink)}.spin-wheel-heading:after{content:"";display:block;width:clamp(40px,7vw,64px);height:3px;margin:.4em auto 0;border-radius:999px;background:linear-gradient(90deg,var(--sw-orange),var(--sw-orange-light))}.spin-wheel-subheading{margin:0 auto;max-width:46ch;font-size:clamp(.8rem,.75rem + .3vw,.95rem);line-height:1.5;color:var(--sw-ink-soft)}.spin-wheel-content{display:flex;flex-direction:column;align-items:center;gap:1.25rem;width:100%}.spin-wheel-wrapper{position:relative;width:var(--sw-wheel-size);max-width:100%;aspect-ratio:1 / 1;isolation:isolate;transform:translateZ(0);flex-shrink:0}[data-idle-active=true] .spin-wheel-wrapper{animation:sw-float 5.5s ease-in-out infinite}.spin-wheel-wrapper.is-spinning{animation-play-state:paused}.spin-wheel-wrapper:before{content:"";position:absolute;left:50%;bottom:-4%;width:78%;height:10%;background:radial-gradient(closest-side,#201a1433,#201a1400);transform:translate3d(-50%,0,0) scale(1);transform-origin:center;will-change:transform,opacity;pointer-events:none;z-index:0}[data-idle-active=true] .spin-wheel-wrapper:before{animation:sw-shadow-breathe 5.5s ease-in-out infinite}.spin-wheel-wrapper.is-spinning:before{animation-play-state:paused;opacity:1;transform:translate3d(-50%,0,0) scale(1.05)}@media(hover:hover)and (pointer:fine){.spin-wheel-wrapper:hover{animation-play-state:paused}.spin-wheel-wrapper:hover .spin-wheel{transform:translateZ(0) scale(1.015)}}.spin-wheel-pointer{position:absolute;top:-6%;left:50%;z-index:3;width:10%;min-width:24px;max-width:48px;aspect-ratio:1 / 1;transform:translate3d(-50%,0,0);transform-origin:50% 20%;filter:drop-shadow(0 3px 6px rgba(32,26,20,.3));transition:transform .25s ease,filter .25s ease;will-change:transform}.spin-wheel-pointer--dot{border-radius:50%;background:var(--sw-pointer);box-shadow:0 0 0 3px var(--sw-white),0 4px 8px #201a144d}.spin-wheel-pointer--dot .spin-wheel-pointer-icon{display:none}.spin-wheel-wrapper.is-spinning .spin-wheel-pointer{animation:sw-pointer-bounce .18s ease-in-out infinite alternate;filter:drop-shadow(0 6px 10px rgba(32,26,20,.4))}.spin-wheel-pointer-icon{width:100%;height:100%;fill:var(--sw-white);stroke:var(--sw-pointer);stroke-width:1.5;stroke-linejoin:round}.spin-wheel{position:relative;width:100%;height:100%;border-radius:50%;background:var(--sw-white);box-shadow:var(--sw-shadow-wheel);padding:0;transform:translateZ(0) scale(1);backface-visibility:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease;will-change:transform}.spin-wheel:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:var(--sw-border-width) solid var(--sw-orange);pointer-events:none;z-index:1}.spin-wheel-inner{position:relative;width:100%;height:100%;border-radius:50%;overflow:hidden;transform:translateZ(0) rotate(0);backface-visibility:hidden;perspective:1000px;will-change:transform;transition:transform var(--spin-duration, 0s) cubic-bezier(.15,.65,.15,1),--sw-spin-angle var(--spin-duration, 0s) cubic-bezier(.15,.65,.15,1);background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.85) 0deg .35deg,transparent .35deg var(--sw-segment-angle)),conic-gradient(from 0deg,var(--sw-conic-stops, #fff))}.spin-wheel-inner:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:linear-gradient(180deg,#ffffff2e,#fff0 40%);pointer-events:none}.spin-wheel-inner:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 0deg,transparent var(--sw-winner-start, 0deg),rgba(255,255,255,.85) calc(var(--sw-winner-start, 0deg) + var(--sw-winner-angle, 0deg) / 2),transparent calc(var(--sw-winner-start, 0deg) + var(--sw-winner-angle, 0deg)),transparent 360deg);opacity:0;pointer-events:none;will-change:opacity}.spin-wheel-wrapper.is-winner-reveal .spin-wheel-inner:after{animation:sw-segment-glow 1.1s ease-in-out 2}.spin-wheel-segment{position:absolute;top:0;right:0;bottom:0;left:0;transform:rotate(var(--segment-mid-angle));transform-origin:50% 50%;pointer-events:none}.spin-wheel-segment-content{position:absolute;left:50%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:calc(var(--sw-unit) * 34);gap:calc(var(--sw-unit) * 1);text-align:center;transform:translate3d(-50%,0,0) rotate(calc(-1 * var(--segment-mid-angle) - var(--sw-spin-angle, 0deg)));will-change:transform}.spin-wheel-segment-content--has-icon{top:calc(var(--sw-unit) * 4)}.spin-wheel-segment-content--no-icon{top:calc(var(--sw-unit) * 21)}.spin-wheel-segment.is-winner-segment .spin-wheel-segment-content{animation:sw-segment-pop .7s cubic-bezier(.34,1.56,.64,1) 1}.spin-wheel-segment-icon{width:calc(var(--sw-unit) * 19);height:calc(var(--sw-unit) * 19);object-fit:contain;flex-shrink:0;filter:drop-shadow(0 2px 4px rgba(0,0,0,.12))}.spin-wheel-segment-label{display:flex;flex-direction:column;align-items:center;gap:calc(var(--sw-unit) * .15);width:100%}.spin-wheel-segment-line{font-size:calc(var(--sw-unit) * 2.8);font-weight:500;line-height:1.15;color:var(--segment-text-color, var(--sw-ink));white-space:normal;max-width:100%}.spin-wheel-segment-line--strong{font-weight:800;font-size:calc(var(--sw-unit) * 3.2)}.spin-wheel-segment-line--accent{color:var(--sw-orange);font-weight:800;font-size:calc(var(--sw-unit) * 3.2)}.spin-wheel-segment-line--hero{color:var(--sw-orange);font-weight:900;font-size:calc(var(--sw-unit) * 6.5);line-height:.95}.spin-wheel-hub{position:absolute;top:50%;left:50%;z-index:2;width:var(--sw-hub-size);aspect-ratio:1 / 1;transform:translate3d(-50%,-50%,0);border-radius:50%;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--sw-white);box-shadow:0 6px 18px #00000024,0 2px 5px #00000014,inset 0 0 0 calc(var(--sw-unit) * .7) var(--sw-orange);padding:calc(var(--sw-unit) * 1.2)}.spin-wheel-hub:before{content:"";position:absolute;top:-14%;right:-14%;bottom:-14%;left:-14%;border-radius:50%;background:radial-gradient(closest-side,#f582208c,#f5822000);opacity:0;transform:scale(.9);pointer-events:none;will-change:transform,opacity}.spin-wheel-wrapper.is-winner-reveal .spin-wheel-hub:before{animation:sw-winner-glow 1.4s ease-out 2}.spin-wheel-hub img,.spin-wheel-hub-image{display:block;width:100%;height:auto;max-height:60%;min-width:0;flex-shrink:0;object-fit:contain}.spin-wheel-hub-text{display:block;max-width:100%;padding:0 8%;font-size:calc(var(--sw-unit) * 3.6);font-weight:800;line-height:1.15;color:var(--sw-orange);letter-spacing:-.02em;text-align:center;word-break:break-word;overflow-wrap:break-word}.spin-wheel-controls{display:flex;flex-direction:column;align-items:center;gap:.6rem;text-align:center;width:100%;max-width:400px}.spin-wheel-instructions{margin:0;font-size:clamp(.8rem,.75rem + .2vw,.92rem);line-height:1.5;color:var(--sw-ink-soft)}.spin-wheel-button{-webkit-appearance:none;appearance:none;border:none;cursor:pointer;height:52px;padding:0 clamp(2rem,5vw,3rem);border-radius:999px;font-size:clamp(.9rem,.85rem + .3vw,1.05rem);font-weight:700;letter-spacing:.01em;color:var(--sw-btn-text);background:linear-gradient(135deg,var(--sw-btn-bg),var(--sw-orange-dark));box-shadow:0 8px 20px #f5822059,0 2px 4px #f5822033;transform:translateZ(0);transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;will-change:transform}.spin-wheel-button:hover{transform:translate3d(0,-2px,0);box-shadow:0 10px 24px #f5822059,0 4px 8px #f5822040}.spin-wheel-button:active{transform:translateZ(0) scale(.97)}.spin-wheel-button:focus-visible{outline:3px solid var(--sw-ink);outline-offset:3px}.spin-wheel-button:disabled{cursor:not-allowed;opacity:.8;transform:scale(.98);pointer-events:none;filter:grayscale(.3) brightness(.95)}.spin-wheel-disclaimer{margin:0;font-size:clamp(.7rem,.65rem + .15vw,.8rem);line-height:1.4;color:var(--sw-ink-soft);opacity:.8}.spin-wheel-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.spin-wheel-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:999;display:flex;align-items:center;justify-content:center;padding:1.25rem;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .35s ease,visibility .35s ease}.spin-wheel-modal.is-open{visibility:visible;opacity:1;pointer-events:auto}.spin-wheel-modal-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#201a1473}@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)){.spin-wheel-modal-overlay{backdrop-filter:blur(6px) saturate(120%);-webkit-backdrop-filter:blur(6px) saturate(120%)}}.spin-wheel-modal-content{position:relative;z-index:1;width:min(100%,420px);padding:clamp(1.75rem,3vw,2.75rem) clamp(1.5rem,3vw,2.25rem);text-align:center;border-radius:clamp(16px,2.5vw,28px);background:var(--sw-popup-bg);border:1px solid rgba(255,255,255,.5);box-shadow:0 2px 6px #201a140f,0 12px 28px #201a141a,0 32px 64px #201a141f;transform:translate3d(0,12px,0) scale(.96);opacity:0;will-change:transform,opacity}@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)){.spin-wheel-modal-content{background:color-mix(in srgb,var(--sw-popup-bg) 65%,transparent);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}}.spin-wheel-modal.is-open .spin-wheel-modal-content{animation:sw-modal-pop .55s cubic-bezier(.34,1.56,.64,1) forwards}.spin-wheel-modal:not(.is-open) .spin-wheel-modal-content{transition:transform .25s ease,opacity .25s ease}.spin-wheel-modal-close{position:absolute;top:.75rem;right:.75rem;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:#201a140f;color:var(--sw-ink);font-size:1.25rem;line-height:1;cursor:pointer;transition:background .2s ease,transform .2s ease}.spin-wheel-modal-close:hover{background:#201a141f;transform:rotate(90deg)}.spin-wheel-modal-close:focus-visible,.spin-wheel-modal-cta:focus-visible,.spin-wheel-modal-overlay:focus-visible{outline:3px solid var(--sw-ink);outline-offset:2px}.spin-wheel-modal-heading{margin:0 0 .5em;font-size:clamp(1.25rem,1rem + 1vw,1.6rem);font-weight:800;color:var(--sw-ink)}.spin-wheel-modal-result{margin:0 0 .35em;font-size:clamp(1.05rem,.95rem + .5vw,1.3rem);font-weight:700;color:var(--sw-orange-dark)}.spin-wheel-modal-subtext{margin:0 0 1.25em;font-size:clamp(.85rem,.8rem + .2vw,.95rem);color:var(--sw-ink-soft);line-height:1.5}.spin-wheel-modal-coupon{display:inline-flex;align-items:center;gap:.6em;margin:0 0 1.25em;padding:.5em .5em .5em .9em;border-radius:999px;border:1px dashed var(--sw-orange)}.spin-wheel-modal-coupon-code{font-weight:700;letter-spacing:.04em;color:var(--sw-orange-dark)}.spin-wheel-modal-coupon-copy{-webkit-appearance:none;appearance:none;cursor:pointer;border:none;border-radius:999px;padding:.4em .9em;font-size:.8rem;font-weight:700;color:var(--sw-btn-text);background:var(--sw-btn-bg);transition:background .2s ease,transform .2s ease;flex-shrink:0}.spin-wheel-modal-coupon-copy:hover{transform:translate3d(0,-1px,0)}.spin-wheel-modal-coupon-copy.is-copied{background:#2f9e44}.spin-wheel-modal-coupon-copy:focus-visible{outline:3px solid var(--sw-ink);outline-offset:2px}.spin-wheel-modal-cta{-webkit-appearance:none;appearance:none;border:none;cursor:pointer;width:100%;padding:.85rem 1.5rem;border-radius:999px;font-size:.95rem;font-weight:700;color:var(--sw-btn-text);background:linear-gradient(135deg,var(--sw-btn-bg),var(--sw-orange-dark));box-shadow:0 8px 18px #f582204d;transition:transform .2s ease,box-shadow .2s ease}.spin-wheel-modal-cta:hover{transform:translate3d(0,-1px,0);box-shadow:0 10px 22px #f5822059}.spin-wheel-confetti{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;pointer-events:none}@media(max-width:374px){.spin-wheel-section{padding:1rem .5rem 1.5rem}}@media(min-width:480px)and (max-width:767px){.spin-wheel-section{padding:1.5rem 1rem 2rem}}@media(min-width:768px)and (max-width:1023px){.spin-wheel-section{padding:2rem 1.5rem 2.5rem}.spin-wheel-content{gap:1.5rem}.spin-wheel-controls{max-width:420px}}@media(min-width:1024px)and (max-width:1199px){.spin-wheel-section{padding:2rem 2rem 2.5rem}.spin-wheel-content{gap:1.5rem}}@media(min-width:1200px){.spin-wheel-section{padding:2.5rem 2rem 3rem}.spin-wheel-content{gap:2rem}.spin-wheel-controls{max-width:450px}}@media(min-width:1440px){.spin-wheel-section{padding:3rem 2rem 3.5rem}}@keyframes sw-float{0%,to{transform:translateZ(0)}50%{transform:translate3d(0,-3%,0)}}@keyframes sw-shadow-breathe{0%,to{transform:translate3d(-50%,0,0) scale(1);opacity:.7}50%{transform:translate3d(-50%,0,0) scale(.88);opacity:.45}}@keyframes sw-pointer-bounce{0%{transform:translate3d(-50%,0,0) rotate(-6deg)}to{transform:translate3d(-50%,10%,0) rotate(6deg)}}@keyframes sw-segment-glow{0%,to{opacity:0}50%{opacity:1}}@keyframes sw-segment-pop{0%{transform:translate3d(-50%,0,0) rotate(calc(-1 * var(--segment-mid-angle) - var(--sw-spin-angle, 0deg))) scale(1)}50%{transform:translate3d(-50%,0,0) rotate(calc(-1 * var(--segment-mid-angle) - var(--sw-spin-angle, 0deg))) scale(1.28)}to{transform:translate3d(-50%,0,0) rotate(calc(-1 * var(--segment-mid-angle) - var(--sw-spin-angle, 0deg))) scale(1.1)}}@keyframes sw-winner-glow{0%{opacity:.9;transform:scale(.85)}70%{opacity:0;transform:scale(1.35)}to{opacity:0;transform:scale(1.35)}}@keyframes sw-modal-pop{0%{transform:translate3d(0,16px,0) scale(.9);opacity:0}60%{transform:translate3d(0,-2px,0) scale(1.02);opacity:1}to{transform:translateZ(0) scale(1);opacity:1}}@media(prefers-reduced-motion:reduce){.spin-wheel-wrapper,.spin-wheel-wrapper:before,.spin-wheel-pointer,.spin-wheel-inner,.spin-wheel-inner:after,.spin-wheel-segment-content,.spin-wheel-hub:before,.spin-wheel-button,.spin-wheel-modal,.spin-wheel-modal-content,.spin-wheel-modal-close{animation:none!important;transition-duration:.01ms!important}}
/*# sourceMappingURL=/cdn/shop/t/162/assets/spin-wheel.css.map */