/* CC Site Music v1.0.0 — floating pill, her brand kit.
   Blush/ivory pill, rose button, black text. Bottom-left, every page. */
.ccsm-pill{
  position:fixed; left:18px; bottom:18px; z-index:99990;
  display:flex; align-items:center; gap:12px;
  background:#fff; border:1.5px solid #D9A5A0; border-radius:999px;
  padding:9px 20px 9px 9px; max-width:calc(100vw - 36px);
  box-shadow:0 12px 30px rgba(20,20,20,.14);
  font-family:'Jost',sans-serif;
}
.ccsm-btn{
  flex:0 0 auto; width:46px; height:46px; border-radius:50%;
  background:#B76E79; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s ease;
}
.ccsm-btn:hover{ background:#F3DFDC; }
.ccsm-btn:hover svg path{ fill:#141414; }
.ccsm-meta{ min-width:0; }
.ccsm-title{
  font-family:'Playfair Display',serif; font-weight:400; font-size:1.02rem;
  color:#141414; margin:0; line-height:1.15; white-space:nowrap;
}
.ccsm-sub{
  font-size:.82rem; font-weight:300; color:#6e625c; margin:2px 0 0;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.ccsm-progress{
  height:4px; background:#F3DFDC; border-radius:99px; margin-top:6px;
  overflow:hidden; display:none;
}
.ccsm-progress span{ display:block; height:100%; width:0%; background:#B76E79; border-radius:99px; }
.ccsm-pill.is-playing .ccsm-progress{ display:block; }
@media (max-width:480px){
  .ccsm-pill{ left:12px; bottom:12px; padding:8px 16px 8px 8px; }
  .ccsm-btn{ width:42px; height:42px; }
  .ccsm-title{ font-size:.95rem; }
}