html, body { min-height:100%; }
.login-card { max-width:440px; margin:8vh auto; padding:24px; }
.login-card h1 { color:var(--teal,#0B626B); }
.login-card form { display:grid; gap:18px; margin-top:28px; }
.login-card label { display:grid; gap:8px; }
.login-card input,.login-card button { width:100%; min-height:44px; border:1px solid #C3A16B; border-radius:10px; padding:10px; font:inherit; }
.login-card button { background:#0B626B; color:white; }
.login-card button:disabled { opacity:.6; }
.account-controls { display:flex; align-items:center; gap:12px; padding:8px 16px; }
.account-controls button { min-height:44px; padding:8px 16px; font:inherit; border:1px solid #0B626B; border-radius:10px; color:#0B626B; background:#F6F5F1; }
.network-state { position:fixed; inset:0 0 auto 0; z-index:9999; margin:0; padding:12px 16px; background:#fff1dc; color:#6b3411; border-bottom:1px solid #C3A16B; }
[data-page="enroll"] .login-card { margin: 0 auto; padding: 20px; }
[data-page="enroll"] form { gap: 10px; margin: 12px 0; }
[data-page="enroll"] h1, [data-page="enroll"] h2 { margin: 0 0 8px; }
[data-page="enroll"] details { margin: 14px 0; }
[data-page="enroll"] summary { cursor: pointer; font-weight: bold; }
[data-page="enroll"] pre { white-space: pre-wrap; overflow-wrap: anywhere; }
[data-page="enroll"] [role="alert"]:not(:empty) {
  color: #8b1d13; background: #fff1ea; padding: 10px; border-radius: 8px;
}
[hidden] { display:none !important; }