html, body { overflow: auto; }
.account-wrap { max-width: 400px; margin: 10vh auto; margin: 10dvh auto; padding: 0 20px 40px; }
@media (max-width: 600px) { .account-wrap { margin-top: 32px; } }
.account-wrap .logo { margin-bottom: 24px; text-align: center; }
.account-form { display: flex; flex-direction: column; gap: 14px; }
.account-form h2 { font-size: 20px; }
.account-form label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--text-muted); }
.account-links { font-size: 13px; color: var(--text-dim); }
.account-links a { color: var(--blue); }
.account-msg { margin-top: 18px; font-size: 14px; min-height: 1.2em; }
.account-form .btn-primary { min-height: 44px; font-size: 15px; }
.account-msg.error { color: var(--red); }
.account-msg.ok { color: var(--green); }
.hp-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
#form-resend { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
altcha-widget {
  --altcha-color-base: var(--bg-input);
  --altcha-color-base-content: var(--text);
  --altcha-color-neutral: var(--bg-hover);
  --altcha-color-primary: var(--accent);
  --altcha-color-primary-content: var(--bg);
  --altcha-color-success: var(--green);
  --altcha-color-error: var(--red);
  --altcha-border-radius: var(--radius-sm);
  --altcha-max-width: 100%;
  color: var(--text);
}
/* Touch: the "I'm not a robot" label is the tap target (the box itself stays compact) */
@media (pointer: coarse), (max-width: 760px) {
  altcha-widget { --altcha-checkbox-size: 26px; }
  altcha-widget .altcha-checkbox-wrap label { display: flex; align-items: center; min-height: 44px; flex: 1; cursor: pointer; }
}
