/* Wavswap V955: the current track borrows its accent from its own artwork. */
track-table tr.wavswap-artwork-accent-v955,
channel-track-table tr.wavswap-artwork-accent-v955 {
  --ws-artwork-row-surface-v955: var(--wav-panel, var(--be-background, #fff));
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.62), rgba(255,255,255,.88) 56%, rgba(255,255,255,.97)),
    var(--ws-artwork-image-v955, linear-gradient(90deg, rgba(100,116,139,.12), rgba(255,255,255,.02))),
    linear-gradient(90deg, var(--ws-artwork-accent-soft-v955, transparent), var(--ws-artwork-accent-faint-v955, transparent)) !important;
  background-position: center, center, center !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100%, cover, 100% 100% !important;
  border-color: var(--ws-artwork-accent-v955, rgba(15,23,42,.2)) !important;
  box-shadow:
    0 8px 22px rgba(15,23,42,.08),
    inset 0 0 0 1px var(--ws-artwork-shadow-v955, rgba(15,23,42,.12)) !important;
}

track-table tr.wavswap-artwork-accent-v955 td,
channel-track-table tr.wavswap-artwork-accent-v955 td {
  border-top-color: var(--ws-artwork-accent-v955, rgba(15,23,42,.2)) !important;
  border-bottom-color: var(--ws-artwork-accent-v955, rgba(15,23,42,.2)) !important;
}

track-table tr.wavswap-artwork-accent-v955 td:first-child,
channel-track-table tr.wavswap-artwork-accent-v955 td:first-child {
  border-left-color: var(--ws-artwork-accent-v955, rgba(15,23,42,.2)) !important;
}

track-table tr.wavswap-artwork-accent-v955 td:last-child,
channel-track-table tr.wavswap-artwork-accent-v955 td:last-child {
  border-right-color: var(--ws-artwork-accent-v955, rgba(15,23,42,.2)) !important;
}

/* Production album art is intentionally served cross-origin without canvas
   pixel access. The waveform borrows the visible cover's real hue through
   blending, so no proxy, analyzer, network request or main-thread image decode
   is needed. */
track-table tr.wavswap-artwork-accent-v955[data-wavswap-artwork-accent="ambient"] waveform .progress-track canvas,
channel-track-table tr.wavswap-artwork-accent-v955[data-wavswap-artwork-accent="ambient"] waveform .progress-track canvas {
  filter: grayscale(1) brightness(1.85) contrast(1.24) !important;
  mix-blend-mode: luminosity !important;
}

track-table tr.wavswap-artwork-accent-v955 waveform .progress-track canvas,
channel-track-table tr.wavswap-artwork-accent-v955 waveform .progress-track canvas {
  filter:
    hue-rotate(var(--ws-artwork-wave-hue-v955, 0deg))
    saturate(1.55)
    contrast(1.14)
    brightness(1.03) !important;
}

track-table tr.wavswap-artwork-accent-v955 waveform .progress-track:after,
channel-track-table tr.wavswap-artwork-accent-v955 waveform .progress-track:after {
  background: linear-gradient(
    90deg,
    var(--ws-artwork-accent-soft-v955, rgba(25,198,211,.16)),
    transparent
  ) !important;
}

.be-dark-mode track-table tr.wavswap-artwork-accent-v955,
.dark track-table tr.wavswap-artwork-accent-v955,
body.dark track-table tr.wavswap-artwork-accent-v955,
body.be-dark-mode track-table tr.wavswap-artwork-accent-v955,
.be-dark-mode channel-track-table tr.wavswap-artwork-accent-v955,
.dark channel-track-table tr.wavswap-artwork-accent-v955,
body.dark channel-track-table tr.wavswap-artwork-accent-v955,
body.be-dark-mode channel-track-table tr.wavswap-artwork-accent-v955 {
  --ws-artwork-row-surface-v955: #121822;
  background-image:
    linear-gradient(90deg, rgba(8,13,22,.58), rgba(12,18,29,.84) 56%, rgba(18,24,34,.97)),
    var(--ws-artwork-image-v955, linear-gradient(90deg, rgba(100,116,139,.18), rgba(18,24,34,.04))),
    linear-gradient(90deg, var(--ws-artwork-accent-soft-v955, transparent), var(--ws-artwork-accent-faint-v955, transparent)) !important;
  color: #f8fafc !important;
}

