/* JUX FM – proportional layout based on the user-supplied official
   GreuDeDifuzat archive (29 October 2026).
   Reference: 90px heading (45px mobile), 500px player, 101px play
   control, 500x100px current-track panel (80% mobile), margins 20px,
   100vh central stage with the footer after the stage.
   This stylesheet deliberately does NOT modify radio streams, menus,
   station branding, background, glass surfaces or Javascript. */

body.jux-home {
  --jux-home-footer-reserve: 0px;
  overflow-x: clip !important;
  overflow-y: auto !important;
  touch-action: pan-y pinch-zoom;
}
body.jux-home .page .container .content .section_player {
  min-height: 100svh !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap {
  height: auto !important;
  min-height: 100svh !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-content: center !important;
  align-items: center !important;
  justify-content: center !important;
}
/* Match the vertical block (62px greeting + 20px separation).
   JUX replaces GDD's greeting text with #HitPeRepeat!. */
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .jux-headline-kicker {
  height: 62px !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
}
body.jux-home .jux-hero-slogan.jux-v3-hashtag {
  font-size: 20px !important;
  line-height: 1.2 !important;
  padding: 7px 13px !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .jux-headline-brand {
  margin: 0 0 20px !important;
  padding: 0 !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .big_title .big_title_container h1.jux-hero-brand {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  white-space: nowrap !important;
  line-height: 1 !important;
}
body.jux-home .jux-hero-brand__main {
  font-size: 90px !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
  white-space: nowrap !important;
  display: inline-block !important;
  max-width: 100% !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .jux-headline-brand + .player {
  margin: 20px 0 0 !important;
  padding: 0 !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .player_container {
  max-width: 500px !important;
  width: 100% !important;
  margin: 0 auto !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .player_container .player_row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .player_container .player_row .play_button .play_button_container .play_button_wrap .button_play .button_play_container a.jux-glass-circle {
  width: 101px !important;
  height: 101px !important;
  min-height: 101px !important;
  min-width: 101px !important;
  max-width: 101px !important;
  max-height: 101px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  aspect-ratio: 1/1 !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now {
  width: 100% !important;
  max-width: 500px !important;
  height: 100px !important;
  min-height: 100px !important;
  margin: 20px auto 0 !important;
  display: table !important;
  table-layout: fixed;
  overflow: hidden;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now .artwork {
  width: 70px !important;
  height: 100px !important;
  display: table-cell !important;
  vertical-align: middle !important;
  overflow: hidden;
  flex-basis: auto !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now .artwork img {
  width: 70px !important;
  height: 70px !important;
  max-width: 100% !important;
  object-fit: cover !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now .info {
  display: table-cell !important;
  width: auto !important;
  vertical-align: middle !important;
  padding: 0 10px !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now .info .song {
  font-size: 1.2em !important;
  line-height: 1.2 !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now .info .artist {
  font-size: 13px !important;
  line-height: 1.4 !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .info_player {
  padding: 50px 20px 0 !important;
  margin: 0 auto !important;
  width: 100% !important;
  max-width: none !important;
  font-size: 12px !important;
  line-height: 1.54 !important;
}
body.jux-home .jux-v3-relocated-social {
  margin: 16px auto 0 !important;
  padding-bottom: 0 !important;
}
/* The footer comes after a full-height stage, just as in GDD; a short
   scroll to the Glass footer is intentional. */
body.jux-home .page .container .content .footer {
  padding-top: 14px !important;
  padding-bottom: 20px !important;
}
body.jux-home .page .footer .footer_container {padding: 20px clamp(18px, 3vw, 42px) !important;}

@media (max-width: 600px) {
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap {
    padding: 85px 0 20px !important;
  }
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .jux-headline-kicker {
    margin: 0 !important;
  }
  body.jux-home .jux-hero-slogan.jux-v3-hashtag {font-size: 20px !important;}
  body.jux-home .jux-hero-brand__main {
    font-size: min(45px, 10.35vw) !important;
    letter-spacing: -0.04em !important;
    padding-right: 0 !important;
  }
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .jux-headline-brand {
    margin: 0 0 20px !important;
  }
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .jux-headline-brand + .player {
    margin: 20px 0 0 !important;
  }
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .player_container {
    max-width: 100% !important;
  }
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .player_container .player_row .divider.left {display:none !important;}
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .player_container .player_row .play_button {
    width: 100% !important;
  }
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .player_container .player_row .divider.right {
    position: relative !important;
    width: 100% !important;
    height: 70px !important;
    min-height: 70px !important;
    top: auto !important;
    left: auto !important;
    bottom: auto !important;
  }
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .player_container .player_row .divider.right .divider_content > span {
    width: 50% !important;
  }
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now {
    width: 86% !important;
    max-width: 86% !important;
  }
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .info_player {
    padding: 15px 20px 5px !important;
    max-width: 100% !important;
    font-size: 12px !important;
  }
  body.jux-home .jux-v3-relocated-social {margin-top: 14px !important;}
  body.jux-home .page .footer .footer_container {padding: 16px 12px !important;}
}
@media (max-width: 350px) {
  body.jux-home .jux-hero-brand__main {font-size: 10vw !important;}
}

/* The JUX song card is a modern flex glass card. Keep its original GDD
   outer dimensions without forcing table layout (which truncates titles). */
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  padding: 9px !important;
  table-layout: auto !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now .artwork {
  display: block !important;
  width: 70px !important;
  height: 70px !important;
  flex: 0 0 70px !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now .info {
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  min-width: 0 !important;
  width: auto !important;
  padding: 0 !important;
}
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now .info .song,
body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap .player .playing_now .info .artist {
  width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}
@media (max-width: 600px) {
  /* With a normal-height phone, centre against the same 100vh stage
     as the reference; the footer remains just below the fold. */
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap {
    padding: 0 !important;
  }
  body.jux-home .jux-hero-brand__main {
    font-size: 45px !important;
  }
}
@media (max-width: 374px) {
  body.jux-home .jux-hero-brand__main {font-size: min(45px,11vw) !important;}
}
@media (max-width: 600px) and (max-height: 720px) {
  /* Avoid positioning content behind the fixed mobile glass header. */
  body.jux-home .page .container .content .section_player .gap .gap_row .column .column_wrap .widget_wrap {
    padding: 85px 0 20px !important;
  }
}