/* ===================== Mosaico "Um pouco de tudo" — 60 rádios aleatórias, imagens pequenas ===================== */
.station-mosaic{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(64px, 1fr)); gap:16px;
}
.mosaic-item{
  position:relative; display:block; aspect-ratio:1/1; border-radius:9px; overflow:hidden;
  background:var(--navy-2); box-shadow:0 3px 8px rgba(2,31,57,.12);
}
.mosaic-item img{ width:100%; height:100%; object-fit:cover; display:block; }
.mosaic-item__play{
  position:absolute; inset:0; width:100%; height:100%; border:none; background:rgba(2,8,18,.55);
  display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .15s; cursor:pointer;
}
.mosaic-item:hover .mosaic-item__play{ opacity:1; }
.mosaic-item__play svg{ width:60%; height:60%; max-width:26px; max-height:26px; }
.mosaic-item__play svg polygon{ fill:var(--orange); }
.mosaic-item.is-playing{ box-shadow:0 0 0 2px var(--orange); }

@media (max-width:640px){
  .station-mosaic{ grid-template-columns:repeat(auto-fill, minmax(52px, 1fr)); gap:12px; }
}