.loader{position:fixed;inset:0;z-index:40;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(86,216,255,.12),transparent 20%),radial-gradient(circle at 18% 20%,rgba(76,125,255,.18),transparent 28%),radial-gradient(circle at 82% 74%,rgba(216,108,255,.14),transparent 30%),#030712;transition:opacity .7s ease,visibility .7s ease}
.loader:before{content:"";position:absolute;inset:-20%;background:linear-gradient(115deg,transparent 0 43%,rgba(86,216,255,.1) 49%,transparent 56% 100%);animation:loader-scan 2.6s ease-in-out infinite}
.loader:after{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.34) 0 1px,transparent 1.5px);background-size:72px 72px;mask-image:radial-gradient(circle at center,#000,transparent 72%);opacity:.28;animation:loader-drift 8s linear infinite}
.loader.hide{opacity:0;visibility:hidden;pointer-events:none}
.loader.hide .loader-shell{display:none}
.loader-shell{position:relative;z-index:1;display:grid;place-items:center;gap:22px;width:min(440px,86vw);text-align:center}
.loader-orbit{position:relative;width:178px;aspect-ratio:1;display:grid;place-items:center}
.loader-orbit span{position:absolute;inset:0;border:1px solid rgba(86,216,255,.22);border-top-color:rgba(86,216,255,.95);border-radius:50%;animation:loader-spin 1.8s linear infinite}
.loader-orbit span:nth-child(2){inset:18px;border-color:rgba(216,108,255,.18);border-right-color:rgba(216,108,255,.9);animation-duration:2.5s;animation-direction:reverse}
.loader-orbit span:nth-child(3){inset:36px;border-color:rgba(255,255,255,.12);border-bottom-color:rgba(255,255,255,.8);animation-duration:3.2s}
.loader-core{width:76px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 32%,#fff,#7ee7ff 28%,#4c7dff 56%,rgba(76,125,255,.2) 72%,transparent 74%);box-shadow:0 0 40px rgba(86,216,255,.45),0 0 90px rgba(76,125,255,.32);animation:loader-pulse 1.5s ease-in-out infinite}
.loader-copy strong{display:block;font:800 26px/1 "Space Grotesk",Inter,sans-serif;letter-spacing:.16em;color:white;text-shadow:0 0 24px rgba(86,216,255,.42)}
.loader-copy span{display:block;margin-top:8px;color:#a7b5c8;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.loader-bar{position:relative;width:min(320px,72vw);height:3px;overflow:hidden;border-radius:999px;background:rgba(170,210,255,.14)}
.loader-bar i{position:absolute;inset:0;width:42%;border-radius:999px;background:linear-gradient(90deg,transparent,var(--cyan),var(--magenta));animation:loader-bar 1.2s ease-in-out infinite}
.loader-status{margin:0;color:#d8e6ff;font-size:12px;letter-spacing:.16em;text-transform:uppercase}
@keyframes loader-spin{to{transform:rotate(360deg)}}
@keyframes loader-pulse{50%{transform:scale(1.08);filter:saturate(1.3)}}
@keyframes loader-scan{0%,100%{transform:translateX(-18%)}50%{transform:translateX(18%)}}
@keyframes loader-drift{to{background-position:72px 72px}}
@keyframes loader-bar{0%{transform:translateX(-110%)}100%{transform:translateX(250%)}}
@media(max-width:700px){.loader-orbit{width:142px}.loader-copy strong{font-size:21px}.loader-copy span,.loader-status{font-size:11px}}
@media(prefers-reduced-motion:reduce){.loader:before,.loader:after,.loader-orbit span,.loader-core,.loader-bar i{animation:none}}