* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Inter', sans-serif; }
.login-wrapper { display: flex; justify-content: center; align-items: center; min-height: 100vh; background: linear-gradient(135deg, #0a2f3c 0%, #0e4a5e 100%); }
.login-card { background: white; max-width: 460px; width: 90%; border-radius: 48px; overflow: hidden; color: #1a2c3e; }
.login-header { background: #0e4a5e; color: white; padding: 32px 28px; text-align: center; }
.login-body { padding: 32px 28px; }
.login-input { width: 100%; padding: 14px; border-radius: 60px; border: 1px solid #cbdde6; font-family: inherit; margin-top: 8px; }
.login-btn { background: #0e4a5e; color: white; width: 100%; padding: 14px; border-radius: 60px; font-weight: 700; border: none; cursor: pointer; margin-top: 20px; }
.login-error { background: #fee2e2; color: #c0392b; padding: 12px; border-radius: 28px; margin-bottom: 20px; text-align: center; }
.login-status { background: #d4edda; color: #155724; padding: 12px; border-radius: 28px; margin-bottom: 20px; text-align: center; }
.remember-me { display: flex; align-items: center; margin-top: 15px; font-size: 0.9rem; color: #555; }
.remember-me input[type="checkbox"] { width: 18px; height: 18px; margin-right: 10px; cursor: pointer; }
.register-link { display: block; text-align: center; margin-top: 12px; color: #0e4a5e; text-decoration: underline; }