.compa-player{
  --mustard:#f0c040;
  display:flex; 
  align-items:center; 
  gap:16px;
  background:rgba(0,0,0,0.75); 
  border:1px solid rgba(255,255,255,0.15);
  border-radius:18px; 
  padding:12px 18px; 
  max-width:520px; 
  margin:20px auto;
  font-family:Arial,sans-serif; 
  color:#fff;
  box-sizing:border-box;
}
.compa-player-logo img{width:90px; height:auto; display:block; border-radius:6px}
.compa-player-controls{flex:1; min-width:0}
.compa-play-row{display:flex; align-items:center; gap:14px}
.compa-btn-play{
  width:56px; height:56px; min-width:56px; border:0; border-radius:50%;
  background:var(--mustard); color:#000; font-size:22px; cursor:pointer; line-height:1;
}
.compa-btn-play.playing{background:#00e676}
.compa-vu{display:flex; align-items:flex-end; gap:2px; height:36px; flex:1}
.compa-vu span{display:block; width:4px; background:var(--mustard); border-radius:2px; height:4px}
.compa-volume-row{display:flex; align-items:center; gap:10px; margin-top:10px; font-size:11px; letter-spacing:1px; opacity:.9}
.compa-volume-row input{flex:1; height:4px; accent-color:var(--mustard); cursor:pointer}
.compa-air{display:flex; align-items:center; gap:6px; font-size:12px; white-space:nowrap}
.compa-live-dot{width:8px; height:8px; background:#555; border-radius:50%; display:inline-block}
.compa-live-dot.on{background:#ff2a2a; box-shadow:0 0 8px #ff2a2a; animation:compaPulse 1.5s infinite}
@keyframes compaPulse{0%{opacity:1}50%{opacity:.4}100%{opacity:1}}