/* MAIS TUNER 24.179 — A CARA DO TABLET (721–1179px)
   O tablet vivia de herança: era o desktop espremido com a capa do celular.
   Esta camada dá uma identidade própria pro meio-termo: capa grande ancorada
   no topo, tipografia um degrau acima do celular, selos com toque confortável
   e a marca FORA da capa (neste modo ela virava um chip apertado em cima da
   arte — no desktop, na página da rádio, o selo sobre a arte continua).
   Carrega DEPOIS de central-2026.css, então ganha no empate. */
@media (min-width:721px) and (max-width:1179px){

  /* 1) marca fora da capa neste modo de visualização */
  .hero.has-station .hero-panel[data-cover-ready="true"] .art{display:none!important}

  /* 2) palco: capa grande, ancorada no topo, respiro de coluna */
  .hero .hero-main{
    grid-template-columns:minmax(230px,290px) minmax(0,1fr)!important;
    gap:30px!important;
    align-items:start!important;
    padding:26px 10px 24px!important;
  }
  .hero .hero-visual{align-self:start!important;margin-top:4px!important}
  /* botão de tocar no cantinho da capa, SAINDO um tanto pra fora (como no
     celular) — com z-index pra nunca ficar por baixo de nada */
  .hero .hero-visual{overflow:visible!important}
  .hero .hero-play{width:62px!important;height:62px!important;right:-10px!important;bottom:-10px!important;z-index:6!important}
  .hero .hero-play svg{width:24px!important;height:24px!important}

  /* 3) tipografia um degrau acima do celular */
  .hero .hero-station{font-size:33px!important;line-height:1.08!important}
  .hero .hero-sub{font-size:14px!important}

  /* 4) selos e botões no tamanho de dedo (nem pílula de desktop, nem aperto) */
  .hero .hero-pill,.hero .meta-pill{min-height:34px!important;padding:7px 13px!important}
  .hero .hero-status-row{gap:12px!important}
  .hero .source-row .src-pill{min-height:56px}

  /* 5) fontes de áudio em DUAS colunas firmes (sem fileira capenga) */
  .hero .source-row{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .hero .source-row .src-pill{width:auto!important;max-width:none!important;justify-content:flex-start}
}
