/* 可收缩音乐播放器 */
#musicPlayer{
  position:fixed;
  z-index:99990;
  display:flex;
  align-items:center;
  gap:10px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(10px);
  border-radius:999px;
  box-shadow:0 6px 20px rgba(255,107,107,.28), 0 2px 8px rgba(0,0,0,.12);
  border:1px solid #ffe3e0;
  padding:8px 14px 8px 8px;
  transition:width .3s ease, border-radius .3s ease, padding .3s ease, opacity .3s ease;
  overflow:hidden;
}
/* 展开态：横向长条 */
#musicPlayer.mp-expanded{
  width:240px;
  height:44px;
}
/* 收缩态：圆形 */
#musicPlayer.mp-collapsed{
  width:44px;
  height:44px;
  padding:0;
  border-radius:50%;
}
#musicPlayer .mp-cover{
  flex:0 0 38px;
  width:38px;height:38px;
  border-radius:50%;
  overflow:hidden;
  border:none;
  padding:0;
  cursor:pointer;
  background:linear-gradient(135deg,#ff9a6b,#ff6b6b);
  display:flex;align-items:center;justify-content:center;
}
#musicPlayer.mp-collapsed .mp-cover{
  flex:0 0 54px;
  width:54px;height:54px;
}
#musicPlayer .mp-cover img{
  width:100%;height:100%;object-fit:cover;display:block;
}
#musicPlayer .mp-cover.spinning img{
  animation:mpSpin 6s linear infinite;
}
@keyframes mpSpin{ to{ transform:rotate(360deg);} }
#musicPlayer .mp-info{
  flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:4px;
}
#musicPlayer.mp-collapsed .mp-info,
#musicPlayer.mp-collapsed .mp-ctrl{ display:none; }
#musicPlayer .mp-title{
  font-size:13px;color:#333;font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#musicPlayer .mp-progress{
  height:4px;border-radius:2px;background:#ffe0dd;overflow:hidden;cursor:pointer;
}
#musicPlayer .mp-bar{
  height:100%;width:0;background:linear-gradient(90deg,#ff9a6b,#ff6b6b);border-radius:2px;
}
#musicPlayer .mp-ctrl{
  flex:0 0 auto;display:flex;align-items:center;gap:2px;
}
#musicPlayer .mp-ctrl button{
  border:none;background:transparent;cursor:pointer;
  width:28px;height:28px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;color:#ff6b6b;transition:background .15s;
}
#musicPlayer .mp-ctrl button:hover{ background:#fff0ee; }
#musicPlayer .mp-ctrl #mpPlay{
  width:34px;height:34px;background:linear-gradient(135deg,#ff9a6b,#ff6b6b);color:#fff;font-size:14px;
}
#musicPlayer .mp-ctrl #mpPlay:hover{ filter:brightness(1.05); }

/* 桌面端：左下角，与手机端同一列 */
@media (min-width:993px){
  #musicPlayer{ left:20px; bottom:20px; }
}
/* 手机端：左列，接在 fab 悬浮按钮组（left:16px bottom:80px）下方，间距一致 */
@media (max-width:992px){
  #musicPlayer{ left:7px; bottom:72px; }
  #musicPlayer.mp-expanded{ width:220px; }
}
