.music-btn { position: fixed; top: 40px; right: 40px; width: 36px; height: 36px; border: 1px solid rgba(255,255,255,0.2); border-radius: 50%; background: rgba(255,255,255,0.06); cursor: pointer; display: flex; align-items: center; justify-content: center; z-index: 100; font-size: 14px; color: #888; transition: all .3s; user-select: none; }
.music-btn:hover { border-color: rgba(255,255,255,0.5); color: #ddd; }
.music-btn.muted { animation: musicPulse 2s infinite; border-color: #c44; color: #c44; }
@keyframes musicPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(204,68,68,0.2); } 50% { box-shadow: 0 0 0 8px rgba(204,68,68,0); } }

.playlist { position: fixed; bottom: 0; left: 0; right: 0; z-index: 100; background: rgba(22,26,32,0.95); backdrop-filter: blur(12px); border-top: 1px solid rgba(255,255,255,0.06); display: none; flex-direction: column; align-items: center; padding: 0; }
.playlist.show { display: flex; }
.song-list { display: flex; gap: 28px; padding: 14px 24px 6px; flex-wrap: wrap; justify-content: center; }
.song-item { font-size: 11px; color: #777; cursor: pointer; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; letter-spacing: 0.04em; transition: color .2s; border: none; background: none; padding: 4px 0; }
.song-item:hover, .song-item.active { color: #ddd; }
.now-playing { font-size: 10px; color: #666; padding: 0 24px 8px; letter-spacing: 0.04em; }

@media (max-width: 600px) {
  .music-btn { top: 24px; right: 24px; }
  .song-list { gap: 14px; }
}