/* Ported from the original IceMoon C-Conductor player. */
.ice-live__panel {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-color: rgba(255, 255, 255, 0.25);
}

.ice-live__panel::after {
  content: '';
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle, rgba(0, 0, 0, 0.94) 0 0.65px, transparent 0.8px) 0 0
      / 5px 5px,
    radial-gradient(circle, rgba(0, 0, 0, 0.72) 0 0.5px, transparent 0.7px) 2px
      3px / 9px 9px;
  mix-blend-mode: multiply;
  opacity: 0.32;
}

.broadcast-player__artwork-stack {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  overflow: hidden;
  opacity: 0.5;
  pointer-events: none;
}

.broadcast-player__artwork-layer {
  position: absolute;
  inset: -2px;
  display: block;
  background-repeat: no-repeat;
  background-position: center 46%;
  background-size: cover;
  transform-origin: center;
  transition:
    opacity 95ms linear,
    transform 130ms ease-out,
    filter 130ms ease-out;
}

.broadcast-player__artwork-layer--blue {
  background-image:
    linear-gradient(rgba(0, 105, 150, 0.52), rgba(0, 40, 64, 0.18)),
    url('../assets/001-comic-dark-v1.png');
  background-blend-mode: color;
  filter: brightness(0.42) contrast(1.34) saturate(1.2);
  opacity: 0.11;
  transform: scale(1.004);
}

.broadcast-player__artwork-layer--reverse {
  background-image: url('../assets/001-comic-reverse-v2.png');
  filter: grayscale(1) brightness(0.68) contrast(1.55);
  mix-blend-mode: multiply;
  opacity: 0.01;
  transform: translate3d(0.5px, -0.5px, 0) scale(1.006);
}

.broadcast-player__artwork-layer--orange {
  background-image:
    linear-gradient(rgba(255, 112, 20, 0.96), rgba(164, 52, 6, 0.88)),
    url('../assets/001-comic-dark-v1.png');
  background-blend-mode: color;
  filter: brightness(0.56) contrast(1.48) saturate(1.55);
  mix-blend-mode: screen;
  opacity: 0;
  transform: translate3d(-1px, 0.75px, 0) rotate(0.035deg) scale(1.006);
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='1']
  .broadcast-player__artwork-layer--blue {
  opacity: calc(0.14 + var(--audio-snare) * 0.04 + var(--audio-groove) * 0.035);
  transform: scale(calc(1.004 + var(--audio-groove) * 0.008));
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='2']
  .broadcast-player__artwork-layer--blue {
  opacity: 0.105;
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='2']
  .broadcast-player__artwork-layer--reverse {
  opacity: calc(0.032 + var(--audio-snare) * 0.028);
  transform: translate3d(1px, -0.75px, 0) scale(1.007);
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='3']
  .broadcast-player__artwork-layer--blue {
  opacity: 0.1;
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='3']
  .broadcast-player__artwork-layer--orange {
  opacity: calc(0.04 + var(--audio-snare) * 0.05 + var(--audio-groove) * 0.025);
  transform: translate3d(-1.5px, 1px, 0) rotate(0.045deg) scale(1.008);
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='4']
  .broadcast-player__artwork-layer--blue {
  opacity: calc(0.12 + var(--audio-mid) * 0.035);
  transform: translate3d(0.4px, -0.25px, 0) scale(1.006);
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='4']
  .broadcast-player__artwork-layer--reverse {
  opacity: 0.03;
  transform: translate3d(0.75px, -0.5px, 0) scale(1.007);
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='4']
  .broadcast-player__artwork-layer--orange {
  opacity: calc(0.028 + var(--audio-groove) * 0.025);
  transform: translate3d(-0.75px, 0.5px, 0) rotate(0.02deg) scale(1.007);
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='5']
  .broadcast-player__artwork-layer--blue {
  opacity: calc(0.145 + var(--audio-groove) * 0.04);
  transform: translate3d(-0.5px, 0.25px, 0) scale(1.009);
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='5']
  .broadcast-player__artwork-layer--reverse {
  opacity: 0.014;
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='5']
  .broadcast-player__artwork-layer--orange {
  opacity: 0.018;
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='6']
  .broadcast-player__artwork-layer--blue {
  opacity: 0.105;
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='6']
  .broadcast-player__artwork-layer--reverse {
  opacity: calc(0.043 + var(--audio-snare) * 0.03);
  transform: translate3d(-1px, 0.8px, 0) scale(1.008);
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='6']
  .broadcast-player__artwork-layer--orange {
  opacity: 0.02;
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='7']
  .broadcast-player__artwork-layer--blue {
  opacity: calc(0.12 + var(--audio-mid) * 0.025);
  transform: translate3d(0.25px, 0.25px, 0) scale(1.006);
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='7']
  .broadcast-player__artwork-layer--reverse {
  opacity: 0.02;
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='7']
  .broadcast-player__artwork-layer--orange {
  opacity: calc(0.05 + var(--audio-snare) * 0.04 + var(--audio-groove) * 0.025);
  transform: translate3d(-1.1px, 0.65px, 0) rotate(0.035deg) scale(1.008);
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='0']
  .broadcast-player__artwork-layer--blue {
  opacity: calc(0.13 + var(--audio-mid) * 0.03);
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='0']
  .broadcast-player__artwork-layer--reverse {
  opacity: 0.022;
}

