/* Security code (number captcha) on the website and admin sign-in forms. */
.c5cap__row { display: flex; align-items: center; gap: .6rem; }
.c5cap__img { flex: none; width: 168px; height: 52px; border-radius: .5rem; background: #eef0f6; user-select: none; -webkit-user-drag: none; }
.c5cap__new { flex: none; display: grid; place-items: center; width: 2.6rem; height: 2.6rem; padding: 0; border: 1px solid currentColor; border-radius: 50%; background: transparent; color: inherit; font-size: 1.05rem; opacity: .7; cursor: pointer; transition: opacity .2s, transform .4s; }
.c5cap__new:hover, .c5cap__new:focus-visible { opacity: 1; }
.c5cap__new.is-spinning { transform: rotate(360deg); }
.c5cap__row > input, .c5cap__in { flex: 1; min-width: 0; }
.c5cap__row input { font-variant-numeric: tabular-nums; }
.c5cap__row input:not(:placeholder-shown) { letter-spacing: .3em; }
.c5cap--on-dark .c5cap__new { color: #fff; }
.c5cap--auth { width: 100%; margin-bottom: 1rem; }
.c5cap--auth .c5cap__row > input { margin: 0; }
.c5cap--auth .c5cap__row { flex-wrap: wrap; }
.c5cap--auth .c5cap__row label.error { flex-basis: 100%; order: 9; margin: 0; }
@media (max-width: 420px) {
    .c5cap__row { flex-wrap: wrap; }
    .c5cap__row > input, .c5cap__in { flex-basis: 100%; }
}
