.pmg-captcha { padding: 20px; border: 1px solid var(--pmg-line); background: var(--pmg-surface); color: var(--pmg-ink); }
.pmg-captcha > label { display: block; margin-bottom: 8px; }
.pmg-captcha-help { margin: 0 0 16px; color: var(--pmg-muted); font-size: 13px; line-height: 1.7; }
.pmg-captcha-challenge { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.pmg-captcha-image { display: flex; align-items: center; justify-content: center; width: 240px; max-width: 100%; min-height: 80px; overflow: hidden; border: 1px solid var(--pmg-line); background: var(--pmg-paper); }
.pmg-captcha-image img { display: block; width: 240px; max-width: 100%; height: auto; }
.pmg-captcha-refresh { min-height: 44px; }
.pmg-captcha-audio { display: block; width: 100%; max-width: 360px; height: 44px; margin: 14px 0; color-scheme: light; }
[data-bs-theme="dark"] .pmg-captcha-audio { color-scheme: dark; }
.pmg-captcha .pmg-captcha-input { max-width: 360px; min-height: 48px; margin-top: 14px; font-family: ui-monospace, monospace; letter-spacing: .12em; text-transform: uppercase; }
.pmg-captcha-input::placeholder { letter-spacing: normal; text-transform: none; }
.pmg-captcha-status { margin: 10px 0 0; font-size: 13px; line-height: 1.7; }
.pmg-captcha .pmg-captcha-help, .pmg-captcha .pmg-captcha-status { text-align: left; }
.pmg-captcha-status:empty { display: none; }
.pmg-captcha .pmg-captcha-fallback { margin: 8px 0 0; font-size: 13px; line-height: 1.7; text-align: left; overflow-wrap: anywhere; }
.pmg-captcha[data-state="error"] .pmg-captcha-status { color: #b42318; }
[data-bs-theme="dark"] .pmg-captcha[data-state="error"] .pmg-captcha-status { color: #ffb4ab; }
.pmg-captcha [hidden] { display: none; }
@media (max-width: 575px) {
    .pmg-captcha { padding: 14px; }
    .pmg-captcha-challenge { align-items: stretch; }
    .pmg-captcha-image, .pmg-captcha-refresh { width: 100%; }
}