.ice-live__panel[data-audio-active='true'][data-artwork-beat='0']
  .broadcast-player__artwork-layer--orange {
  opacity: calc(0.028 + var(--audio-groove) * 0.032);
  transform: translate3d(-0.75px, 0.5px, 0) rotate(0.02deg) scale(1.006);
}

.ice-live__panel > :not(.broadcast-player__artwork-stack) {
  position: relative;
  z-index: 2;
}

.ice-live__panel[data-audio-active='true'] .frequency-signal {
  opacity: calc(
    0.04 + var(--audio-mid) * 0.12 + var(--audio-snare) * 0.24 +
      var(--audio-groove) * 0.08
  );
}


.frequency-signal {
  position: relative;
  display: grid;
  grid-template-columns: repeat(24, minmax(0, 1fr));
  align-items: center;
  gap: clamp(1px, 0.22vw, 3px);
  width: 100%;
  height: 1.125rem;
  overflow: hidden;
  pointer-events: none;
  opacity: 0.16;
  mask-image: linear-gradient(
    90deg,
    transparent,
    black 7%,
    black 93%,
    transparent
  );
  transition: opacity 180ms ease-out;
}

.frequency-signal::before {
  content: '';
  position: absolute;
  z-index: -1;
  top: 50%;
  right: 0;
  left: 0;
  height: 1px;
  background: rgba(255, 255, 255, 0.1);
}

.frequency-signal > span {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    180deg,
    transparent 3%,
    color-mix(in srgb, var(--primary) 48%, transparent) 29%,
    color-mix(in srgb, var(--primary) 92%, white 8%) 50%,
    color-mix(in srgb, var(--primary) 48%, transparent) 71%,
    transparent 97%
  );
  box-shadow: 0 0 7px color-mix(in srgb, var(--primary) 38%, transparent);
  transform: scaleY(calc(0.035 + var(--spectrum-level, 0) * 0.965));
  transform-origin: center;
  transition: transform 72ms linear;
}


/* Preserve the approved cover/control arrangement; scope effects to the panel. */
.ice-live__panel{--primary:var(--ice-accent);min-width:0}
.ice-live .ice-live__heading{padding:18px 24px}
.ice-live .ice-live__controls{padding:16px 24px}
.ice-live .ice-live__timeline{padding:0 24px 10px}
.ice-live__frequency{padding:0 24px 3px}
.ice-live__settings{display:flex;align-items:center;justify-content:space-between;gap:8px 18px;flex-wrap:wrap;padding:6px 24px;border-top:1px solid #29414a;font:10px/1.4 Arial,sans-serif;letter-spacing:.07em;text-transform:uppercase}
.ice-live__settings a{color:var(--ice-accent);display:inline-flex;align-items:center;min-height:36px;text-decoration:none}
.ice-live__comfort{display:flex;align-items:center;gap:10px;min-height:36px;color:#afc3cc}
.ice-live__comfort output{min-width:22px;color:var(--ice-accent)}
.ice-live .ice-live__comfort button{position:relative;display:inline-block;width:42px;min-width:42px;height:24px;min-height:24px;border:1px solid #627680;border-radius:20px;padding:2px;background:#172a30;touch-action:manipulation}
.ice-live__comfort button span{display:block;width:18px;height:18px;border-radius:50%;background:#cbd6db;transition:transform .12s ease}
.ice-live .ice-live__comfort button[aria-checked=true]{background:var(--ice-accent);border-color:var(--ice-accent)}
.ice-live__comfort button[aria-checked=true] span{transform:translateX(17px);background:#00171d}
.ice-live__local-note{color:#8199a4;font-size:9px}
.ice-live[data-state=error] .ice-live__status{color:#ffa6a6}
.ice-live__panel:not([data-audio-active=true]) .frequency-signal{opacity:.08}
.ice-live__panel .frequency-signal{min-width:0}
@media(max-width:720px){.ice-live .ice-live__heading,.ice-live .ice-live__controls{padding:16px 20px}.ice-live__frequency{padding:0 20px 3px}.ice-live .ice-live__timeline{padding:0 20px 12px}.ice-live__settings{padding:7px 20px}.ice-live__comfort{min-height:44px}.ice-live__settings a{min-height:44px}}
@media(prefers-reduced-motion:reduce){.ice-live .frequency-signal>span{transform:scaleY(.035);transition:none}.ice-live .broadcast-player__artwork-layer,.ice-live__comfort button span{transition:none}}

/* Keep the live spectrum raised on both Broadcast and standalone Listen. */
.ice-live--live .ice-live__frequency > .frequency-signal {
  transform: translateY(-8px);
}