/* Skin Reward V5 — shared selector and transition */
#skinRewardV5{position:fixed;inset:0;z-index:1000001;display:none;overflow:hidden;background:#02030a;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC",sans-serif;isolation:isolate}
#skinRewardV5.on{display:block}
#skinRewardV5 *{box-sizing:border-box}
.sr5-space{position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,#26135d 0,#080a25 32%,#02030a 72%);overflow:hidden}
.sr5-space:before{content:"";position:absolute;inset:-50%;background:conic-gradient(from 0deg,transparent 0 8%,rgba(61,229,255,.15) 10%,transparent 13% 25%,rgba(255,52,205,.14) 28%,transparent 31% 49%,rgba(255,194,62,.11) 52%,transparent 55%);animation:sr5Spin 14s linear infinite}
.sr5-grid{position:absolute;inset:44% -20% -55%;background-image:linear-gradient(rgba(71,223,255,.17) 1px,transparent 1px),linear-gradient(90deg,rgba(241,71,255,.13) 1px,transparent 1px);background-size:54px 54px;transform:perspective(480px) rotateX(65deg);animation:sr5Grid 2s linear infinite}
.sr5-stars i{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;box-shadow:0 0 8px #7fe9ff;animation:sr5Star var(--d) ease-in-out infinite alternate;animation-delay:var(--x)}
.sr5-flash{position:absolute;inset:0;z-index:5;background:#fff;opacity:0;pointer-events:none}.sr5-on .sr5-flash{animation:sr5Flash .42s ease-out both}
.sr5-shock{position:absolute;left:50%;top:50%;z-index:4;width:18vmin;height:18vmin;border:3px solid #8ff5ff;border-radius:50%;opacity:0;box-shadow:0 0 25px #39e4ff,0 0 70px #a83cff,inset 0 0 28px #f448ff;transform:translate(-50%,-50%)}
.sr5-on .sr5-shock{animation:sr5Shock 1.05s .16s cubic-bezier(.08,.72,.17,1) both}
.sr5-ring{position:absolute;left:50%;top:50%;z-index:3;border:1px solid rgba(135,241,255,.72);border-radius:50%;transform:translate(-50%,-50%) scale(.1);opacity:0}.sr5-ring.r1{width:44vmin;height:44vmin}.sr5-ring.r2{width:64vmin;height:64vmin;border-color:rgba(255,89,226,.65)}.sr5-ring.r3{width:84vmin;height:84vmin;border-style:dashed;border-color:rgba(255,213,93,.45)}
.sr5-on .r1{animation:sr5Ring 1s .25s ease-out both}.sr5-on .r2{animation:sr5Ring 1.05s .34s ease-out both}.sr5-on .r3{animation:sr5Ring 1.2s .4s ease-out both}
.sr5-unlock{position:absolute;left:50%;top:50%;z-index:8;text-align:center;transform:translate(-50%,-50%);opacity:0;pointer-events:none}.sr5-on .sr5-unlock{animation:sr5Unlock 1.25s .55s cubic-bezier(.15,1.4,.2,1) both}
.sr5-gem{width:clamp(80px,12vw,138px);height:clamp(80px,12vw,138px);margin:0 auto 18px;display:grid;place-items:center;font-size:clamp(46px,7vw,82px);background:linear-gradient(145deg,rgba(255,255,255,.25),rgba(92,49,255,.25));border:2px solid #d8fbff;clip-path:polygon(50% 0,88% 20%,100% 62%,72% 100%,28% 100%,0 62%,12% 20%);filter:drop-shadow(0 0 22px #38e8ff) drop-shadow(0 0 42px #ff42d6);animation:sr5Gem 1.2s ease-in-out infinite alternate}
.sr5-unlock small{display:block;font-size:11px;font-weight:800;letter-spacing:8px;color:#8befff;text-shadow:0 0 15px #31e6ff;margin-bottom:10px}.sr5-unlock strong{display:block;font-size:clamp(38px,7vw,78px);line-height:1;font-weight:1000;letter-spacing:-2px;background:linear-gradient(90deg,#fff,#73efff,#ff78dd,#ffd66a,#fff);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sr5Flow 1.2s linear infinite;filter:drop-shadow(0 5px 18px rgba(71,224,255,.35))}.sr5-unlock span{display:block;margin-top:12px;color:rgba(255,255,255,.65);font-size:13px;letter-spacing:3px}
.sr5-panel{position:absolute;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;padding:clamp(54px,7vh,86px) 20px 30px;opacity:0;visibility:hidden;transform:scale(1.08);overflow:auto}.sr5-on .sr5-panel{animation:sr5Panel .55s 1.75s cubic-bezier(.2,.9,.25,1) forwards}
.sr5-head{position:relative;z-index:2;text-align:center;margin-bottom:22px}.sr5-head b{display:block;font-size:clamp(30px,4.5vw,58px);font-weight:950;letter-spacing:-1px;background:linear-gradient(90deg,#fff,#55e8ff,#ff55d6,#ffd65c);background-size:230% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sr5Flow 2.5s linear infinite}.sr5-head p{margin:8px 0 0;color:rgba(255,255,255,.65);font-size:13px;letter-spacing:1px}.sr5-head p em{font-style:normal;color:#7deaff;font-weight:800}
.sr5-cards{position:relative;z-index:2;width:min(1240px,96vw);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding-bottom:28px}
.sr5-card{--c1:#7cecff;--c2:#8a45ff;position:relative;min-height:170px;padding:18px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.2);border-radius:18px;background:linear-gradient(145deg,color-mix(in srgb,var(--c1) 24%,#060711),color-mix(in srgb,var(--c2) 20%,#080912));box-shadow:0 14px 35px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.1);opacity:0;transform:translateY(45px) scale(.85);transition:transform .2s,border-color .2s,box-shadow .2s;cursor:pointer}.sr5-on .sr5-card{animation:sr5Card .55s cubic-bezier(.15,1.3,.25,1) forwards;animation-delay:calc(1.88s + var(--i)*.055s)}
.sr5-card:before{content:"";position:absolute;inset:-50%;background:conic-gradient(from 0deg,transparent,var(--c1),transparent 25%,var(--c2),transparent 55%);opacity:.22;animation:sr5Spin 8s linear infinite}.sr5-card:after{content:"";position:absolute;inset:1px;border-radius:17px;background:radial-gradient(circle at 80% 8%,color-mix(in srgb,var(--c1) 36%,transparent),transparent 34%),linear-gradient(145deg,rgba(255,255,255,.07),transparent 45%);pointer-events:none}.sr5-card>*{position:relative;z-index:2}.sr5-card:hover{transform:translateY(-7px) scale(1.025);border-color:var(--c1);box-shadow:0 22px 55px rgba(0,0,0,.5),0 0 28px color-mix(in srgb,var(--c1) 36%,transparent)}.sr5-card.picked{z-index:20;animation:sr5Picked .7s cubic-bezier(.1,.9,.2,1) forwards!important}.sr5-icon{font-size:42px;line-height:1;margin-bottom:13px;filter:drop-shadow(0 5px 14px rgba(0,0,0,.45))}.sr5-name{font-size:18px;font-weight:900}.sr5-desc{font-size:11.5px;color:rgba(255,255,255,.68);margin-top:5px}.sr5-badge{position:absolute;right:11px;top:11px;padding:4px 8px;border:1px solid color-mix(in srgb,var(--c1) 65%,white);border-radius:999px;background:rgba(0,0,0,.32);font-size:9px;font-weight:900;letter-spacing:1px;color:#fff}.sr5-current{opacity:.62}.sr5-close{position:fixed;top:18px;right:18px;z-index:30;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;font-size:22px;cursor:pointer;backdrop-filter:blur(12px);transition:.18s}.sr5-close:hover{transform:rotate(90deg);background:rgba(255,55,155,.3);border-color:#ff5dca}
.sr5-wipe{position:fixed;inset:0;z-index:50;pointer-events:none;transform:translateX(-105%);background:linear-gradient(110deg,#000 0 16%,var(--wc1) 46%,var(--wc2) 65%,#fff 68%,#000 72%);filter:saturate(1.25)}.sr5-wipe.go{animation:sr5Wipe .72s cubic-bezier(.65,0,.25,1) forwards}
@keyframes sr5Spin{to{transform:rotate(360deg)}}@keyframes sr5Grid{to{background-position:0 54px,54px 0}}@keyframes sr5Star{to{opacity:.15;transform:scale(.45)}}@keyframes sr5Flash{0%{opacity:0}20%{opacity:1}100%{opacity:0}}@keyframes sr5Shock{0%{opacity:1;transform:translate(-50%,-50%) scale(.05)}100%{opacity:0;transform:translate(-50%,-50%) scale(7)}}@keyframes sr5Ring{0%{opacity:.9;transform:translate(-50%,-50%) scale(.08) rotate(0)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.5) rotate(130deg)}}@keyframes sr5Unlock{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}35%,72%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.32)}}@keyframes sr5Gem{to{transform:translateY(-5px) rotate(3deg);filter:drop-shadow(0 0 32px #38e8ff) drop-shadow(0 0 55px #ff42d6)}}@keyframes sr5Flow{to{background-position:260% 0}}@keyframes sr5Panel{to{opacity:1;visibility:visible;transform:scale(1)}}@keyframes sr5Card{to{opacity:1;transform:translateY(0) scale(1)}}@keyframes sr5Picked{to{transform:scale(1.2);filter:brightness(1.6);box-shadow:0 0 100px var(--c1)}}@keyframes sr5Wipe{to{transform:translateX(105%)}}
@media(max-width:900px){.sr5-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.sr5-card{min-height:145px}}
@media(max-width:620px){.sr5-panel{padding:65px 12px 20px}.sr5-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.sr5-card{min-height:125px;padding:13px;border-radius:14px}.sr5-card:after{border-radius:13px}.sr5-icon{font-size:32px;margin-bottom:9px}.sr5-name{font-size:15px}.sr5-desc{font-size:10px}.sr5-badge{font-size:8px}.sr5-head{margin-bottom:15px}.sr5-head p{font-size:11px}.sr5-unlock small{letter-spacing:4px}}
@media(prefers-reduced-motion:reduce){.sr5-space:before,.sr5-grid,.sr5-stars i,.sr5-gem,.sr5-unlock strong,.sr5-head b,.sr5-card:before{animation:none!important}.sr5-on .sr5-flash,.sr5-on .sr5-shock,.sr5-on .sr5-ring,.sr5-on .sr5-unlock{display:none}.sr5-on .sr5-panel{animation:sr5Panel .15s forwards}.sr5-on .sr5-card{animation:sr5Card .15s forwards}}
