.sx-intro { position: fixed; inset: 0; z-index: 9990; display: grid; place-items: center; background: radial-gradient(700px 420px at 50% 45%, rgba(var(--accent-rgb, 124, 58, 237), .16), transparent 70%), var(--bg-0, #0B1120); transition: opacity .45s ease, visibility .45s ease; overflow: hidden; }
.sx-intro.is-done { opacity: 0; visibility: hidden; pointer-events: none; }
.sx-stage { position: relative; font-size: clamp(30px, 7.4vw, 76px); }
.sx-row { position: relative; display: flex; align-items: center; white-space: nowrap; font-family: 'Russo One', 'Montserrat', system-ui, sans-serif; font-weight: 400; line-height: 1; color: #F1F0FF; opacity: 0; will-change: transform, opacity; }
.sx-t { display: inline-block; will-change: transform, opacity; transform-origin: 0 50%; }
.sx-w2 { color: #F1F0FF; }
#sxAna { transform-origin: 100% 50%; }
.sx-gap { display: inline-block; width: .32em; }
.sx-s { display: inline-block; width: .6em; height: 1em; margin-right: .02em; position: relative; }
.sx-svg { position: absolute; left: 0; top: -.04em; width: .6em; height: 1.08em; overflow: visible; }
.sx-bow { fill: none; stroke: #F1F0FF; stroke-width: 12.5; stroke-linecap: round; stroke-linejoin: round; }
.sx-str { stroke: #DDD6FE; stroke-width: 3.2; stroke-linecap: round; opacity: 0; }
.sx-arrow { position: absolute; left: 0; top: 50%; height: 0; width: .9em; opacity: 0; pointer-events: none; transform-origin: 0 50%; }
.sx-arrow::before { content: ""; position: absolute; left: 0; right: .14em; top: -.03em; height: .06em; border-radius: 99px; background: linear-gradient(90deg, rgba(167, 139, 250, 0), #C4B5FD 35%, #F5F3FF); box-shadow: 0 0 .25em rgba(167, 139, 250, .8); }
.sx-arrow::after { content: ""; position: absolute; right: 0; top: -.09em; border-left: .2em solid #F5F3FF; border-top: .09em solid transparent; border-bottom: .09em solid transparent; filter: drop-shadow(0 0 .12em #A78BFA); }
.sx-arrow i { position: absolute; left: 0; top: -.1em; width: .16em; height: .2em; border-left: .05em solid #A78BFA; border-right: .05em solid #A78BFA; transform: skewX(-30deg); }
.sx-flash { position: absolute; left: 0; top: 50%; width: 1.4em; height: 1.4em; margin: -.7em 0 0 -.7em; border-radius: 50%; background: radial-gradient(circle, #fff 0, rgba(196, 181, 253, .9) 22%, rgba(124, 58, 237, .45) 45%, transparent 70%); opacity: 0; transform: scale(.2); pointer-events: none; }
.sx-spark { position: absolute; top: 50%; width: .07em; height: .07em; margin: -.035em; border-radius: 50%; background: #E9D5FF; box-shadow: 0 0 .15em #A78BFA; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .sx-intro { transition: opacity .2s ease, visibility .2s ease; } }
