.login-container{width:100%;max-width:450px;padding:1rem}.login-card{background-color:var(--card-bg);border:1px solid var(--card-border);border-radius:1.5rem;padding:3rem 2rem;box-shadow:var(--shadow-lg);animation:fadeIn .3s ease-out}@media (max-width:640px){.login-card{padding:2rem 1.5rem}}.login-header{text-align:center;margin-bottom:2rem}.login-icon{width:64px;height:64px;margin:0 auto 1.5rem;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--accent-color),var(--accent-hover));border-radius:1rem;color:white;animation:iconPulse 2s ease-in-out infinite}.login-icon svg{width:32px;height:32px}@keyframes iconPulse{0%,to{transform:scale(1);box-shadow:0 0 0 0 rgba(239,68,68,.4)}50%{transform:scale(1.05);box-shadow:0 0 0 10px rgba(239,68,68,0)}}.login-title{font-size:1.875rem;font-weight:700;color:var(--text-primary);margin-bottom:.5rem}.login-subtitle{font-size:.95rem;color:var(--text-secondary)}.login-form{gap:1.5rem}.form-group,.login-form{display:flex;flex-direction:column}.form-group{gap:.5rem}.form-label{font-size:.875rem;font-weight:500;color:var(--text-secondary)}.input-wrapper{position:relative;display:flex;align-items:center}.input-icon{position:absolute;left:1rem;width:20px;height:20px;color:var(--text-tertiary);pointer-events:none;z-index:1}.form-input{width:100%;padding:.875rem 1rem .875rem 3rem;font-size:.95rem;color:var(--text-primary);background-color:var(--input-bg);border:2px solid var(--input-border);border-radius:.75rem;transition:all .2s ease;outline:none}.form-input::placeholder{color:var(--text-tertiary)}.form-input:focus{border-color:var(--input-focus);box-shadow:0 0 0 3px var(--accent-bg)}.form-input:hover:not(:focus){border-color:var(--border-hover)}.password-toggle{position:absolute;right:1rem;width:20px;height:20px;padding:0;background:none;border:none;color:var(--text-tertiary);cursor:pointer;transition:color .2s ease;z-index:1}.password-toggle:hover{color:var(--text-secondary)}.password-toggle svg{width:20px;height:20px}.form-options{justify-content:space-between;margin-top:-.5rem}.checkbox-label,.form-options{display:flex;align-items:center}.checkbox-label{gap:.5rem;cursor:pointer}.checkbox-input{width:18px;height:18px;cursor:pointer;accent-color:var(--accent-color)}.checkbox-text{font-size:.875rem;color:var(--text-secondary);-webkit-user-select:none;user-select:none}.forgot-password{font-size:.875rem;color:var(--accent-color);background:none;border:none;cursor:pointer;transition:opacity .2s ease}.forgot-password:hover{opacity:.8;text-decoration:underline}.login-button{width:100%;padding:.875rem;font-size:1rem;font-weight:600;color:white;background:linear-gradient(135deg,var(--accent-color),var(--accent-hover));border:none;border-radius:.75rem;cursor:pointer;transition:all .2s ease;margin-top:.5rem;position:relative;overflow:hidden}.login-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 20px rgba(239,68,68,.3)}.login-button:active:not(:disabled){transform:translateY(0)}.login-button:disabled{opacity:.6;cursor:not-allowed}.login-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.login-button:hover:not(:disabled):before{left:100%}.back-button{width:100%;padding:.875rem;font-size:.95rem;font-weight:500;color:var(--text-secondary);background:transparent;border:2px solid var(--border-secondary);border-radius:.75rem;cursor:pointer;transition:all .2s ease}.back-button:hover{background-color:var(--hover-bg);border-color:var(--border-hover);color:var(--text-primary)}.loading-spinner{display:inline-block;width:20px;height:20px;border-radius:50%;border:3px solid rgba(255,255,255,.3);border-top-color:white;animation:spin .8s linear infinite}.method-input .loading-spinner{border:3px solid var(--accent-bg);border-top-color:var(--accent-color)}@keyframes spin{to{transform:rotate(1turn)}}.login-footer{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border-primary);text-align:center}.footer-text{font-size:.875rem;color:var(--text-secondary)}.footer-link{color:var(--accent-color);background:none;border:none;cursor:pointer;font-weight:600;transition:opacity .2s ease}.footer-link:hover{opacity:.8;text-decoration:underline}.code-input-container{display:grid;grid-template-columns:repeat(6,1fr);gap:.5rem}.code-input{width:100%;aspect-ratio:1;padding:0;font-size:1.5rem;font-weight:600;text-align:center;color:var(--text-primary);background-color:var(--input-bg);border:2px solid var(--input-border);border-radius:.75rem;transition:all .2s ease;outline:none}.code-input:focus{border-color:var(--input-focus);box-shadow:0 0 0 3px var(--accent-bg);transform:scale(1.05)}.code-input:hover:not(:focus){border-color:var(--border-hover)}@media (max-width:640px){.code-input-container{gap:.375rem}.code-input{font-size:1.25rem}}.method-input-container{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:.5rem}.method-input{padding:1.5rem 1rem;font-size:1rem;font-weight:600;color:var(--text-secondary);background-color:var(--input-bg);border:2px solid var(--input-border);border-radius:1rem;cursor:pointer;transition:all .2s ease;text-align:center;position:relative;overflow:visible;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:140px}.method-input:hover{border-color:var(--accent-color);color:var(--text-primary);transform:translateY(-2px);box-shadow:0 4px 12px var(--method-shadow-hover)}.method-input:active{transform:translateY(0)}.method-input.selected{border-color:var(--accent-color);background:var(--method-selected-bg);color:var(--accent-color);box-shadow:0 0 0 3px var(--accent-bg)}@media (max-width:640px){.method-input-container{gap:.75rem}.method-input{padding:1.25rem .75rem;font-size:.95rem}}.resend-container{text-align:center;margin-top:-.5rem}.resend-button{font-size:.875rem;color:var(--text-secondary);background:none;border:none;cursor:pointer}.resend-link{color:var(--accent-color);font-weight:600;transition:opacity .2s ease}.resend-button:hover .resend-link{opacity:.8;text-decoration:underline}.success-card{flex-direction:column;text-align:center;min-height:400px}.success-card,.success-icon{display:flex;align-items:center;justify-content:center}.success-icon{width:100px;height:100px;background:linear-gradient(135deg,var(--success-color),#059669);border-radius:50%;color:white;margin-bottom:2rem}.success-icon svg{width:50px;height:50px}.success-title{font-size:2rem;font-weight:700;color:var(--text-primary);margin-bottom:.75rem}.success-subtitle{font-size:1rem;color:var(--text-secondary)}.form-error{font-size:.875rem;color:var(--error-color);margin-top:.25rem}.form-error-alert-v2{background-color:#fee2e2;border:1px solid #ef4444;color:#b91c1c;padding:1rem;border-radius:.5rem;margin-bottom:1.5rem;font-size:.95rem;font-weight:600;text-align:center;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);position:relative;z-index:50;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width:640px){.login-title{font-size:1.5rem}.login-subtitle{font-size:.875rem}.login-icon{width:56px;height:56px}.login-icon svg{width:28px;height:28px}}[data-theme=light] .login-button{box-shadow:0 4px 12px rgba(220,38,38,.2)}[data-theme=light] .login-button:hover:not(:disabled){box-shadow:0 10px 25px rgba(220,38,38,.3)}[data-theme=light] .code-input,[data-theme=light] .form-input{background-color:var(--bg-secondary)}