.sound-library { width: 100%; max-width: 1100px; }
.sound-collection { border: 0; }
.sound-collection summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 0;
  list-style: none;
  cursor: pointer;
  color: var(--paper);
  transition: color .25s;
}
.sound-collection summary::-webkit-details-marker { display: none; }
.sound-collection summary::marker { content: ''; }
.sound-collection h3 {
  margin: 0;
  font-size: clamp(30px, 7.8vw, 128px);
  line-height: 1.05;
  font-weight: 900;
  letter-spacing: .01em;
  font-kerning: normal;
  text-transform: uppercase;
}
.sound-collection summary:hover, .sound-collection[open] summary { color: var(--acid); }
.sound-collection-mark {
  display: grid;
  place-items: center;
  flex: none;
  width: clamp(26px, 3vw, 40px);
  height: clamp(26px, 3vw, 40px);
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 22px;
  line-height: 1;
  font-weight: 400;
}
.sound-collection-mark::before { content: '+'; }
.sound-collection[open] .sound-collection-mark::before { content: '\2212'; }
.sound-collection-content { padding: 12px 0 28px; max-width: 600px; }
.sound-collection-content p { margin: 0; font-size: 14px; line-height: 1.8; color: var(--muted); }
.sound-collection-content .collection-empty { margin-top: 8px; font-size: 12px; color: var(--muted); opacity: .8; }
.production-card { margin-top: 24px; }
.production-player { display: block; width: 100%; height: 152px; border: 0; border-radius: 12px; background: #121411; }
.production-spotify-link { margin-top: 16px; min-height: 44px; letter-spacing: 1.8px; }
@media (max-width: 360px) {
  .sound { padding-inline: 18px; }
}
@media (max-width: 740px) {
  .sound-collection summary { min-height: 82px; gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .sound-collection summary { transition: none; }
}
