.portfolio-music {
  position: fixed;
  z-index: 18;
  right: max(24px, env(safe-area-inset-right));
  bottom: max(24px, env(safe-area-inset-bottom));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid #ffffff38;
  border-radius: 999px;
  background: #111111e8;
  color: #fff;
  box-shadow: 0 4px 18px #0002;
  font: 500 12px/1.2 var(--font-sans, sans-serif);
  letter-spacing: .02em;
  cursor: pointer;
  touch-action: manipulation;
  backdrop-filter: blur(12px);
  transition: color 160ms, background 160ms, border-color 160ms;
}
.portfolio-music:hover { border-color: var(--color-accent, #c9fe6e); }
.portfolio-music:focus-visible { outline: 2px solid var(--color-accent, #c9fe6e); outline-offset: 4px; }
.portfolio-music[aria-pressed="true"] { color: #0a0a0a; border-color: var(--color-accent, #c9fe6e); background: var(--color-accent, #c9fe6e); }
.portfolio-music__icon { display: flex; align-items: center; gap: 3px; height: 17px; }
.portfolio-music__icon i { width: 2px; height: 5px; border-radius: 2px; background: currentColor; }
.portfolio-music__icon i:nth-child(2) { height: 13px; }
.portfolio-music__icon i:nth-child(3) { height: 17px; }
.portfolio-music__icon i:nth-child(4) { height: 9px; }
.portfolio-music[data-playing="true"] .portfolio-music__icon i { animation: portfolio-music-pulse 1111ms ease-in-out infinite alternate; }
.portfolio-music[data-playing="true"] .portfolio-music__icon i:nth-child(2) { animation-delay: -277ms; }
.portfolio-music[data-playing="true"] .portfolio-music__icon i:nth-child(3) { animation-delay: -555ms; }
.portfolio-music[data-playing="true"] .portfolio-music__icon i:nth-child(4) { animation-delay: -833ms; }
body.modal-open .portfolio-music { visibility: hidden; pointer-events: none; }
@keyframes portfolio-music-pulse { to { transform: scaleY(.35); } }
@media (max-width: 767px) {
  .portfolio-music { right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); padding-inline: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .portfolio-music, .portfolio-music__icon i { animation: none !important; transition: none; }
}
