/*
 * Universal detail-page geometry.
 *
 * Championship is the visual reference. Every profile detail page uses these
 * final-loaded tokens so module styles cannot change the primary image or
 * connected information-card geometry.
 */

body.profile-page .profile-page:not(.profile-page--championships) {
  --ms-detail-max-width: var(--ms-profile-detail-card-max, 980px);
  --ms-detail-mobile-gutter: 12px;
  --ms-detail-card-radius: 18px;
  --ms-detail-media-radius: 14px;
  --ms-detail-card-padding-block: 16px;
  --ms-detail-card-padding-inline: 24px;
  --ms-detail-card-background: #fff;
  --ms-detail-field-background: #f7f9fc;
  --ms-detail-border: #dfe5ee;
  --ms-detail-text: #111827;
  --ms-detail-muted: #64748b;
  --ms-detail-shadow: 0 16px 40px rgba(15, 23, 42, 0.06);
}

body.profile-page .profile-page {
  --ms-detail-image-aspect-ratio: auto;
  --ms-detail-image-card-padding: 0px;
  --ms-detail-image-shell-background: transparent;
  --ms-detail-image-radius: 18px;
  --ms-detail-video-aspect-ratio: 16 / 9;
}

/* Card previews intentionally crop into their stable feed/timeline frame. */
img.ms-card-preview-media.ms-card-preview-media {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
}

/*
 * Semantic still-image contract. Templates outside the profile shell use the
 * same classes so their primary detail image cannot fall back to a fixed crop.
 */
.ms-detail-image-shell.ms-detail-image-shell:has(img):not(:has(:is(video, iframe, embed, object))) {
  position: relative !important;
  isolation: isolate !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: var(--ms-detail-image-aspect-ratio, auto) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--ms-detail-image-shell-background, transparent) !important;
  border: 0 !important;
  border-radius: var(--ms-detail-image-radius, 18px) !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  backdrop-filter: none !important;
  mix-blend-mode: normal !important;
  line-height: 0 !important;
}

.ms-detail-image-shell.ms-detail-image-shell::before,
.ms-detail-image-shell.ms-detail-image-shell::after {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
  backdrop-filter: none !important;
}

.ms-detail-image-shell.ms-detail-image-shell :is(a, picture) {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: inherit !important;
  line-height: 0 !important;
}

