/* Rádio Só Flashback | Título e artista da música no PC.
   O HTML e o JS originais permanecem intactos, assim como o layout mobile.
   Uma linha por campo: textos longos são abreviados automaticamente com ... */
@media (min-width: 891px) {
  .site-shell .song-center #trackHeading {
    /* A faixa central respeita também as duas caixas laterais.
       O recuo é simétrico para permanecer alinhado com o vinil. */
    width: min(820px, calc(100vw - clamp(325px, 26vw, 470px) - clamp(325px, 26vw, 470px) - clamp(14px, 2.5vw, 44px) - clamp(14px, 2.5vw, 44px) - 40px));
    max-width: 100%;
    min-width: 0;
    margin: 12px auto 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    text-align: center;
    overflow: hidden;
    overflow-wrap: normal;
    white-space: nowrap;
    transform: none;
    font-family: 'Barlow Condensed', 'Arial Narrow', sans-serif;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: .55px;
  }

  .site-shell .song-center #songText {
    order: 1;
    display: block;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: clamp(27px, 2.35vw, 41px);
    line-height: 1.18;
    font-weight: 800;
    color: #fcfdff;
    text-shadow:
      0 1px 0 #cbd0da,
      0 2px 0 #67718d,
      0 4px 0 #20233d,
      0 6px 9px rgba(0,0,0,.85),
      0 0 13px rgba(244,246,255,.12);
  }

  .site-shell .song-center #artistText {
    order: 2;
    display: block;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: clamp(18px, 1.55vw, 25px);
    line-height: 1.22;
    font-weight: 800;
    color: #48d5ff;
    letter-spacing: .45px;
    text-shadow:
      0 1px 0 #148ab9,
      0 2px 0 #07547c,
      0 4px 8px rgba(0,0,0,.8),
      0 0 10px rgba(31,186,255,.23);
  }

  /* Separador é utilizado somente na apresentação tradicional/mobile. */
  .site-shell .song-center .track-separator { display: none; }
}

/* Em monitores menores, reserva-se espaço extra para ambas as caixas. */
@media (min-width: 891px) and (max-width: 1280px) {
  .site-shell .song-center #trackHeading {
    width: min(700px, calc(100vw - clamp(280px, 28vw, 380px) - clamp(280px, 28vw, 380px) - 64px));
  }
}

/* Em desktops baixos a tipografia deve continuar em duas linhas compactas. */
@media (min-width: 891px) and (max-height: 640px) {
  .site-shell .song-center #trackHeading { margin-top: 4px; gap: 0; }
  .site-shell .song-center #songText { font-size: clamp(25px, 2.1vw, 34px); }
  .site-shell .song-center #artistText { font-size: clamp(17px, 1.4vw, 22px); }
}
