/* Self-hosted captcha widget (website forms + login). */
.q-captcha { --qc-accent: var(--wp--preset--color--accent); --qc-ink: var(--wp--preset--color--contrast); --qc-muted: var(--wp--preset--color--muted); display: grid; gap: 8px; margin: 4px 0 6px; padding: 12px 14px; border: 1px solid var(--wp--preset--color--line); border-radius: 16px; background: linear-gradient(135deg, color-mix(in srgb, var(--wp--preset--color--brass-light) 9%, white), #fff); box-shadow: 0 10px 24px -20px color-mix(in srgb, var(--wp--preset--color--espresso) 60%, transparent); }
.q-captcha__label { display: flex; align-items: center; gap: 6px; font: 700 11px/1 system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--qc-muted); }
.q-captcha__shield { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; animation: q-captcha-hue 7s ease-in-out infinite; }
@keyframes q-captcha-hue { 0%, 100% { color: var(--wp--preset--color--accent); } 33% { color: var(--wp--preset--color--brass); } 66% { color: var(--wp--preset--color--sage); } }
.q-captcha__row { display: flex; align-items: center; gap: 10px; }
.q-captcha__img { display: block; width: 180px; height: 60px; border-radius: 10px; background: var(--wp--preset--color--cream); box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); object-fit: cover; }
.q-captcha.is-loading .q-captcha__img { background: linear-gradient(100deg, var(--wp--preset--color--cream) 30%, color-mix(in srgb, var(--wp--preset--color--brass) 11%, white) 50%, var(--wp--preset--color--cream) 70%) 0 0 / 300% 100%; animation: q-captcha-shimmer 1.2s linear infinite; }
.q-captcha.is-loading .q-captcha__img:not([src]) , .q-captcha.is-loading .q-captcha__img[src=""] { color: transparent; }
@keyframes q-captcha-shimmer { to { background-position: -150% 0; } }
.q-captcha__new { display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 1px solid var(--wp--preset--color--line); border-radius: 50%; background: #fff; cursor: pointer; transition: transform .2s, box-shadow .2s; }
.q-captcha__new:hover { box-shadow: 0 6px 14px -8px rgba(0,0,0,.4); transform: translateY(-1px); }
.q-captcha__new:focus-visible { outline: 3px solid color-mix(in srgb, var(--wp--preset--color--accent) 55%, transparent); outline-offset: 2px; }
.q-captcha__new svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; animation: q-captcha-hue 7s ease-in-out infinite; }
.q-captcha__new.is-spin svg { animation: q-captcha-spin .6s cubic-bezier(.3,1.4,.5,1), q-captcha-hue 7s ease-in-out infinite; }
@keyframes q-captcha-spin { from { transform: rotate(-360deg); } }
.q-captcha__field { display: grid; gap: 4px; margin: 0; font-size: 13px; font-weight: 600; color: var(--qc-ink); }
.q-captcha__field input { width: 180px; max-width: 100%; min-height: 44px; padding: 6px 12px; border: 1.5px solid color-mix(in srgb, var(--wp--preset--color--on-dark-muted) 91%, white); border-radius: 10px; background: #fff; font: 700 22px/1 ui-monospace, "SFMono-Regular", Menlo, monospace; letter-spacing: .42em; color: var(--qc-ink); transition: border-color .2s, box-shadow .2s; }
.q-captcha__field input:focus { outline: none; border-color: var(--qc-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--wp--preset--color--accent) 18%, transparent); }
.q-captcha.is-complete .q-captcha__field input { border-color: var(--wp--preset--color--sage); }
.q-captcha.is-wrong .q-captcha__field input { border-color: #b32d2e; animation: q-captcha-shake .4s; }
@keyframes q-captcha-shake { 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
.q-captcha__status { font-size: 12px; color: #b32d2e; }
.q-captcha__status:empty { display: none; }
@media (prefers-reduced-motion: reduce) { .q-captcha *, .q-captcha { animation: none !important; } }

/* wp-login.php – sits on the dark glass panel. */
.login .q-captcha { margin: 0 0 16px; }
.login .q-captcha, .q-gc__balance .q-captcha { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.22); box-shadow: none; }
.login .q-captcha__label, .q-gc__balance .q-captcha__label { color: color-mix(in srgb, var(--wp--preset--color--brass-light) 81%, white); }
.login .q-captcha__field span, .q-gc__balance .q-captcha__field span { color: color-mix(in srgb, var(--wp--preset--color--brass) 17%, white); font-weight: 600; }
.login .q-captcha__field input, .q-gc__balance .q-captcha__field input { border-color: rgba(255,255,255,.35); background: #fff; color: var(--wp--preset--color--contrast); text-transform: none; letter-spacing: .42em; font-family: ui-monospace, Menlo, monospace; }
.login .q-captcha__new, .q-gc__balance .q-captcha__new { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.3); color: color-mix(in srgb, var(--wp--preset--color--brass) 17%, white); }
.login .q-captcha__field input { width: 100%; font-size: 22px; }
.login .q-captcha__img { width: 180px; }