.login-page{background:linear-gradient(135deg,#fff,#e0e7ff);color:#1a1a1a;font-family:Inter,sans-serif;min-height:100vh;overflow-x:hidden;position:relative}.login-page:before{animation:subtleFloat 20s ease-in-out infinite;background:radial-gradient(circle at 20% 80%,rgba(59,130,246,.05) 0,transparent 50%),radial-gradient(circle at 80% 20%,rgba(99,102,241,.05) 0,transparent 50%),radial-gradient(circle at 40% 40%,rgba(16,185,129,.03) 0,transparent 50%);content:"";height:100%;left:0;position:fixed;top:0;width:100%;z-index:-1}@keyframes subtleFloat{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(180deg)}}.login-page body{background:none!important;color:#1a1a1a!important}.login-page .container{align-items:center;display:flex;justify-content:center;min-height:100vh;padding:20px;position:relative;z-index:2}.login-page .particles{height:100%;left:0;pointer-events:none;position:fixed;top:0;width:100%;z-index:1}.login-page .particle{animation:particleFloat 20s linear infinite;background:#3b82f6;border-radius:50%;height:2px;opacity:.1;position:absolute;width:2px}@keyframes particleFloat{0%{opacity:0;transform:translateY(100vh) translate(0)}10%{opacity:.1}90%{opacity:.1}to{opacity:0;transform:translateY(-100vh) translate(50px)}}.login-page .auth-container{background:#fff;border:1px solid #e5e7eb;border-radius:16px;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;display:grid;grid-template-columns:1fr 1fr;max-width:1200px;min-height:700px;overflow:hidden;position:relative;width:100%}.login-page .content-section{background:linear-gradient(135deg,#3b82f6,#2563eb);display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:60px;position:relative}.login-page .content-section:before{background:radial-gradient(circle at 30% 70%,hsla(0,0%,100%,.1) 0,transparent 50%),radial-gradient(circle at 70% 30%,hsla(0,0%,100%,.05) 0,transparent 50%);bottom:0;content:"";left:0;position:absolute;right:0;top:0;z-index:1}.login-page .back-home{align-items:center;color:#d1d5db;display:flex;font-size:14px;font-weight:500;gap:8px;margin-bottom:40px;position:relative;text-decoration:none;transition:all .3s ease;z-index:2}.login-page .back-home:hover{color:#fff;transform:translate(-5px)}.login-page .back-home:before{content:"←";font-size:16px}.login-page .content-section h2{color:#fff;font-family:Space Grotesk,sans-serif;font-size:clamp(2.5rem,4vw,3.5rem);font-weight:700;line-height:1.2;margin-bottom:20px;position:relative;z-index:2}.login-page .content-section p{color:#d1d5db;font-size:18px;line-height:1.6;margin-bottom:40px;position:relative;z-index:2}.login-page .cta-btn{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff26;border:1px solid hsla(0,0%,100%,.2);border-radius:12px;color:#fff;display:inline-flex;font-size:16px;font-weight:600;gap:12px;overflow:hidden;padding:16px 32px;position:relative;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);width:fit-content;z-index:2}.login-page .cta-btn:hover{background:#ffffff40;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;transform:translateY(-2px)}.login-page .login-section{background:#fff;display:flex;flex-direction:column;justify-content:center;padding:60px;position:relative}.login-page .logo-section{margin-bottom:40px;text-align:center}.login-page .logo{align-items:center;background:linear-gradient(135deg,#3b82f6,#2563eb);border-radius:16px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;color:#fff;display:flex;height:80px;justify-content:center;margin:0 auto 24px;overflow:hidden;position:relative;width:80px}.login-page .logo,.login-page .welcome-text{font-family:Space Grotesk,sans-serif;font-size:32px;font-weight:700}.login-page .welcome-text{color:#1f2937;margin-bottom:8px}.login-page .subtitle{color:#6b7280;font-size:16px;font-weight:400}.login-page .form-group{margin-bottom:24px;position:relative}.login-page .form-input{background:#f9fafb;border:2px solid #e5e7eb;border-radius:12px;color:#1a1a1a;font-size:16px;font-weight:400;padding:16px 20px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);width:100%}.login-page .form-input:focus{background:#fff;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a;outline:none;transform:translateY(-1px)}.login-page .form-input:focus+.form-label,.login-page .form-input:not(:placeholder-shown)+.form-label{color:#3b82f6;font-weight:500;transform:translateY(-28px) scale(.85)}.login-page .form-label{background:#fff;color:#9ca3af;font-size:16px;left:20px;padding:0 4px;pointer-events:none;position:absolute;top:16px;transform-origin:left center;transition:all .3s cubic-bezier(.4,0,.2,1)}.login-page .password-toggle{background:none;border:none;border-radius:8px;color:#9ca3af;cursor:pointer;font-size:18px;padding:8px;position:absolute;right:16px;top:50%;transform:translateY(-50%);transition:all .3s ease}.login-page .password-toggle:hover{background:#f9fafb;color:#1a1a1a}.login-page .remember-me{align-items:center;display:flex;gap:12px;margin-bottom:24px}.login-page .checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:2px solid #e5e7eb;border-radius:6px;cursor:pointer;height:20px;position:relative;transition:all .3s ease;width:20px}.login-page .checkbox:checked{background:#3b82f6;border-color:#3b82f6}.login-page .checkbox:checked:after{color:#fff;content:"✓";font-size:12px;font-weight:700;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.login-page .checkbox:focus{box-shadow:0 0 0 3px #3b82f61a}.login-page .checkbox-label{color:#6b7280;cursor:pointer;font-size:14px;-webkit-user-select:none;user-select:none}.login-page .forgot-password{margin-bottom:32px;text-align:right}.login-page .forgot-password a{color:#3b82f6;font-size:14px;font-weight:500;text-decoration:none;transition:all .3s ease}.login-page .forgot-password a:hover{color:#2563eb;text-decoration:underline}.login-page .login-btn{align-items:center;background:#3b82f6;border:none;border-radius:12px;box-shadow:0 1px 2px #0000000d;color:#fff;cursor:pointer;display:flex;font-size:16px;font-weight:600;gap:8px;justify-content:center;overflow:hidden;padding:16px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);width:100%}.login-page .login-btn:hover{background:#2563eb;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;transform:translateY(-1px)}.login-page .login-btn:active{transform:translateY(0)}.login-page .login-btn:focus{box-shadow:0 0 0 3px #3b82f633;outline:none}.login-page .login-btn[data-loading=true]{opacity:.8;pointer-events:none}.login-page .spinner{animation:spin 1s linear infinite;border:2px solid hsla(0,0%,100%,.3);border-radius:50%;border-top-color:#3b82f6;height:20px;width:20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.login-page .divider{color:#6b7280;font-size:14px;margin:32px 0;position:relative;text-align:center}.login-page .divider:before{background:#e5e7eb;content:"";height:1px;left:0;position:absolute;right:0;top:50%}.login-page .divider sp{background:#fff;padding:0 20px;position:relative;z-index:1}.login-page .social-login{display:flex;gap:12px;margin-bottom:32px}.login-page .social-btn{background:#f9fafb;border:2px solid #e5e7eb;border-radius:12px;color:#1a1a1a;cursor:pointer;flex:1;font-size:20px;overflow:hidden;padding:16px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.login-page .social-btn:hover{background:#f3f4f6;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;transform:translateY(-2px)}.login-page .social-btn:focus{box-shadow:0 0 0 3px #3b82f61a;outline:none}.login-page .google:hover{border-color:#db4437;color:#db4437}.login-page .facebook:hover{border-color:#1877f2;color:#1877f2}.login-page .twitter:hover{border-color:#1da1f2;color:#1da1f2}.login-page .register-link{color:#6b7280;font-size:14px;text-align:center}.login-page .register-link a{color:#3b82f6;font-weight:600;text-decoration:none;transition:all .3s ease}.login-page .register-link a:hover{color:#2563eb;text-decoration:underline}.login-page .error-message,.login-page .success-message{border:1px solid;border-radius:12px;display:none;font-size:14px;font-weight:500;margin-bottom:24px;opacity:0;padding:16px;transform:translateY(-10px);transition:opacity .3s ease,transform .3s ease}.login-page .error-message{background:#fef2f2;border-color:#fca5a5;color:#dc2626}.login-page .success-message{background:#f0fdf4;border-color:#86efac;color:#166534}.login-page .error-message[style*="display: block"],.login-page .success-message[style*="display: block"]{opacity:1;transform:translateY(0)}.login-page .validation-message{font-size:12px;margin-top:8px;opacity:0;transform:translateY(-5px);transition:all .3s ease}.login-page .validation-message.error{color:#dc2626;opacity:1;transform:translateY(0)}.login-page .validation-message.success{color:#166534;opacity:1;transform:translateY(0)}.login-page .form-input.error{background:#fef2f2;border-color:#dc2626}.login-page .form-input.success{background:#f0fdf4;border-color:#16a34a}@media (max-width:1024px){.login-page .auth-container{grid-template-columns:1fr;max-width:500px}.login-page .content-section,.login-page .login-section{padding:40px;text-align:center}}@media (max-width:768px){.login-page .container{padding:16px}.login-page .auth-container{border-radius:16px;min-height:auto}.login-page .content-section,.login-page .login-section{padding:32px 24px}.login-page .content-section h2{font-size:2rem;margin-bottom:16px}.login-page .content-section p{font-size:16px;margin-bottom:24px}.login-page .welcome-text{font-size:24px}.login-page .logo{font-size:24px;height:60px;margin-bottom:20px;width:60px}}.login-page :focus{outline:2px solid #3b82f6;outline-offset:2px}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f9fafb}::-webkit-scrollbar-thumb{background:#3b82f6;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#3b82f6}.login-page .checkbox:focus,.login-page .form-input:focus,.login-page .login-btn:focus,.login-page .social-btn:focus{outline:none}