/* The compiled studio theme selects active rows with two classes, which is
   more specific than the basic artwork selector above. These selectors mirror
   the real table shape so the detected cover color wins on every loaded page. */
html body track-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
html body channel-track-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
html body track-table table.material-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
html body channel-track-table table.material-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent] {
  background-color: var(--ws-artwork-accent-faint-v955, var(--ws-artwork-row-surface-v955)) !important;
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.62), rgba(255,255,255,.88) 56%, rgba(255,255,255,.97)),
    var(--ws-artwork-image-v955, linear-gradient(90deg, rgba(100,116,139,.12), rgba(255,255,255,.02))),
    linear-gradient(90deg, var(--ws-artwork-accent-soft-v955, transparent), var(--ws-artwork-accent-faint-v955, transparent)) !important;
  border-color: var(--ws-artwork-accent-v955, rgba(15,23,42,.2)) !important;
  box-shadow:
    0 8px 22px rgba(15,23,42,.08),
    inset 0 0 0 1px var(--ws-artwork-shadow-v955, rgba(15,23,42,.12)) !important;
}

html body track-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent] > td,
html body channel-track-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent] > td,
html body track-table table.material-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent] > td,
html body channel-track-table table.material-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent] > td {
  border-color: var(--ws-artwork-accent-v955, rgba(15,23,42,.2)) !important;
}

html body.be-dark-mode track-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
html body.dark track-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
html body.be-dark-mode channel-track-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
html body.dark channel-track-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
html body.be-dark-mode track-table table.material-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
html body.dark track-table table.material-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
html body.be-dark-mode channel-track-table table.material-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
html body.dark channel-track-table table.material-table tr.track-list-row.wavswap-artwork-accent-v955[data-wavswap-artwork-accent] {
  background-image:
    linear-gradient(90deg, rgba(8,13,22,.58), rgba(12,18,29,.84) 56%, rgba(18,24,34,.97)),
    var(--ws-artwork-image-v955, linear-gradient(90deg, rgba(100,116,139,.18), rgba(18,24,34,.04))),
    linear-gradient(90deg, var(--ws-artwork-accent-soft-v955, transparent), var(--ws-artwork-accent-faint-v955, transparent)) !important;
}

@media (prefers-reduced-motion: reduce) {
  track-table tr.wavswap-artwork-accent-v955,
  channel-track-table tr.wavswap-artwork-accent-v955 {
    transition: none !important;
  }
}

/* Mobile table cards are declared later in the legacy bundle with important
   backgrounds. These deliberately more-specific rules keep the cover color on
   the selected card without changing its layout or touch controls. */
