/* SENSIK compact cover sizing: keep the main artwork prominent without clipping controls or starving the library list. */
#studio-workspace .music-panel > .hero-player-area {
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  flex: 0 0 auto !important;
  padding: 10px 12px 12px !important;
  gap: 6px !important;
  overflow: hidden !important;
}
#studio-workspace .music-panel .cf-carousel {
  box-sizing: border-box !important;
  flex: 0 0 230px !important;
  width: 100% !important;
  height: 230px !important;
  min-height: 230px !important;
  max-height: 230px !important;
  overflow: hidden !important;
  margin: 0 auto 1px !important;
}
#studio-workspace .music-panel .cf-card {
  width: clamp(150px, 18vw, 205px) !important;
  height: clamp(166px, 19vw, 215px) !important;
  border-radius: 16px !important;
}
#studio-workspace .music-panel .cf-card.is-center {
  width: clamp(195px, 22vw, 235px) !important;
  height: clamp(200px, 22vw, 228px) !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.55), 0 0 0 1px rgba(73,245,213,.22) !important;
}
#studio-workspace .music-panel .hero-controls-area {
  flex: 0 0 auto !important;
  width: min(100%, 470px) !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 2 !important;
}
#studio-workspace .music-panel .hero-progress-bar { margin: 5px 0 7px !important; }
#studio-workspace .music-panel .hero-buttons { min-height: 40px !important; }
@media (min-width: 1051px) {
  #studio-workspace .music-panel > .hero-player-area { flex-basis: 445px !important; min-height: 445px !important; max-height: 445px !important; }
  #studio-workspace .music-panel .cf-carousel { flex-basis: 230px !important; height: 230px !important; min-height: 230px !important; max-height: 230px !important; }
  #studio-workspace .music-panel .cf-card.is-center { width: clamp(215px, 21vw, 250px) !important; height: clamp(205px, 20vw, 225px) !important; }
}
@media (min-width: 761px) and (max-width: 1050px) {
  #studio-workspace .music-panel > .hero-player-area { flex-basis: 425px !important; min-height: 425px !important; max-height: 425px !important; padding: 9px 9px 10px !important; }
  #studio-workspace .music-panel .cf-carousel { flex-basis: 225px !important; height: 225px !important; min-height: 225px !important; max-height: 225px !important; }
  #studio-workspace .music-panel .cf-card { width: clamp(150px, 18vw, 195px) !important; height: clamp(165px, 19vw, 210px) !important; }
  #studio-workspace .music-panel .cf-card.is-center { width: clamp(195px, 22vw, 230px) !important; height: clamp(195px, 21vw, 220px) !important; }
}
@media (max-width: 760px) {
  #studio-workspace .music-panel > .hero-player-area { flex-basis: auto !important; min-height: 420px !important; max-height: none !important; padding: 10px 7px 12px !important; gap: 5px !important; }
  #studio-workspace .music-panel .cf-carousel { flex-basis: 210px !important; height: 210px !important; min-height: 210px !important; max-height: 210px !important; }
  #studio-workspace .music-panel .cf-card { width: clamp(142px, 44vw, 178px) !important; height: clamp(160px, 47vw, 190px) !important; }
  #studio-workspace .music-panel .cf-card.is-center { width: clamp(180px, 56vw, 220px) !important; height: clamp(185px, 54vw, 210px) !important; }
  #studio-workspace .music-panel .hero-controls-area { width: 100% !important; padding: 0 5px !important; }
  #studio-workspace .music-panel .hero-title { font-size: 14px !important; }
  #studio-workspace .music-panel .hero-progress-bar { margin: 4px 0 6px !important; gap: 6px !important; }
  #studio-workspace .music-panel .hero-buttons { min-height: 38px !important; gap: 7px !important; }
  #studio-workspace .music-panel .h-play-btn { width: 38px !important; height: 38px !important; }
}
@media (min-width: 761px) and (max-height: 760px) {
  #studio-workspace .music-panel > .hero-player-area { flex-basis: 415px !important; min-height: 415px !important; max-height: 415px !important; }
  #studio-workspace .music-panel .cf-carousel { flex-basis: 205px !important; height: 205px !important; min-height: 205px !important; max-height: 205px !important; }
}
