@seaverse/auth-sdk 0.4.8 → 0.4.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -2
- package/dist/auth-modal.css +1 -1
- package/dist/index.cjs +23 -13
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +23 -13
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1820,8 +1820,9 @@ MIT © [SeaVerse Team](mailto:support@seaverse.com)
|
|
|
1820
1820
|
### v0.4.7 (Current Version)
|
|
1821
1821
|
- 🎨 **UI Style Update**: Modernized login interface with refined visual design
|
|
1822
1822
|
- Updated primary button color to brighter green (#00E599 → #00e599, #00f5a8 on hover)
|
|
1823
|
-
- **OAuth buttons layout
|
|
1824
|
-
-
|
|
1823
|
+
- **OAuth buttons layout** (applies to login and signup pages):
|
|
1824
|
+
- **Desktop & Mobile**: Google and GitHub in first row (2 columns grid), Discord spans full width in second row
|
|
1825
|
+
- Uses CSS Grid layout with `grid-column: 1 / -1` for Discord button to span both columns
|
|
1825
1826
|
- Consistent button styling across all OAuth providers
|
|
1826
1827
|
- Enhanced input field styling with improved hover and focus states
|
|
1827
1828
|
- Refined modal layout: left panel (374px) + right panel (456px), fixed height (636px)
|
package/dist/auth-modal.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--font-display:-apple-system,BlinkMacSystemFont,'Segoe UI','Helvetica Neue',Arial,sans-serif;--font-sans:-apple-system,BlinkMacSystemFont,'Segoe UI','Helvetica Neue',Arial,sans-serif;--color-neon-green:#00E599;--color-text-primary:#ffffff;--color-text-secondary:#a1a1aa;--color-text-tertiary:#71717a;--gradient-neon:linear-gradient(135deg,#00E599 0%,#00cc88 100%);}.auth-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px;animation:modalFadeIn 0.3s ease-out;overflow:hidden;}.auth-modal.hidden{display:none;}@keyframes modalFadeIn{from{opacity:0;}to{opacity:1;}}.auth-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.85);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}.auth-modal-content{position:relative;z-index:10;display:flex;width:fit-content;max-width:90vw;height:636px;background:#1a1a1a;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,0.5);overflow:hidden;animation:modalSlideUp 0.4s cubic-bezier(0.4,0,0.2,1);transition:all 0.3s ease;}.auth-modal-content:has(#authMessage:not(.hidden)){width:480px;}.auth-modal-content:has(#authMessage:not(.hidden)) .auth-modal-left{display:none;}@keyframes modalSlideUp{from{opacity:0;transform:translateY(30px) scale(0.96);}to{opacity:1;transform:translateY(0) scale(1);}}.auth-modal-left{position:relative;display:flex;flex-direction:column;justify-content:space-between;width:374px;height:636px;padding:48px 32px;background:#000;overflow:hidden;}.auth-modal-left::before{content:'';filter:blur(80px);opacity:0.6;background:radial-gradient(at 0 0,#6366f14d 0,#0b5cf64d 0,#0000 50%),radial-gradient(at 50% 0%,#1db9814d 0,#0000 50%),radial-gradient(at 100% 0%,#f43f5e4d 0,#0000 50%),radial-gradient(at 100%,#f43f5e4d 0,#0000 50%),radial-gradient(at 100% 100%,#8b5cf64d 0,#0000 50%),radial-gradient(at 0 100%,#ec48994d 0,#0000 50%),radial-gradient(at 50% 100%,#8b5cf64d 0,#0000 50%);width:200%;height:200%;animation:20s linear infinite meshRotate;position:absolute;inset:-50%;pointer-events:none;}@keyframes meshRotate{from{transform:rotate(170.867deg);}to{transform:rotate(530.867deg);}}.auth-modal-left::after{content:'';position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E");opacity:0.4;mix-blend-mode:overlay;pointer-events:none;}.auth-modal-logo{display:flex;align-items:center;gap:10px;z-index:10;position:relative;}.auth-modal-logo .logo-icon{width:28px;height:28px;filter:drop-shadow(0 0 10px rgba(16,185,129,0.3));}.auth-modal-logo .logo-text{font-family:var(--font-display);font-size:16px;font-weight:700;color:#fff;}.auth-modal-decoration{position:absolute;inset:0;overflow:hidden;pointer-events:none;}.auth-modal-decoration .glow-orb-1{position:absolute;width:400px;height:400px;top:50%;left:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,255,255,0.05) 0%,transparent 70%);border-radius:50%;filter:blur(60px);animation:breathe 8s ease-in-out infinite;pointer-events:none;}@keyframes breathe{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:0.5;}50%{transform:translate(-50%,-50%) scale(1.2);opacity:0.8;}}.auth-modal-decoration .glow-orb-2{position:absolute;width:300px;height:300px;top:20%;right:-10%;background:radial-gradient(circle,rgba(139,92,246,0.08) 0%,transparent 70%);border-radius:50%;filter:blur(50px);animation:breathe 10s ease-in-out infinite;animation-delay:2s;pointer-events:none;}.auth-modal-branding{z-index:10;position:relative;}.auth-modal-branding .branding-title{font-family:var(--font-display);font-size:28px;font-weight:700;line-height:1.15;margin-bottom:16px;color:#ffffff;}.auth-modal-branding .branding-subtitle{font-size:16px;color:rgba(255,255,255,0.8);line-height:1.6;}.auth-modal-right{position:relative;display:flex;flex-direction:column;width:456px;height:636px;padding:80px 48px 50px 48px;background:#1e1e1e;overflow-y:auto;}.auth-modal-right::-webkit-scrollbar{width:6px;}.auth-modal-right::-webkit-scrollbar-track{background:transparent;}.auth-modal-right::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:3px;}.auth-modal-close{position:absolute;top:16px;right:16px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:rgba(255,255,255,0.5);cursor:pointer;transition:all 0.2s ease;z-index:20;border-radius:8px;}.auth-modal-close:hover{background:rgba(255,255,255,0.1);color:#ffffff;}.auth-form-view{animation:formFadeIn 0.3s ease-out;}#loginForm .form-input{width:360px;}@keyframes formFadeIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}.auth-form-view.hidden{display:none;}.new-style-login-view{max-width:400px;margin:0 auto;animation:formFadeIn 0.3s ease-out;}.new-style-login-view.hidden{display:none;}.new-style-login-view .auth-form-header{margin-bottom:32px;text-align:center;}.new-style-login-view .auth-form-title{font-family:var(--font-display);font-size:28px;font-weight:700;margin-bottom:8px;color:#ffffff;}.new-style-login-view .auth-form-subtitle{font-size:14px;color:#888;}.new-style-login-view .auth-form{display:flex;flex-direction:column;gap:12px;}.new-style-login-view .social-buttons{display:flex;flex-direction:column;gap:12px;}.new-style-login-view .btn-social{width:100%;padding:12px;background:rgba(255,255,255,0.04);border:1px solid rgba(230,233,236,0.1);border-radius:8px;color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:background 0.3s,border-color 0.3s;display:flex;align-items:center;justify-content:center;gap:10px;}.new-style-login-view .btn-social:hover{background:rgba(255,255,255,0.08);border-color:rgba(230,233,236,0.2);}.new-style-login-view .btn-social svg{width:18px;height:18px;}.new-style-login-view .divider{font-size:12px;color:#666;margin:30px 0;text-transform:lowercase;letter-spacing:0.5px;}.new-style-login-view .divider::before,.new-style-login-view .divider::after{height:1px;background:#3a3a3a;}.btn-email-toggle{width:100%;padding:12px;font-family:var(--font-sans);font-size:14px;font-weight:500;color:#fff;background:rgba(255,255,255,0.04);border:1px solid rgba(230,233,236,0.1);border-radius:8px;cursor:pointer;transition:background 0.3s,border-color 0.3s;display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:20px;}.btn-email-toggle:hover{background:rgba(255,255,255,0.08);border-color:rgba(230,233,236,0.2);}.btn-email-toggle svg{width:20px;height:20px;}.terms-text{font-size:12px;color:#666;text-align:center;line-height:1.6;}.terms-link{color:#888;text-decoration:underline;}.terms-link:hover{color:#aaa;}.old-style-login-view{animation:formFadeIn 0.3s ease-out;}.old-style-login-view.hidden{display:none;}.old-style-login-view .auth-form-header{margin-bottom:28px;text-align:center;}.old-style-login-view .auth-form-title{font-family:var(--font-display);font-size:28px;font-weight:700;margin-bottom:8px;color:#ffffff;}.old-style-login-view .auth-form-subtitle{font-size:14px;color:#888;}.old-style-login-view .form-input{width:360px;}.btn-back{width:100%;height:32px;padding:0 12px;font-family:var(--font-sans);font-size:14px;font-weight:500;color:rgba(156,163,175,1);background:transparent;border:none;border-radius:8px;cursor:pointer;transition:all 0.2s ease;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px;}.btn-back:hover{color:#ffffff;}.btn-back svg{transition:transform 0.3s ease;}.btn-back:hover svg{transform:translateX(-4px);}.auth-form-header{margin-bottom:32px;text-align:center;}.auth-form-title{font-family:var(--font-display);font-size:28px;font-weight:700;margin-bottom:8px;color:#ffffff;}.auth-form-subtitle{font-size:14px;color:#888;}.auth-form{display:flex;flex-direction:column;gap:16px;}.form-group{display:flex;flex-direction:column;gap:6px;}.form-label{display:block;font-size:12px;color:#aaa;margin-bottom:8px;text-transform:uppercase;letter-spacing:0.5px;font-weight:500;}.form-input{width:100%;height:40px;padding:0 14px;font-family:var(--font-sans);font-size:14px;color:var(--color-text-primary);background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.15);border-radius:8px;outline:none;transition:all 0.3s;}.form-input::placeholder{color:#666;}.form-input:hover{background:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.25);}.form-input:focus{border:2px solid #00d9a3;box-shadow:0 0 0 3px rgba(0,217,163,0.1);background:rgba(255,255,255,0.1);}.form-input:invalid:not(:placeholder-shown){border-color:#ff006e;}.form-input[type="textarea"],textarea.form-input{min-height:100px;resize:vertical;font-family:inherit;line-height:1.5;padding:12px 14px;}.char-count{font-size:12px;color:rgba(255,255,255,0.5);text-align:right;margin-top:4px;}.auth-modal-light .char-count{color:rgba(0,0,0,0.4);}.icon-mail{position:relative;z-index:2;color:#10b981;filter:drop-shadow(0 0 10px rgba(16,185,129,0.4));animation:floatIcon 4s ease-in-out infinite;}.forgot-password-icon:has(.icon-mail) .icon-glow{background:radial-gradient( circle,rgba(16,185,129,0.25) 0%,rgba(6,182,212,0.15) 40%,transparent 70% );}#applyInviteReason{position:relative;min-height:120px;padding:14px 16px;background:rgba(20,20,20,0.6);transition:all 0.3s ease;}#applyInviteReason:focus{background:rgba(20,20,20,0.8);border-color:rgba(16,185,129,0.5);box-shadow:0 0 0 3px rgba(16,185,129,0.15),0 0 20px rgba(16,185,129,0.15),inset 0 1px 0 rgba(255,255,255,0.05);}.form-group:has(#applyInviteReason) .char-count{font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;color:rgba(161,161,170,0.7);text-align:right;margin-top:8px;padding:4px 0;display:block;float:right;position:relative;transition:all 0.3s ease;letter-spacing:0.02em;}.form-group:has(#applyInviteReason) .char-count::before{content:'';position:absolute;bottom:0;left:0;height:2px;width:var(--progress-width,0%);background:linear-gradient(90deg,#10b981,#06b6d4);transition:width 0.3s ease,box-shadow 0.3s ease,background 0.3s ease;box-shadow:0 0 8px rgba(16,185,129,0.5);}.form-group:has(#applyInviteReason) .char-count[data-progress="low"]{color:rgba(251,191,36,0.9);}.form-group:has(#applyInviteReason) .char-count[data-progress="low"]::before{background:linear-gradient(90deg,rgba(251,191,36,0.8),rgba(251,191,36,0.6));box-shadow:0 0 8px rgba(251,191,36,0.5);}.form-group:has(#applyInviteReason) .char-count[data-progress="medium"]{color:rgba(16,185,129,0.9);}.form-group:has(#applyInviteReason) .char-count[data-progress="medium"]::before{background:linear-gradient(90deg,#10b981,#06b6d4);box-shadow:0 0 10px rgba(16,185,129,0.6);}.form-group:has(#applyInviteReason) .char-count[data-progress="high"]{color:rgba(239,68,68,0.9);}.form-group:has(#applyInviteReason) .char-count[data-progress="high"]::before{background:linear-gradient(90deg,rgba(239,68,68,0.8),rgba(239,68,68,0.6));box-shadow:0 0 10px rgba(239,68,68,0.6);}.auth-modal-light .icon-mail{color:#059669;filter:drop-shadow(0 0 8px rgba(5,150,105,0.3));}.auth-modal-light .forgot-password-icon:has(.icon-mail) .icon-glow{background:radial-gradient( circle,rgba(16,185,129,0.15) 0%,rgba(6,182,212,0.1) 40%,transparent 70% );}.auth-modal-light #applyInviteReason{background:rgba(255,255,255,0.8);border-color:rgba(16,185,129,0.2);color:#0a0a0a;}.auth-modal-light #applyInviteReason:focus{background:rgba(255,255,255,0.95);border-color:rgba(16,185,129,0.5);box-shadow:0 0 0 3px rgba(16,185,129,0.12),0 0 20px rgba(16,185,129,0.1),inset 0 1px 0 rgba(255,255,255,0.8);}.auth-modal-light .form-group:has(#applyInviteReason) .char-count{color:rgba(82,82,91,0.8);}.input-with-icon{position:relative;display:flex;align-items:center;}.input-with-icon .form-input{padding-right:40px;}.input-icon-btn{position:absolute;right:8px;background:transparent;border:none;color:rgba(255,255,255,0.4);cursor:pointer;padding:6px;display:flex;align-items:center;justify-content:center;transition:color 0.2s ease;border-radius:4px;}.input-icon-btn:hover{color:rgba(255,255,255,0.7);background:rgba(255,255,255,0.05);}.input-icon-btn .hidden{display:none;}.strength-text{font-size:12px;color:var(--color-text-tertiary);font-weight:500;display:flex;align-items:center;gap:6px;margin-top:4px;}.form-group-header{display:flex;align-items:center;justify-content:space-between;}.form-group-header .form-label{margin-bottom:0;}.forgot-password-link{font-size:12px;color:#00d9a3;text-decoration:none;text-transform:none;letter-spacing:normal;margin-bottom:8px;}.forgot-password-link:hover{text-decoration:underline;}.link-primary{color:var(--color-neon-green);text-decoration:none;font-weight:600;transition:all 0.2s ease;position:relative;text-shadow:0 0 10px rgba(0,255,136,0.3);}.link-primary::after{content:'';position:absolute;bottom:-2px;left:0;width:100%;height:1px;background:var(--color-neon-green);transform:scaleX(0);transform-origin:right;transition:transform 0.3s ease;}.link-primary:hover{color:#00ff88;text-shadow:0 0 20px rgba(0,255,136,0.5);}.link-primary:hover::after{transform:scaleX(1);transform-origin:left;}.btn-auth-primary{width:100%;padding:14px;font-family:var(--font-sans);font-size:15px;font-weight:600;color:#0a0a0a;background:#00e599;border:none;border-radius:8px;cursor:pointer;transition:background 0.3s,transform 0.1s;display:flex;align-items:center;justify-content:center;gap:12px;margin-top:8px;}.btn-auth-primary:hover{background:#00f5a8;}.btn-auth-primary:active{transform:scale(0.98);}.btn-auth-primary svg{width:20px;height:20px;flex-shrink:0;}.btn-auth-primary svg path{fill:rgba(0,0,0,0.8);}.btn-auth-primary:disabled{opacity:0.6;cursor:not-allowed;transform:none;}.btn-auth-primary .btn-text{position:relative;z-index:2;}.btn-auth-primary .btn-loader{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;}.btn-auth-primary .btn-loader.hidden{display:none;}.spinner{width:20px;height:20px;fill:none;stroke-width:3;animation:spin 0.8s linear infinite;}@keyframes spin{to{transform:rotate(360deg);}}.spinner-track{stroke:rgba(0,0,0,0.2);}.spinner-circle{stroke:#000;stroke-dasharray:50;stroke-dashoffset:50;animation:spinDash 1.2s ease-in-out infinite;}@keyframes spinDash{0%{stroke-dashoffset:50;}50%{stroke-dashoffset:12.5;}100%{stroke-dashoffset:50;}}.invite-code-icon{position:relative;width:80px;height:80px;margin:0 auto 24px;display:flex;align-items:center;justify-content:center;background:rgba(52,211,153,0.1);border-radius:12px;}.invite-code-icon .icon-glow{position:absolute;inset:-10px;background:radial-gradient(circle,rgba(52,211,153,0.2) 0%,transparent 70%);border-radius:50%;animation:pulseGlow 3s ease-in-out infinite;filter:blur(15px);}.invite-code-icon .icon-star{position:relative;z-index:2;color:#34d399;filter:drop-shadow(0 0 10px rgba(52,211,153,0.4));animation:floatIcon 4s ease-in-out infinite;}.forgot-password-icon{position:relative;width:100px;height:100px;margin:0 auto 24px;display:flex;align-items:center;justify-content:center;}.forgot-password-icon .icon-glow{position:absolute;inset:-10px;background:radial-gradient(circle,rgba(16,185,129,0.25) 0%,transparent 70%);border-radius:50%;animation:pulseGlow 3s ease-in-out infinite;filter:blur(15px);}@keyframes pulseGlow{0%,100%{opacity:0.5;transform:scale(0.95);}50%{opacity:0.8;transform:scale(1.05);}}.forgot-password-icon .icon-lock{position:relative;z-index:2;color:#10b981;filter:drop-shadow(0 0 10px rgba(16,185,129,0.4));animation:floatIcon 4s ease-in-out infinite;}@keyframes floatIcon{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}.btn-forgot-password{display:flex;align-items:center;justify-content:center;gap:8px;}.btn-forgot-password .btn-arrow{transition:transform 0.3s ease;}.btn-forgot-password:hover .btn-arrow{transform:translateX(4px);}.auth-footer{margin-top:24px;text-align:center;}.forgot-footer{display:flex;justify-content:center;}.back-to-login{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--color-text-secondary);text-decoration:none;transition:all 0.2s ease;padding:8px 12px;border-radius:6px;}.back-to-login:hover{color:var(--color-neon-green);background:rgba(16,185,129,0.05);}.back-to-login svg{transition:transform 0.3s ease;}.back-to-login:hover svg{transform:translateX(-4px);}.invite-code-divider{position:relative;text-align:center;margin:32px 0 20px 0;font-size:11px;font-weight:600;color:var(--color-text-tertiary);letter-spacing:0.08em;display:flex;align-items:center;gap:12px;}.invite-code-divider::before,.invite-code-divider::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.1),transparent);}.btn-apply-invite{width:100%;height:44px;padding:0 24px;font-family:var(--font-sans);font-size:14px;font-weight:500;color:var(--color-text-secondary);background:rgba(30,30,30,0.8);border:1px solid rgba(255,255,255,0.1);border-radius:10px;cursor:pointer;transition:all 0.25s cubic-bezier(0.4,0,0.2,1);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;}.btn-apply-invite::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,transparent 0%,rgba(255,255,255,0.05) 50%,transparent 100%);opacity:0;transition:opacity 0.3s ease;}.btn-apply-invite:hover{border-color:rgba(255,255,255,0.2);background:rgba(40,40,40,0.9);color:var(--color-text-primary);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.3);}.btn-apply-invite:hover::before{opacity:1;}.btn-apply-invite:active{transform:translateY(0);}.auth-modal-light .invite-code-icon{background:rgba(52,211,153,0.08);}.auth-modal-light .invite-code-icon .icon-star{color:#059669;filter:drop-shadow(0 2px 8px rgba(5,150,105,0.3));}.auth-modal-light .btn-apply-invite{background:rgba(255,255,255,0.9);border:1.5px solid rgba(0,0,0,0.08);color:rgba(0,0,0,0.6);box-shadow:0 2px 4px rgba(0,0,0,0.04),0 0 0 1px rgba(255,255,255,0.8) inset;}.auth-modal-light .btn-apply-invite:hover{background:#ffffff;border-color:rgba(16,185,129,0.2);color:#0a0a0a;box-shadow:0 4px 8px rgba(0,0,0,0.06),0 0 0 1px rgba(16,185,129,0.1) inset;transform:translateY(-1px);}.auth-modal-light .invite-code-divider{color:rgba(0,0,0,0.35);}.auth-modal-light .invite-code-divider::before,.auth-modal-light .invite-code-divider::after{background:linear-gradient(to right,transparent,rgba(0,0,0,0.1),transparent);}.auth-footer-divider{margin-top:32px;padding:28px 20px 0 20px;position:relative;text-align:center;isolation:isolate;}.auth-footer-divider::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:85%;height:2px;background:linear-gradient( 90deg,transparent 0%,rgba(16,185,129,0.15) 15%,rgba(16,185,129,0.5) 30%,rgba(6,182,212,0.6) 50%,rgba(16,185,129,0.5) 70%,rgba(16,185,129,0.15) 85%,transparent 100% );filter:blur(0.5px);animation:energyFlow 4s ease-in-out infinite;}.auth-footer-divider::after{content:'';position:absolute;top:-4px;left:50%;transform:translateX(-50%);width:70%;height:8px;background:radial-gradient( ellipse at center,rgba(16,185,129,0.25) 0%,rgba(6,182,212,0.15) 40%,transparent 70% );filter:blur(6px);animation:glowPulse 3s ease-in-out infinite;opacity:0.6;}@keyframes energyFlow{0%,100%{opacity:0.7;transform:translateX(-50%) scaleX(1);}50%{opacity:1;transform:translateX(-50%) scaleX(1.02);}}@keyframes glowPulse{0%,100%{opacity:0.4;transform:translateX(-50%) scaleY(0.8);}50%{opacity:0.8;transform:translateX(-50%) scaleY(1.2);}}.auth-footer-text{font-size:13.5px;font-weight:400;color:rgba(161,161,170,0.85);letter-spacing:0.02em;line-height:1.6;margin:0;position:relative;z-index:1;}.auth-link{color:#10b981;font-weight:600;text-decoration:none;position:relative;display:inline-block;padding:6px 14px;border-radius:6px;transition:all 0.4s cubic-bezier(0.34,1.56,0.64,1);background:rgba(16,185,129,0.05);border:1px solid rgba(16,185,129,0.2);margin-left:6px;letter-spacing:0.01em;isolation:isolate;}.auth-link::before{content:'';position:absolute;inset:-1px;border-radius:6px;padding:1px;background:linear-gradient( 135deg,transparent 0%,rgba(16,185,129,0.4) 25%,rgba(6,182,212,0.5) 50%,rgba(16,185,129,0.4) 75%,transparent 100% );-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:0;transition:opacity 0.4s ease;animation:shimmerRotate 3s linear infinite paused;}@keyframes shimmerRotate{0%{background-position:0% 50%;}100%{background-position:200% 50%;}}.auth-link::after{content:'';position:absolute;bottom:3px;left:14px;right:14px;height:2px;background:linear-gradient( 90deg,rgba(16,185,129,0.8),rgba(6,182,212,0.9),rgba(16,185,129,0.8) );border-radius:2px;transform:scaleX(0);transform-origin:center;transition:transform 0.4s cubic-bezier(0.34,1.56,0.64,1);filter:blur(0.5px);box-shadow:0 0 8px rgba(16,185,129,0.6),0 0 12px rgba(6,182,212,0.4);}.auth-link:hover{color:#00ffaa;background:rgba(16,185,129,0.12);border-color:rgba(6,182,212,0.5);transform:translateY(-2px) scale(1.02);text-shadow:0 0 10px rgba(16,185,129,0.6),0 0 20px rgba(6,182,212,0.4),0 0 30px rgba(16,185,129,0.2);box-shadow:0 4px 20px rgba(16,185,129,0.3),0 0 40px rgba(6,182,212,0.15),inset 0 1px 0 rgba(255,255,255,0.1);}.auth-link:hover::before{opacity:1;animation-play-state:running;}.auth-link:hover::after{transform:scaleX(1);}.auth-link:active{transform:translateY(0) scale(0.98);background:rgba(16,185,129,0.18);border-color:rgba(16,185,129,0.6);box-shadow:0 2px 12px rgba(16,185,129,0.4),inset 0 2px 8px rgba(0,0,0,0.2);}.auth-link:focus-visible{outline:none;border-color:rgba(16,185,129,0.8);box-shadow:0 0 0 3px rgba(16,185,129,0.3),0 0 20px rgba(16,185,129,0.4),inset 0 1px 0 rgba(255,255,255,0.15);}@media (max-width:768px){.auth-footer-divider{margin-top:28px;padding-top:24px;}.auth-footer-divider::before{width:90%;}.auth-footer-text{font-size:13px;}.auth-link{padding:8px 16px;margin-left:4px;}.auth-link::after{left:16px;right:16px;}}.auth-modal-light .auth-footer-divider::before{background:linear-gradient( 90deg,transparent 0%,rgba(16,185,129,0.2) 15%,rgba(16,185,129,0.35) 30%,rgba(6,182,212,0.4) 50%,rgba(16,185,129,0.35) 70%,rgba(16,185,129,0.2) 85%,transparent 100% );}.auth-modal-light .auth-footer-divider::after{background:radial-gradient( ellipse at center,rgba(16,185,129,0.15) 0%,rgba(6,182,212,0.1) 40%,transparent 70% );}.auth-modal-light .auth-footer-text{color:rgba(82,82,91,0.9);}.auth-modal-light .auth-link{color:#059669;background:rgba(16,185,129,0.08);border-color:rgba(16,185,129,0.25);}.auth-modal-light .auth-link::before{background:linear-gradient( 135deg,transparent 0%,rgba(16,185,129,0.5) 25%,rgba(6,182,212,0.6) 50%,rgba(16,185,129,0.5) 75%,transparent 100% );}.auth-modal-light .auth-link:hover{color:#047857;background:rgba(16,185,129,0.15);border-color:rgba(6,182,212,0.4);text-shadow:0 0 8px rgba(16,185,129,0.4),0 0 16px rgba(6,182,212,0.3);box-shadow:0 4px 16px rgba(16,185,129,0.25),0 0 30px rgba(6,182,212,0.1),inset 0 1px 0 rgba(255,255,255,0.6);}.auth-modal-light .auth-link:active{background:rgba(16,185,129,0.22);box-shadow:0 2px 10px rgba(16,185,129,0.3),inset 0 2px 6px rgba(0,0,0,0.1);}.auth-message-content{display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px;}.message-icon{width:80px;height:80px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;border-radius:50%;background:rgba(16,185,129,0.1);color:#10b981;}.message-icon svg{filter:drop-shadow(0 0 10px rgba(16,185,129,0.3));animation:successPulse 2s ease-in-out infinite;}@keyframes successPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.05);}}.message-title{font-family:var(--font-display);font-size:24px;font-weight:700;margin-bottom:12px;color:#ffffff;}.message-text{font-size:14px;color:var(--color-text-secondary);margin-bottom:24px;line-height:1.6;}.divider{position:relative;text-align:center;margin:30px 0;font-size:12px;color:#666;text-transform:lowercase;letter-spacing:0.5px;display:flex;align-items:center;}.divider::before,.divider::after{content:'';flex:1;height:1px;background:#3a3a3a;}.divider::before{margin-right:16px;}.divider::after{margin-left:16px;}.social-buttons-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}.btn-social{width:100%;padding:12px;font-family:var(--font-sans);font-size:14px;font-weight:500;color:#fff;background:rgba(255,255,255,0.04);border:1px solid rgba(230,233,236,0.1);border-radius:8px;cursor:pointer;transition:background 0.3s,border-color 0.3s;display:flex;align-items:center;justify-content:center;gap:10px;}.btn-social:hover{background:rgba(255,255,255,0.08);border-color:rgba(230,233,236,0.2);}.btn-social:active{transform:scale(0.98);}.btn-social svg{width:18px;height:18px;flex-shrink:0;}.btn-social-full{width:100%;padding:12px;font-family:var(--font-sans);font-size:14px;font-weight:500;color:#fff;background:rgba(255,255,255,0.04);border:1px solid rgba(230,233,236,0.1);border-radius:8px;cursor:pointer;transition:background 0.3s,border-color 0.3s;display:flex;align-items:center;justify-content:center;gap:10px;}.btn-social-full:hover{background:rgba(255,255,255,0.08);border-color:rgba(230,233,236,0.2);}.btn-social-full:active{transform:scale(0.98);}.btn-social-full svg{width:18px;height:18px;flex-shrink:0;}@media (max-width:768px){.auth-modal-content{flex-direction:column;width:95vw;height:auto;}.auth-modal-left{width:100%;height:200px;padding:30px 20px;}.auth-modal-right{width:100%;height:auto;padding:40px 30px;}.demo-controls{top:10px;right:10px;}.demo-btn{padding:10px 16px;font-size:12px;}.auth-form-title{font-size:24px;}.btn-auth-primary{padding:12px;font-size:14px;}.social-buttons-grid{grid-template-columns:1fr;gap:10px;}.new-style-login-view,.old-style-login-view{max-width:100%;}.old-style-login-view .form-input{width:100%;}}@media (max-width:480px){.auth-modal{padding:0;}.auth-modal-content{border-radius:0;max-height:100vh;}.auth-modal-right{padding:20px 16px;}.auth-form-header{margin-bottom:20px;}.auth-form-title{font-size:20px;}.new-style-login-view .btn-email-toggle{height:44px;}}.auth-modal-light{}.auth-modal-light .auth-modal-backdrop{background:rgba(255,255,255,0.75);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);}.auth-modal-light .auth-modal-content{background:linear-gradient(135deg,#fdfbf7 0%,#f8f6f2 100%);border:1px solid rgba(16,185,129,0.1);box-shadow:0 50px 100px rgba(0,0,0,0.12),0 20px 40px rgba(0,0,0,0.08),0 0 0 1px rgba(255,255,255,0.9) inset;}.auth-modal-light .auth-modal-left{background:linear-gradient(135deg,#ffffff 0%,#faf9f7 100%);border-right:1px solid rgba(16,185,129,0.08);box-shadow:2px 0 20px rgba(0,0,0,0.03),0 0 0 1px rgba(16,185,129,0.05) inset;}.auth-modal-light .auth-modal-left::before{background:radial-gradient(at 0% 0%,rgba(16,185,129,0.08) 0px,transparent 50%),radial-gradient(at 50% 0%,rgba(6,182,212,0.06) 0px,transparent 50%),radial-gradient(at 100% 0%,rgba(16,185,129,0.08) 0px,transparent 50%),radial-gradient(at 0% 50%,rgba(52,211,153,0.05) 0px,transparent 50%),radial-gradient(at 100% 50%,rgba(6,182,212,0.06) 0px,transparent 50%),radial-gradient(at 0% 100%,rgba(16,185,129,0.07) 0px,transparent 50%),radial-gradient(at 100% 100%,rgba(52,211,153,0.06) 0px,transparent 50%);filter:blur(60px);opacity:0.9;}.auth-modal-light .auth-modal-left::after{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.02'/%3E%3C/svg%3E");opacity:0.6;mix-blend-mode:multiply;}.auth-modal-light .auth-modal-logo .logo-icon{filter:drop-shadow(0 2px 8px rgba(16,185,129,0.25));}.auth-modal-light .auth-modal-logo .logo-text{color:#0a0a0a;text-shadow:0 1px 2px rgba(16,185,129,0.1);}.auth-modal-light .auth-modal-decoration .glow-orb-1{background:radial-gradient(circle,rgba(16,185,129,0.08) 0%,transparent 70%);filter:blur(80px);}.auth-modal-light .auth-modal-decoration .glow-orb-2{background:radial-gradient(circle,rgba(6,182,212,0.06) 0%,transparent 70%);filter:blur(70px);}.auth-modal-light .auth-modal-branding .branding-title{color:#0a0a0a;text-shadow:0 2px 12px rgba(16,185,129,0.12);background:linear-gradient(135deg,#0a0a0a 0%,#1a1a1a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}.auth-modal-light .auth-modal-branding .branding-subtitle{color:rgba(0,0,0,0.6);}.auth-modal-light .auth-modal-right{background:rgba(255,255,255,0.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:-2px 0 20px rgba(0,0,0,0.03);}.auth-modal-light .auth-modal-right::-webkit-scrollbar-thumb{background:rgba(16,185,129,0.2);}.auth-modal-light .auth-modal-right::-webkit-scrollbar-thumb:hover{background:rgba(16,185,129,0.3);}.auth-modal-light .auth-modal-close{color:rgba(0,0,0,0.4);}.auth-modal-light .auth-modal-close:hover{background:rgba(16,185,129,0.08);color:#0a0a0a;}.auth-modal-light .auth-form-title{color:#0a0a0a;background:linear-gradient(135deg,#0a0a0a 0%,#2a2a2a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}.auth-modal-light .auth-form-subtitle{color:rgba(0,0,0,0.5);}.auth-modal-light .form-label{color:#0a0a0a;opacity:0.7;}.auth-modal-light .form-input{color:#0a0a0a;background:rgba(255,255,255,0.9);border:1.5px solid rgba(0,0,0,0.08);box-shadow:0 1px 2px rgba(0,0,0,0.02),0 0 0 1px rgba(255,255,255,0.8) inset;}.auth-modal-light .form-input::placeholder{color:rgba(0,0,0,0.3);}.auth-modal-light .form-input:hover{border-color:rgba(16,185,129,0.2);box-shadow:0 2px 4px rgba(0,0,0,0.03),0 0 0 1px rgba(16,185,129,0.05) inset;}.auth-modal-light .form-input:focus{border-color:#10b981;box-shadow:0 0 0 3px rgba(16,185,129,0.12),0 2px 8px rgba(16,185,129,0.08);background:#ffffff;}.auth-modal-light .form-input:invalid:not(:placeholder-shown){border-color:#ff006e;box-shadow:0 0 0 3px rgba(255,0,110,0.1);}.auth-modal-light .input-icon-btn{color:rgba(0,0,0,0.4);}.auth-modal-light .input-icon-btn:hover{color:rgba(0,0,0,0.7);}.auth-modal-light .forgot-password-link{color:#10b981;}.auth-modal-light .forgot-password-link:hover{color:#059669;text-shadow:0 0 8px rgba(16,185,129,0.2);}.auth-modal-light .strength-text{color:rgba(0,0,0,0.45);}.auth-modal-light .btn-auth-primary{background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:#ffffff;border:none;box-shadow:0 4px 12px rgba(16,185,129,0.25),0 2px 4px rgba(16,185,129,0.15),0 0 0 1px rgba(255,255,255,0.3) inset;}.auth-modal-light .btn-auth-primary:hover{background:linear-gradient(135deg,#059669 0%,#047857 100%);box-shadow:0 6px 16px rgba(16,185,129,0.3),0 3px 6px rgba(16,185,129,0.2),0 0 0 1px rgba(255,255,255,0.4) inset;transform:translateY(-1px);}.auth-modal-light .btn-auth-primary:active{transform:translateY(0);box-shadow:0 2px 8px rgba(16,185,129,0.2),0 1px 3px rgba(16,185,129,0.15);}.auth-modal-light .btn-auth-primary:disabled{background:linear-gradient(135deg,rgba(16,185,129,0.4) 0%,rgba(5,150,105,0.4) 100%);box-shadow:none;}.auth-modal-light .btn-forgot-password{background:linear-gradient(135deg,#10b981 0%,#059669 100%);}.auth-modal-light .btn-forgot-password:hover{background:linear-gradient(135deg,#059669 0%,#047857 100%);}.auth-modal-light .btn-forgot-password .btn-arrow{filter:drop-shadow(0 0 4px rgba(255,255,255,0.5));}.auth-modal-light .divider{color:rgba(0,0,0,0.35);}.auth-modal-light .divider::before,.auth-modal-light .divider::after{background:linear-gradient(to right,transparent,rgba(0,0,0,0.1),transparent);}.auth-modal-light .btn-social,.auth-modal-light .btn-social-full{background:rgba(255,255,255,0.9);border:1.5px solid rgba(0,0,0,0.08);color:#1a1a1a;box-shadow:0 2px 4px rgba(0,0,0,0.04),0 0 0 1px rgba(255,255,255,0.8) inset;}.auth-modal-light .btn-social:hover,.auth-modal-light .btn-social-full:hover{background:#ffffff;border-color:rgba(16,185,129,0.2);box-shadow:0 4px 8px rgba(0,0,0,0.06),0 0 0 1px rgba(16,185,129,0.1) inset;transform:translateY(-1px);}.auth-modal-light .btn-social:active,.auth-modal-light .btn-social-full:active{transform:translateY(0);box-shadow:0 1px 3px rgba(0,0,0,0.04),0 0 0 1px rgba(0,0,0,0.05) inset;}.auth-modal-light .link-primary{color:#10b981;}.auth-modal-light .link-primary:hover{color:#059669;text-shadow:0 0 8px rgba(16,185,129,0.2);}.auth-modal-light .forgot-password-icon{background:linear-gradient(135deg,rgba(16,185,129,0.08) 0%,rgba(6,182,212,0.06) 100%);box-shadow:0 8px 24px rgba(16,185,129,0.12),0 0 0 1px rgba(16,185,129,0.1) inset;}.auth-modal-light .forgot-password-icon .icon-glow{background:radial-gradient(circle,rgba(16,185,129,0.15) 0%,transparent 70%);}.auth-modal-light .forgot-password-icon .icon-lock{color:#10b981;filter:drop-shadow(0 2px 8px rgba(16,185,129,0.2));}.auth-modal-light .forgot-password-icon .lock-shackle{animation:shakeLock 2s ease-in-out infinite;}.auth-modal-light .back-to-login{color:rgba(0,0,0,0.6);}.auth-modal-light .back-to-login:hover{color:#10b981;}.auth-modal-light .back-to-login svg{color:rgba(0,0,0,0.4);}.auth-modal-light .back-to-login:hover svg{color:#10b981;}.auth-modal-light .auth-message-content{background:linear-gradient(135deg,rgba(16,185,129,0.05) 0%,rgba(6,182,212,0.03) 100%);box-shadow:0 8px 32px rgba(16,185,129,0.12),0 0 0 1px rgba(16,185,129,0.1) inset;}.auth-modal-light .message-icon{background:linear-gradient(135deg,#10b981 0%,#059669 100%);box-shadow:0 8px 24px rgba(16,185,129,0.3),0 0 0 4px rgba(16,185,129,0.1);}.auth-modal-light .message-icon svg{filter:drop-shadow(0 2px 4px rgba(0,0,0,0.2));}.auth-modal-light .message-title{color:#0a0a0a;background:linear-gradient(135deg,#0a0a0a 0%,#2a2a2a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}.auth-modal-light .message-text{color:rgba(0,0,0,0.6);}
|
|
1
|
+
:root{--font-display:-apple-system,BlinkMacSystemFont,'Segoe UI','Helvetica Neue',Arial,sans-serif;--font-sans:-apple-system,BlinkMacSystemFont,'Segoe UI','Helvetica Neue',Arial,sans-serif;--color-neon-green:#00E599;--color-text-primary:#ffffff;--color-text-secondary:#a1a1aa;--color-text-tertiary:#71717a;--gradient-neon:linear-gradient(135deg,#00E599 0%,#00cc88 100%);}.auth-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px;animation:modalFadeIn 0.3s ease-out;overflow:hidden;}.auth-modal.hidden{display:none;}@keyframes modalFadeIn{from{opacity:0;}to{opacity:1;}}.auth-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.85);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}.auth-modal-content{position:relative;z-index:10;display:flex;width:fit-content;max-width:90vw;height:636px;background:#1a1a1a;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,0.5);overflow:hidden;animation:modalSlideUp 0.4s cubic-bezier(0.4,0,0.2,1);transition:all 0.3s ease;}.auth-modal-content:has(#authMessage:not(.hidden)){width:480px;}.auth-modal-content:has(#authMessage:not(.hidden)) .auth-modal-left{display:none;}@keyframes modalSlideUp{from{opacity:0;transform:translateY(30px) scale(0.96);}to{opacity:1;transform:translateY(0) scale(1);}}.auth-modal-left{position:relative;display:flex;flex-direction:column;justify-content:space-between;width:374px;height:636px;padding:48px 32px;background:#000;overflow:hidden;}.auth-modal-left::before{content:'';filter:blur(80px);opacity:0.6;background:radial-gradient(at 0 0,#6366f14d 0,#0b5cf64d 0,#0000 50%),radial-gradient(at 50% 0%,#1db9814d 0,#0000 50%),radial-gradient(at 100% 0%,#f43f5e4d 0,#0000 50%),radial-gradient(at 100%,#f43f5e4d 0,#0000 50%),radial-gradient(at 100% 100%,#8b5cf64d 0,#0000 50%),radial-gradient(at 0 100%,#ec48994d 0,#0000 50%),radial-gradient(at 50% 100%,#8b5cf64d 0,#0000 50%);width:200%;height:200%;animation:20s linear infinite meshRotate;position:absolute;inset:-50%;pointer-events:none;}@keyframes meshRotate{from{transform:rotate(170.867deg);}to{transform:rotate(530.867deg);}}.auth-modal-left::after{content:'';position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E");opacity:0.4;mix-blend-mode:overlay;pointer-events:none;}.auth-modal-logo{display:flex;align-items:center;gap:10px;z-index:10;position:relative;}.auth-modal-logo .logo-icon{width:28px;height:28px;filter:drop-shadow(0 0 10px rgba(16,185,129,0.3));}.auth-modal-logo .logo-text{font-family:var(--font-display);font-size:16px;font-weight:700;color:#fff;}.auth-modal-decoration{position:absolute;inset:0;overflow:hidden;pointer-events:none;}.auth-modal-decoration .glow-orb-1{position:absolute;width:400px;height:400px;top:50%;left:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,255,255,0.05) 0%,transparent 70%);border-radius:50%;filter:blur(60px);animation:breathe 8s ease-in-out infinite;pointer-events:none;}@keyframes breathe{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:0.5;}50%{transform:translate(-50%,-50%) scale(1.2);opacity:0.8;}}.auth-modal-decoration .glow-orb-2{position:absolute;width:300px;height:300px;top:20%;right:-10%;background:radial-gradient(circle,rgba(139,92,246,0.08) 0%,transparent 70%);border-radius:50%;filter:blur(50px);animation:breathe 10s ease-in-out infinite;animation-delay:2s;pointer-events:none;}.auth-modal-branding{z-index:10;position:relative;}.auth-modal-branding .branding-title{font-family:var(--font-display);font-size:28px;font-weight:700;line-height:1.15;margin-bottom:16px;color:#ffffff;}.auth-modal-branding .branding-subtitle{font-size:16px;color:rgba(255,255,255,0.8);line-height:1.6;}.auth-modal-right{position:relative;display:flex;flex-direction:column;width:456px;height:636px;padding:80px 48px 50px 48px;background:#1e1e1e;overflow-y:auto;}.auth-modal-right::-webkit-scrollbar{width:6px;}.auth-modal-right::-webkit-scrollbar-track{background:transparent;}.auth-modal-right::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:3px;}.auth-modal-close{position:absolute;top:16px;right:16px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:rgba(255,255,255,0.5);cursor:pointer;transition:all 0.2s ease;z-index:20;border-radius:8px;}.auth-modal-close:hover{background:rgba(255,255,255,0.1);color:#ffffff;}.auth-form-view{animation:formFadeIn 0.3s ease-out;}#loginForm .form-input{width:360px;}@keyframes formFadeIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}.auth-form-view.hidden{display:none;}.new-style-login-view{max-width:400px;margin:0 auto;animation:formFadeIn 0.3s ease-out;}.new-style-login-view.hidden{display:none;}.new-style-login-view .auth-form-header{margin-bottom:32px;text-align:center;}.new-style-login-view .auth-form-title{font-family:var(--font-display);font-size:28px;font-weight:700;margin-bottom:8px;color:#ffffff;}.new-style-login-view .auth-form-subtitle{font-size:14px;color:#888;}.new-style-login-view .auth-form{display:flex;flex-direction:column;gap:12px;}.new-style-login-view .social-buttons{display:flex;flex-direction:column;gap:12px;}.new-style-login-view .btn-social{width:100%;padding:12px;background:rgba(255,255,255,0.04);border:1px solid rgba(230,233,236,0.1);border-radius:8px;color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:background 0.3s,border-color 0.3s;display:flex;align-items:center;justify-content:center;gap:10px;}.new-style-login-view .btn-social:hover{background:rgba(255,255,255,0.08);border-color:rgba(230,233,236,0.2);}.new-style-login-view .btn-social svg{width:18px;height:18px;}.new-style-login-view .divider{font-size:12px;color:#666;margin:30px 0;text-transform:lowercase;letter-spacing:0.5px;}.new-style-login-view .divider::before,.new-style-login-view .divider::after{height:1px;background:#3a3a3a;}.btn-email-toggle{width:100%;padding:12px;font-family:var(--font-sans);font-size:14px;font-weight:500;color:#fff;background:rgba(255,255,255,0.04);border:1px solid rgba(230,233,236,0.1);border-radius:8px;cursor:pointer;transition:background 0.3s,border-color 0.3s;display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:20px;}.btn-email-toggle:hover{background:rgba(255,255,255,0.08);border-color:rgba(230,233,236,0.2);}.btn-email-toggle svg{width:20px;height:20px;}.terms-text{font-size:12px;color:#666;text-align:center;line-height:1.6;}.terms-link{color:#888;text-decoration:underline;}.terms-link:hover{color:#aaa;}.old-style-login-view{animation:formFadeIn 0.3s ease-out;}.auth-modal-right:has(.old-style-login-view:not(.hidden)){padding:40px 48px 30px 48px;}.old-style-login-view.hidden{display:none;}.old-style-login-view .auth-form-header{margin-bottom:20px;text-align:center;}.old-style-login-view .auth-form-title{font-family:var(--font-display);font-size:28px;font-weight:700;margin-bottom:8px;color:#ffffff;}.old-style-login-view .auth-form-subtitle{font-size:14px;color:#888;}.old-style-login-view .form-group{gap:4px;margin-bottom:12px;}.old-style-login-view .divider{margin:16px 0;}.old-style-login-view .auth-form-title{font-size:24px;margin-bottom:6px;}#signupForm .auth-form-header{margin-bottom:10px;}#signupForm .auth-form-title{font-size:22px;margin-bottom:2px;}#signupForm .auth-form-subtitle{font-size:13px;line-height:1.3;}#signupForm .form-group{gap:2px;margin-bottom:5px;}#signupForm .divider{margin:8px 0;}#signupForm .strength-text{font-size:10px;line-height:1.2;margin-top:1px;margin-bottom:0;}#signupForm .btn-auth-primary{height:44px;margin-top:4px;margin-bottom:4px;}#signupForm .form-label{margin-bottom:3px;}#signupForm .form-input{height:36px;}.auth-modal-right:has(#signupForm:not(.hidden)){padding:28px 48px 18px 48px;}.btn-back{width:100%;height:32px;padding:0 12px;font-family:var(--font-sans);font-size:14px;font-weight:500;color:rgba(156,163,175,1);background:transparent;border:none;border-radius:8px;cursor:pointer;transition:all 0.2s ease;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px;}.btn-back:hover{color:#ffffff;}.btn-back svg{transition:transform 0.3s ease;}.btn-back:hover svg{transform:translateX(-4px);}.auth-form-header{margin-bottom:32px;text-align:center;}.auth-form-title{font-family:var(--font-display);font-size:28px;font-weight:700;margin-bottom:8px;color:#ffffff;}.auth-form-subtitle{font-size:14px;color:#888;}.auth-form{display:flex;flex-direction:column;gap:16px;}.form-group{display:flex;flex-direction:column;gap:6px;}.form-label{display:block;font-size:12px;color:#aaa;margin-bottom:8px;text-transform:uppercase;letter-spacing:0.5px;font-weight:500;}.form-input{width:100%;height:40px;padding:0 14px;font-family:var(--font-sans);font-size:14px;color:var(--color-text-primary);background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.15);border-radius:8px;outline:none;transition:all 0.3s;}.form-input::placeholder{color:#666;}.form-input:hover{background:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.25);}.form-input:focus{border:2px solid #00d9a3;box-shadow:0 0 0 3px rgba(0,217,163,0.1);background:rgba(255,255,255,0.1);}.form-input:invalid:not(:placeholder-shown){border-color:#ff006e;}.form-input[type="textarea"],textarea.form-input{min-height:100px;resize:vertical;font-family:inherit;line-height:1.5;padding:12px 14px;}.char-count{font-size:12px;color:rgba(255,255,255,0.5);text-align:right;margin-top:4px;}.auth-modal-light .char-count{color:rgba(0,0,0,0.4);}.icon-mail{position:relative;z-index:2;color:#10b981;filter:drop-shadow(0 0 10px rgba(16,185,129,0.4));animation:floatIcon 4s ease-in-out infinite;}.forgot-password-icon:has(.icon-mail) .icon-glow{background:radial-gradient( circle,rgba(16,185,129,0.25) 0%,rgba(6,182,212,0.15) 40%,transparent 70% );}#applyInviteReason{position:relative;min-height:120px;padding:14px 16px;background:rgba(20,20,20,0.6);transition:all 0.3s ease;}#applyInviteReason:focus{background:rgba(20,20,20,0.8);border-color:rgba(16,185,129,0.5);box-shadow:0 0 0 3px rgba(16,185,129,0.15),0 0 20px rgba(16,185,129,0.15),inset 0 1px 0 rgba(255,255,255,0.05);}.form-group:has(#applyInviteReason) .char-count{font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;color:rgba(161,161,170,0.7);text-align:right;margin-top:8px;padding:4px 0;display:block;float:right;position:relative;transition:all 0.3s ease;letter-spacing:0.02em;}.form-group:has(#applyInviteReason) .char-count::before{content:'';position:absolute;bottom:0;left:0;height:2px;width:var(--progress-width,0%);background:linear-gradient(90deg,#10b981,#06b6d4);transition:width 0.3s ease,box-shadow 0.3s ease,background 0.3s ease;box-shadow:0 0 8px rgba(16,185,129,0.5);}.form-group:has(#applyInviteReason) .char-count[data-progress="low"]{color:rgba(251,191,36,0.9);}.form-group:has(#applyInviteReason) .char-count[data-progress="low"]::before{background:linear-gradient(90deg,rgba(251,191,36,0.8),rgba(251,191,36,0.6));box-shadow:0 0 8px rgba(251,191,36,0.5);}.form-group:has(#applyInviteReason) .char-count[data-progress="medium"]{color:rgba(16,185,129,0.9);}.form-group:has(#applyInviteReason) .char-count[data-progress="medium"]::before{background:linear-gradient(90deg,#10b981,#06b6d4);box-shadow:0 0 10px rgba(16,185,129,0.6);}.form-group:has(#applyInviteReason) .char-count[data-progress="high"]{color:rgba(239,68,68,0.9);}.form-group:has(#applyInviteReason) .char-count[data-progress="high"]::before{background:linear-gradient(90deg,rgba(239,68,68,0.8),rgba(239,68,68,0.6));box-shadow:0 0 10px rgba(239,68,68,0.6);}.auth-modal-light .icon-mail{color:#059669;filter:drop-shadow(0 0 8px rgba(5,150,105,0.3));}.auth-modal-light .forgot-password-icon:has(.icon-mail) .icon-glow{background:radial-gradient( circle,rgba(16,185,129,0.15) 0%,rgba(6,182,212,0.1) 40%,transparent 70% );}.auth-modal-light #applyInviteReason{background:rgba(255,255,255,0.8);border-color:rgba(16,185,129,0.2);color:#0a0a0a;}.auth-modal-light #applyInviteReason:focus{background:rgba(255,255,255,0.95);border-color:rgba(16,185,129,0.5);box-shadow:0 0 0 3px rgba(16,185,129,0.12),0 0 20px rgba(16,185,129,0.1),inset 0 1px 0 rgba(255,255,255,0.8);}.auth-modal-light .form-group:has(#applyInviteReason) .char-count{color:rgba(82,82,91,0.8);}.input-with-icon{position:relative;display:flex;align-items:center;}.input-with-icon .form-input{padding-right:40px;}.input-icon-btn{position:absolute;right:8px;background:transparent;border:none;color:rgba(255,255,255,0.4);cursor:pointer;padding:6px;display:flex;align-items:center;justify-content:center;transition:color 0.2s ease;border-radius:4px;}.input-icon-btn:hover{color:rgba(255,255,255,0.7);background:rgba(255,255,255,0.05);}.input-icon-btn .hidden{display:none;}.strength-text{font-size:12px;color:var(--color-text-tertiary);font-weight:500;display:flex;align-items:center;gap:6px;margin-top:4px;}.form-group-header{display:flex;align-items:center;justify-content:space-between;}.form-group-header .form-label{margin-bottom:0;}.forgot-password-link{font-size:12px;color:#00d9a3;text-decoration:none;text-transform:none;letter-spacing:normal;margin-bottom:8px;}.forgot-password-link:hover{text-decoration:underline;}.link-primary{color:var(--color-neon-green);text-decoration:none;font-weight:600;transition:all 0.2s ease;position:relative;text-shadow:0 0 10px rgba(0,255,136,0.3);}.link-primary::after{content:'';position:absolute;bottom:-2px;left:0;width:100%;height:1px;background:var(--color-neon-green);transform:scaleX(0);transform-origin:right;transition:transform 0.3s ease;}.link-primary:hover{color:#00ff88;text-shadow:0 0 20px rgba(0,255,136,0.5);}.link-primary:hover::after{transform:scaleX(1);transform-origin:left;}.btn-auth-primary{width:100%;padding:14px;font-family:var(--font-sans);font-size:15px;font-weight:600;color:#0a0a0a;background:#00e599;border:none;border-radius:8px;cursor:pointer;transition:background 0.3s,transform 0.1s;display:flex;align-items:center;justify-content:center;gap:12px;margin-top:8px;}.btn-auth-primary:hover{background:#00f5a8;}.btn-auth-primary:active{transform:scale(0.98);}.btn-auth-primary svg{width:20px;height:20px;flex-shrink:0;}.btn-auth-primary svg path{fill:rgba(0,0,0,0.8);}.btn-auth-primary:disabled{opacity:0.6;cursor:not-allowed;transform:none;}.btn-auth-primary .btn-text{position:relative;z-index:2;}.btn-auth-primary .btn-loader{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;}.btn-auth-primary .btn-loader.hidden{display:none;}.spinner{width:20px;height:20px;fill:none;stroke-width:3;animation:spin 0.8s linear infinite;}@keyframes spin{to{transform:rotate(360deg);}}.spinner-track{stroke:rgba(0,0,0,0.2);}.spinner-circle{stroke:#000;stroke-dasharray:50;stroke-dashoffset:50;animation:spinDash 1.2s ease-in-out infinite;}@keyframes spinDash{0%{stroke-dashoffset:50;}50%{stroke-dashoffset:12.5;}100%{stroke-dashoffset:50;}}.invite-code-icon{position:relative;width:80px;height:80px;margin:0 auto 24px;display:flex;align-items:center;justify-content:center;background:rgba(52,211,153,0.1);border-radius:12px;}.invite-code-icon .icon-glow{position:absolute;inset:-10px;background:radial-gradient(circle,rgba(52,211,153,0.2) 0%,transparent 70%);border-radius:50%;animation:pulseGlow 3s ease-in-out infinite;filter:blur(15px);}.invite-code-icon .icon-star{position:relative;z-index:2;color:#34d399;filter:drop-shadow(0 0 10px rgba(52,211,153,0.4));animation:floatIcon 4s ease-in-out infinite;}.forgot-password-icon{position:relative;width:100px;height:100px;margin:0 auto 24px;display:flex;align-items:center;justify-content:center;}.forgot-password-icon .icon-glow{position:absolute;inset:-10px;background:radial-gradient(circle,rgba(16,185,129,0.25) 0%,transparent 70%);border-radius:50%;animation:pulseGlow 3s ease-in-out infinite;filter:blur(15px);}@keyframes pulseGlow{0%,100%{opacity:0.5;transform:scale(0.95);}50%{opacity:0.8;transform:scale(1.05);}}.forgot-password-icon .icon-lock{position:relative;z-index:2;color:#10b981;filter:drop-shadow(0 0 10px rgba(16,185,129,0.4));animation:floatIcon 4s ease-in-out infinite;}@keyframes floatIcon{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}.btn-forgot-password{display:flex;align-items:center;justify-content:center;gap:8px;}.btn-forgot-password .btn-arrow{transition:transform 0.3s ease;}.btn-forgot-password:hover .btn-arrow{transform:translateX(4px);}.auth-footer{margin-top:24px;text-align:center;}.forgot-footer{display:flex;justify-content:center;}.back-to-login{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--color-text-secondary);text-decoration:none;transition:all 0.2s ease;padding:8px 12px;border-radius:6px;}.back-to-login:hover{color:var(--color-neon-green);background:rgba(16,185,129,0.05);}.back-to-login svg{transition:transform 0.3s ease;}.back-to-login:hover svg{transform:translateX(-4px);}.invite-code-divider{position:relative;text-align:center;margin:32px 0 20px 0;font-size:11px;font-weight:600;color:var(--color-text-tertiary);letter-spacing:0.08em;display:flex;align-items:center;gap:12px;}.invite-code-divider::before,.invite-code-divider::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.1),transparent);}.btn-apply-invite{width:100%;height:44px;padding:0 24px;font-family:var(--font-sans);font-size:14px;font-weight:500;color:var(--color-text-secondary);background:rgba(30,30,30,0.8);border:1px solid rgba(255,255,255,0.1);border-radius:10px;cursor:pointer;transition:all 0.25s cubic-bezier(0.4,0,0.2,1);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;}.btn-apply-invite::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,transparent 0%,rgba(255,255,255,0.05) 50%,transparent 100%);opacity:0;transition:opacity 0.3s ease;}.btn-apply-invite:hover{border-color:rgba(255,255,255,0.2);background:rgba(40,40,40,0.9);color:var(--color-text-primary);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.3);}.btn-apply-invite:hover::before{opacity:1;}.btn-apply-invite:active{transform:translateY(0);}.auth-modal-light .invite-code-icon{background:rgba(52,211,153,0.08);}.auth-modal-light .invite-code-icon .icon-star{color:#059669;filter:drop-shadow(0 2px 8px rgba(5,150,105,0.3));}.auth-modal-light .btn-apply-invite{background:rgba(255,255,255,0.9);border:1.5px solid rgba(0,0,0,0.08);color:rgba(0,0,0,0.6);box-shadow:0 2px 4px rgba(0,0,0,0.04),0 0 0 1px rgba(255,255,255,0.8) inset;}.auth-modal-light .btn-apply-invite:hover{background:#ffffff;border-color:rgba(16,185,129,0.2);color:#0a0a0a;box-shadow:0 4px 8px rgba(0,0,0,0.06),0 0 0 1px rgba(16,185,129,0.1) inset;transform:translateY(-1px);}.auth-modal-light .invite-code-divider{color:rgba(0,0,0,0.35);}.auth-modal-light .invite-code-divider::before,.auth-modal-light .invite-code-divider::after{background:linear-gradient(to right,transparent,rgba(0,0,0,0.1),transparent);}.auth-footer-divider{margin-top:32px;padding:28px 20px 0 20px;position:relative;text-align:center;isolation:isolate;}.auth-footer-divider::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:85%;height:2px;background:linear-gradient( 90deg,transparent 0%,rgba(16,185,129,0.15) 15%,rgba(16,185,129,0.5) 30%,rgba(6,182,212,0.6) 50%,rgba(16,185,129,0.5) 70%,rgba(16,185,129,0.15) 85%,transparent 100% );filter:blur(0.5px);animation:energyFlow 4s ease-in-out infinite;}.auth-footer-divider::after{content:'';position:absolute;top:-4px;left:50%;transform:translateX(-50%);width:70%;height:8px;background:radial-gradient( ellipse at center,rgba(16,185,129,0.25) 0%,rgba(6,182,212,0.15) 40%,transparent 70% );filter:blur(6px);animation:glowPulse 3s ease-in-out infinite;opacity:0.6;}@keyframes energyFlow{0%,100%{opacity:0.7;transform:translateX(-50%) scaleX(1);}50%{opacity:1;transform:translateX(-50%) scaleX(1.02);}}@keyframes glowPulse{0%,100%{opacity:0.4;transform:translateX(-50%) scaleY(0.8);}50%{opacity:0.8;transform:translateX(-50%) scaleY(1.2);}}.auth-footer-text{font-size:13.5px;font-weight:400;color:rgba(161,161,170,0.85);letter-spacing:0.02em;line-height:1.6;margin:0;position:relative;z-index:1;}.auth-link{color:#10b981;font-weight:600;text-decoration:none;position:relative;display:inline-block;padding:6px 14px;border-radius:6px;transition:all 0.4s cubic-bezier(0.34,1.56,0.64,1);background:rgba(16,185,129,0.05);border:1px solid rgba(16,185,129,0.2);margin-left:6px;letter-spacing:0.01em;isolation:isolate;}.auth-link::before{content:'';position:absolute;inset:-1px;border-radius:6px;padding:1px;background:linear-gradient( 135deg,transparent 0%,rgba(16,185,129,0.4) 25%,rgba(6,182,212,0.5) 50%,rgba(16,185,129,0.4) 75%,transparent 100% );-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:0;transition:opacity 0.4s ease;animation:shimmerRotate 3s linear infinite paused;}@keyframes shimmerRotate{0%{background-position:0% 50%;}100%{background-position:200% 50%;}}.auth-link::after{content:'';position:absolute;bottom:3px;left:14px;right:14px;height:2px;background:linear-gradient( 90deg,rgba(16,185,129,0.8),rgba(6,182,212,0.9),rgba(16,185,129,0.8) );border-radius:2px;transform:scaleX(0);transform-origin:center;transition:transform 0.4s cubic-bezier(0.34,1.56,0.64,1);filter:blur(0.5px);box-shadow:0 0 8px rgba(16,185,129,0.6),0 0 12px rgba(6,182,212,0.4);}.auth-link:hover{color:#00ffaa;background:rgba(16,185,129,0.12);border-color:rgba(6,182,212,0.5);transform:translateY(-2px) scale(1.02);text-shadow:0 0 10px rgba(16,185,129,0.6),0 0 20px rgba(6,182,212,0.4),0 0 30px rgba(16,185,129,0.2);box-shadow:0 4px 20px rgba(16,185,129,0.3),0 0 40px rgba(6,182,212,0.15),inset 0 1px 0 rgba(255,255,255,0.1);}.auth-link:hover::before{opacity:1;animation-play-state:running;}.auth-link:hover::after{transform:scaleX(1);}.auth-link:active{transform:translateY(0) scale(0.98);background:rgba(16,185,129,0.18);border-color:rgba(16,185,129,0.6);box-shadow:0 2px 12px rgba(16,185,129,0.4),inset 0 2px 8px rgba(0,0,0,0.2);}.auth-link:focus-visible{outline:none;border-color:rgba(16,185,129,0.8);box-shadow:0 0 0 3px rgba(16,185,129,0.3),0 0 20px rgba(16,185,129,0.4),inset 0 1px 0 rgba(255,255,255,0.15);}@media (max-width:768px){.auth-footer-divider{margin-top:28px;padding-top:24px;}.auth-footer-divider::before{width:90%;}.auth-footer-text{font-size:13px;}.auth-link{padding:8px 16px;margin-left:4px;}.auth-link::after{left:16px;right:16px;}}.auth-modal-light .auth-footer-divider::before{background:linear-gradient( 90deg,transparent 0%,rgba(16,185,129,0.2) 15%,rgba(16,185,129,0.35) 30%,rgba(6,182,212,0.4) 50%,rgba(16,185,129,0.35) 70%,rgba(16,185,129,0.2) 85%,transparent 100% );}.auth-modal-light .auth-footer-divider::after{background:radial-gradient( ellipse at center,rgba(16,185,129,0.15) 0%,rgba(6,182,212,0.1) 40%,transparent 70% );}.auth-modal-light .auth-footer-text{color:rgba(82,82,91,0.9);}.auth-modal-light .auth-link{color:#059669;background:rgba(16,185,129,0.08);border-color:rgba(16,185,129,0.25);}.auth-modal-light .auth-link::before{background:linear-gradient( 135deg,transparent 0%,rgba(16,185,129,0.5) 25%,rgba(6,182,212,0.6) 50%,rgba(16,185,129,0.5) 75%,transparent 100% );}.auth-modal-light .auth-link:hover{color:#047857;background:rgba(16,185,129,0.15);border-color:rgba(6,182,212,0.4);text-shadow:0 0 8px rgba(16,185,129,0.4),0 0 16px rgba(6,182,212,0.3);box-shadow:0 4px 16px rgba(16,185,129,0.25),0 0 30px rgba(6,182,212,0.1),inset 0 1px 0 rgba(255,255,255,0.6);}.auth-modal-light .auth-link:active{background:rgba(16,185,129,0.22);box-shadow:0 2px 10px rgba(16,185,129,0.3),inset 0 2px 6px rgba(0,0,0,0.1);}.auth-message-content{display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px;}.message-icon{width:80px;height:80px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;border-radius:50%;background:rgba(16,185,129,0.1);color:#10b981;}.message-icon svg{filter:drop-shadow(0 0 10px rgba(16,185,129,0.3));animation:successPulse 2s ease-in-out infinite;}@keyframes successPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.05);}}.message-title{font-family:var(--font-display);font-size:24px;font-weight:700;margin-bottom:12px;color:#ffffff;}.message-text{font-size:14px;color:var(--color-text-secondary);margin-bottom:24px;line-height:1.6;}.divider{position:relative;text-align:center;margin:30px 0;font-size:12px;color:#666;text-transform:lowercase;letter-spacing:0.5px;display:flex;align-items:center;}.divider::before,.divider::after{content:'';flex:1;height:1px;background:#3a3a3a;}.divider::before{margin-right:16px;}.divider::after{margin-left:16px;}.social-buttons-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}.btn-social{width:100%;padding:12px;font-family:var(--font-sans);font-size:14px;font-weight:500;color:#fff;background:rgba(255,255,255,0.04);border:1px solid rgba(230,233,236,0.1);border-radius:8px;cursor:pointer;transition:background 0.3s,border-color 0.3s;display:flex;align-items:center;justify-content:center;gap:10px;}.btn-social:hover{background:rgba(255,255,255,0.08);border-color:rgba(230,233,236,0.2);}.btn-social:active{transform:scale(0.98);}.btn-social svg{width:18px;height:18px;flex-shrink:0;}.btn-social-full{width:100%;padding:12px;font-family:var(--font-sans);font-size:14px;font-weight:500;color:#fff;background:rgba(255,255,255,0.04);border:1px solid rgba(230,233,236,0.1);border-radius:8px;cursor:pointer;transition:background 0.3s,border-color 0.3s;display:flex;align-items:center;justify-content:center;gap:10px;grid-column:1 / -1;}.btn-social-full:hover{background:rgba(255,255,255,0.08);border-color:rgba(230,233,236,0.2);}.btn-social-full:active{transform:scale(0.98);}.btn-social-full svg{width:18px;height:18px;flex-shrink:0;}@media (max-width:768px){.auth-modal{padding:12px;overflow:hidden;}.auth-modal-content{flex-direction:column;width:calc(100vw - 24px);max-width:420px;height:auto;max-height:calc(100vh - 24px);overflow:hidden;}.auth-modal-left{display:none;}.auth-modal-right{width:100%;height:auto;max-height:calc(100vh - 24px);padding:24px 20px;overflow:hidden;box-sizing:border-box;}#loginForm .form-input{width:100%;max-width:100%;}.auth-form-header{margin-bottom:12px;}.auth-form-title{font-size:20px;margin-bottom:4px;}.auth-form-subtitle{font-size:13px;line-height:1.3;}.form-group{margin-bottom:10px;gap:3px;}.form-label{font-size:12px;margin-bottom:3px;}.form-input{height:42px;font-size:14px;padding:0 12px;}.btn-auth-primary{height:44px;font-size:14px;margin-top:6px;}.divider{margin:12px 0;font-size:11px;}.social-buttons-grid,.new-style-login-view .social-buttons{gap:12px;}.social-buttons-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}.new-style-login-view .social-buttons{display:flex;flex-direction:column;}.btn-social,.btn-social-full{width:100%;height:42px;font-size:13px;padding:0 14px;}.btn-social-full{grid-column:1 / -1;}.btn-social svg,.btn-social-full svg{width:16px;height:16px;}.new-style-login-view,.old-style-login-view{max-width:100%;overflow:hidden;}.old-style-login-view .form-group{margin-bottom:10px;}.old-style-login-view .divider{margin:10px 0;}.old-style-login-view .auth-form-title{font-size:20px;margin-bottom:4px;}.old-style-login-view .auth-form-header{margin-bottom:10px;}.auth-modal-right:has(.old-style-login-view:not(.hidden)){padding:22px 20px 20px 20px;}#signupForm .auth-form-header{margin-bottom:10px;}#signupForm .auth-form-title{font-size:18px;margin-bottom:3px;}#signupForm .auth-form-subtitle{font-size:11px;line-height:1.3;}#signupForm .form-group{margin-bottom:8px;}#signupForm .form-input{height:38px;}#signupForm .divider{margin:8px 0;}#signupForm .strength-text{font-size:10px;margin-top:1px;}#signupForm .btn-auth-primary{height:42px;margin-top:4px;margin-bottom:2px;}.auth-modal-right:has(#signupForm:not(.hidden)){padding:20px 20px 18px 20px;}.btn-back{top:12px;left:12px;width:32px;height:32px;}.demo-controls{top:10px;right:10px;}.demo-btn{padding:6px 12px;font-size:11px;}}@media (max-width:480px){.auth-modal{padding:8px;}.auth-modal-content{width:calc(100vw - 16px);max-width:380px;max-height:calc(100vh - 16px);}.auth-modal-right{padding:20px 18px;max-height:calc(100vh - 16px);}.auth-form-title{font-size:18px;}#signupForm .auth-form-title{font-size:17px;}.form-input{height:40px;font-size:14px;padding:0 12px;}#signupForm .form-input{height:36px;}.btn-auth-primary{height:42px;font-size:14px;}#signupForm .btn-auth-primary{height:40px;}.btn-social,.btn-social-full{height:40px;font-size:13px;}.divider{margin:10px 0;}.auth-modal-right:has(#signupForm:not(.hidden)){padding:18px 18px 16px 18px;}.auth-modal-right:has(.old-style-login-view:not(.hidden)){padding:20px 18px 18px 18px;}#signupForm .form-group{margin-bottom:7px;}#signupForm .divider{margin:7px 0;}.old-style-login-view .form-group{margin-bottom:8px;}.old-style-login-view .divider{margin:8px 0;}.social-buttons-grid,.new-style-login-view .social-buttons{gap:10px;}.social-buttons-grid{grid-template-columns:1fr 1fr;gap:10px;}.form-group{margin-bottom:8px;}}.auth-modal-light{}.auth-modal-light .auth-modal-backdrop{background:rgba(255,255,255,0.75);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);}.auth-modal-light .auth-modal-content{background:linear-gradient(135deg,#fdfbf7 0%,#f8f6f2 100%);border:1px solid rgba(16,185,129,0.1);box-shadow:0 50px 100px rgba(0,0,0,0.12),0 20px 40px rgba(0,0,0,0.08),0 0 0 1px rgba(255,255,255,0.9) inset;}.auth-modal-light .auth-modal-left{background:linear-gradient(135deg,#ffffff 0%,#faf9f7 100%);border-right:1px solid rgba(16,185,129,0.08);box-shadow:2px 0 20px rgba(0,0,0,0.03),0 0 0 1px rgba(16,185,129,0.05) inset;}.auth-modal-light .auth-modal-left::before{background:radial-gradient(at 0% 0%,rgba(16,185,129,0.08) 0px,transparent 50%),radial-gradient(at 50% 0%,rgba(6,182,212,0.06) 0px,transparent 50%),radial-gradient(at 100% 0%,rgba(16,185,129,0.08) 0px,transparent 50%),radial-gradient(at 0% 50%,rgba(52,211,153,0.05) 0px,transparent 50%),radial-gradient(at 100% 50%,rgba(6,182,212,0.06) 0px,transparent 50%),radial-gradient(at 0% 100%,rgba(16,185,129,0.07) 0px,transparent 50%),radial-gradient(at 100% 100%,rgba(52,211,153,0.06) 0px,transparent 50%);filter:blur(60px);opacity:0.9;}.auth-modal-light .auth-modal-left::after{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.02'/%3E%3C/svg%3E");opacity:0.6;mix-blend-mode:multiply;}.auth-modal-light .auth-modal-logo .logo-icon{filter:drop-shadow(0 2px 8px rgba(16,185,129,0.25));}.auth-modal-light .auth-modal-logo .logo-text{color:#0a0a0a;text-shadow:0 1px 2px rgba(16,185,129,0.1);}.auth-modal-light .auth-modal-decoration .glow-orb-1{background:radial-gradient(circle,rgba(16,185,129,0.08) 0%,transparent 70%);filter:blur(80px);}.auth-modal-light .auth-modal-decoration .glow-orb-2{background:radial-gradient(circle,rgba(6,182,212,0.06) 0%,transparent 70%);filter:blur(70px);}.auth-modal-light .auth-modal-branding .branding-title{color:#0a0a0a;text-shadow:0 2px 12px rgba(16,185,129,0.12);background:linear-gradient(135deg,#0a0a0a 0%,#1a1a1a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}.auth-modal-light .auth-modal-branding .branding-subtitle{color:rgba(0,0,0,0.6);}.auth-modal-light .auth-modal-right{background:rgba(255,255,255,0.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:-2px 0 20px rgba(0,0,0,0.03);}.auth-modal-light .auth-modal-right::-webkit-scrollbar-thumb{background:rgba(16,185,129,0.2);}.auth-modal-light .auth-modal-right::-webkit-scrollbar-thumb:hover{background:rgba(16,185,129,0.3);}.auth-modal-light .auth-modal-close{color:rgba(0,0,0,0.4);}.auth-modal-light .auth-modal-close:hover{background:rgba(16,185,129,0.08);color:#0a0a0a;}.auth-modal-light .auth-form-title{color:#0a0a0a;background:linear-gradient(135deg,#0a0a0a 0%,#2a2a2a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}.auth-modal-light .auth-form-subtitle{color:rgba(0,0,0,0.5);}.auth-modal-light .form-label{color:#0a0a0a;opacity:0.7;}.auth-modal-light .form-input{color:#0a0a0a;background:rgba(255,255,255,0.9);border:1.5px solid rgba(0,0,0,0.08);box-shadow:0 1px 2px rgba(0,0,0,0.02),0 0 0 1px rgba(255,255,255,0.8) inset;}.auth-modal-light .form-input::placeholder{color:rgba(0,0,0,0.3);}.auth-modal-light .form-input:hover{border-color:rgba(16,185,129,0.2);box-shadow:0 2px 4px rgba(0,0,0,0.03),0 0 0 1px rgba(16,185,129,0.05) inset;}.auth-modal-light .form-input:focus{border-color:#10b981;box-shadow:0 0 0 3px rgba(16,185,129,0.12),0 2px 8px rgba(16,185,129,0.08);background:#ffffff;}.auth-modal-light .form-input:invalid:not(:placeholder-shown){border-color:#ff006e;box-shadow:0 0 0 3px rgba(255,0,110,0.1);}.auth-modal-light .input-icon-btn{color:rgba(0,0,0,0.4);}.auth-modal-light .input-icon-btn:hover{color:rgba(0,0,0,0.7);}.auth-modal-light .forgot-password-link{color:#10b981;}.auth-modal-light .forgot-password-link:hover{color:#059669;text-shadow:0 0 8px rgba(16,185,129,0.2);}.auth-modal-light .strength-text{color:rgba(0,0,0,0.45);}.auth-modal-light .btn-auth-primary{background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:#ffffff;border:none;box-shadow:0 4px 12px rgba(16,185,129,0.25),0 2px 4px rgba(16,185,129,0.15),0 0 0 1px rgba(255,255,255,0.3) inset;}.auth-modal-light .btn-auth-primary:hover{background:linear-gradient(135deg,#059669 0%,#047857 100%);box-shadow:0 6px 16px rgba(16,185,129,0.3),0 3px 6px rgba(16,185,129,0.2),0 0 0 1px rgba(255,255,255,0.4) inset;transform:translateY(-1px);}.auth-modal-light .btn-auth-primary:active{transform:translateY(0);box-shadow:0 2px 8px rgba(16,185,129,0.2),0 1px 3px rgba(16,185,129,0.15);}.auth-modal-light .btn-auth-primary:disabled{background:linear-gradient(135deg,rgba(16,185,129,0.4) 0%,rgba(5,150,105,0.4) 100%);box-shadow:none;}.auth-modal-light .btn-forgot-password{background:linear-gradient(135deg,#10b981 0%,#059669 100%);}.auth-modal-light .btn-forgot-password:hover{background:linear-gradient(135deg,#059669 0%,#047857 100%);}.auth-modal-light .btn-forgot-password .btn-arrow{filter:drop-shadow(0 0 4px rgba(255,255,255,0.5));}.auth-modal-light .divider{color:rgba(0,0,0,0.35);}.auth-modal-light .divider::before,.auth-modal-light .divider::after{background:linear-gradient(to right,transparent,rgba(0,0,0,0.1),transparent);}.auth-modal-light .btn-social,.auth-modal-light .btn-social-full{background:rgba(255,255,255,0.9);border:1.5px solid rgba(0,0,0,0.08);color:#1a1a1a;box-shadow:0 2px 4px rgba(0,0,0,0.04),0 0 0 1px rgba(255,255,255,0.8) inset;}.auth-modal-light .btn-social:hover,.auth-modal-light .btn-social-full:hover{background:#ffffff;border-color:rgba(16,185,129,0.2);box-shadow:0 4px 8px rgba(0,0,0,0.06),0 0 0 1px rgba(16,185,129,0.1) inset;transform:translateY(-1px);}.auth-modal-light .btn-social:active,.auth-modal-light .btn-social-full:active{transform:translateY(0);box-shadow:0 1px 3px rgba(0,0,0,0.04),0 0 0 1px rgba(0,0,0,0.05) inset;}.auth-modal-light .link-primary{color:#10b981;}.auth-modal-light .link-primary:hover{color:#059669;text-shadow:0 0 8px rgba(16,185,129,0.2);}.auth-modal-light .forgot-password-icon{background:linear-gradient(135deg,rgba(16,185,129,0.08) 0%,rgba(6,182,212,0.06) 100%);box-shadow:0 8px 24px rgba(16,185,129,0.12),0 0 0 1px rgba(16,185,129,0.1) inset;}.auth-modal-light .forgot-password-icon .icon-glow{background:radial-gradient(circle,rgba(16,185,129,0.15) 0%,transparent 70%);}.auth-modal-light .forgot-password-icon .icon-lock{color:#10b981;filter:drop-shadow(0 2px 8px rgba(16,185,129,0.2));}.auth-modal-light .forgot-password-icon .lock-shackle{animation:shakeLock 2s ease-in-out infinite;}.auth-modal-light .back-to-login{color:rgba(0,0,0,0.6);}.auth-modal-light .back-to-login:hover{color:#10b981;}.auth-modal-light .back-to-login svg{color:rgba(0,0,0,0.4);}.auth-modal-light .back-to-login:hover svg{color:#10b981;}.auth-modal-light .auth-message-content{background:linear-gradient(135deg,rgba(16,185,129,0.05) 0%,rgba(6,182,212,0.03) 100%);box-shadow:0 8px 32px rgba(16,185,129,0.12),0 0 0 1px rgba(16,185,129,0.1) inset;}.auth-modal-light .message-icon{background:linear-gradient(135deg,#10b981 0%,#059669 100%);box-shadow:0 8px 24px rgba(16,185,129,0.3),0 0 0 4px rgba(16,185,129,0.1);}.auth-modal-light .message-icon svg{filter:drop-shadow(0 2px 4px rgba(0,0,0,0.2));}.auth-modal-light .message-title{color:#0a0a0a;background:linear-gradient(135deg,#0a0a0a 0%,#2a2a2a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}.auth-modal-light .message-text{color:rgba(0,0,0,0.6);}
|
package/dist/index.cjs
CHANGED
|
@@ -2673,6 +2673,7 @@ class AuthModal {
|
|
|
2673
2673
|
this.resetToken = null;
|
|
2674
2674
|
this.tempUserId = null; // 临时用户ID(需要激活)
|
|
2675
2675
|
this.tempUserEmail = null; // 临时用户邮箱
|
|
2676
|
+
this.isOAuthInProgress = false; // OAuth登录进行中标志
|
|
2676
2677
|
this.client = options.client;
|
|
2677
2678
|
this.options = options;
|
|
2678
2679
|
// Auto-detect email verification token in URL
|
|
@@ -2884,8 +2885,8 @@ class AuthModal {
|
|
|
2884
2885
|
termsText.className = 'terms-text';
|
|
2885
2886
|
termsText.innerHTML = `
|
|
2886
2887
|
By clicking continue, you agree to our
|
|
2887
|
-
<a href="
|
|
2888
|
-
<a href="
|
|
2888
|
+
<a href="https://seaverse.ai/terms" class="terms-link">Terms of Service</a> and
|
|
2889
|
+
<a href="https://seaverse.ai/privacy" class="terms-link">Privacy Policy</a>.
|
|
2889
2890
|
`;
|
|
2890
2891
|
form.appendChild(termsText);
|
|
2891
2892
|
view.appendChild(form);
|
|
@@ -2966,7 +2967,7 @@ class AuthModal {
|
|
|
2966
2967
|
divider.className = 'divider';
|
|
2967
2968
|
divider.textContent = 'OR SIGN IN WITH';
|
|
2968
2969
|
form.appendChild(divider);
|
|
2969
|
-
// Social buttons grid (Google + GitHub)
|
|
2970
|
+
// Social buttons grid (Google + GitHub + Discord)
|
|
2970
2971
|
const socialGrid = document.createElement('div');
|
|
2971
2972
|
socialGrid.className = 'social-buttons-grid';
|
|
2972
2973
|
if (this.options.enableOAuth?.google) {
|
|
@@ -2977,13 +2978,13 @@ class AuthModal {
|
|
|
2977
2978
|
const githubBtn = this.createSocialButton('github', 'Github', 'login', false, 'old');
|
|
2978
2979
|
socialGrid.appendChild(githubBtn);
|
|
2979
2980
|
}
|
|
2980
|
-
if (socialGrid.children.length > 0) {
|
|
2981
|
-
form.appendChild(socialGrid);
|
|
2982
|
-
}
|
|
2983
2981
|
// Discord button (full width)
|
|
2984
2982
|
if (this.options.enableOAuth?.discord) {
|
|
2985
2983
|
const discordBtn = this.createSocialButton('discord', 'Discord', 'login', true, 'old');
|
|
2986
|
-
|
|
2984
|
+
socialGrid.appendChild(discordBtn);
|
|
2985
|
+
}
|
|
2986
|
+
if (socialGrid.children.length > 0) {
|
|
2987
|
+
form.appendChild(socialGrid);
|
|
2987
2988
|
}
|
|
2988
2989
|
}
|
|
2989
2990
|
view.appendChild(form);
|
|
@@ -3067,7 +3068,7 @@ class AuthModal {
|
|
|
3067
3068
|
divider.className = 'divider';
|
|
3068
3069
|
divider.textContent = 'OR SIGN UP WITH';
|
|
3069
3070
|
form.appendChild(divider);
|
|
3070
|
-
// Social buttons grid (Google + GitHub)
|
|
3071
|
+
// Social buttons grid (Google + GitHub + Discord)
|
|
3071
3072
|
const socialGrid = document.createElement('div');
|
|
3072
3073
|
socialGrid.className = 'social-buttons-grid';
|
|
3073
3074
|
// Google button - only if enabled
|
|
@@ -3080,14 +3081,14 @@ class AuthModal {
|
|
|
3080
3081
|
const githubBtn = this.createSocialButton('github', 'Github', 'signup');
|
|
3081
3082
|
socialGrid.appendChild(githubBtn);
|
|
3082
3083
|
}
|
|
3083
|
-
// Only add grid if it has buttons
|
|
3084
|
-
if (socialGrid.children.length > 0) {
|
|
3085
|
-
form.appendChild(socialGrid);
|
|
3086
|
-
}
|
|
3087
3084
|
// Discord button (full width) - only if configured
|
|
3088
3085
|
if (this.options.enableOAuth?.discord) {
|
|
3089
3086
|
const discordBtn = this.createSocialButton('discord', 'Discord', 'signup', true);
|
|
3090
|
-
|
|
3087
|
+
socialGrid.appendChild(discordBtn);
|
|
3088
|
+
}
|
|
3089
|
+
// Only add grid if it has buttons
|
|
3090
|
+
if (socialGrid.children.length > 0) {
|
|
3091
|
+
form.appendChild(socialGrid);
|
|
3091
3092
|
}
|
|
3092
3093
|
}
|
|
3093
3094
|
container.appendChild(form);
|
|
@@ -4220,7 +4221,14 @@ class AuthModal {
|
|
|
4220
4221
|
* - Redirecting back to returnUrl with token
|
|
4221
4222
|
*/
|
|
4222
4223
|
async startOAuthFlow(provider) {
|
|
4224
|
+
// 防止重复点击:如果已经有 OAuth 登录在进行中,直接返回
|
|
4225
|
+
if (this.isOAuthInProgress) {
|
|
4226
|
+
console.log(`[AuthModal] OAuth login already in progress, ignoring ${provider} login request`);
|
|
4227
|
+
return;
|
|
4228
|
+
}
|
|
4223
4229
|
try {
|
|
4230
|
+
// 设置登录进行中标志
|
|
4231
|
+
this.isOAuthInProgress = true;
|
|
4224
4232
|
// Get the return URL (where user should be redirected after OAuth)
|
|
4225
4233
|
const return_url = this.options.returnUrl || window.location.href;
|
|
4226
4234
|
// Call backend to get OAuth authorization URL
|
|
@@ -4245,6 +4253,8 @@ class AuthModal {
|
|
|
4245
4253
|
window.location.href = authorizeUrl;
|
|
4246
4254
|
}
|
|
4247
4255
|
catch (error) {
|
|
4256
|
+
// 登录失败,释放锁定
|
|
4257
|
+
this.isOAuthInProgress = false;
|
|
4248
4258
|
const err = error instanceof Error ? error : new Error(`${provider} OAuth failed`);
|
|
4249
4259
|
this.showError('OAuth Failed', err.message);
|
|
4250
4260
|
if (this.options.onError) {
|