/* Color station artwork forms the tile background; a readable lower panel
   carries the real guide listing. No filters recolor or desaturate artwork. */
html:root body .channel-tile.sl-live-tile{position:relative;isolation:isolate;min-height:268px;padding:0!important;overflow:hidden;border:1px solid var(--line);border-radius:18px!important;background:var(--sg-panel,#121215)!important;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:inset 0 1px 0 var(--sg-highlight,#ffffff20),0 8px 24px var(--sg-shadow,#0003)!important}
html:root body .sl-live-tile>.tile-art{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;aspect-ratio:auto!important;margin:0!important;border:0!important;border-radius:inherit!important;background:radial-gradient(ellipse at 50% 26%,rgba(235,240,245,.92),rgba(195,205,215,.78) 46%,rgba(var(--channel-rgb,100,110,125),.2) 86%)!important;box-shadow:none!important}
html:root body .sl-live-tile>.tile-art::before{opacity:0!important}
html:root body .sl-live-tile>.tile-art>img.loaded{position:absolute!important;inset:16px 6% auto!important;width:88%!important;height:calc(50% - 24px)!important;max-width:none!important;max-height:none!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:center!important;padding:8px!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;transform:none!important;filter:none!important;opacity:1!important}
html:root body .sl-live-tile .tile-initials{position:absolute;inset:40px 10px auto;height:90px;display:grid;place-items:center;color:#24323f;font-size:38px;font-weight:800;text-shadow:none}
html:root body .sl-live-tile>.sl-live-copy{position:relative;z-index:3;pointer-events:none;display:flex;flex-direction:column;gap:6px;padding:16px 16px 13px;min-height:134px;margin-top:134px;border-top:1px solid var(--line);background:linear-gradient(180deg,rgba(13,13,16,.88),rgba(8,8,10,.97));color:#f4f4f6;box-shadow:inset 0 1px 0 #ffffff0c}
html:root[data-theme="light"] body .sl-live-tile>.sl-live-copy{background:linear-gradient(180deg,rgba(244,247,250,.9),rgba(239,243,247,.97));color:#202b33}
html:root body .sl-live-copy>strong{font-size:12px!important;font-weight:600;line-height:1.35;color:inherit!important;margin:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html:root body .sl-live-copy>small{font-size:9px!important;font-weight:750;line-height:1.2;letter-spacing:.12em;color:var(--accent)!important;margin:2px 0 0!important}
html:root body .sl-live-copy>.tile-description{font-size:16px!important;line-height:1.3!important;font-weight:700!important;color:inherit!important;margin:0!important;white-space:normal!important;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;min-height:2.6em;max-height:2.6em}
html:root body .sl-tile-airtime{font-size:11px;line-height:1.4;color:#bfc4cc}
html:root[data-theme="light"] body .sl-tile-airtime{color:#52616c}
.sl-tile-progress{height:2px;background:#ffffff24;display:block;margin-top:3px;overflow:hidden}
.sl-tile-progress>i{display:block;height:100%;background:var(--accent)}
html[data-theme="light"] .sl-tile-progress{background:#1a2b3924}
.sl-tile-progress[hidden]{display:none}
/* Guide logos retain their original colors, with a profile-accent backing.
   The existing image contrast detector selects a dark base for white marks. */
html:root body #channelArea .guide-row .channel-cell .channel-logo{
  background:linear-gradient(135deg,rgba(var(--accent-rgb),.28),rgba(var(--accent-rgb),.12)),#e7ebef!important;
  border:1px solid rgba(var(--accent-rgb),.42)!important;border-radius:9px!important;padding:2px!important;position:relative;
  box-shadow:inset 0 1px 0 #ffffff40!important;
}
html:root body #channelArea .guide-row .channel-cell .channel-logo.logo-is-light{
  background:linear-gradient(135deg,rgba(var(--accent-rgb),.32),rgba(var(--accent-rgb),.15)),#16191e!important;
}
html:root body #channelArea .guide-row .channel-cell .channel-logo:not(.has-image){color:#202b33!important}
html:root body #channelArea .guide-row .channel-cell .channel-logo img{background:transparent!important;filter:drop-shadow(0 1px 1px #0008)!important;object-fit:contain!important}
html:root body #channelArea .guide-row .channel-cell .channel-logo img.guide-logo-fitted{
  position:absolute!important;left:var(--guide-logo-left)!important;top:var(--guide-logo-top)!important;
  width:var(--guide-logo-width)!important;height:var(--guide-logo-height)!important;
  max-width:none!important;max-height:none!important;padding:0!important;margin:0!important;transform:none!important;
}
html:root body .sl-live-tile .tile-art>.favorite-star{z-index:5}
html:root body .sl-live-tile .tile-art>.tile-play{bottom:auto;top:60px;z-index:4}
/* Curated artwork is centered within the header above the listing panel. */
html:root body .sl-live-tile>.tile-art>img.station-logo-tile.loaded.has-image[src*="streamline-curated.png"]{top:67px!important}
@media(max-width:600px){html:root body .channel-tile.sl-live-tile{min-height:235px}html:root body .sl-live-tile>.sl-live-copy{padding:12px 10px;gap:5px;margin-top:110px;min-height:125px}html:root body .sl-live-copy>.tile-description{font-size:14px!important}html:root body .sl-live-copy>strong{font-size:11px!important}html:root body .sl-tile-airtime{font-size:10px}html:root body .sl-live-tile>.tile-art>img.loaded{height:calc(47% - 20px)!important;inset:10px 6% auto!important}}

html:root body .sl-live-tile>.tile-art:has(>img.logo-is-light){background:radial-gradient(ellipse at 50% 26%,rgba(var(--accent-rgb),.2),transparent 80%),#252b34!important}
@media(max-width:600px){html:root body .sl-live-tile>.tile-art>img.station-logo-tile.loaded.has-image[src*="streamline-curated.png"]{top:55px!important}}
