.intro-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;
background:linear-gradient(160deg,#070B1A 0%,#0F172A 55%,#1E293B 100%);overflow:hidden;
animation:introIn .3s ease-out both,introOut .4s ease-in 1.1s forwards;will-change:opacity,transform}
.intro-glow-top,.intro-glow-bottom{position:absolute;left:50%;width:140%;height:50%;pointer-events:none;transform:translateX(-50%)}
.intro-glow-top{top:-10%;background:radial-gradient(ellipse at 50% 20%,rgba(255,59,59,.10),transparent 65%);filter:blur(100px)}
.intro-glow-bottom{bottom:-15%;background:radial-gradient(ellipse at 50% 80%,rgba(59,130,246,.15),transparent 65%);filter:blur(120px)}
.intro-content{position:relative;max-width:90vw;text-align:center}
.intro-logo{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:72px;margin-bottom:22px;animation:logoGlow 1s ease-in-out .3s 1}
.data-bar{width:8px;border-radius:4px;background:linear-gradient(to top,#7FFF00,#00D4FF);transform-origin:bottom;
transform:scaleY(.2);animation:barIn .3s ease-out forwards,dataWave .4s ease-in-out .3s 1,barGlow .5s ease-in-out .4s 2 alternate;will-change:transform}
.bar-1{height:20px;animation-delay:0s,.3s,.4s}.bar-2{height:40px;animation-delay:.05s,.35s,.4s}
.bar-3{height:60px;animation-delay:.1s,.4s,.4s}.bar-4{height:40px;animation-delay:.15s,.45s,.4s}.bar-5{height:20px;animation-delay:.2s,.5s,.4s}
.intro-particles span{position:absolute;width:4px;height:4px;border-radius:50%;background:#00D4FF;opacity:.6;animation:float 2s ease-in-out infinite}
.intro-particles span:nth-child(1){top:-30px;left:8%}.intro-particles span:nth-child(2){top:10px;right:6%;background:#7FFF00}
.intro-particles span:nth-child(3){top:60px;left:-4%}.intro-particles span:nth-child(4){top:90px;right:-2%}
.intro-particles span:nth-child(5){top:-10px;right:30%;background:#7FFF00}.intro-particles span:nth-child(6){top:120px;left:20%}
.intro-brand{margin:0;font:700 20px/1.2 Inter,Poppins,system-ui,sans-serif;letter-spacing:2px;color:#fff;
text-shadow:0 0 20px rgba(127,255,0,.5);opacity:0;animation:fadeUp20 .3s ease-out .7s forwards}
.intro-tagline{margin:8px 0 0;font:italic 14px Inter,system-ui,sans-serif;color:#9CA3AF;opacity:0;animation:fadeUp10 .3s ease-out .85s forwards}
.intro-status{margin:14px 0 0;font:12px Inter,system-ui,sans-serif;color:#6B7280;opacity:0;animation:fadeUp10 .3s ease-out .9s forwards}
.intro-status .dots span{animation:dot 1s infinite}.intro-status .dots span:nth-child(2){animation-delay:.15s}.intro-status .dots span:nth-child(3){animation-delay:.3s}
@media(min-width:768px){.data-bar{width:12px}.intro-logo{gap:12px}.intro-brand{font-size:28px}}
@keyframes introIn{from{opacity:0}to{opacity:1}}
@keyframes introOut{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.05)}}
@keyframes barIn{to{transform:scaleY(1)}}
@keyframes dataWave{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.15)}}
@keyframes barGlow{from{box-shadow:0 0 10px #7FFF00}to{box-shadow:0 0 20px #7FFF00}}
@keyframes logoGlow{50%{filter:drop-shadow(0 0 14px rgba(127,255,0,.55))}}
@keyframes fadeUp20{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes fadeUp10{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes float{50%{transform:translateY(-8px)}}
@keyframes dot{50%{opacity:.2}}
.intro-overlay.intro-done{pointer-events:none}
@media(prefers-reduced-motion:reduce){.intro-overlay{display:none!important}}