html:not(.no-fx) .fx-grain{position:fixed;inset:0;z-index:-1;pointer-events:none;
background:url("https://spooky-pots.green7493.workers.dev/rafflex/fx/noise.png") repeat;background-size:128px 128px;opacity:.05}
html:not(.no-fx) header .hidden.lg\:flex>nav{justify-content:center;gap:30px!important;padding:0 28px}
@media(min-width:1280px){
html:not(.no-fx) header .hidden.lg\:flex{justify-content:flex-end}
html:not(.no-fx) header .hidden.lg\:flex>nav{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
flex:0 0 auto;width:auto;padding:0;white-space:nowrap}
}
html:not(.no-fx) header .hidden.lg\:flex>nav>a:not(.sx-arcade),
html:not(.no-fx) header .hidden.lg\:flex>nav>ui-dropdown>button{font-size:16px!important;letter-spacing:.06em!important;
padding-left:6px!important;padding-right:6px!important}
html:not(.no-fx) section.hx::before{content:"";position:absolute;right:0;top:-6%;width:min(52vw,600px);
height:112%;z-index:0;pointer-events:none;opacity:.08;
background:url("https://spooky-pots.green7493.workers.dev/rafflex/fx/ghost.webp") no-repeat;background-size:contain;background-position:calc(100% + 4vw) 50%}
html:not(.no-fx) footer{position:relative;isolation:isolate;overflow:hidden}
html:not(.no-fx) footer::before{content:"";position:absolute;right:0;bottom:0;width:min(60vw,560px);
aspect-ratio:1/1;z-index:-1;pointer-events:none;opacity:.06;
background:url("https://spooky-pots.green7493.workers.dev/rafflex/fx/ghost.webp") no-repeat;background-size:contain;background-position:calc(100% + 6vw) calc(100% + 18%)}
@media(max-width:640px){
html:not(.no-fx) section.hx::before{width:70vw;opacity:.07;background-position:calc(100% + 16vw) 50%}
html:not(.no-fx) footer::before{width:80vw;background-position:calc(100% + 20vw) calc(100% + 8%)}
}
html:not(.no-fx) .fx-fog{position:absolute;left:0;right:0;bottom:0;height:270px;overflow:hidden;
pointer-events:none;z-index:2}
html:not(.no-fx) .fx-fog i{position:absolute;left:0;top:0;height:100%;width:200%;display:block;
background-repeat:repeat-x;background-size:50% 100%;opacity:.85}
html:not(.no-fx) .fx-fog .a{background-image:url("https://spooky-pots.green7493.workers.dev/rafflex/fx/fog1.webp")}
html:not(.no-fx) .fx-fog .b{background-image:url("https://spooky-pots.green7493.workers.dev/rafflex/fx/fog2.webp");opacity:.5;height:88%;top:12%}
@media(hover:hover) and (pointer:fine){
html:not(.no-fx) .fx-fog .a{animation:fx-fog 75s linear infinite}
html:not(.no-fx) .fx-fog .b{animation:fx-fog 120s linear infinite reverse}
}
@keyframes fx-fog{to{transform:translateX(-50%)}}
@media(hover:none) and (pointer:coarse){html:not(.no-fx) .fx-fog .b{display:none}}
@media(max-width:640px){html:not(.no-fx) .fx-fog{height:180px}}
html:not(.no-fx) .sx-wt,
html:not(.no-fx) .sxp,
html:not(.no-fx) .sx-strip:has(>.sx-stats),
html:not(.no-fx) .sx-strip:has(>.sx-social),
html:not(.no-fx) main div.mt-10:has(.cv-card),
html:not(.no-fx) main .sxr{margin-top:var(--fx-gap,100px)}
html:not(.no-fx) .sx-strip:has(>.sx-next){margin-top:34px}
.fx-rail{--fx-y:44px;position:relative;height:0;overflow:visible;pointer-events:none;z-index:1}
.fx-rail::before{content:"";position:absolute;left:0;right:0;top:var(--fx-y);height:2px;
background:linear-gradient(90deg,transparent,#8B47F0 25%,#B6FF3C 50%,#E0219A 75%,transparent);
box-shadow:0 0 22px rgba(139,71,240,.55)}
.fx-rail span{position:absolute;left:50%;top:var(--fx-y);transform:translate(-50%,-50%);background:#05030C;
padding:6px 18px;font-family:Anton,Impact,"Arial Narrow",sans-serif;letter-spacing:.2em;font-size:14px;
line-height:1.2;color:#C4B5FD;text-transform:uppercase;white-space:nowrap}
.fx-rail span::before,.fx-rail span::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;
background:#B6FF3C;box-shadow:0 0 10px #B6FF3C;vertical-align:middle;margin:0 10px 2px}
@media(max-width:640px){
html:not(.no-fx) .sx-wt,html:not(.no-fx) .sxp,
html:not(.no-fx) .sx-strip:has(>.sx-stats),html:not(.no-fx) .sx-strip:has(>.sx-social),
html:not(.no-fx) main div.mt-10:has(.cv-card),
html:not(.no-fx) main .sxr{margin-top:74px}
html:not(.no-fx) .sx-strip:has(>.sx-next){margin-top:26px}
.fx-rail{--fx-y:32px}
.fx-rail span{font-size:11px;padding:4px 12px;letter-spacing:.16em}
.fx-rail span::before,.fx-rail span::after{width:5px;height:5px;margin:0 7px 2px}
}
html:not(.no-fx) .sx-strip .sx-social{gap:18px}
html:not(.no-fx) .sx-strip .sx-social .sx-soc{--c:#4C8DFF;display:flex;flex-direction:column;align-items:center;
text-align:center;gap:12px;padding:24px 14px 20px;border-radius:18px;background:#0A0716;
border:1px solid rgba(255,255,255,.06);box-shadow:none;filter:none;
transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .35s,box-shadow .35s}
html:not(.no-fx) .sx-strip .sx-social .sx-soc.fb{--c:#4C8DFF;background:#0A0716}
html:not(.no-fx) .sx-strip .sx-social .sx-soc.grp{--c:#B48CFF;background:#0A0716}
html:not(.no-fx) .sx-strip .sx-social .sx-soc.wa{--c:#25D366;background:#0A0716}
html:not(.no-fx) .sx-strip .sx-social .sx-soc.ig{--c:#FF5FA8;background:#0A0716}
html:not(.no-fx) .sx-strip .sx-social .sx-soc.tt{--c:#35E5E0;background:#0A0716}
html:not(.no-fx) .sx-strip .sx-social .sx-ico{display:block;width:54px;height:54px;overflow:visible;color:var(--c);
filter:drop-shadow(0 0 5px var(--c)) drop-shadow(0 0 14px var(--c))}
html:not(.no-fx) .sx-strip .sx-social .sx-ico path{fill:var(--c);fill-opacity:.08;stroke:var(--c);stroke-width:1.05;
stroke-linejoin:round;stroke-linecap:round}
html:not(.no-fx) .sx-strip .sx-social .sx-soc b{font-family:Anton,Impact,"Arial Narrow",sans-serif;font-weight:400;
font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:var(--c);text-shadow:0 0 12px var(--c);opacity:.9;line-height:1}
html:not(.no-fx) .sx-strip .sx-social .sx-soc span{font-size:11.5px;letter-spacing:.04em;color:#9A8FB8;margin-top:-6px;line-height:1.3}
@media(hover:hover) and (pointer:fine){
html:not(.no-fx) .sx-strip .sx-social .sx-soc:hover{transform:translateY(-4px);filter:none;border-color:var(--c);
box-shadow:0 0 0 1px var(--c),0 14px 40px -14px var(--c)}
html:not(.no-fx) .sx-strip .sx-social .sx-soc:hover b{opacity:1}
}
@media(max-width:1240px){html:not(.no-fx) .sx-strip .sx-social{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){html:not(.no-fx) .sx-strip .sx-social{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){
html:not(.no-fx) .sx-strip .sx-social{display:flex;justify-content:center;gap:14px}
html:not(.no-fx) .sx-strip .sx-social .sx-soc{width:52px;height:52px;padding:0;border-radius:50%;gap:0;
display:grid;place-items:center;border:1px solid var(--c);box-shadow:0 0 16px -6px var(--c)}
html:not(.no-fx) .sx-strip .sx-social .sx-soc b,html:not(.no-fx) .sx-strip .sx-social .sx-soc span{display:none}
html:not(.no-fx) .sx-strip .sx-social .sx-ico{width:24px;height:24px;filter:drop-shadow(0 0 4px var(--c))}
html:not(.no-fx) .sx-strip .sx-social .sx-ico path{stroke-width:1.25}
}
@media (hover:none) and (pointer:coarse){
html:not(.no-fx) .cv-card.cv-live{animation:none!important}
}
@media (hover:none) and (pointer:coarse){
html:not(.no-fx) .hx-card{filter:none!important;opacity:.38!important;
transition:transform .62s cubic-bezier(.25,1,.5,1),opacity .5s!important}
html:not(.no-fx) .splide__slide.is-active .hx-card{opacity:1!important}
}
html:not(.no-fx) .hx-slide{padding:30px 0!important}
@media(max-width:640px){html:not(.no-fx) .hx-slide{padding:24px 0!important}}
html:not(.no-fx) .hx-card::after{content:"";position:absolute;inset:-20px;
border-radius:34px;z-index:-2;pointer-events:none;opacity:0;
transition:opacity .55s;
background:radial-gradient(58% 58% at 50% 55%,
var(--hx-glow, rgba(139,71,240,.60)) 0%,
var(--hx-glow2, rgba(224,33,154,.30)) 40%,
rgba(182,255,60,.11) 64%,rgba(139,71,240,0) 78%)}
html:not(.no-fx) .fx-fog{
height:140px;bottom:-72px;
-webkit-mask-image:linear-gradient(to bottom,
rgba(0,0,0,0) 0%,rgba(0,0,0,.55) 22%,#000 60%);
mask-image:linear-gradient(to bottom,
rgba(0,0,0,0) 0%,rgba(0,0,0,.55) 22%,#000 60%)}
@media(max-width:640px){
html:not(.no-fx) .fx-fog{height:100px;bottom:-38px}}
html:not(.no-fx) .hx-cap>b{
position:absolute;width:1px;height:1px;margin:-1px;padding:0;
overflow:hidden;white-space:nowrap;clip-path:inset(50%);border:0}
html:not(.no-fx) .hx-cap{background:none}
html:not(.no-fx) .splide__slide.is-active .hx-card::after{
animation:fx-hero-glow 5.2s ease-in-out infinite}
@keyframes fx-hero-glow{0%,100%{opacity:.58}50%{opacity:1}}
html:not(.no-fx) .splide__slide.is-active .hx-card{
animation:fx-hero-float 6.4s ease-in-out infinite}
@keyframes fx-hero-float{
0%{translate:0 0;rotate:0deg}
28%{translate:0 -6px;rotate:.45deg}
55%{translate:0 -3px;rotate:-.4deg}
78%{translate:0 -5px;rotate:.2deg}
100%{translate:0 0;rotate:0deg}}
@media(prefers-reduced-motion:reduce){
html:not(.no-fx) .splide__slide.is-active .hx-card,
html:not(.no-fx) .splide__slide.is-active .hx-card::after{animation:none!important}
html:not(.no-fx) .splide__slide.is-active .hx-card::after{opacity:.75}}
@media(prefers-reduced-motion:reduce){
html:not(.no-fx) .fx-fog .a,html:not(.no-fx) .fx-fog .b{animation:none}
html:not(.no-fx) .sx-strip .sx-social .sx-soc{transition:none}
}
.hx-boost{display:inline-flex;align-items:center;gap:7px;
padding:5px 10px;border-radius:8px;line-height:1;
font-family:Anton,Impact,system-ui,sans-serif;font-size:11px;
letter-spacing:.09em;text-transform:uppercase;white-space:nowrap;
color:#2A1D00;background:linear-gradient(180deg,#FFD75E,#E3A700);
box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 2px 10px rgba(0,0,0,.38)}
.hx-boost i{font-style:normal;line-height:1}
.hx-boost u{text-decoration:none;line-height:1;
font-family:Manrope,system-ui,sans-serif;font-weight:800;font-size:10.5px;
letter-spacing:.02em;font-variant-numeric:tabular-nums;
padding:3px 6px;border-radius:5px;
background:rgba(42,29,0,.22);color:#231800}
@media(max-width:640px){
.hx-boost{font-size:10px;padding:4px 8px;gap:5px}
.hx-boost u{font-size:9.5px;padding:2px 5px}}
@media (hover:none) and (pointer:coarse){
html:not(.no-fx) .splide__slide.is-active .hx-card::before{
animation:none!important}
html:not(.no-fx) .splide__slide.is-active .hx-card::after{
animation:none!important;opacity:.78!important}
}
html:not(.no-fx) .gx-info{text-align:center}
html:not(.no-fx) .gx-info>ol{
max-width:920px;margin-left:auto;margin-right:auto;text-align:left}
@media (min-width:1100px){
html:not(.no-fx) .hx-iw,
html:not(.no-fx) .hx-boost{
font-size:15px!important;padding:8px 14px!important;border-radius:10px!important}
html:not(.no-fx) .hx-boost u{font-size:13px!important}
html:not(.no-fx) .hx-pill i{font-size:32px!important}
html:not(.no-fx) .hx-pill u{font-size:11px!important}
html:not(.no-fx) .hx-tl{gap:9px!important}
}
html:not(.no-fx) .hx-card .cv-shine b{animation-play-state:paused}
html:not(.no-fx) .splide__slide.is-active .hx-card .cv-shine b{
animation-play-state:running}
html:not(.no-fx) .fx-endsat{
display:block;margin-top:5px;
font-family:Manrope,system-ui,sans-serif;font-weight:700;
font-size:10.5px;letter-spacing:.10em;text-transform:uppercase;
color:rgba(239,233,255,.60)}
@media(max-width:640px){
html:not(.no-fx) .fx-endsat{font-size:9.5px;letter-spacing:.05em;margin-top:4px}}
html:not(.no-fx) .cv-shine{border-radius:inherit}
html:not(.no-fx) .fx-name{
display:flex;align-items:center;justify-content:center;gap:16px;
padding:2px 16px 16px;pointer-events:none}
html:not(.no-fx) .fx-name b{
font-family:Anton,"Arial Narrow",Impact,system-ui,sans-serif;
font-weight:400;font-size:clamp(25px,5.2vw,46px);line-height:1.04;
letter-spacing:.035em;text-transform:uppercase;text-align:center;
text-wrap:balance;max-width:22ch;color:#FFF4FF;
text-shadow:
0 0 5px rgba(255,244,255,.60),
0 0 14px rgba(224,33,154,.95),
0 0 26px rgba(224,33,154,.55),
0 0 34px rgba(139,71,240,.62),
0 0 66px rgba(139,71,240,.34)}
html:not(.no-fx) .fx-name i{
flex:0 1 130px;height:2px;border-radius:2px;
box-shadow:0 0 9px rgba(224,33,154,.70);
background:linear-gradient(90deg,rgba(224,33,154,0),#E0219A 62%,#8B47F0);
transform-origin:right center}
html:not(.no-fx) .fx-name i+i{
background:linear-gradient(270deg,rgba(224,33,154,0),#E0219A 62%,#8B47F0);
transform-origin:left center}
@media(max-width:640px){
html:not(.no-fx) .fx-name{gap:0;padding:0 14px 12px}
html:not(.no-fx) .fx-name i{display:none}}
@keyframes fx-name-on{
from{opacity:0;transform:translateY(9px) scale(.986)}
to{opacity:1;transform:none}}
@keyframes fx-name-rule{
from{opacity:0;transform:scaleX(0)}
to{opacity:1;transform:scaleX(1)}}
html:not(.no-fx) .fx-name.on b{
animation:fx-name-on .5s cubic-bezier(.22,1,.36,1) both}
html:not(.no-fx) .fx-name.on i{
animation:fx-name-rule .62s cubic-bezier(.22,1,.36,1) both}
@media(prefers-reduced-motion:reduce){
html:not(.no-fx) .fx-name.on b,
html:not(.no-fx) .fx-name.on i{animation:none}}
html:not(.no-fx) .cv-card:has(.cv-boost){--sxbb:38px}
@media(max-width:640px){
html:not(.no-fx) .cv-card:has(.cv-boost){--sxbb:34px}}
html:not(.no-fx) .cv-card:has(.cv-boost) .cv-inner{padding-top:var(--sxbb)}
html:not(.no-fx) .cv-card:has(.cv-boost) .cv-boost{
top:calc(var(--sxbb) * -1);bottom:auto}