.wreckd-intro[hidden]{display:none!important}
.wreckd-intro{position:fixed;inset:0;z-index:2147483000;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 50% 60%,#102c3c,#050c13 70%);color:#36c6f4;font-family:'Source Sans 3',Arial,sans-serif;display:flex;align-items:center;justify-content:center;min-height:100svh;transition:opacity .55s,visibility .55s}
.wreckd-intro.is-leaving{opacity:0;visibility:hidden;pointer-events:none}
.wreckd-intro__grid,.wreckd-intro__orbit,.wreckd-intro__progress{display:none}
.wreckd-intro__skip{position:absolute;right:28px;top:28px;border:1px solid #ffffff25;border-radius:30px;background:#ffffff05;color:#b0c2cd;font:500 12px Arial,sans-serif;padding:12px 18px;cursor:pointer}.wreckd-intro__skip span{margin-left:15px}
.wreckd-intro__center{text-align:center;width:min(92vw,1040px)}
.wreckd-intro__stage{position:relative;height:clamp(270px,36vw,410px);display:flex;align-items:center;justify-content:flex-end}
.wreckd-intro__stage:after{content:'';position:absolute;bottom:1%;left:0;width:32%;height:18px;background:radial-gradient(ellipse,#0008,transparent 68%);animation:walk-in 2.3s linear both;z-index:-1}
.wreckd-intro__walker{position:absolute;left:0;bottom:0;width:32%;animation:walk-in 2.3s linear both;filter:drop-shadow(0 8px 20px #0005)}
.intro-wizard{display:block;width:100%;height:auto;overflow:visible}
.wizard-rig{transform-origin:380px 770px;animation:rig-walk .38s 6 linear,rig-settle .4s 2.28s both}
.wizard-leg{transform-origin:390px 550px}.wizard-leg--far{animation:leg-far .38s 6 linear}.wizard-leg--near{animation:leg-near .38s 6 linear}
.wizard-head{transform-origin:390px 510px;animation:head-walk .38s 6 linear,head-cast 1.4s 2.4s both}
.wizard-arm--rest{transform-origin:255px 515px;animation:arm-walk .38s 6 linear}
.wizard-arm--spell{transform-origin:530px 520px;animation:arm-cast 8s both}
.wizard-magic{opacity:0;animation:hand-magic 8s both;filter:drop-shadow(0 0 15px #36c6f4)}
.wizard-hat-sparks{transform-origin:250px 290px;animation:hat-sparks 8s both}
.wreckd-intro__mark{width:67%;animation:title-conjure 8s both;transform-origin:0 65%}
.wreckd-intro__mark svg{display:block;width:100%;height:auto;color:#36c6f4}
.intro-spell{position:absolute;left:22%;top:35%;width:65%;height:45%;pointer-events:none}
.intro-spell i{position:absolute;left:0;top:50%;font-style:normal;color:#b0f3ff;text-shadow:0 0 18px #36c6f4;font-size:22px;opacity:0;animation:spell-flight .9s 3.05s both}
.intro-spell i:nth-child(2){animation-delay:3.15s;top:20%;font-size:14px}.intro-spell i:nth-child(3){animation-delay:3.25s;top:75%;font-size:16px}.intro-spell i:nth-child(4){animation-delay:3.35s;top:0}.intro-spell i:nth-child(5){animation-delay:3.45s;top:60%}
.intro-flash{position:absolute;left:32%;top:15%;width:65%;height:75%;background:radial-gradient(ellipse,#91edff80,transparent 65%);opacity:0;pointer-events:none;animation:spell-bloom 1.1s 3.3s both}
.wreckd-intro__tagline{font-size:clamp(14px,2vw,19px);color:#9cb2c1;margin:24px 0;animation:caption-in 8s both;letter-spacing:.03em}
.wreckd-intro__enter{border:1px solid #36c6f460;background:#36c6f412;border-radius:30px;color:#c3efff;font:600 12px Arial,sans-serif;padding:15px 25px;cursor:pointer;animation:caption-in 8s both}.wreckd-intro__enter span{margin-left:35px}.wreckd-intro__enter:hover{background:#36c6f430}
.wreckd-intro button:focus-visible{outline:2px solid #fffaf0;outline-offset:5px}html.wreckd-intro-active{overflow:hidden}
@keyframes walk-in{0%{transform:translateX(-75vw)}100%{transform:translateX(0)}}
@keyframes rig-walk{0%,50%,100%{transform:translateY(0)}25%,75%{transform:translateY(-13px)}}
@keyframes leg-near{0%,100%{transform:rotate(-13deg)}25%{transform:rotate(0) translateY(-8px)}50%{transform:rotate(13deg)}75%{transform:rotate(0)}}
@keyframes leg-far{0%,100%{transform:rotate(13deg)}25%{transform:rotate(0)}50%{transform:rotate(-13deg)}75%{transform:rotate(0) translateY(-8px)}}
@keyframes arm-walk{0%,100%{transform:rotate(10deg)}50%{transform:rotate(-12deg)}}
@keyframes head-walk{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
@keyframes rig-settle{0%{transform:translateY(0) scale(1)}45%{transform:translateY(4px) scale(1.02,.97)}100%{transform:none}}
@keyframes head-cast{0%,100%{transform:none}35%{transform:rotate(-9deg)}65%{transform:rotate(6deg)}}
@keyframes arm-cast{0%,29%{transform:rotate(8deg)}35%{transform:rotate(36deg)}41%,54%{transform:rotate(-67deg)}64%,100%{transform:rotate(8deg)}}
@keyframes hand-magic{0%,32%{opacity:0;transform:scale(.2)}38%{opacity:1;transform:scale(.7) rotate(-25deg)}43%{opacity:1;transform:scale(1.4) rotate(35deg)}54%,100%{opacity:0;transform:scale(.2) rotate(90deg)}}
@keyframes hat-sparks{0%,32%,60%,100%{opacity:1;transform:none}43%{opacity:.5;transform:translate(-10px,-15px) scale(1.06)}}
@keyframes spell-flight{0%{opacity:0;transform:translate(0,10px) scale(.2)}20%,65%{opacity:1}100%{opacity:0;transform:translate(45vw,-25px) rotate(160deg) scale(.5)}}
@keyframes title-conjure{0%,42%{opacity:0;transform:scale(.8) translateX(-20px);filter:blur(18px);clip-path:inset(0 100% 0 0)}49%{opacity:1;transform:scale(1.025);filter:blur(0) drop-shadow(0 0 20px #36c6f4);clip-path:inset(0 0 0 0)}57%,100%{opacity:1;transform:none;filter:drop-shadow(0 10px 25px #0005);clip-path:inset(-20% -20% -20% -20%)}}
@keyframes spell-bloom{0%,100%{opacity:0;transform:scale(.4)}40%{opacity:1;transform:scale(1.2)}}
@keyframes caption-in{0%,57%{opacity:0;transform:translateY(8px)}66%,100%{opacity:1;transform:none}}
@media(max-width:600px){.wreckd-intro__stage{height:260px}.wreckd-intro__walker{width:37%;bottom:8px}.wreckd-intro__mark{width:62%}.wreckd-intro__skip{top:20px;right:20px}.wreckd-intro__tagline{margin:15px 0 25px}}
@media(prefers-reduced-motion:reduce){.wreckd-intro,.wreckd-intro *{animation:none!important;transition:none!important}.intro-spell,.intro-flash,.wizard-magic{display:none}.wreckd-intro__mark{opacity:1;transform:none}}

/* Resolve into the unmodified master lockup, including the mascot's blue M. */
.wreckd-intro__stage{height:auto;aspect-ratio:1630 / 725;display:block}
.wreckd-intro__mark{position:absolute;inset:0;width:100%;animation:master-reveal 8s both;transform-origin:50% 50%}
.wreckd-intro__mark svg{width:100%;height:100%;color:#36c6f4}
.wreckd-intro__walker{width:49.08%;left:-3.067%;bottom:-4.137%;animation:walk-in 2.3s linear both,mascot-resolve 8s both}
.wreckd-intro__stage:after{left:0;width:37%;bottom:0;animation:walk-in 2.3s linear both,shadow-resolve 8s both}
.wizard-arm--spell{animation:arm-cast 8s both}
.intro-spell{left:28%;top:38%;width:60%;height:40%}
.intro-flash{left:20%;top:5%;width:80%;height:90%}
.wreckd-intro__tagline{animation:final-caption 8s both;margin:32px 0 24px}
.wreckd-intro__enter{animation:final-caption 8s both}
@keyframes master-reveal{0%,40%{opacity:0;clip-path:inset(-12% 0 -12% 100%);filter:blur(9px);transform:translateY(4px)}48%{opacity:1;clip-path:inset(-12% 0 -12% 36%);filter:blur(0) drop-shadow(0 0 10px #36c6f460);transform:none}57%{opacity:1;clip-path:inset(-12% 0 -12% 34%);filter:none}66%,100%{opacity:1;clip-path:inset(-12% -5% -12% -5%);filter:none;transform:none}}
@keyframes mascot-resolve{0%,57%{opacity:1}65%,100%{opacity:0}}
@keyframes shadow-resolve{0%,57%{opacity:1}66%,100%{opacity:0}}
@keyframes final-caption{0%,65%{opacity:0;transform:translateY(6px)}73%,100%{opacity:1;transform:none}}
@media(max-width:600px){.wreckd-intro__stage{height:auto;aspect-ratio:1630 / 725}.wreckd-intro__walker{width:49.08%;left:-3.067%;bottom:-4.137%}.wreckd-intro__mark{width:100%}.wreckd-intro__tagline{margin-top:32px;font-size:13px}.wreckd-intro__center{width:92vw}}
@media(prefers-reduced-motion:reduce){.wreckd-intro__walker,.wreckd-intro__stage:after{display:none}.wreckd-intro__mark{opacity:1;clip-path:none;transform:none}}

/* Cast with the original wand-bearing left arm, pivoting at its shoulder. */
.wizard-arm--rest{transform-origin:252px 530px;animation:left-arm-sequence 8s linear both}
.wizard-head{animation:head-walk .38s 6 linear,watch-wand 1.7s 2.3s both}
.wizard-magic{animation:original-wand-charge 8s both}
.intro-spell{left:26%;top:40%;width:66%;height:35%}
.intro-spell i{animation-name:wand-spell-flight;animation-duration:1s;animation-delay:3.25s}
.intro-spell i:nth-child(2){animation-delay:3.32s;top:30%}.intro-spell i:nth-child(3){animation-delay:3.4s;top:65%}.intro-spell i:nth-child(4){animation-delay:3.47s;top:15%}.intro-spell i:nth-child(5){animation-delay:3.54s;top:75%}
@keyframes left-arm-sequence{
0%,4.75%,9.5%,14.25%,19%,23.75%,28.5%{transform:rotate(-7deg)}
2.375%,7.125%,11.875%,16.625%,21.375%,26.125%{transform:rotate(8deg)}
31%{transform:rotate(0)}
35%{transform:rotate(24deg)}
39%{transform:rotate(112deg)}
42%{transform:rotate(140deg)}
46%{transform:rotate(130deg)}
50%{transform:rotate(134deg)}
56%{transform:rotate(35deg)}
61%,100%{transform:rotate(0)}
}
@keyframes original-wand-charge{0%,32%{opacity:0;transform:scale(.1)}36%{opacity:.8;transform:scale(.5) rotate(15deg)}40%{opacity:1;transform:scale(1.2) rotate(55deg)}43%{opacity:1;transform:scale(1.7) rotate(100deg)}49%{opacity:.7;transform:scale(.7) rotate(150deg)}54%,100%{opacity:0;transform:scale(.1) rotate(200deg)}}
@keyframes watch-wand{0%,100%{transform:none}30%{transform:rotate(-7deg)}65%{transform:rotate(5deg)}}
@keyframes wand-spell-flight{0%{opacity:0;transform:translate(0,0) scale(.2)}15%{opacity:1}50%{opacity:1;transform:translate(22vw,-25px) scale(1.1) rotate(70deg)}100%{opacity:0;transform:translate(50vw,-8px) scale(.3) rotate(160deg)}}

.intro-spell{top:59%;height:20%}
