/* Profile card follows the editorial split layout: character in front, data panel behind. */

@media (min-width: 761px) {
  #profileModal .profile-cover-card {
    min-height: 488px !important;
    overflow: visible !important;
  }

  #profileModal .profile-cover-card .profile-cover {
    overflow: hidden !important;
  }

  #profileModal .profile-cover-card .profile-cover::before {
    background: linear-gradient(90deg, rgba(255,255,255,.02) 0 34%, rgba(255,255,255,.08) 52%, rgba(255,255,255,.38) 100%) !important;
  }

  #profileModal .profile-cover-card .avatar-picker-current {
    top: 14px !important;
    bottom: 10px !important;
    left: 2px !important;
    width: 50% !important;
    z-index: 27 !important;
  }

  #profileModal .profile-cover-card .avatar-picker-current > img {
    filter: drop-shadow(0 24px 18px rgba(12, 15, 23, .3)) !important;
  }

  #profileModal .profile-cover-card .profile-summary-card {
    top: 64px !important;
    right: 20px !important;
    bottom: 22px !important;
    left: 42% !important;
    z-index: 17 !important;
    padding: 30px 24px 20px !important;
    border-radius: 26px !important;
    box-shadow: 0 24px 48px rgba(15, 19, 29, .16) !important;
  }

  #profileModal .profile-cover-card .profile-summary-card .profile-name-line {
    gap: 13px !important;
  }

  #profileModal .profile-cover-card .profile-summary-card h2 {
    font-size: clamp(27px, 3.2vw, 36px) !important;
  }

  #profileModal .profile-cover-card .profile-summary-card .profile-details-row {
    padding-top: 17px !important;
  }

  #profileModal .profile-cover-card .avatar-picker-popover {
    z-index: 35 !important;
  }
}

@media (max-width: 760px) {
  #mobileProfileContent .m-profile-hero,
  #mobileProfileContent.is-editing .m-profile-hero {
    min-height: 412px !important;
    height: 412px !important;
  }

  #mobileProfileContent .m-profile-cover::after {
    background: linear-gradient(90deg, rgba(255,255,255,.01) 0 32%, rgba(255,255,255,.1) 58%, rgba(255,255,255,.32) 100%), var(--m-profile-cover) center / cover no-repeat !important;
  }

  #mobileProfileContent .m-profile-avatar-stage {
    top: 14px !important;
    bottom: 8px !important;
    left: -8px !important;
    width: 52% !important;
    z-index: 8 !important;
  }

  #mobileProfileContent .m-profile-main,
  #mobileProfileContent.is-editing .m-profile-main {
    top: 68px !important;
    right: 12px !important;
    bottom: 14px !important;
    left: 42% !important;
    z-index: 5 !important;
    padding: 19px 13px 13px !important;
    border-radius: 22px !important;
    box-shadow: 0 18px 34px rgba(15, 19, 29, .16) !important;
  }

  #mobileProfileContent .m-profile-identity h2,
  #mobileProfileContent.is-editing .m-profile-identity h2 {
    font-size: clamp(22px, 6.2vw, 31px) !important;
  }

  #mobileProfileContent .m-profile-stats span,
  #mobileProfileContent .m-profile-email-stat {
    padding-top: 11px !important;
  }
}