/* Customer avatars only. Assistant portraits and brand artwork are unchanged. */
html body .hw-user-avatar,
html body #sidebarAccountAvatar.hw-user-avatar,
html body #accountPreviewAvatar.hw-user-avatar,
html body #settingsProfileAvatar.hw-user-avatar {
  width: var(--hardask-user-avatar-size, 32px) !important;
  height: var(--hardask-user-avatar-size, 32px) !important;
  min-width: var(--hardask-user-avatar-size, 32px) !important;
  min-height: var(--hardask-user-avatar-size, 32px) !important;
  max-width: var(--hardask-user-avatar-size, 32px) !important;
  max-height: var(--hardask-user-avatar-size, 32px) !important;
  inline-size: var(--hardask-user-avatar-size, 32px) !important;
  block-size: var(--hardask-user-avatar-size, 32px) !important;
  min-inline-size: var(--hardask-user-avatar-size, 32px) !important;
  min-block-size: var(--hardask-user-avatar-size, 32px) !important;
  max-inline-size: var(--hardask-user-avatar-size, 32px) !important;
  max-block-size: var(--hardask-user-avatar-size, 32px) !important;
  flex: 0 0 var(--hardask-user-avatar-size, 32px) !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  background-image: none !important;
  padding: 0 !important;
  overflow: hidden !important;
  object-fit: cover !important;
  transform: none !important;
  filter: none !important;
}
html body .hw-user-avatar::before,
html body .hw-user-avatar::after,
html body .hw-user-avatar-frame::before,
html body .hw-user-avatar-frame::after,
html body .user-settings-avatar-button::after,
html body .user-settings-avatar-button > span {
  display: none !important;
  content: none !important;
}
html body .hw-user-avatar > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  border-radius: 50% !important;
  padding: 0 !important;
  object-fit: cover !important;
  transform: none !important;
  filter: none !important;
  box-shadow: none !important;
}
html body .hw-user-avatar-frame,
html body .user-settings-avatar-button,
html body .engineer-dossier-avatar,
html body .engineer-avatar,
html body .growth-archive-avatar {
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
  overflow: hidden;
}
html body .user-settings-avatar-button {
  width: 64px !important;
  height: 64px !important;
  min-width: 64px !important;
  flex: 0 0 64px !important;
}
html body .hw-user-avatar:focus-visible,
html body .user-settings-avatar-button:focus-visible {
  outline: 2px solid var(--accent, #df776a);
  outline-offset: 3px;
}
.account-name-edit { margin-top: 20px; max-width: 540px; }
.account-name-edit[hidden] { display: none; }
.account-name-edit-row { display: flex; gap: 10px; align-items: center; margin-top: 8px; }
.account-name-edit-row input { flex: 1; min-width: 0; }
.account-name-edit p { min-height: 1.4em; margin: 8px 0 0; }
#hardaskAccountEmailChange form { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 12px; }
#hardaskAccountEmailChange form[hidden] { display: none; }
#hardaskAccountEmailChange label { display: grid; flex-basis: 100%; gap: 8px; min-width: 0; }
#hardaskAccountEmailChange label[hidden] { display: none; }
#hardaskAccountEmailChange input { min-width: 0; width: 100%; box-sizing: border-box; }
#hardaskAccountEmailChange button { max-width: 100%; white-space: normal; }
@media (max-width: 480px) {
  .account-name-edit-row { flex-wrap: wrap; }
  .account-name-edit-row input { flex-basis: 100%; }
}