.password-visibility-field { position: relative; width: 100%; }
.password-visibility-field .password-visibility-input { width: 100%; padding-right: 3.25rem; }
.password-visibility-toggle {
  position: absolute;
  top: 50%;
  right: .55rem;
  display: grid;
  width: 2.25rem;
  height: 2.25rem;
  place-items: center;
  padding: 0;
  transform: translateY(-50%);
  border: 0;
  border-radius: .65rem;
  background: transparent;
  color: var(--text-tertiary, #8b8796);
  cursor: pointer;
  transition: color .16s ease, background-color .16s ease;
}
.password-visibility-toggle:hover { color: var(--text-primary); background: var(--bg-secondary); }
.password-visibility-toggle:focus-visible { outline: 2px solid var(--brand-primary); outline-offset: 2px; }
.password-visibility-toggle svg { width: 1.2rem; height: 1.2rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
@media (prefers-reduced-motion: reduce) { .password-visibility-toggle { transition: none; } }