.password-dialog {
  width: min(420px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 0;
  border: 1px solid #e2e8ef;
  border-radius: 8px;
  background: #fff;
  color: #172735;
  box-shadow: 0 28px 76px rgba(20, 38, 65, .22);
}
.password-dialog::backdrop { background: rgba(20, 35, 54, .52); }
.password-dialog__form { padding: 28px; }
.password-dialog__head { display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.password-dialog__title { margin: 0; font-size: 22px; line-height: 1.3; font-weight: 650; }
.password-dialog__close, .password-dialog__toggle {
  display: inline-grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: #647587;
  cursor: pointer;
}
.password-dialog__close { width: 32px; height: 32px; padding: 0; }
.password-dialog__close:hover, .password-dialog__toggle:hover { color: #205bc1; }
.password-dialog__note { margin: 8px 0 24px; color: #627181; font-size: 13px; line-height: 1.5; }
.password-dialog__field { display: block; margin-top: 16px; font-size: 14px; font-weight: 550; }
.password-dialog__input-wrap { position: relative; display: block; margin-top: 8px; }
.password-dialog__input {
  display: block;
  width: 100%;
  height: 44px;
  box-sizing: border-box;
  padding: 0 45px 0 12px;
  border: 1px solid #ccd5df;
  border-radius: 6px;
  outline: none;
  background: #fff;
  color: #172735;
  font: inherit;
}
.password-dialog__input:focus { border-color: #246bdb; box-shadow: 0 0 0 3px rgba(36, 107, 219, .12); }
.password-dialog__input::placeholder { color: #8b98a7; font-weight: 400; }
.password-dialog__toggle { position: absolute; right: 5px; top: 5px; width: 34px; height: 34px; padding: 0; }
.password-dialog__toggle svg, .password-dialog__close svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  pointer-events: none;
}
.password-dialog__toggle[aria-pressed="true"] [data-password-eye-slash] { display: none; }
.password-dialog__close:focus-visible, .password-dialog__toggle:focus-visible {
  outline: 2px solid #246bdb;
  outline-offset: 2px;
  border-radius: 4px;
}
.password-dialog__message { min-height: 20px; margin: 15px 0 0; font-size: 13px; line-height: 1.5; }
.password-dialog__message[data-kind="error"] { color: #bb3344; }
.password-dialog__message[data-kind="success"] { color: #187356; }
.password-dialog__submit {
  display: block;
  width: 100%;
  height: 44px;
  margin-top: 12px;
  border: 0;
  border-radius: 6px;
  background: #246bdb;
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
.password-dialog__submit:hover { background: #1d59b8; }
.password-dialog__submit:disabled { opacity: .65; cursor: default; }
@media (max-width: 480px) {
  .password-dialog__form { padding: 24px 20px; }
}
