.login-page{background-color:var(--bg);background-image:linear-gradient(rgba(var(--primary-rgb), .25), rgba(var(--primary-rgb), .25)), linear-gradient(var(--bg), var(--bg)), url(/login-bg.png);background-blend-mode:overlay, multiply, normal;min-height:100vh;transition:background var(--transition-slow);background-position:50%;background-size:cover;justify-content:center;align-items:center;padding:24px;display:flex;position:relative;overflow:hidden}.login-page:before{content:"";-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:0;position:absolute;inset:0}.login-container{z-index:10;width:100%;max-width:440px;animation:.8s cubic-bezier(.16,1,.3,1) login-appear;position:relative}@keyframes login-appear{0%{opacity:0;transform:translateY(30px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.login-card{-webkit-backdrop-filter:blur(20px)saturate(180%);border-radius:var(--radius-xl);background:#ffffffb3;border:1px solid #ffffff4d;flex-direction:column;gap:12px;padding:20px 32px;display:flex;box-shadow:0 25px 50px -12px #00000040}.dark .login-card{background:#1e293bb3;border:1px solid #ffffff14;box-shadow:0 25px 50px -12px #00000080}.login-header{text-align:center}.login-logo{object-fit:contain;width:64px;height:64px;margin:0 auto 16px;display:block}.login-title{color:var(--text-primary);letter-spacing:-.02em;margin-bottom:4px;font-size:28px;font-weight:800}.login-subtitle{color:var(--text-muted);font-size:15px}.login-form{flex-direction:column;gap:10px;display:flex}.form-group{flex-direction:column;gap:6px;display:flex}.form-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:13px;font-weight:600}.input-wrapper{align-items:center;display:flex;position:relative}.input-icon{color:var(--text-subtle);width:18px;height:18px;position:absolute;left:14px}.login-input{border:1.5px solid var(--border);border-radius:var(--radius-md);width:100%;color:var(--text-primary);transition:all var(--transition-base);background:#ffffff80;outline:none;padding:10px 14px 10px 42px;font-size:15px}.dark .login-input{background:#0f172a4d}.login-input:focus{border-color:var(--primary);background:var(--surface);box-shadow:0 0 0 4px #2563eb1a}.login-options{justify-content:space-between;align-items:center;font-size:14px;display:flex}.remember-me{cursor:pointer;color:var(--text-secondary);align-items:center;gap:8px;display:flex}.forgot-password{color:var(--primary);transition:color var(--transition-fast);font-weight:600;text-decoration:none}.forgot-password:hover{color:var(--primary-dark)}.login-btn{background-color:var(--primary);color:#fff;border-radius:var(--radius-md);cursor:pointer;width:100%;transition:all var(--transition-base);border:none;margin-top:4px;padding:10px;font-size:16px;font-weight:700}.login-btn:hover{background-color:var(--primary-dark);transform:translateY(-2px);box-shadow:0 10px 20px -8px #2563eb80}.login-btn:active{transform:translateY(0)}.login-divider{align-items:center;gap:16px;margin:4px 0;display:flex}.login-divider:before,.login-divider:after{content:"";background-color:var(--border);flex:1;height:1px}.divider-text{color:var(--text-subtle);text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:600}.social-logins{grid-template-columns:1fr 1fr;gap:12px;display:grid}.social-btn{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);color:var(--text-primary);justify-content:center;align-items:center;gap:10px;padding:10px;font-size:14px;font-weight:600;display:flex}.social-btn:hover{background:var(--surface-2);border-color:var(--text-subtle);transform:translateY(-1px)}.login-footer{text-align:center;color:var(--text-secondary);font-size:14px}.signup-link{color:var(--primary);font-weight:700;text-decoration:none}.signup-link:hover{text-decoration:underline}.signup-toggle-btn{color:var(--primary);cursor:pointer;font-family:inherit;font-weight:700;font-size:inherit;transition:all var(--transition-fast);background:0 0;border:none;padding:0}.signup-toggle-btn:hover{color:var(--primary-dark);text-decoration:underline}.error-message{border:1px solid var(--accent);color:var(--accent);border-radius:var(--radius-md);text-align:center;background:#ef44441a;padding:12px;font-size:14px;animation:.5s cubic-bezier(.36,.07,.19,.97) both shake}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}@media (max-width:480px){.login-card{padding:32px 24px}}
