/* Abertura Capitão MX — não bloqueia a página após a animação */
.mx-intro{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 40%,#25202f 0,#08090e 62%);color:#fff;font-family:inherit;isolation:isolate}
.mx-intro.is-hidden{visibility:hidden;pointer-events:none;transition:visibility 0s .45s,opacity .45s;opacity:0}
.intro-glow{position:absolute;inset:0;background:radial-gradient(circle at 52% 52%,rgba(13,193,250,.12),transparent 45%);animation:introPulse 1.5s infinite alternate}
.intro-inner{position:relative;z-index:3;text-align:center;padding:18px;max-width:620px;width:100%}
.intro-label{font-size:12px;font-weight:900;letter-spacing:.3em;color:#fff}.intro-label span{color:#ffdb24}
.intro-mascot-wrap{height:clamp(210px,37vh,380px);position:relative;margin:10px auto 0;max-width:430px}
.intro-mascot{position:relative;z-index:2;height:100%;width:100%;object-fit:contain;animation:mascotLaunch 2.6s ease-in-out both;filter:drop-shadow(0 15px 35px #0008)}
.intro-inner h2{font-size:clamp(24px,4vw,42px);letter-spacing:-.04em;margin:8px 0 5px;font-weight:900}.intro-inner h2 em{font-style:normal;color:#ffdf26}.intro-inner p{color:#d1d0d8;font-size:14px;margin:0 0 18px}
.intro-progress{width:min(260px,80%);height:5px;background:#ffffff30;border-radius:10px;overflow:hidden;margin:auto}.intro-progress span{display:block;height:100%;background:linear-gradient(90deg,#00c9ff,#f50092,#ffdd17);animation:fillIntro 2.6s linear both}
.intro-skip{border:1px solid #ffffff50;border-radius:99px;background:#ffffff12;color:white;cursor:pointer;margin-top:20px;padding:9px 19px;font:inherit;font-size:13px}.intro-skip:hover{background:#ffffff30}
.intro-splash{position:absolute;z-index:4;left:50%;top:45%;width:60px;height:60px;border-radius:52% 48% 30% 70%;opacity:0;transform:translate(-50%,-50%) scale(.1);filter:drop-shadow(0 0 12px currentColor);animation:splashThrow 1.35s cubic-bezier(.2,.7,.2,1) 1.25s both}
.splash-blue{background:#00caff;color:#00caff;--tx:-220px;--ty:-130px;animation-delay:1.23s}.splash-pink{background:#f60995;color:#f60995;--tx:200px;--ty:-100px;animation-delay:1.37s}.splash-yellow{background:#ffdc1a;color:#ffdc1a;--tx:-160px;--ty:120px;animation-delay:1.5s}.splash-white{background:#fff;color:#fff;--tx:165px;--ty:130px;animation-delay:1.6s}
.intro-wipe{position:absolute;z-index:2;inset:0;background:conic-gradient(from 30deg at 50% 50%,#02c5ff,#ed008c,#ffdb16,#02c5ff);clip-path:circle(0% at 50% 48%);animation:wipePaint .8s ease-in 2.25s both;opacity:.97}
@keyframes mascotLaunch{0%{transform:translateY(32px) scale(.8);opacity:0}30%{transform:translateY(0) scale(1);opacity:1}54%{transform:rotate(-9deg) scale(1.03)}70%{transform:rotate(10deg) scale(1.06)}100%{transform:rotate(0) scale(1.02)}}
@keyframes splashThrow{0%{opacity:0;transform:translate(-50%,-50%) scale(.1)}35%{opacity:1}100%{opacity:1;transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(3.7)}}
@keyframes fillIntro{from{width:0}to{width:100%}}@keyframes wipePaint{0%{clip-path:circle(0% at 50% 48%)}100%{clip-path:circle(155% at 50% 48%)}}@keyframes introPulse{to{opacity:.3}}
@media(max-width:600px){.intro-mascot-wrap{height:250px}.intro-splash{width:38px;height:38px}.splash-blue{--tx:-115px;--ty:-90px}.splash-pink{--tx:110px;--ty:-70px}.splash-yellow{--tx:-90px;--ty:90px}.splash-white{--tx:100px;--ty:90px}}
@media(prefers-reduced-motion:reduce){.mx-intro{display:none!important}}