@media (min-width: 1181px) {
  .shell .rt-option-a-stage .status-grid {
    transform: translateX(-42px) !important;
    justify-self: end !important;
  }
}

@media (max-width: 1180px) {
  .shell .rt-option-a-stage .status-grid {
    transform: none !important;
  }
}



@media (min-width: 1181px) {
  .shell .rt-option-a-stage .audio-card {
    transform: translateX(-24px) !important;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
    padding: 0 !important;
    z-index: 2 !important;
  }

  .shell .rt-option-a-stage .rt-premium-player {
    position: relative !important;
    z-index: 2 !important;
  }

  .shell .rt-option-a-stage .social-stack,
  .shell .rt-option-a-stage .social-single-row-wrap {
    transform: translateX(-78px) !important;
    position: relative !important;
    z-index: 3 !important;
    overflow: visible !important;
  }

  .shell .rt-option-a-stage .social-single-row {
    position: relative !important;
    z-index: 4 !important;
    overflow: visible !important;
  }

  .shell .rt-option-a-stage .status-grid {
    position: relative !important;
    z-index: 8 !important;
  }

  .shell .rt-option-a-stage .status-grid .metric,
  .shell .rt-option-a-stage .status-grid .rt-network-listeners-card {
    position: relative !important;
    z-index: 9 !important;
  }
}

@media (max-width: 1180px) {
  .shell .rt-option-a-stage .audio-card,
  .shell .rt-option-a-stage .social-stack,
  .shell .rt-option-a-stage .social-single-row-wrap {
    transform: none !important;
  }
}



@media (min-width: 901px) {
  .shell .rt-option-a-stage .status-grid .now-layout {
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 14px !important;
  }

  .shell .rt-option-a-stage #rtArtworkBox,
  .shell .rt-option-a-stage .artbox {
    width: 72px !important;
    height: 72px !important;
    min-width: 72px !important;
    max-width: 72px !important;
    flex: 0 0 72px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
  }

  .shell .rt-option-a-stage #rtArtwork {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
  }
}

@media (max-width: 900px) {
  .shell .rt-option-a-stage #rtArtworkBox,
  .shell .rt-option-a-stage .artbox {
    width: 60px !important;
    height: 60px !important;
    min-width: 60px !important;
    max-width: 60px !important;
    flex: 0 0 60px !important;
  }
}



@media (min-width: 1181px) {
  .shell .rt-option-a-stage .hero-block {
    transform: translateX(-28px) !important;
  }
}

@media (max-width: 1180px) {
  .shell .rt-option-a-stage .hero-block {
    transform: none !important;
  }
}



.shell .rt-option-a-stage .rt-premium-player__meter {
  display: inline-flex !important;
  align-items: end !important;
  justify-content: center !important;
  gap: 4px !important;
  min-height: 28px !important;
  overflow: hidden !important;
}

.shell .rt-option-a-stage .rt-premium-player__bar {
  display: inline-block !important;
  width: 5px !important;
  min-height: 8px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #fff3a8, #f6b935) !important;
  opacity: .78 !important;
  transform-origin: bottom center !important;
}

.shell .rt-option-a-stage .rt-premium-player__bar:nth-child(1) {
  height: 12px !important;
}

.shell .rt-option-a-stage .rt-premium-player__bar:nth-child(2) {
  height: 20px !important;
}

.shell .rt-option-a-stage .rt-premium-player__bar:nth-child(3) {
  height: 26px !important;
}

.shell .rt-option-a-stage .rt-premium-player__bar:nth-child(4) {
  height: 16px !important;
}

.shell .rt-option-a-stage .rt-premium-player.is-playing .rt-premium-player__bar:nth-child(1),
.shell .rt-option-a-stage .rt-premium-player__bar:nth-child(1) {
  animation: rtPlayerBars 1.0s ease-in-out infinite !important;
}

.shell .rt-option-a-stage .rt-premium-player.is-playing .rt-premium-player__bar:nth-child(2),
.shell .rt-option-a-stage .rt-premium-player__bar:nth-child(2) {
  animation: rtPlayerBars 1.1s ease-in-out infinite .12s !important;
}

.shell .rt-option-a-stage .rt-premium-player.is-playing .rt-premium-player__bar:nth-child(3),
.shell .rt-option-a-stage .rt-premium-player__bar:nth-child(3) {
  animation: rtPlayerBars .9s ease-in-out infinite .22s !important;
}

.shell .rt-option-a-stage .rt-premium-player.is-playing .rt-premium-player__bar:nth-child(4),
.shell .rt-option-a-stage .rt-premium-player__bar:nth-child(4) {
  animation: rtPlayerBars 1.2s ease-in-out infinite .08s !important;
}


