.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);padding:20px}.login-container{width:100%;max-width:420px}.login-card{background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;padding:48px;animation:slideUp .4s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.login-header{text-align:center;margin-bottom:32px}.login-icon{display:inline-flex;align-items:center;justify-content:center;margin-bottom:24px}.login-header h1{font-size:28px;font-weight:700;color:var(--text-primary);margin:0 0 8px}.login-header p{font-size:14px;color:var(--text-secondary);margin:0}.login-form{margin-bottom:24px}.login-error{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;color:#dc2626;font-size:14px;margin-bottom:20px;animation:shake .3s ease-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.form-group{margin-bottom:20px}.form-group label{display:block;font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:8px}.form-group input{width:100%;height:44px;padding:0 16px;font-size:15px;border:1px solid var(--border-light);border-radius:8px;outline:none;transition:all .2s ease;font-family:inherit}.form-group input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-group input:disabled{background:var(--bg-tertiary);cursor:not-allowed}.form-group input::placeholder{color:var(--text-tertiary)}.login-button{width:100%;height:48px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:15px;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease;margin-top:8px}.login-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #667eea66}.login-button:active:not(:disabled){transform:translateY(0)}.login-button:disabled{opacity:.6;cursor:not-allowed}.login-footer{text-align:center;padding-top:24px;border-top:1px solid var(--border-light)}.login-hint{font-size:13px;color:var(--text-tertiary);margin:0;font-style:italic}@media(max-width:480px){.login-card{padding:32px 24px}.login-header h1{font-size:24px}.login-icon{width:64px;height:64px}.login-icon svg{width:32px;height:32px}}