img.ms-detail-image.ms-detail-image,
.ms-detail-image-shell.ms-detail-image-shell img {
  position: relative !important;
  inset: auto !important;
  z-index: 2 !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  backdrop-filter: none !important;
  mix-blend-mode: normal !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
:is(
  .profile-detail-shell,
  .detail-page-shell,
  .module-entry-detail-shell,
  .exercise-drill-detail-shell,
  .game-highlight-detail-shell
) {
  box-sizing: border-box !important;
  width: min(100%, var(--ms-detail-max-width)) !important;
  max-width: var(--ms-detail-max-width) !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(.profile-detail-page, .blog-detail-page) {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  row-gap: 18px !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .profile-detail-title-row,
  .detail-title-row,
  .detail-page-title-row,
  .profile-page-ad-slot
) {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: var(--ms-detail-max-width) !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

/* One white surface contract for media cards and lower information cards. */
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .profile-detail-card,
  .detail-page-card,
  .module-detail-card,
  .module-entry-detail-card,
  .universal-detail-card,
  .exercise-drill-detail-card,
  .game-highlight-detail-card
) {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: var(--ms-detail-max-width) !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding: var(--ms-detail-card-padding-block) var(--ms-detail-card-padding-inline) !important;
  overflow: hidden !important;
  background: var(--ms-detail-card-background) !important;
  border: 0 !important;
  border-radius: var(--ms-detail-card-radius) !important;
  box-shadow: var(--ms-detail-shadow) !important;
}

/* Nested information/action sections belong to their parent white panel. */
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .profile-detail-card,
  .detail-page-card,
  .module-detail-card
) :is(
  .profile-detail-card,
  .detail-page-card,
  .module-detail-card
) {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Connected wrappers combine information, activity, and comments as one card. */
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .training-detail-connected-panel,
  .detail-connected-card,
  .alumni-detail-connected-card,
  .coach-detail-connected-card,
  .honors-detail-connected-card,
  .highlight-detail-connected-bottom-card,
  .athlete-detail-connected-card,
  .podcast-guest-connected-section,
  .staff-detail-connected-card,
  .trainer-detail-connected-card,
  .profile-info-detail-connected-section,
  .recommendation-detail-connected-section
) {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: var(--ms-detail-max-width) !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding: var(--ms-detail-card-padding-block) var(--ms-detail-card-padding-inline) !important;
  overflow: hidden !important;
  background: var(--ms-detail-card-background) !important;
  border: 0 !important;
  border-radius: var(--ms-detail-card-radius) !important;
  box-shadow: var(--ms-detail-shadow) !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .training-detail-connected-panel,
  .detail-connected-card,
  .alumni-detail-connected-card,
  .coach-detail-connected-card,
  .honors-detail-connected-card,
  .highlight-detail-connected-bottom-card,
  .athlete-detail-connected-card,
  .podcast-guest-connected-section,
  .staff-detail-connected-card,
  .trainer-detail-connected-card,
  .profile-info-detail-connected-section,
  .recommendation-detail-connected-section
) > :is(.profile-detail-card, .detail-page-card, .module-detail-card) {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .training-detail-connected-panel,
  .detail-connected-card,
  .alumni-detail-connected-card,
  .coach-detail-connected-card,
  .honors-detail-connected-card,
  .highlight-detail-connected-bottom-card,
  .athlete-detail-connected-card,
  .podcast-guest-connected-section,
  .staff-detail-connected-card,
  .trainer-detail-connected-card,
  .profile-info-detail-connected-section,
  .recommendation-detail-connected-section
) :is(
  .podcast-guest-detail-actions-section,
  [class$="-detail-actions-section"],
  [class*="-detail-actions-section "]
) {
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Primary image cards use Championship's unpadded, transparent media surface. */
body.profile-page .profile-page
.profile-detail-shell :is(
  .profile-detail-card,
  .detail-page-card,
  .module-detail-card
):has(:is(
  .detail-media-frame,
  .blog-detail-media,
  .detail-split-media,
  .media-detail-carousel,
  .training-detail-media-card,
  .watch-detail-player-frame,
  .facility-detail-media-frame,
  .trophy-detail-media,
  .honors-detail-media,
  [class$="-detail-media"],
  [class*="-detail-media "],
  [class$="-media-frame"],
  [class*="-media-frame "],
  [class$="-detail-media-wrap"],
  [class*="-detail-media-wrap "],
  [class$="-detail-image-shell"],
  [class*="-detail-image-shell "]
)) {
  padding: var(--ms-detail-image-card-padding) !important;
  background: var(--ms-detail-image-shell-background) !important;
  border: 0 !important;
  box-shadow: none !important;
}

/*
 * Drill, Exercise, and Workout use an outer media card around the actual
 * image/player. Keep that structural wrapper natural so it cannot restore a
 * fixed crop around the shared Championship-style image shell.
 */
body.profile-page .profile-page
.profile-detail-shell .training-detail-media-card {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: var(--ms-detail-image-radius) !important;
  box-shadow: none !important;
}

/* One Championship-style natural image shell across every detail module. */
body.profile-page .profile-page
.profile-detail-shell :is(
  .championship-detail-image-shell,
  .detail-media-frame,
  .detail-media-shell,
  .blog-detail-media,
  .media-detail-carousel__item,
  .repost-detail-media,
  .highlight-detail-media,
  .highlight-detail-media-frame,
  .watch-detail-player-frame,
  .champ-post-media,
  .trophy-detail-media,
  .honors-detail-media,
  .alumni-detail-photo-col,
  .detail-split-media,
  .team-history-detail-media,
  .parent-info-detail-media,
  .training-detail-media-card,
  .workout-detail-hero-media,
  .exercise-detail-upload-media,
  .facility-detail-media-frame,
  [class$="-detail-media"],
  [class*="-detail-media "],
  [class$="-media-frame"],
  [class*="-media-frame "],
  [class$="-detail-media-wrap"],
  [class*="-detail-media-wrap "],
  [class$="-detail-image-shell"],
  [class*="-detail-image-shell "],
  .group-wall-media-grid:not(.group-wall-media-grid--multi),
  .verified-metric-proof__media
):not(.training-detail-media-card):has(img):not(:has(:is(video, iframe, embed, object))) {
  position: relative !important;
  isolation: isolate !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: var(--ms-detail-image-aspect-ratio) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--ms-detail-image-shell-background) !important;
  border: 0 !important;
  border-radius: var(--ms-detail-image-radius) !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  backdrop-filter: none !important;
  mix-blend-mode: normal !important;
  line-height: 0 !important;
}

body.profile-page .profile-page
.profile-detail-shell :is(
  .championship-detail-image-shell,
  .detail-media-frame,
  .detail-media-shell,
  .blog-detail-media,
  .media-detail-carousel__item,
  .repost-detail-media,
  .highlight-detail-media,
  .highlight-detail-media-frame,
  .watch-detail-player-frame,
  .champ-post-media,
  .trophy-detail-media,
  .honors-detail-media,
  .alumni-detail-photo-col,
  .detail-split-media,
  .team-history-detail-media,
  .parent-info-detail-media,
  .training-detail-media-card,
  .workout-detail-hero-media,
  .exercise-detail-upload-media,
  .facility-detail-media-frame,
  [class$="-detail-media"],
  [class*="-detail-media "],
  [class$="-media-frame"],
  [class*="-media-frame "],
  [class$="-detail-media-wrap"],
  [class*="-detail-media-wrap "],
  [class$="-detail-image-shell"],
  [class*="-detail-image-shell "],
  .group-wall-media-grid:not(.group-wall-media-grid--multi),
  .verified-metric-proof__media
)::before,
body.profile-page .profile-page
.profile-detail-shell :is(
  .championship-detail-image-shell,
  .detail-media-frame,
  .detail-media-shell,
  .blog-detail-media,
  .media-detail-carousel__item,
  .repost-detail-media,
  .highlight-detail-media,
  .highlight-detail-media-frame,
  .watch-detail-player-frame,
  .champ-post-media,
  .trophy-detail-media,
  .honors-detail-media,
  .alumni-detail-photo-col,
  .detail-split-media,
  .team-history-detail-media,
  .parent-info-detail-media,
  .training-detail-media-card,
  .workout-detail-hero-media,
  .exercise-detail-upload-media,
  .facility-detail-media-frame,
  [class$="-detail-media"],
  [class*="-detail-media "],
  [class$="-media-frame"],
  [class*="-media-frame "],
  [class$="-detail-media-wrap"],
  [class*="-detail-media-wrap "],
  [class$="-detail-image-shell"],
  [class*="-detail-image-shell "],
  .group-wall-media-grid:not(.group-wall-media-grid--multi),
  .verified-metric-proof__media
)::after {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
  backdrop-filter: none !important;
}

body.profile-page .profile-page
.profile-detail-shell :is(
  .championship-detail-image-shell,
  .detail-media-frame,
  .detail-media-shell,
  .blog-detail-media,
  .media-detail-carousel__item,
  .repost-detail-media,
  .highlight-detail-media,
  .highlight-detail-media-frame,
  .watch-detail-player-frame,
  .champ-post-media,
  .trophy-detail-media,
  .honors-detail-media,
  .alumni-detail-photo-col,
  .detail-split-media,
  .team-history-detail-media,
  .parent-info-detail-media,
  .training-detail-media-card,
  .workout-detail-hero-media,
  .exercise-detail-upload-media,
  .facility-detail-media-frame,
  [class$="-detail-media"],
  [class*="-detail-media "],
  [class$="-media-frame"],
  [class*="-media-frame "],
  [class$="-detail-media-wrap"],
  [class*="-detail-media-wrap "],
  [class$="-detail-image-shell"],
  [class*="-detail-image-shell "],
  .group-wall-media-grid:not(.group-wall-media-grid--multi),
  .verified-metric-proof__media
):not(.training-detail-media-card):has(img):not(:has(:is(video, iframe, embed, object))) :is(a, picture) {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  background: transparent !important;
  border-radius: inherit !important;
}

body.profile-page .profile-page
.profile-detail-shell :is(
  .championship-detail-image-shell,
  .detail-media-frame,
  .detail-media-shell,
  .blog-detail-media,
  .media-detail-carousel__item,
  .repost-detail-media,
  .highlight-detail-media,
  .highlight-detail-media-frame,
  .watch-detail-player-frame,
  .champ-post-media,
  .trophy-detail-media,
  .honors-detail-media,
  .alumni-detail-photo-col,
  .detail-split-media,
  .team-history-detail-media,
  .parent-info-detail-media,
  .training-detail-media-card,
  .workout-detail-hero-media,
  .exercise-detail-upload-media,
  .facility-detail-media-frame,
  [class$="-detail-media"],
  [class*="-detail-media "],
  [class$="-media-frame"],
  [class*="-media-frame "],
  [class$="-detail-media-wrap"],
  [class*="-detail-media-wrap "],
  [class$="-detail-image-shell"],
  [class*="-detail-image-shell "],
  .group-wall-media-grid:not(.group-wall-media-grid--multi),
  .verified-metric-proof__media
):not(.training-detail-media-card):has(img):not(:has(:is(video, iframe, embed, object))) :is(img, .ms-smart-image--detail) {
  position: relative !important;
  inset: auto !important;
  z-index: 2 !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  backdrop-filter: none !important;
  mix-blend-mode: normal !important;
}

/* The shared detail-image include is authoritative even in legacy wrappers. */
.profile-detail-shell img.ms-smart-image--detail {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  backdrop-filter: none !important;
  mix-blend-mode: normal !important;
}

/* Facilities previously positioned a translucent image over a white layer. */
body.profile-page .profile-page
.profile-detail-shell .facility-detail-media-frame:has(> img.facility-detail-image) {
  position: relative !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  border-radius: var(--ms-detail-image-radius) !important;
  opacity: 1 !important;
  filter: none !important;
}

body.profile-page .profile-page
.profile-detail-shell .facility-detail-media-frame > img.facility-detail-image {
  position: relative !important;
  inset: auto !important;
  z-index: 2 !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  border-radius: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

body.profile-page .profile-page
.profile-detail-shell :is(
  .setup-detail__image,
  .tournament-detail__image,
  .rank-detail__proof,
  .game-account-detail__proof
) {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: var(--ms-detail-image-aspect-ratio) !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

/* Video players retain a stable player ratio even when they have a poster. */
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .detail-media-frame,
  .detail-media-shell,
  .blog-detail-media,
  .media-detail-carousel__item,
  .repost-detail-media,
  .highlight-detail-media,
  .highlight-detail-media-frame,
  .watch-detail-player-frame,
  .champ-post-media,
  .trophy-detail-media,
  .honors-detail-media,
  .alumni-detail-photo-col,
  .detail-split-media,
  .team-history-detail-media,
  .parent-info-detail-media,
  .workout-detail-hero-media,
  .exercise-detail-upload-media,
  .facility-detail-media-frame,
  [class$="-detail-media"],
  [class*="-detail-media "],
  [class$="-media-frame"],
  [class*="-media-frame "],
  [class$="-detail-media-wrap"],
  [class*="-detail-media-wrap "],
  [class$="-detail-image-shell"],
  [class*="-detail-image-shell "],
  .group-wall-media-grid:not(.group-wall-media-grid--multi),
  .verified-metric-proof__media
):not(.training-detail-media-card):has(:is(video, iframe, embed, object)) {
  position: relative !important;
  isolation: isolate !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: var(--ms-detail-video-aspect-ratio) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #0f172a !important;
  border: 0 !important;
  border-radius: var(--ms-detail-image-radius) !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  backdrop-filter: none !important;
  mix-blend-mode: normal !important;
  line-height: 0 !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .detail-media-frame,
  .detail-media-shell,
  .blog-detail-media,
  .media-detail-carousel__item,
  .repost-detail-media,
  .highlight-detail-media,
  .highlight-detail-media-frame,
  .watch-detail-player-frame,
  .champ-post-media,
  .trophy-detail-media,
  .honors-detail-media,
  .alumni-detail-photo-col,
  .detail-split-media,
  .team-history-detail-media,
  .parent-info-detail-media,
  .workout-detail-hero-media,
  .exercise-detail-upload-media,
  .facility-detail-media-frame,
  [class$="-detail-media"],
  [class*="-detail-media "],
  [class$="-media-frame"],
  [class*="-media-frame "],
  [class$="-detail-media-wrap"],
  [class*="-detail-media-wrap "],
  [class$="-detail-image-shell"],
  [class*="-detail-image-shell "]
):not(.training-detail-media-card):has(:is(video, iframe, embed, object)) :is(
  .ms-external-media__frame,
  .workout-detail-hero-preview,
  .workout-detail-hero-player,
  .workout-detail-hero-embed,
  .blog-detail-embed
) {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .detail-media-frame,
  .detail-media-shell,
  .blog-detail-media,
  .media-detail-carousel__item,
  .repost-detail-media,
  .highlight-detail-media,
  .highlight-detail-media-frame,
  .watch-detail-player-frame,
  .champ-post-media,
  .trophy-detail-media,
  .honors-detail-media,
  .alumni-detail-photo-col,
  .detail-split-media,
  .team-history-detail-media,
  .parent-info-detail-media,
  .workout-detail-hero-media,
  .exercise-detail-upload-media,
  .facility-detail-media-frame,
  [class$="-detail-media"],
  [class*="-detail-media "],
  [class$="-media-frame"],
  [class*="-media-frame "],
  [class$="-detail-media-wrap"],
  [class*="-detail-media-wrap "],
  [class$="-detail-image-shell"],
  [class*="-detail-image-shell "]
):not(.training-detail-media-card):has(:is(video, iframe, embed, object)) img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: cover !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .detail-media-frame,
  .detail-media-shell,
  .blog-detail-media,
  .media-detail-carousel__item,
  .repost-detail-media,
  .highlight-detail-media,
  .highlight-detail-media-frame,
  .watch-detail-player-frame,
  .champ-post-media,
  .trophy-detail-media,
  .honors-detail-media,
  .alumni-detail-photo-col,
  .detail-split-media,
  .team-history-detail-media,
  .parent-info-detail-media,
  .training-detail-media-card,
  .workout-detail-hero-media,
  .exercise-detail-upload-media,
  .facility-detail-media-frame,
  [class$="-detail-media"],
  [class*="-detail-media "],
  [class$="-media-frame"],
  [class*="-media-frame "],
  [class$="-detail-image-shell"],
  [class*="-detail-image-shell "]
) :is(video, iframe, embed, object) {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: inherit !important;
  object-fit: cover !important;
  object-position: center !important;
  background: #0f172a !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Fallbacks sit behind valid media instead of washing it out. */
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .media-detail-fallback,
  .events-detail-media-fallback,
  .facility-detail-media-fallback,
  .championship-detail-media-fallback
) {
  z-index: 1 !important;
  opacity: 1;
  filter: none !important;
  backdrop-filter: none !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .detail-media-frame,
  .blog-detail-media,
  .detail-split-media,
  .facility-detail-media-frame
):not(:has(:is(img, video, iframe, embed, object))) {
  min-height: 220px !important;
}

/* Shared label/value hierarchy for every lower information section. */
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .detail-field-label,
  .detail-data-label,
  .module-detail-label,
  .universal-detail-label,
  .detail-meta-label,
  .championship-info-label,
  .food-journal-detail-info-label,
  .event-summary-meta-label,
  .training-detail-meta-label
) {
  display: block !important;
  margin: 0 0 4px !important;
  color: var(--ms-detail-muted) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell :is(
  .detail-field-value,
  .detail-data-value,
  .module-detail-value,
  .universal-detail-value,
  .detail-meta-value,
  .championship-info-value,
  .food-journal-detail-info-value,
  .event-summary-meta-value,
  .training-detail-meta-value
) {
  margin: 0 !important;
  color: var(--ms-detail-text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

/* Activity and comments use the same lower-card spacing as Championship. */
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .universal-detail-actions {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .universal-detail-actions :is(
  .uda-activity-bar,
  .uda-comments-block,
  .uda-comment-list,
  .uda-comment-empty
) {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .universal-detail-actions .uda-activity-bar {
  min-height: 48px !important;
  padding: 10px 0 0 !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .universal-detail-actions .uda-comments-block {
  padding: 8px 0 0 !important;
}

/*
 * Connected information cards already place their title, fields, and actions
 * on the shared detail-info gutter. Do not add a second inset to the wrapper.
 */
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .detail-connected-layout {
  padding: 0 !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .detail-connected-layout > .detail-connected-content {
  padding-right: var(--ms-detail-info-inline-pad, var(--ms-detail-card-padding-inline)) !important;
  padding-left: var(--ms-detail-info-inline-pad, var(--ms-detail-card-padding-inline)) !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .detail-connected-layout
.universal-detail-actions.uda-season-template > :is(
  .uda-activity-bar,
  .uda-comments-block,
  .uda-section
) {
  padding-right: var(--ms-detail-info-inline-pad, var(--ms-detail-card-padding-inline)) !important;
  padding-left: var(--ms-detail-info-inline-pad, var(--ms-detail-card-padding-inline)) !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .universal-detail-actions .uda-activity-actions {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  min-width: 0 !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .universal-detail-actions .uda-action-count {
  gap: 6px !important;
  min-width: 0 !important;
  min-height: 28px !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .universal-detail-actions .uda-composer {
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  gap: 8px !important;
  margin: 10px 0 0 !important;
  padding: 3px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid #d1d5db !important;
  border-radius: 999px !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .universal-detail-actions .uda-composer input {
  flex: 1 1 auto !important;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .universal-detail-actions .uda-post-btn {
  flex: 0 0 auto !important;
  min-width: 56px !important;
}

/* Keep shared previous/next navigation as small controls over the thumbnail. */
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .detail-nav-thumbnail-target {
  position: relative !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .detail-nav-host--on-thumbnail {
  position: absolute !important;
  inset: 0 !important;
  z-index: 20 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  pointer-events: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .detail-nav-host--on-thumbnail .detail-nav-arrow {
  position: absolute !important;
  top: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 !important;
  transform: translateY(-50%) !important;
  pointer-events: auto !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  border-radius: 50% !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.14) !important;
  opacity: 1 !important;
}

@media (max-width: 1024px) {
  body.profile-page .profile-page:not(.profile-page--championships) {
    --ms-detail-card-radius: 16px;
    --ms-detail-media-radius: 12px;
    --ms-detail-card-padding-block: 14px;
    --ms-detail-card-padding-inline: 14px;
  }

  body.profile-page .profile-page:not(.profile-page--championships)
  :is(
    .profile-detail-shell,
    .detail-page-shell,
    .module-entry-detail-shell,
    .exercise-drill-detail-shell,
    .game-highlight-detail-shell
  ) {
    width: calc(100% - (var(--ms-detail-mobile-gutter) * 2)) !important;
    max-width: none !important;
    margin-right: var(--ms-detail-mobile-gutter) !important;
    margin-left: var(--ms-detail-mobile-gutter) !important;
  }

  body.profile-page .profile-page:not(.profile-page--championships)
  .profile-detail-shell :is(
    .profile-detail-card,
    .detail-page-card,
    .module-detail-card,
    .module-entry-detail-card,
    .universal-detail-card,
    .exercise-drill-detail-card,
    .game-highlight-detail-card,
    .training-detail-connected-panel,
    .detail-connected-card,
    .alumni-detail-connected-card,
    .coach-detail-connected-card,
    .honors-detail-connected-card,
    .highlight-detail-connected-bottom-card,
    .athlete-detail-connected-card,
    .podcast-guest-connected-section,
    .staff-detail-connected-card,
    .trainer-detail-connected-card,
    .profile-info-detail-connected-section,
    .recommendation-detail-connected-section
  ) {
    max-width: none !important;
  }

  body.profile-page .profile-page:not(.profile-page--championships)
  .profile-detail-shell :is(
    .profile-detail-card,
    .detail-page-card,
    .module-detail-card
  ):has(:is(
    .detail-media-frame,
    .blog-detail-media,
    .detail-split-media,
    .media-detail-carousel,
    .training-detail-media-card,
    .watch-detail-player-frame,
    .facility-detail-media-frame,
    .trophy-detail-media,
    .honors-detail-media,
    [class$="-detail-media"],
    [class*="-detail-media "],
    [class$="-media-frame"],
    [class*="-media-frame "]
  )) {
    padding: var(--ms-detail-image-card-padding) !important;
    background: var(--ms-detail-image-shell-background) !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  body.profile-page .profile-page:not(.profile-page--championships)
  .profile-detail-shell .profile-page-ad-slot {
    margin-top: 16px !important;
    margin-bottom: 16px !important;
    border-radius: var(--ms-detail-card-radius) !important;
    overflow: hidden !important;
  }
}

@media (max-width: 359px) {
  body.profile-page .profile-page:not(.profile-page--championships)
  .profile-detail-shell :is(
    .detail-field-grid,
    .detail-data-grid,
    .module-detail-grid,
    .universal-detail-grid,
    .championship-info-grid,
    .food-journal-detail-info-grid
  ) {
    grid-template-columns: 1fr !important;
  }
}

/*
 * The uploader header and primary media form one connected card. Keep the
 * header's outer top corners rounded, but make the header-to-media seam square.
 */
body.profile-page .profile-page
:is(.profile-detail-shell, .detail-page-shell)
.detail-media-card {
  --ms-detail-image-radius: 0 0 var(--ms-standard-detail-card-radius, var(--ms-detail-card-radius, 18px)) var(--ms-standard-detail-card-radius, var(--ms-detail-card-radius, 18px));
}

body.profile-page .profile-page
:is(.profile-detail-shell, .detail-page-shell)
.detail-media-card > .detail-media-card__uploader ~ *,
body.profile-page .profile-page
:is(.profile-detail-shell, .detail-page-shell)
.detail-media-card > .detail-media-card__uploader ~ * :is(
  a,
  picture,
  .ms-detail-image-shell,
  .championship-detail-image-shell,
  .detail-media-shell,
  .detail-media-frame,
  img,
  video,
  iframe,
  embed,
  object
) {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}

body.profile-page .profile-page
:is(.profile-detail-shell, .detail-page-shell)
.detail-media-card > .detail-media-card__uploader + :is(
  .ms-detail-image-shell,
  .championship-detail-image-shell,
  .detail-media-shell,
  .detail-media-frame
),
body.profile-page .profile-page
:is(.profile-detail-shell, .detail-page-shell)
.detail-media-card > .detail-media-card__uploader + :is(
  .ms-detail-image-shell,
  .championship-detail-image-shell,
  .detail-media-shell,
  .detail-media-frame
) > :is(a, picture, img, video, iframe, embed, object) {
  border-radius: 0 0 var(--ms-standard-detail-card-radius, var(--ms-detail-image-radius, 18px)) var(--ms-standard-detail-card-radius, var(--ms-detail-image-radius, 18px)) !important;
}

/*
 * Single-gutter lower detail cards.
 *
 * Legacy module styles sometimes add horizontal padding to both the shared
 * white card and an invisible child wrapper. Keep each card's visible field
 * boxes and responsive grids intact, but remove that duplicate wrapper inset
 * so headings, fields, body copy, engagement, comments, and the composer use
 * one common content line.
 */
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .detail-connected-layout
.detail-connected-content .detail-connected-content,
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .hof-detail-connected-card > .hof-detail-info-section,
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .athlete-detail-connected-card > :is(
  .athlete-detail-info-section,
  .athlete-detail-activity-card
),
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .ath-media-detail-lower-card > .ath-media-info-section,
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .article-post-card--media-interaction .media-detail-under-media-copy,
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .blog-detail-interaction-card > .blog-detail-copy,
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .events-detail-info-card > .events-detail-info-section,
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .watch-detail-summary-card > .watch-detail-summary-description {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell:is(.detail-page-shell--drill, .detail-page-shell--exercise)
.training-detail-title-row,
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .drill-detail-clean-interaction > .training-detail-section,
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell .exercise-detail-clean-interaction .exercise-breakdown-section {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell.detail-page-shell--exercise
.exercise-detail-clean-interaction > .training-detail-breakdown-card {
  padding: 0 !important;
}

body.profile-page .profile-page--championships
.championship-detail-connected-card {
  --ms-championship-detail-info-inline-pad: 24px;
}

body.profile-page .profile-page--championships
.championship-detail-connected-card
.universal-detail-actions.uda-season-template > :is(
  .uda-activity-bar,
  .uda-comments-block,
  .uda-section
) {
  padding-right: var(--ms-championship-detail-info-inline-pad) !important;
  padding-left: var(--ms-championship-detail-info-inline-pad) !important;
}

@media (max-width: 1024px) {
  body.profile-page .profile-page--championships
  .championship-detail-connected-card {
    --ms-championship-detail-info-inline-pad: 12px;
  }
}

/* Drill and exercise content must not be clipped by a second inner radius. */
body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell:is(.detail-page-shell--drill, .detail-page-shell--exercise)
.training-detail-info-body {
  overflow: visible !important;
  border-radius: 0 !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell.detail-page-shell--drill
.drill-detail-info-grid {
  gap: 14px !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell.detail-page-shell--drill
.drill-information-card .training-detail-header-block {
  margin-bottom: 2px !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell.detail-page-shell--drill
.drill-detail-info-grid .exercise-detail-info-row {
  column-gap: 40px !important;
  row-gap: 14px !important;
}

body.profile-page .profile-page:not(.profile-page--championships)
.profile-detail-shell.detail-page-shell--drill
.drill-detail-info-grid :is(
  .training-detail-meta-cell,
  .workout-detail-fact-card
) {
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/*
 * Story-origin posts use a 9:16 canvas in the Story viewer. On the Media
 * detail page, show the same source image/video geometry used by Album detail
 * instead of centering that portrait canvas inside the connected media card.
 */
body.profile-page .profile-page
.detail-page-shell--media .detail-media-card > .media-story-composition-stage {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: var(--ms-standard-detail-card-radius, var(--ms-detail-card-radius, 18px)) !important;
  border-bottom-left-radius: var(--ms-standard-detail-card-radius, var(--ms-detail-card-radius, 18px)) !important;
  box-shadow: none !important;
  line-height: 0 !important;
}

body.profile-page .profile-page
.detail-page-shell--media .detail-media-card > .media-story-composition-stage > :is(
  .media-story-composition,
  .timeline-story-design
) {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: inherit !important;
  box-shadow: none !important;
}

body.profile-page .profile-page
.detail-page-shell--media .detail-media-card > .media-story-composition-stage > :is(
  .media-story-composition,
  .timeline-story-design
) > :is(
  img.media-story-composition__asset,
  video.media-story-composition__asset,
  img.timeline-story-design__image,
  video.timeline-story-design__image
) {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: inherit !important;
  transform: none !important;
}