/* Public profile identity is intentionally split into two independent boxes:
   the name sits beside the portrait, while About spans the page rail below. */
.public-profile-page .public-profile-identity {
  align-items: flex-start !important;
  gap: 16px !important;
}

.public-profile-page .public-profile-identity-copy {
  display: grid !important;
  align-content: end;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
  width: auto !important;
  margin-top: var(--public-avatar-overlap-size) !important;
  padding: 12px 16px !important;
  border: 1px solid rgba(22, 53, 71, .14) !important;
  border-radius: 14px !important;
  background: rgba(255, 253, 249, .82) !important;
  box-shadow: 0 8px 20px rgba(22, 53, 71, .07) !important;
}

.public-profile-page .public-profile-identity-copy > .public-profile-name-line {
  order: 0;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.public-profile-page #publicProfileAbout.public-profile-identity-about-box {
  width: min(var(--profile-content-max-width), calc(100% - 32px)) !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 18px 20px !important;
  border: 1px solid rgba(22, 53, 71, .14) !important;
  border-radius: 14px !important;
  background: rgba(255, 253, 249, .82) !important;
  box-shadow: 0 8px 20px rgba(22, 53, 71, .07) !important;
  text-align: inherit;
}

.public-profile-page #publicProfileAbout.public-profile-identity-about-box > h2 {
  margin: 0 0 3px !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: 0.78rem !important;
}

.public-profile-page #publicProfileAbout.public-profile-identity-about-box > #publicProfileAboutText {
  margin: 0 !important;
  font-size: .92rem;
  line-height: 1.45;
}

@media (max-width: 700px) {
  .public-profile-page .public-profile-identity {
    gap: 11px !important;
  }
  .public-profile-page .public-profile-identity-copy {
    margin-top: var(--public-avatar-overlap-size) !important;
    padding: 10px 12px !important;
  }
  .public-profile-page #publicProfileAbout.public-profile-identity-about-box {
    width: calc(100% - 20px) !important;
    padding: 14px 15px !important;
  }
}
