* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; }
.syn-auth-page {
    min-height:100vh; display:grid; overflow-x:hidden;
    padding:24px; color:#f8f7ff; background:#07091b;
    font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Segoe UI Variable Text","Segoe UI Variable","Segoe UI",Arial,sans-serif;
}

/* ============ UNIVERSE BACKGROUND ============ */
.universe,.universe:before,.universe:after { position:fixed; inset:0; pointer-events:none; }
.universe {
    overflow:hidden; z-index:0; perspective:900px;
    background:radial-gradient(ellipse at 50% 42%,#2d3170 0,#151a46 38%,#090b25 72%,#030414 100%);
    transform:translate3d(calc(var(--mx,0) * -10px),calc(var(--my,0) * -7px),0) scale(1.03);
    transition:transform .8s ease-out;
}
.universe:before {
    content:""; z-index:3;
    background:radial-gradient(circle at center,rgba(111,91,255,.22),transparent 8%,rgba(5,6,23,.35) 58%,#040512 100%);
}
/* nebula clouds — slowly drifting & hue-shifting */
.nebula { position:absolute; border-radius:50%; filter:blur(70px); mix-blend-mode:screen; will-change:transform,opacity; }
.nebula-1 { width:820px; height:620px; left:-260px; top:-220px; background:radial-gradient(ellipse,rgba(99,81,255,.34),transparent 66%); animation:nebulaA 26s ease-in-out infinite alternate; }
.nebula-2 { width:760px; height:640px; right:-260px; bottom:-240px; background:radial-gradient(ellipse,rgba(255,61,145,.26),transparent 66%); animation:nebulaB 31s ease-in-out infinite alternate; }
.nebula-3 { width:560px; height:560px; left:52%; top:56%; transform:translate(-50%,-50%); background:radial-gradient(circle,rgba(97,215,255,.16),transparent 62%); animation:nebulaC 22s ease-in-out infinite alternate; }
.cosmic-dust { position:absolute; inset:-20%; border-radius:50%; pointer-events:none; }
.dust-far {
    opacity:.45;
    background:radial-gradient(ellipse at 30% 35%,transparent 0 22%,rgba(99,81,255,.15) 33%,transparent 54%),radial-gradient(ellipse at 72% 70%,rgba(255,80,160,.12),transparent 42%);
    filter:blur(28px);
    transform:translate3d(calc(var(--mx,0) * -5px),calc(var(--my,0) * -4px),0);
}
.dust-near {
    opacity:.3;
    background-image:radial-gradient(circle,rgba(187,169,255,.8) 0 .7px,transparent 1px);
    background-size:37px 43px;
    mask-image:radial-gradient(ellipse at center,#000,transparent 68%);
    transform:translate3d(calc(var(--mx,0) * -22px),calc(var(--my,0) * -15px),0);
    transition:transform 1.2s ease-out;
}
.stars {
    position:absolute; inset:-15%; opacity:.5;
    background-image:radial-gradient(circle,#fff 0 1px,transparent 1.6px),radial-gradient(circle,#9081ff 0 1px,transparent 1.6px);
    background-size:113px 127px,191px 177px;
    transform:translate3d(calc(var(--mx,0) * -18px),calc(var(--my,0) * -12px),0);
    transition:transform 1s ease-out;
}
.stars-one { animation:starDrift 38s linear infinite; }
.stars-two { opacity:.28; background-position:41px 64px,90px 22px; animation:starDrift 65s linear infinite reverse; transform:translate3d(calc(var(--mx,0) * -30px),calc(var(--my,0) * -20px),0); }
.stars-three { opacity:.18; background-size:43px 57px,71px 83px; background-position:9px 7px,29px 31px; transform:translate3d(calc(var(--mx,0) * -46px),calc(var(--my,0) * -32px),0); }
/* warp flight stars */
.flight-stars { position:absolute; inset:0; z-index:1; overflow:hidden; pointer-events:none; }
.flight-stars i {
    position:absolute; left:50%; top:50%;
    width:var(--size,2px); height:var(--size,2px); border-radius:50%;
    background:#d8f8ff; box-shadow:0 0 9px 2px #63dcff;
    opacity:0; transform:translate(-50%,-50%);
    animation:starWarp var(--duration,14s) linear var(--delay,0s) infinite;
}
.flight-stars i:nth-child(even) { background:#e8d8ff; box-shadow:0 0 9px 2px #a66cff; }
.fs-1{--x:-47vw;--y:-32vh;--duration:15s;--delay:-7s;--size:2px}.fs-2{--x:43vw;--y:-28vh;--duration:19s;--delay:-2s;--size:3px}.fs-3{--x:-35vw;--y:35vh;--duration:17s;--delay:-11s;--size:1px}.fs-4{--x:49vw;--y:31vh;--duration:22s;--delay:-14s;--size:2px}.fs-5{--x:-18vw;--y:-42vh;--duration:13s;--delay:-4s;--size:2px}.fs-6{--x:22vw;--y:43vh;--duration:20s;--delay:-17s;--size:3px}.fs-7{--x:-51vw;--y:9vh;--duration:18s;--delay:-9s;--size:1px}.fs-8{--x:52vw;--y:7vh;--duration:24s;--delay:-20s;--size:2px}.fs-9{--x:-8vw;--y:-46vh;--duration:16s;--delay:-12s;--size:1px}.fs-10{--x:7vw;--y:47vh;--duration:21s;--delay:-6s;--size:2px}.fs-11{--x:-43vw;--y:-12vh;--duration:26s;--delay:-22s;--size:2px}.fs-12{--x:45vw;--y:17vh;--duration:14s;--delay:-1s;--size:1px}
/* shooting meteors */
.meteor {
    position:absolute; top:12%; left:-12%; width:340px; height:2px; border-radius:2px;
    background:linear-gradient(90deg,transparent,#cfd8ff 42%,#fff 78%,transparent);
    box-shadow:0 0 14px 2px rgba(160,180,255,.4);
    transform:rotate(-24deg) translateX(-40vw); opacity:0;
    animation:meteorFly 9s cubic-bezier(.25,.6,.35,1) infinite;
}
.meteor-2 { top:34%; width:260px; animation-duration:13s; animation-delay:4.5s; background:linear-gradient(90deg,transparent,#a8ecff 45%,#fff 80%,transparent); }
.meteor-3 { top:6%; width:420px; animation-duration:16s; animation-delay:8.5s; background:linear-gradient(90deg,transparent,#e2c8ff 45%,#fff 80%,transparent); }
.aurora { position:absolute; border-radius:50%; filter:blur(60px); }
.aurora-left { width:720px;height:520px;left:-300px;top:-210px;background:radial-gradient(ellipse,rgba(93,70,255,.6),transparent 68%);animation:auroraLeft 14s ease-in-out infinite alternate; }
.aurora-right { width:720px;height:570px;right:-290px;bottom:-260px;background:radial-gradient(ellipse,rgba(255,61,145,.43),transparent 68%);animation:auroraRight 17s ease-in-out infinite alternate; }
.aurora-center { width:760px; height:420px; left:50%; top:28%; transform:translateX(-50%); background:radial-gradient(ellipse,rgba(104,92,255,.25),transparent 68%); filter:blur(70px); opacity:.55; animation:auroraCenter 11s ease-in-out infinite alternate; }
.perspective-grid { position:absolute; inset:0; opacity:.16; background-image:linear-gradient(rgba(134,123,255,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(134,123,255,.35) 1px,transparent 1px); background-size:64px 64px; transform:perspective(850px) rotateX(64deg) translateY(41%); mask-image:linear-gradient(to top,#000,transparent 68%); animation:gridShift 24s linear infinite; }
.vignette { position:absolute; inset:0; box-shadow:inset 0 0 180px rgba(0,0,0,.45); }
.mouse-glow { position:absolute; width:420px; height:420px; left:calc(50% + var(--mx,0) * 220px); top:calc(50% + var(--my,0) * 180px); transform:translate(-50%,-50%); border-radius:50%; background:radial-gradient(circle,rgba(97,215,255,.1),transparent 68%); filter:blur(22px); transition:left .25s ease-out,top .25s ease-out; }

/* ============ STAGE ============ */
.register-stage {
    position:relative; z-index:5;
    width:min(1040px,calc(100vw - 48px));
    margin:auto; overflow:hidden;
    border:1px solid rgba(164,142,255,.24); border-radius:26px;
    background:rgba(11,14,39,.72);
    box-shadow:0 35px 110px rgba(0,0,0,.62),inset 0 0 80px rgba(118,91,255,.06);
    backdrop-filter:blur(22px);
    animation:stageIn .7s cubic-bezier(.2,.75,.25,1) both;
}
.register-head {
    height:66px; display:flex; align-items:center; justify-content:space-between; padding:14px 28px;
    border-bottom:1px solid rgba(255,255,255,.09);
    background:linear-gradient(90deg,rgba(47,40,112,.4),rgba(11,14,39,.2));
}
.brand-lockup { display:flex; align-items:center; gap:11px; color:#e1ddf5; font-size:14px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.brand-lockup small { margin-left:8px; color:#777da4; font-size:9px; font-weight:600; letter-spacing:.06em; text-transform:none; }
.brand-symbol {
    display:grid; place-items:center; width:40px; height:40px; border-radius:13px;
    background:linear-gradient(135deg,#ff679f,#8e60ff); color:#fff; font-size:18px;
    box-shadow:0 0 28px rgba(166,108,255,.48);
    animation:symbolPulse 3.2s ease-in-out infinite;
}
.register-status { color:#65e3ba; font-size:10px; font-weight:800; letter-spacing:.13em; }
.register-status i { position:relative; display:inline-block; width:7px; height:7px; margin-right:7px; border-radius:50%; background:#65e3ba; box-shadow:0 0 14px #65e3ba; }
.register-status i::after { content:""; position:absolute; inset:-4px; border:1px solid rgba(101,227,186,.75); border-radius:50%; animation:ringPing 2.2s cubic-bezier(.2,.6,.35,1) infinite; }
.register-content { display:grid; grid-template-columns:1fr 1fr; gap:44px; padding:38px 52px 42px; align-items:center; }

/* ============ INTRO SIDE ============ */
.register-intro { align-self:center; max-width:420px; }
.register-intro .micro-label { color:#858dc2; font-size:10px; font-weight:800; letter-spacing:.18em; }
.register-intro h1 { margin:14px 0; color:#fff; font-size:clamp(2rem,3.4vw,3.3rem); line-height:1.05; letter-spacing:-.06em; word-spacing:.02em; }
.register-intro h1 strong {
    font-weight:800;
    background:linear-gradient(100deg,#af87ff 0%,#e2c8ff 25%,#63dcff 50%,#af87ff 75%);
    background-size:220% 100%;
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
    animation:shimmerText 5.5s linear infinite;
    filter:drop-shadow(0 0 30px rgba(166,108,255,.4));
}
.register-intro p { max-width:360px; margin-top:14px; color:#9da7c4; font-size:13px; line-height:1.65; }

/* neural network svg */
.auth-network { width:min(400px,100%); margin:18px 0 0; opacity:.95; }
.auth-network svg { display:block; width:100%; height:auto; overflow:visible; }
.auth-orbit { fill:none; stroke:rgba(166,108,255,.3); stroke-width:1; stroke-dasharray:3 9; transform-origin:260px 126px; }
.auth-orbit.orbit-wide { animation:authOrbit 18s linear infinite; }
.auth-orbit.orbit-tall { stroke:rgba(97,215,255,.2); animation:authOrbit 25s linear infinite reverse; }
.auth-wire { fill:none; stroke:url(#authWire); stroke-width:1.2; stroke-dasharray:210 210; animation:wireFlow 4s linear infinite; }
.auth-dot { fill:#a66cff; filter:url(#authGlow); animation:dotGlow 2.6s ease-in-out infinite; }
.auth-dot.cyan { fill:#63dcff; animation-delay:.9s; }
.auth-dot:nth-of-type(4) { animation-delay:.4s; }
.auth-core circle:first-child { fill:#8d60ff; stroke:#ff679f; stroke-width:1; }
.auth-core-inner { fill:#22204f; stroke:rgba(255,255,255,.24); }
.auth-core text { fill:#fff; font:900 25px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.auth-label { fill:#bda8ff; font:800 9px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; letter-spacing:1.5px; }
.cyan-text { fill:#8beaff; }

/* ============ ACCESS SIDE ============ */
.register-access-wrap { position:relative; display:grid; place-items:center; min-height:420px; width:100%; }
.register-orbit { position:absolute; border:1px solid rgba(97,215,255,.28); border-radius:50%; pointer-events:none; }
.orbit-a { width:440px; height:270px; transform:rotate(32deg) scaleX(.55); animation:registerOrbitA 15s linear infinite; }
.orbit-a::before, .orbit-a::after { content:""; position:absolute; width:20px; height:20px; border-radius:50%; background:radial-gradient(circle,#fff 0 1.5px,#63dcff 2.5px,rgba(99,220,255,.32) 8px,transparent 9px); }
.orbit-a::before { top:34px; right:56px; }
.orbit-a::after { bottom:46px; left:78px; width:16px; height:16px; background:radial-gradient(circle,#fff 0 1px,#ff679f 2.5px,rgba(255,103,159,.32) 6px,transparent 7px); }
.orbit-b { width:340px; height:410px; border-color:rgba(166,108,255,.3); transform:rotate(-42deg) scaleX(.7); animation:registerOrbitB 21s linear infinite reverse; }
.orbit-b::before { content:""; position:absolute; top:64px; left:48px; width:18px; height:18px; border-radius:50%; background:radial-gradient(circle,#fff 0 1.5px,#a66cff 2.5px,rgba(166,108,255,.32) 7px,transparent 8px); }
.orbit-c { width:500px; height:310px; border:1px dashed rgba(255,103,159,.16); transform:rotate(58deg) scaleX(.42); animation:registerOrbitC 34s linear infinite; }
.register-orbit-core {
    position:absolute; z-index:2; display:grid; place-items:center; align-content:center;
    width:74px; height:74px; border:1px solid #63dcff; border-radius:50%;
    background:#121b43e8;
    box-shadow:0 0 35px rgba(97,215,255,.35),inset 0 0 25px rgba(166,108,255,.3);
    animation:coreFloat 4s ease-in-out infinite;
}
.register-orbit-core b { color:#e9fbff; font-size:24px; line-height:1; }
.register-orbit-core small { margin-top:4px; color:#63dcff; font-size:7px; letter-spacing:.13em; }

/* the form card */
.register-form {
    position:relative; z-index:3;
    width:100%; max-width:440px; padding:26px;
    border-radius:22px;
    background:
        url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E"),
        linear-gradient(155deg,rgba(36,39,78,.78),rgba(20,23,52,.7));
    border:1px solid rgba(255,255,255,.1);
    box-shadow:0 22px 60px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.08);
    backdrop-filter:blur(14px);
    transform:perspective(1100px) rotateX(calc(var(--my,0) * -2.2deg)) rotateY(calc(var(--mx,0) * 2.6deg));
    transition:transform .35s ease-out;
}
/* rotating conic border beam */
@property --beam { syntax:'<angle>'; inherits:false; initial-value:0deg; }
.register-form::before {
    content:""; position:absolute; inset:-1px; border-radius:23px; padding:1px;
    background:conic-gradient(from var(--beam),transparent 0deg,rgba(166,108,255,0) 250deg,#a66cff 305deg,#63dcff 330deg,rgba(166,108,255,0) 360deg);
    -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude;
    animation:beamSpin 5s linear infinite;
    opacity:.9; pointer-events:none;
}
/* top hairline */
.register-form::after {
    content:""; position:absolute; left:28px; right:28px; top:0; height:1px;
    background:linear-gradient(90deg,transparent,#ff679f,#9b6cff,#63dcff,transparent);
    box-shadow:0 0 16px #a66cff; pointer-events:none;
}

/* error */
.access-error { display:flex; gap:8px; align-items:center; padding:10px; border:1px solid rgba(255,103,159,.28); border-radius:10px; background:rgba(255,103,159,.1); color:#ffabc4; font-size:12px; animation:errorShake .45s cubic-bezier(.36,.07,.19,.97); }
.access-error span { display:grid; place-items:center; width:17px; height:17px; border-radius:50%; background:#ff679f; color:#25132d; font-weight:900; flex:none; }

/* fields */
.register-form label { display:block; margin:11px 0; color:#bfc3d7; font-size:10px; font-weight:800; letter-spacing:.12em; position:relative; }
.register-form input {
    width:100%; height:44px; margin-top:6px; padding:0 13px;
    border:1px solid rgba(255,255,255,.11); border-radius:12px;
    background:rgba(23,26,56,.85); color:#fff; font:inherit;
    transition:border-color .25s, box-shadow .25s, background .25s, transform .25s;
}
.register-form input::placeholder { color:#62698e; }
.register-form input:hover { border-color:rgba(166,108,255,.35); }
.register-form input:focus {
    outline:0; border-color:#a66cff; background:rgba(26,29,62,.95);
    box-shadow:0 0 0 4px rgba(166,108,255,.13),0 0 26px rgba(166,108,255,.14),inset 0 0 14px rgba(166,108,255,.06);
    transform:translateY(-1px);
}
/* animated underline draw */
.register-form label::after {
    content:""; position:absolute; left:13px; right:13px; bottom:0; height:2px; border-radius:2px;
    background:linear-gradient(90deg,#a66cff,#63dcff);
    transform:scaleX(0); transform-origin:left; transition:transform .35s cubic-bezier(.2,.75,.25,1);
}
.register-form label:focus-within::after { transform:scaleX(1); }

.connection-note { display:flex; gap:9px; margin-top:14px; padding:11px; border:1px solid rgba(97,215,255,.16); border-radius:10px; background:rgba(97,215,255,.06); }
.connection-note>span { color:#61d7ff; font-size:17px; }
.connection-note b,.connection-note small { display:block; }
.connection-note b { color:#d6ecff; font-size:11.5px; }
.connection-note small { margin-top:3px; color:#7d95b5; font-size:10.5px; line-height:1.5; }

/* submit button */
.access-submit {
    position:relative; overflow:hidden;
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    width:100%; height:48px; margin-top:20px; padding:0 16px;
    border:0; border-radius:13px; cursor:pointer;
    background:linear-gradient(100deg,#ff5f9a,#9b5cff,#6f5cff,#9b5cff,#ff5f9a);
    background-size:280% 100%;
    color:#fff; font:inherit; font-size:10.5px; font-weight:900; letter-spacing:.14em;
    box-shadow:0 10px 28px rgba(166,108,255,.3),inset 0 1px rgba(255,255,255,.25);
    transition:box-shadow .3s, transform .2s;
    animation:gradientSlide 6s linear infinite;
}
.access-submit b { font-size:17px; font-weight:400; transition:transform .3s cubic-bezier(.2,.75,.25,1); }
.access-submit::after {
    content:""; position:absolute; top:0; bottom:0; left:-80%; width:45%;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);
    transform:skewX(-22deg); animation:shineSweep 3.8s ease-in-out infinite;
}
.access-submit:hover { box-shadow:0 14px 40px rgba(166,108,255,.5),0 0 60px rgba(166,108,255,.25),inset 0 1px rgba(255,255,255,.3); transform:translateY(-2px); }
.access-submit:hover b { transform:translateX(4px); }
.access-submit:active { transform:translateY(0) scale(.985); }

.access-switch { margin-top:18px; text-align:center; color:#7d84a8; font-size:12px; }
.access-switch a { color:#ddceff; font-weight:800; text-decoration:none; background-image:linear-gradient(#a66cff,#a66cff); background-size:0% 1.5px; background-repeat:no-repeat; background-position:0 100%; transition:background-size .3s, color .3s, text-shadow .3s; padding-bottom:2px; }
.access-switch a:hover { color:#efe6ff; background-size:100% 1.5px; text-shadow:0 0 18px rgba(166,108,255,.6); }

/* ============ ENTRANCE SEQUENCE ============ */
.register-stage [data-reg] { opacity:0; transform:translateY(17px); filter:blur(5px); transition:opacity .7s cubic-bezier(.2,.75,.25,1),transform .7s cubic-bezier(.2,.75,.25,1),filter .7s ease; }
.register-stage [data-reg].reg-visible { opacity:1; transform:none; filter:none; }

/* ============ KEYFRAMES ============ */
@keyframes stageIn { from { opacity:0; transform:translateY(22px) scale(.98); } to { opacity:1; transform:none; } }
@keyframes starDrift { to { background-position:113px 127px,191px 177px; } }
@keyframes gridShift { to { background-position:0 64px,64px 0; } }
@keyframes auroraLeft { to { transform:translate(100px,60px) scale(1.12); opacity:.72; } }
@keyframes auroraRight { to { transform:translate(-80px,-50px) scale(1.1); opacity:.72; } }
@keyframes auroraCenter { to { transform:translateX(-50%) translateY(30px) scale(1.15); opacity:.8; } }
@keyframes starWarp { 0% { transform:translate(-50%,-50%) scale(.1); opacity:0; } 12% { opacity:.2; } 32% { opacity:.7; } 78% { opacity:.88; } 100% { transform:translate(var(--x),var(--y)) scale(2.4); opacity:0; } }
@keyframes meteorFly { 0% { transform:rotate(-24deg) translateX(-40vw); opacity:0; } 4% { opacity:1; } 14% { transform:rotate(-24deg) translateX(130vw); opacity:0; } 100% { transform:rotate(-24deg) translateX(130vw); opacity:0; } }
@keyframes nebulaA { to { transform:translate(90px,60px) scale(1.18); filter:blur(70px) hue-rotate(40deg); opacity:.8; } }
@keyframes nebulaB { to { transform:translate(-70px,-50px) scale(1.14); filter:blur(70px) hue-rotate(-35deg); opacity:.8; } }
@keyframes nebulaC { to { transform:translate(-42%,-58%) scale(1.3); filter:blur(70px) hue-rotate(55deg); opacity:.9; } }
@keyframes symbolPulse { 50% { box-shadow:0 0 42px rgba(166,108,255,.75),0 0 12px rgba(255,103,159,.5); transform:scale(1.04); } }
@keyframes ringPing { 0% { transform:scale(.5); opacity:1; } 100% { transform:scale(2.6); opacity:0; } }
@keyframes shimmerText { to { background-position:220% 0; } }
@keyframes authOrbit { to { transform:rotate(360deg); } }
@keyframes wireFlow { to { stroke-dashoffset:-420; } }
@keyframes dotGlow { 0%,100% { opacity:.55; } 50% { opacity:1; } }
@keyframes registerOrbitA { to { transform:rotate(392deg) scaleX(.55); } }
@keyframes registerOrbitB { to { transform:rotate(-382deg) scaleX(.7); } }
@keyframes registerOrbitC { to { transform:rotate(418deg) scaleX(.42); } }
@keyframes coreFloat { 50% { transform:scale(1.045); } }
@keyframes beamSpin { to { --beam:360deg; } }
@keyframes gradientSlide { to { background-position:280% 0; } }
@keyframes shineSweep { 0%,55% { left:-80%; } 100% { left:140%; } }
@keyframes errorShake { 10%,90% { transform:translateX(-2px); } 20%,80% { transform:translateX(3px); } 30%,50%,70% { transform:translateX(-5px); } 40%,60% { transform:translateX(5px); } }

/* Registration progress surface */
.registration-loading { display:none; position:fixed; inset:0; z-index:50; place-items:center; padding:22px; background:rgba(3,5,20,.84); backdrop-filter:blur(18px); }
.registration-loading.active { display:grid; }
.registration-loading-card { position:relative; width:min(500px,100%); overflow:hidden; padding:30px 28px 24px; border:1px solid rgba(99,215,255,.28); border-radius:24px; background:linear-gradient(145deg,rgba(25,31,72,.98),rgba(9,14,39,.98)); box-shadow:0 30px 100px rgba(0,0,0,.65),inset 0 0 55px rgba(100,85,255,.1); text-align:center; }
.registration-loading-kicker { color:#63dcff; font-size:10px; font-weight:800; letter-spacing:.18em; }
.registration-loading-card h2 { margin:18px 0 5px; color:#fff; font-size:24px; letter-spacing:-.04em; }
.registration-loading-card p { margin:0; color:#aab4d0; font-size:13px; }
.registration-core { position:relative; z-index:2; display:grid; place-items:center; width:70px; height:70px; margin:0 auto 18px; border:1px solid #63dcff; border-radius:50%; background:#121b43e8; color:#fff; font-size:25px; font-weight:900; box-shadow:0 0 38px rgba(97,215,255,.38),inset 0 0 25px rgba(166,108,255,.3); animation:registrationCore 2.2s ease-in-out infinite; }
.registration-orbit { position:absolute; top:18px; left:50%; width:150px; height:74px; transform:translateX(-50%) rotate(-18deg); border:1px solid rgba(166,108,255,.45); border-radius:50%; animation:registrationOrbit 3.5s linear infinite; }
.registration-orbit i { position:absolute; width:7px; height:7px; border-radius:50%; background:#63dcff; box-shadow:0 0 12px #63dcff; }
.registration-orbit i:nth-child(1) { top:8px; left:24px; }.registration-orbit i:nth-child(2) { right:12px; bottom:12px; background:#ff679f; box-shadow:0 0 12px #ff679f; }.registration-orbit i:nth-child(3) { top:50%; right:-4px; }
.registration-progress { height:7px; margin-top:22px; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:999px; background:#090e26; }
.registration-progress span { display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,#63dcff,#a66cff,#ff679f); box-shadow:0 0 15px rgba(166,108,255,.65); transition:width .6s ease; }
.registration-loading-step { margin-top:9px; color:#64dfb5; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.registration-terminal { display:flex; gap:8px; align-items:center; margin-top:15px; padding:10px 12px; border:1px solid rgba(97,215,255,.14); border-radius:9px; background:#080d22; color:#7186a9; font:11px monospace; text-align:left; }
.registration-terminal b { color:#63dcff; font-size:16px; }
@keyframes registrationOrbit { to { transform:translateX(-50%) rotate(342deg); } }
@keyframes registrationCore { 50% { transform:scale(1.05); box-shadow:0 0 48px rgba(97,215,255,.62),inset 0 0 25px rgba(166,108,255,.4); } }

/* ============ RESPONSIVE ============ */
@media(max-width:800px) {
    .syn-auth-page { padding:10px; }
    .register-stage { width:100%; min-height:0; margin:0; border-radius:22px; }
    .register-head { height:70px; padding:14px 18px; }
    .brand-lockup small { display:none; }
    .register-content { display:block; padding:32px 18px 34px; }
    .register-intro { margin-bottom:28px; padding-top:0; }
    .register-intro h1 { font-size:3.5rem; }
    .auth-network { transform:scale(.86); transform-origin:top center; margin-bottom:-30px; }
    .register-access-wrap { min-height:0; }
    .register-orbit, .register-orbit-core { display:none; }
    .register-form { max-width:none; padding:22px 18px; transform:none; }
    .meteor { display:none; }
}
@media(prefers-reduced-motion:reduce) {
    *,*:before,*:after { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; transition-duration:.01ms!important; }
}