@media (max-width: 1100px) {
  html body track-table .material-table.mobile tr.track-list-row.wavswap-artwork-accent-v955,
  html body track-table tr.track-list-row.wavswap-artwork-accent-v955,
  html body channel-track-table .material-table.mobile tr.track-list-row.wavswap-artwork-accent-v955,
  html body channel-track-table tr.track-list-row.wavswap-artwork-accent-v955 {
    background-image:
      linear-gradient(115deg, rgba(255,255,255,.48), rgba(255,255,255,.84) 62%, rgba(255,255,255,.95)),
      var(--ws-artwork-image-v955, linear-gradient(115deg, rgba(100,116,139,.14), rgba(255,255,255,.02))),
      linear-gradient(115deg, var(--ws-artwork-accent-soft-v955, transparent), var(--ws-artwork-accent-faint-v955, transparent)) !important;
    background-position: center, center, center !important;
    background-repeat: no-repeat !important;
    background-size: 100% 100%, cover, 100% 100% !important;
    border-color: var(--ws-artwork-accent-v955, rgba(15,23,42,.2)) !important;
    box-shadow: 0 8px 22px var(--ws-artwork-shadow-v955, rgba(15,23,42,.14)) !important;
  }

  /* The compact mobile renderer is injected after this stylesheet and owns a
     separate generated play button. The attribute adds enough specificity to
     beat its blue --be-hover background without changing its grid or taps. */
  html body track-table table.material-table.mobile tr.track-list-row.wavswap-mobile-row-v474.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
  html body channel-track-table table.material-table.mobile tr.track-list-row.wavswap-mobile-row-v474.wavswap-artwork-accent-v955[data-wavswap-artwork-accent] {
    background-color: var(--ws-artwork-accent-faint-v955, var(--ws-artwork-row-surface-v955)) !important;
    background-image:
      linear-gradient(115deg, rgba(255,255,255,.42), rgba(255,255,255,.79) 62%, rgba(255,255,255,.93)),
      var(--ws-artwork-image-v955, linear-gradient(115deg, rgba(100,116,139,.14), rgba(255,255,255,.02))),
      linear-gradient(115deg, var(--ws-artwork-accent-soft-v955, transparent), var(--ws-artwork-accent-faint-v955, transparent)) !important;
    border-color: var(--ws-artwork-accent-v955, rgba(15,23,42,.2)) !important;
    box-shadow: inset 0 0 0 1px var(--ws-artwork-shadow-v955, rgba(15,23,42,.14)) !important;
  }

  html body.be-dark-mode track-table table.material-table.mobile tr.track-list-row.wavswap-mobile-row-v474.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
  html body.dark track-table table.material-table.mobile tr.track-list-row.wavswap-mobile-row-v474.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
  html body.be-dark-mode channel-track-table table.material-table.mobile tr.track-list-row.wavswap-mobile-row-v474.wavswap-artwork-accent-v955[data-wavswap-artwork-accent],
  html body.dark channel-track-table table.material-table.mobile tr.track-list-row.wavswap-mobile-row-v474.wavswap-artwork-accent-v955[data-wavswap-artwork-accent] {
    background-image:
      linear-gradient(115deg, rgba(8,13,22,.48), rgba(12,18,29,.79) 62%, rgba(18,24,34,.94)),
      var(--ws-artwork-image-v955, linear-gradient(115deg, rgba(100,116,139,.18), rgba(18,24,34,.04))),
      linear-gradient(115deg, var(--ws-artwork-accent-soft-v955, transparent), var(--ws-artwork-accent-faint-v955, transparent)) !important;
  }

  html body track-table tr.track-list-row.wavswap-artwork-accent-v955 td,
  html body channel-track-table tr.track-list-row.wavswap-artwork-accent-v955 td {
    background-color: transparent !important;
    border-color: var(--ws-artwork-accent-v955, rgba(15,23,42,.18)) !important;
  }

  html body.be-dark-mode track-table tr.track-list-row.wavswap-artwork-accent-v955,
  html body.dark track-table tr.track-list-row.wavswap-artwork-accent-v955,
  html body.be-dark-mode channel-track-table tr.track-list-row.wavswap-artwork-accent-v955,
  html body.dark channel-track-table tr.track-list-row.wavswap-artwork-accent-v955 {
    background-image:
      linear-gradient(115deg, rgba(8,13,22,.5), rgba(12,18,29,.82) 62%, rgba(18,24,34,.96)),
      var(--ws-artwork-image-v955, linear-gradient(115deg, rgba(100,116,139,.18), rgba(18,24,34,.04))),
      linear-gradient(115deg, var(--ws-artwork-accent-soft-v955, transparent), var(--ws-artwork-accent-faint-v955, transparent)) !important;
  }
}
