:root{--enter:450ms;--spin:4200ms;--exit:450ms;--cream:#fff9ea;--gold:#e9bd57;--deep:#603a12;--mint:#bce7d4}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:transparent!important}body{font-family:"Pretendard","Noto Sans KR",sans-serif}
.roulette-overlay{position:absolute;inset:0;overflow:hidden;opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--exit) ease,visibility 0s linear var(--exit)}
.roulette-overlay.visible{opacity:1;visibility:visible;transition:opacity var(--enter) ease,visibility 0s}
.birthday-glow{position:absolute;left:43%;bottom:-28%;width:950px;height:950px;border-radius:50%;background:radial-gradient(circle,rgba(255,240,183,.46),rgba(200,240,218,.2) 43%,transparent 70%);filter:blur(8px)}
.donation-card{position:absolute;left:50%;top:42px;z-index:30;min-width:620px;max-width:940px;padding:17px 42px 19px;border:2px solid rgba(255,235,181,.9);border-radius:999px;text-align:center;color:var(--deep);background:linear-gradient(135deg,rgba(255,252,239,.96),rgba(221,248,236,.94));box-shadow:0 16px 45px rgba(69,44,12,.2),inset 0 0 28px rgba(255,255,255,.9);transform:translate(-50%,-150%);transition:transform var(--enter) cubic-bezier(.18,.86,.24,1.15)}
.visible .donation-card{transform:translate(-50%,0)}.donation-card .eyebrow{display:block;color:#9a7225;font-size:15px;font-weight:900;letter-spacing:4px}.donation-card strong{font-size:31px}.donation-card b{margin-left:16px;color:#c48816;font-size:38px}.donation-card i{margin-left:5px;font-size:22px;font-style:normal;font-weight:800}.donation-card p{display:none;margin:5px 0 0;color:#69553a;font-size:18px}.donation-card p.has-message{display:block}
.ion-character{position:absolute;left:72px;bottom:-34px;z-index:7;width:510px;height:920px;transform:translateX(-125%);transform-origin:50% 88%;transition:transform var(--enter) cubic-bezier(.2,.9,.28,1.12)}.visible .ion-character{transform:translateX(0)}.ion-character img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 24px 22px rgba(46,30,8,.28));transform-origin:50% 84%;animation:ionIdle 2.8s ease-in-out infinite}.spinning .ion-character img{animation:ionCheer .52s ease-in-out infinite alternate}.show-result .ion-character img{animation:ionCelebrate .78s cubic-bezier(.18,.85,.3,1.2) both,ionIdle 2.8s .78s ease-in-out infinite}
.wheel-stage{position:absolute;left:835px;bottom:72px;z-index:5;width:730px;height:730px;transform:translateY(120%) scale(.72);transition:transform var(--enter) cubic-bezier(.16,.86,.25,1.12)}.visible .wheel-stage{transform:translateY(0) scale(1)}
.wheel{position:absolute;inset:58px;border:17px solid #f4d37d;border-radius:50%;box-shadow:0 0 0 10px #8d6427,0 24px 50px rgba(48,29,5,.34),inset 0 0 45px rgba(132,88,17,.22);transform:rotate(0deg);will-change:transform}.wheel::after{content:"";position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(from -1deg,rgba(116,73,16,.4) 0 2deg,transparent 2deg var(--slice,60deg))}
.wheel-items{position:absolute;inset:0}.wheel-items b{position:absolute;left:50%;top:50%;z-index:2;display:grid;width:204px;min-height:58px;place-content:center;padding:6px 10px;border-radius:18px;color:#5d3808;background:rgba(255,255,255,.38);font-size:27px;font-weight:1000;line-height:1.08;text-align:center;text-shadow:0 2px 0 #fff,0 0 8px #fff;transform:translate(-50%,-50%) rotate(var(--angle)) translateY(-228px) rotate(var(--counter));transform-origin:50% 50%;-webkit-text-stroke:.25px currentColor}.wheel-items b:nth-child(even){color:#155e4b}.wheel-items b.long{width:194px;font-size:22px}
.fixed-center{position:absolute;left:50%;top:50%;z-index:14;display:flex;width:248px;height:248px;align-items:center;justify-content:center;flex-direction:column;padding:25px 18px;border:10px solid #e9bf5c;border-radius:50%;color:#765018;text-align:center;background:radial-gradient(circle,#fffef8,#f0dfaa);box-shadow:0 9px 25px rgba(67,38,3,.35),inset 0 0 24px #fff;transform:translate(-50%,-50%)}.fixed-center>span{font-size:25px;font-weight:1000}.fixed-center small{margin-top:4px;color:#a46f13;font-size:14px;font-weight:1000;letter-spacing:2px}.fixed-rewards{display:flex;align-items:center;justify-content:center;flex-direction:column;margin-top:6px;font-size:17px;font-weight:1000;line-height:1.18}.fixed-rewards span+span::before{content:"+ ";color:#b98824}.fixed-center em{margin-top:7px;padding:5px 10px;border-radius:999px;color:#236b57;background:#dff5eb;font-size:13px;font-style:normal;font-weight:1000}
.pointer{position:absolute;left:50%;top:8px;z-index:18;width:92px;height:115px;filter:drop-shadow(0 9px 8px rgba(60,36,3,.35));transform:translateX(-50%)}.pointer span{display:block;width:92px;height:115px;background:linear-gradient(135deg,#fff4bd,#d79820);clip-path:polygon(50% 100%,0 0,100% 0)}.wheel-lights{position:absolute;inset:25px;border:18px dotted #fff4b3;border-radius:50%;filter:drop-shadow(0 0 7px #f6c957);animation:lights .65s steps(2) infinite}
.spinning:not(.guaranteed-only) .wheel{animation:rouletteSpin var(--spin) cubic-bezier(.08,.62,.1,1) forwards}.spinning:not(.guaranteed-only) .wheel-items b{animation:rouletteLabelSpin var(--spin) cubic-bezier(.08,.62,.1,1) forwards}.spinning:not(.guaranteed-only) .pointer{animation:pointerTick .14s ease-in-out infinite alternate}
.guaranteed-only .pointer,.guaranteed-only .wheel-items{display:none}.guaranteed-only .wheel{background:radial-gradient(circle,#fff8d9 0 37%,#f6d36a 38% 43%,#d7f3e6 44% 61%,#f7d778 62% 100%)!important}.guaranteed-only .wheel::after{background:radial-gradient(circle,transparent 52%,rgba(255,255,255,.78) 53% 56%,transparent 57%)}.guaranteed-only .fixed-center{width:330px;height:330px;border-width:13px;background:radial-gradient(circle,#fffef6,#f7db83);box-shadow:0 0 55px #efc95b99,inset 0 0 35px #fff}.guaranteed-only .fixed-center>span{font-size:31px}.guaranteed-only .fixed-rewards{font-size:23px}.guaranteed-only .fixed-center em{color:#71450a;background:#f3c953;font-size:16px}.spinning.guaranteed-only .wheel{animation:guaranteedGlow 1.2s ease-in-out both}
.result-card{position:absolute;right:40px;bottom:42px;z-index:40;width:540px;padding:25px 28px 24px;border:3px solid #f4d47d;border-radius:32px;text-align:center;color:#654214;background:linear-gradient(145deg,rgba(255,253,241,.98),rgba(215,246,232,.97));box-shadow:0 20px 55px rgba(48,29,4,.32);opacity:0;transform:translateY(70px) scale(.72)}.show-result .result-card{animation:resultPop .55s cubic-bezier(.12,.9,.2,1.24) forwards}.result-card>span{display:block;color:#9a7225;font-size:18px;font-weight:900;letter-spacing:3px}.result-fixed{display:none;margin:10px 0 8px;padding:9px 12px;border-radius:14px;color:#296c59;background:#e0f4eb;font-size:17px;font-weight:900;line-height:1.3}.result-fixed.show{display:block}.result-card small{display:block;margin-top:7px;color:#8e774d;font-size:14px;font-weight:900;letter-spacing:2px}.result-card strong{display:block;margin:4px 0 5px;color:#b77a11;font-size:48px;line-height:1.08;text-shadow:0 3px #fff}.result-card p{margin:0;font-size:23px}
.confetti{position:absolute;inset:0;z-index:25;display:none}.show-result .confetti{display:block}.confetti i{position:absolute;left:calc(18% + var(--n,0)*9%);top:-6%;width:18px;height:36px;background:var(--c,#e9bd57);animation:confettiFall 2.2s ease-in forwards}.confetti i:nth-child(1){--n:0;--c:#e9bd57}.confetti i:nth-child(2){--n:1;--c:#86d5b7;animation-delay:.15s}.confetti i:nth-child(3){--n:2;--c:#fff2aa;animation-delay:.3s}.confetti i:nth-child(4){--n:3;--c:#d7a6c8;animation-delay:.08s}.confetti i:nth-child(5){--n:4;--c:#e9bd57;animation-delay:.4s}.confetti i:nth-child(6){--n:5;--c:#86d5b7;animation-delay:.22s}.confetti i:nth-child(7){--n:6;--c:#fff2aa;animation-delay:.52s}.confetti i:nth-child(8){--n:7;--c:#d7a6c8;animation-delay:.34s}
@keyframes rouletteSpin{from{transform:rotate(0)}to{transform:rotate(var(--target,2160deg))}}@keyframes rouletteLabelSpin{from{transform:translate(-50%,-50%) rotate(var(--angle)) translateY(-228px) rotate(var(--counter-start))}to{transform:translate(-50%,-50%) rotate(var(--angle)) translateY(-228px) rotate(var(--counter-end))}}@keyframes guaranteedGlow{0%{transform:scale(.9);filter:brightness(.9)}55%{transform:scale(1.04);filter:brightness(1.18)}100%{transform:scale(1);filter:brightness(1)}}@keyframes pointerTick{to{transform:translateX(-50%) rotate(5deg)}}@keyframes lights{50%{opacity:.58}}@keyframes ionIdle{0%,100%{transform:translateY(0) rotate(-.35deg) scale(1)}50%{transform:translateY(-10px) rotate(.5deg) scale(1.008)}}@keyframes ionCheer{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(-10px) rotate(1.2deg) scale(1.018)}}@keyframes ionCelebrate{0%{transform:translateY(0)}48%{transform:translateY(-34px) rotate(2deg) scale(1.045)}75%{transform:translateY(4px) rotate(-1deg) scale(.995)}100%{transform:translateY(0)}}@keyframes resultPop{to{opacity:1;transform:translateY(0) scale(1)}}@keyframes confettiFall{to{top:108%;transform:translateX(160px) rotate(620deg)}}