/* Evening palette normalized */
.account-settings-identity {
  flex-wrap: wrap;
}

.account-settings-avatar-preview {
  position: relative;
  flex: 0 0 64px;
  width: 64px !important;
  height: 64px !important;
  overflow: hidden;
  border-radius: 20px !important;
}

.account-settings-avatar-preview img,
.avatar-pair span img,
.pair-account-avatar img,
.pair-result-avatar img,
.pair-invite-people span img,
.couple-settings-card .avatar-pair span img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.account-settings-person {
  min-width: 140px;
  flex: 1 1 180px;
}

.account-settings-identity .account-avatar-help {
  margin-top: 7px;
  color: var(--ui-muted);
  font-size: 14px;
}

.account-avatar-actions {
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  gap: 7px;
}

.account-avatar-input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.account-avatar-actions button {
  min-height: 38px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid var(--ui-line);
  border-radius: 12px;
  color: var(--ui-muted);
  background: var(--ui-solid);
  cursor: pointer;
  font-size: 14px;
  font-weight: 650;
}

.account-avatar-actions button.remove {
  color: var(--ui-danger);
  border-color: var(--ui-line);
  background: var(--ui-solid);
}

.account-avatar-actions button:disabled {
  opacity: .55;
  cursor: wait;
}

.avatar-pair span,
.pair-account-avatar,
.pair-result-avatar,
.pair-invite-people span {
  overflow: hidden;
}

@media (max-width: 560px) {
  .account-settings-identity {
    align-items: flex-start;
  }

  .account-avatar-actions {
    width: 100%;
    padding-left: 76px;
  }

  .account-avatar-actions button {
    flex: 1 1 auto;
  }
}

@media (max-width: 380px) {
  .account-avatar-actions {
    padding-left: 0;
  }
}