/* Rádio Clube FM — Top 5 refinado (V23). Sobrescreve apenas a seção Top 5. */
.music-rail .top10 {
  container-name: clube-top5;
  container-type: inline-size;
  display:block;
  margin:0;
  padding:17px;
  min-width:0;
  border-radius:19px;
  background:#fff;
  box-shadow:0 7px 25px rgba(35,24,25,.075);
}
.music-rail .top10-title {
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  grid-column:auto;
  grid-row:auto;
  gap:11px!important;
  height:auto!important;
  min-height:58px;
  width:100%;
  max-width:none;
  margin:0 0 15px;
  padding:13px 17px!important;
  border-radius:14px;
  background:linear-gradient(110deg,#ef0726,#bc001d);
}
.music-rail .top10-title .ui-icon {
  flex:0 0 26px;
  width:26px!important;
  height:26px!important;
}
.music-rail .top10-title h2 {
  margin:0!important;
  color:#fff;
  font-size:clamp(19px,2.2vw,23px)!important;
  line-height:1.15!important;
  font-weight:850;
  letter-spacing:-.5px;
  text-align:left!important;
  white-space:normal!important;
}
.music-rail .artists {
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  margin:0;
  min-width:0;
  overflow:visible!important;
  scroll-snap-type:none!important;
  scrollbar-width:none;
}
.music-rail .artists::-webkit-scrollbar {display:none}
.music-rail .artist {
  display:flex;
  flex-direction:column;
  flex:initial!important;
  position:relative;
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  margin:0;
  padding:0;
  overflow:hidden;
  border:1px solid #f0e7e6;
  border-radius:13px;
  background:#fff;
  box-shadow:0 3px 10px rgba(46,31,30,.055);
  color:#1b293e;
  text-decoration:none;
  scroll-snap-align:unset;
  transition:transform .16s ease,box-shadow .16s ease;
}
.music-rail .artist img {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/4.8;
  object-fit:cover;
  object-position:50% 30%;
  background:linear-gradient(155deg,#fff2f1,#edd7dd);
  flex:none;
}
.music-rail .artist::after {display:none!important}
.music-rail .artist span {
  position:static!important;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:1;
  width:100%;
  min-height:46px;
  margin:0;
  padding:7px 4px;
  background:#fff;
  color:#192842!important;
  font-size:clamp(10px,1.04vw,12px)!important;
  line-height:1.22!important;
  font-weight:850;
  letter-spacing:-.12px;
  text-align:center;
  overflow-wrap:break-word;
}
.music-rail .artist:hover,
.music-rail .artist:focus-visible {
  transform:translateY(-3px);
  box-shadow:0 9px 18px rgba(35,22,22,.13);
  outline-color:#df0025;
}
.music-rail .top10-note {
  position:static!important;
  display:block;
  margin:14px 2px 0;
  padding:0;
  color:#7a8191;
  font-size:10px;
  line-height:1.45;
  text-align:center;
}
/* If a remote artist photo fails, never replace it with a misleading station logo. */
.music-rail .artist.photo-unavailable img {opacity:0}
.music-rail .artist.photo-unavailable {background:linear-gradient(155deg,#fff5f3,#f2dce0)}
.music-rail .artist.photo-unavailable::before {
  content:'♫';
  display:flex;
  position:absolute;
  top:0;
  left:0;
  right:0;
  aspect-ratio:4/4.8;
  align-items:center;
  justify-content:center;
  color:#c4042b;
  font-size:38px;
  pointer-events:none;
}
@container clube-top5 (max-width:560px) {
  .music-rail .artists {grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .music-rail .artist span {font-size:12px!important;min-height:43px}
}
@container clube-top5 (max-width:330px) {
  .music-rail .artists {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .music-rail .artist span {font-size:12px!important}
}
@media (max-width:540px) {
  .music-rail .top10 {padding:13px}
  .music-rail .top10-title {min-height:54px;padding:11px 13px!important;margin-bottom:13px}
  .music-rail .top10-title h2 {font-size:20px!important}
}
@media (prefers-reduced-motion:reduce) {
  .music-rail .artist {transition:none}
}