.password-field { position: relative; width: 100%; min-width: 0; }
/* Adorno compartilhado: reserva o olho também sob os seletores legados/mobile. */
.password-field input { display: block; width: 100%; padding-right: 3.5rem !important; margin-bottom: 0; }
.login-container .password-field { margin-bottom: 1.25rem; }
.password-field .password-toggle {
    position: absolute; top: 50%; right: .25rem; transform: translateY(-50%);
    display: grid; place-items: center; width: 44px; height: 44px; min-height: 44px;
    /* O alvo fixo de 44px não deve comprimir o SVG ao ampliar os textos. */
    padding: 10px; margin: 0; border: 0; border-radius: .5rem;
    color: var(--ui-muted); background: transparent; box-shadow: none; cursor: pointer;
}
.password-field .password-toggle:hover { transform: translateY(-50%); background: var(--ui-raised); box-shadow: none; color: var(--ui-text); }
.password-field .password-toggle:active { transform: translateY(-50%); }
.password-field .password-toggle:focus-visible { outline: 3px solid var(--ui-focus); outline-offset: 0; }
.password-toggle svg { width: 24px; height: 24px; max-width: none; }
.auth-form .input-group label { display: block; text-align: left; margin-bottom: .5rem; color: var(--ui-text); }
.auth-field-error { display: block; color: var(--ui-danger); text-align: left; font-size: .875rem; overflow-wrap: anywhere; }
.auth-field-error:not(:empty) { margin: .25rem 0 .5rem; }
.login-container p.auth-form-status, .auth-form-status { color: var(--ui-text); text-align: left; margin: .5rem 0; min-height: 1.5em; font-size: .875rem; overflow-wrap: anywhere; }
.auth-password-hint { display: block; text-align: left; color: var(--ui-muted); font-size: .875rem; margin: .4rem 0; }