.auth-password-feedback { margin: 8px 0 16px; font-size: 12px; color: var(--gray-500, #66746e); }
.auth-password-feedback p { margin: 6px 0 0; }
.auth-password-feedback__bars { display: flex; gap: 6px; }
.auth-password-feedback__bars span { flex: 1; height: 4px; border-radius: 4px; background: var(--gray-200, #e1e7e5); }
.auth-password-feedback[data-level=poor] .auth-password-feedback__bars span:first-child { background: #c44444; }
.auth-password-feedback[data-level=medium] .auth-password-feedback__bars span:nth-child(-n+2) { background: #ba7400; }
.auth-password-feedback[data-level=strong] .auth-password-feedback__bars span { background: #007b55; }
.auth-password-match { margin: 8px 0 16px; font-size: 12px; }
.auth-password-match:empty { display: none; }
.auth-password-match[data-state=match] { color: #007b55; }
.auth-password-match[data-state=mismatch] { color: #b93e3e; }

.auth-verification-hint { color: var(--dark, #1c2823); line-height: 1.5; }
.auth-verification-fields {
    --auth-code-border: #73867b;
    --auth-code-background: #f3f8f5;
    --auth-code-ink: #1c2823;
    --auth-code-focus: #007b55;
    --auth-code-error: #b93e3e;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: clamp(8px, 2vw, 16px);
    max-width: 436px;
}
.auth-verification-fields .auth-verification-code-field {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    height: clamp(52px, 5vw, 72px);
    padding: 8px;
    border: 2px solid var(--auth-code-border);
    border-radius: 12px;
    background: var(--auth-code-background);
    color: var(--auth-code-ink);
    font: inherit;
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    caret-color: var(--auth-code-focus);
}
.auth-verification-fields .auth-verification-code-field:focus {
    border-color: var(--auth-code-focus);
    /* Restore focus visibility over the shared input reset. */
    outline: 3px solid var(--auth-code-focus) !important;
    outline-offset: 3px;
}
.auth-verification-fields .auth-verification-code-field[aria-invalid="true"] {
    border-color: var(--auth-code-error);
}
.auth-verification-fields .auth-verification-code-field[aria-invalid="true"]:focus {
    outline-color: var(--auth-code-error) !important;
}
.dark-mode .auth-verification-fields {
    --auth-code-border: #89a89b;
    --auth-code-background: #13261d;
    --auth-code-ink: #edf6f0;
    --auth-code-focus: #78dfb1;
    --auth-code-error: #ffb4ab;
}
@media (max-width: 991.98px) {
    .auth-verification-shell .auth-page-card__mask { right: 0; }
}
@media (max-width: 575.98px) {
    .auth-verification-shell { margin-top: 32px !important; margin-bottom: 32px !important; }
    .auth-verification-shell .auth-page-surface { padding: 12px !important; }
    .auth-verification-shell .js-auth-page-form > div { padding-left: 0 !important; padding-top: 8px !important; }
}