.rt-option-a-stage .artbox,
.rt-option-a-stage #rtArtworkBox {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 35% 20%, rgba(255, 216, 106, .22), transparent 42%),
    linear-gradient(135deg, rgba(8, 26, 48, .96), rgba(3, 10, 24, .98)) !important;
}

.rt-option-a-stage #rtArtwork {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

@media (max-width: 760px) {
  .rt-option-a-stage,
  .rt-option-a-stage .hero-block,
  .rt-option-a-stage .status-grid,
  .rt-option-a-stage .metric,
  .rt-option-a-stage .now-card {
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  .rt-option-a-stage .now-layout {
    grid-template-columns: 72px minmax(0, 1fr) !important;
  }

  .rt-option-a-stage #rtArtworkBox,
  .rt-option-a-stage .artbox {
    width: 72px !important;

    min-width: 72px !important;
  }
}

.rt-quick-nav {
  margin-top: 12px !important;
  margin-bottom: 14px !important;
  padding: 8px 10px !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: none !important;
}
.rt-quick-nav a {
  min-height: 28px !important;
  padding: 5px 12px !important;
  font-size: .86rem !important;
  line-height: 1.1 !important;
}
@media (max-width: 720px) {
  .rt-quick-nav {
    gap: 7px !important;
    justify-content: center !important;
  }
  .rt-quick-nav a {
    min-height: 34px !important;
    padding: 8px 11px !important;
  }
}





/* Visible outer radio frame only */
.shell {
  width: min(1120px, 92vw) !important;
  max-width: 1120px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Inner content follows shell, but is not hard-forced into new alignment lanes */
.shell > .content {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* Prevent overflow without changing natural widths/alignment */
.shell .rt-option-a-stage,
.shell .hero-block,
.shell .audio-card,
.shell .rt-premium-player,
.shell .embed,
.shell .embed-collapsed,
.shell .rt-quick-nav,
.shell #rtStations,
.shell #rtSchedule,
.shell .support-grid,
.shell .rt-station-info,
.shell .rt-pro-page-links {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* Important: do not force .footer or footer to width:100%.
   That caused the lower RadioTrumpet Pages/footer lane shift. */

/* Media inside the radio frame must not force horizontal overflow */
.shell img,
.shell iframe,
.shell audio,
.shell video,
.shell canvas,
.shell textarea {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Keep desktop/tablet frame aligned with the top public box */
@media (max-width: 1180px) {
  .shell {
    width: calc(100% - 40px) !important;
    max-width: calc(100% - 40px) !important;
  }
}

/* Mobile frame fit */
@media (max-width: 720px) {
  .shell {
    width: calc(100% - 20px) !important;
    max-width: calc(100% - 20px) !important;
  }

  .shell > .content {
    max-width: 100% !important;
    min-width: 0 !important;
  }
}





@media (max-width: 1180px) {
  .shell .rt-option-a-stage {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "hero"
      "status"
      "actions"
      "audio"
      "social" !important;
    gap: 14px !important;
    padding: clamp(24px, 3vw, 34px) !important;
    overflow: hidden !important;
  }

  .shell .rt-option-a-stage::after {
    left: 78% !important;
    top: 22% !important;
    opacity: 0.25 !important;
  }

  .shell .rt-option-a-stage .hero-block,
  .shell .rt-option-a-stage .hero-title {
    max-width: 760px !important;
  }

  .shell .rt-option-a-stage .audio-card,
  .shell .rt-option-a-stage .social-stack {
    width: 100% !important;
    max-width: 760px !important;
    min-width: 0 !important;
    justify-self: start !important;
    box-sizing: border-box !important;
  }

  .shell .rt-option-a-stage .status-grid {
    grid-area: status !important;
    width: 100% !important;
    max-width: 760px !important;
    min-width: 0 !important;
    justify-self: start !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 14px !important;
    margin: 12px 0 0 !important;
    box-sizing: border-box !important;
  }

  .shell .rt-option-a-stage .status-grid .metric,
  .shell .rt-option-a-stage .status-grid .now-card,
  .shell .rt-option-a-stage .status-grid .rt-network-listeners-card {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .shell .rt-option-a-stage .social-single-row {
    width: 100% !important;
    max-width: 100% !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
  }
}

@media (max-width: 650px) {
  .shell .rt-option-a-stage {
    padding: 22px !important;
    border-radius: 14px !important;
  }

  .shell .rt-option-a-stage::before,
  .shell .rt-option-a-stage::after {
    display: none !important;
  }

  .shell .rt-option-a-stage .status-grid {
    grid-template-columns: 1fr !important;
    max-width: 100% !important;
  }

  .shell .rt-option-a-stage .audio-card,
  .shell .rt-option-a-stage .social-stack {
    max-width: 100% !important;
  }
}