.auth-gate{position:fixed;inset:0;z-index:3000;background:linear-gradient(135deg,var(--graphite,#131416),var(--void,#0b0c0e));display:none;align-items:center;justify-content:center;overflow:hidden}
.auth-gate.open,.auth-gate[style*="display:flex"],.auth-gate[style*="display: flex"]{display:flex}
.auth-gate .gate-box{width:100%;max-width:420px;padding:24px;position:relative;z-index:2}
.auth-gate .gate-logo{text-align:center;margin-bottom:24px}
.auth-gate .gate-logo .logo{width:64px;height:64px;border-radius:50%;background:var(--signal,#e23c55);color:#fff;font-size:28px;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;box-shadow:0 0 30px var(--bloom,rgba(226,60,85,.4));animation:authLogoFloat 3s ease-in-out infinite}
.auth-gate .gate-logo h2{color:var(--snow,#fff);margin:0;font-size:28px}
.auth-gate .gate-logo p{color:var(--fog,#858687);font-size:13px;margin:4px 0 0}
.auth-gate .auth-box{background:var(--charcoal,#1f1f21);border:1px solid var(--hair,rgba(255,255,255,.07));border-radius:16px;padding:24px;color:var(--snow,#fff);max-width:420px;width:100%}
.auth-gate .auth-box h2{color:var(--snow,#fff);margin:0 0 4px;font-size:20px}
.auth-gate .auth-box .sub{color:var(--fog,#858687);font-size:13px;margin:0 0 16px}
.auth-gate .auth-box .field{width:100%;background:var(--void,#0b0c0e);border:1px solid var(--hair,rgba(255,255,255,.12));color:var(--snow,#fff);border-radius:8px;padding:12px;font-size:14px;margin-bottom:10px;font-family:inherit;box-sizing:border-box}
.auth-gate .auth-box .field:focus{outline:none;border-color:var(--signal,#e23c55)}
.auth-gate .auth-box .field::placeholder{color:var(--steel,#71717a)}
.auth-gate .auth-box .btn{width:100%;background:var(--signal,#e23c55);color:#fff;border:none;border-radius:8px;padding:14px;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;transition:background .15s}
.auth-gate .auth-box .btn:hover{background:var(--deep,#ba223b)}
.auth-gate .auth-box .btn:disabled{opacity:.5;cursor:not-allowed}
.auth-gate .auth-box .err{color:var(--signal,#e23c55);font-size:13px;margin:8px 0;min-height:16px}
.auth-gate .auth-box .link{color:var(--fog,#858687);text-decoration:none;font-size:13px;text-align:center;display:block;margin-top:10px;background:none;border:none;cursor:pointer;font-family:inherit;width:100%;padding:8px;transition:color .15s}
.auth-gate .auth-box .link:hover{color:var(--snow,#fff)}
.auth-gate .auth-box .geo{color:var(--fog,#858687);font-size:12px;margin:0 0 10px}
.auth-gate .auth-box .row{display:flex;gap:10px;margin-bottom:0}
.auth-gate .auth-box .row .field{flex:1}
.auth-gate .auth-box .qr{text-align:center;margin:10px 0}
.auth-gate .auth-box .qr img{border-radius:8px}
.auth-gate .auth-box .secret{font-family:'Courier New',monospace;background:var(--void,#0b0c0e);border:1px solid var(--hair,rgba(255,255,255,.07));border-radius:6px;padding:8px 12px;text-align:center;font-size:15px;letter-spacing:2px;color:var(--mint,#4ade80);margin:8px 0;word-break:break-all}
.gate-tilt{transform-style:preserve-3d;transition:transform .2s ease}
.gate-tilt .auth-box{transform:translateZ(30px)}
.gate-particles{position:absolute;inset:0;z-index:1;pointer-events:none}
.gate-particles span{position:absolute;border-radius:50%;background:rgba(226,60,85,.4);animation:authParticleFloat linear infinite}
.gate-glow{position:absolute;width:500px;height:500px;border-radius:50%;filter:blur(80px);opacity:.25;z-index:0;pointer-events:none}
.gate-glow.g1{background:var(--signal,#e23c55);top:-150px;left:-150px;animation:authGlowDrift 8s ease-in-out infinite}
.gate-glow.g2{background:var(--ember,#f9a542);bottom:-150px;right:-150px;animation:authGlowDrift 10s ease-in-out infinite reverse}
.gate-fx{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.shooting-star{position:absolute;width:120px;height:2px;background:linear-gradient(90deg,transparent,var(--snow,#fff))}
.firework{position:absolute}
.firework .spark{position:absolute;width:4px;height:4px;border-radius:50%}
@keyframes authLogoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes authParticleFloat{0%{transform:translateY(0);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateY(-100vh);opacity:0}}
@keyframes authGlowDrift{0%,100%{transform:translate(0,0)}50%{transform:translate(20px,20px)}}
@keyframes shootStar{0%{transform:translateX(0);opacity:1}100%{transform:translateX(-800px);opacity:0}}
@keyframes fireworkBurst{0%{transform:translate(0,0);opacity:1}100%{transform:translate(var(--x),var(--y));opacity:0}}
.auth-modal{position:fixed;inset:0;z-index:3001;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center}
.auth-modal.open{display:flex}