:where(.llwp-music){--llwp-card:#16202a;--llwp-text:#f2f6fa;--llwp-muted:#8fa3b5;--llwp-accent:#ffd23f;--llwp-on-accent:#16202a;--llwp-line:#3b4650;--llwp-radius:14px;--llwp-gap:22px;--llwp-min:240px;--llwp-thumb:76px}
@media(max-width:767px){:where(.llwp-music){--llwp-gap:12px}}
.llwp-music.llwp-music{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--llwp-min),1fr));gap:var(--llwp-gap);font-family:inherit;line-height:1.3;color:var(--llwp-text)}
.llwp-music.llwp-music *{box-sizing:border-box}
.llwp-music.llwp-music .llwp-card{background:var(--llwp-card);border-radius:var(--llwp-radius);overflow:hidden;align-self:start}
.llwp-music.llwp-music .llwp-media{position:relative;aspect-ratio:1;background:linear-gradient(135deg,#2b3a48,#101820);overflow:hidden}
.llwp-music.llwp-music .llwp-media img,.llwp-music.llwp-music .llwp-media .llwp-cover{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;object-fit:cover;display:block}
.llwp-music.llwp-music .llwp-play{position:absolute;inset:0;width:100%;height:100%;display:grid;place-items:center;margin:0;padding:0;background:none;border:0;border-radius:0;box-shadow:none;cursor:pointer}
.llwp-music.llwp-music .llwp-play:hover,.llwp-music.llwp-music .llwp-play:focus{background:none}
.llwp-music.llwp-music .llwp-play svg{width:56px;height:56px;padding:16px;border-radius:50%;background:var(--llwp-accent);fill:var(--llwp-on-accent);box-shadow:0 4px 18px rgba(0,0,0,.45);transition:transform .15s,opacity .15s}
.llwp-music.llwp-music .llwp-play:hover svg{transform:scale(1.08)}
@media(hover:hover){
  .llwp-music.llwp-music .llwp-play svg{opacity:0}
  .llwp-music.llwp-music .llwp-media:hover .llwp-play svg,.llwp-music.llwp-music .llwp-media.playing .llwp-play svg{opacity:1}
}
.llwp-music.llwp-music .llwp-bar{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.22);pointer-events:none}
.llwp-music.llwp-music .llwp-bar i{display:block;height:100%;width:0;background:var(--llwp-accent)}
.llwp-music.llwp-music .llwp-video{position:absolute;inset:0;background:#000;z-index:3;overflow:hidden}
.llwp-music.llwp-music .llwp-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0;background:#000}
/* 16:9 YouTube video cropped to a centered square */
.llwp-music.llwp-music .llwp-video iframe{position:absolute;top:0;left:50%;width:177.78%;height:100%;transform:translateX(-50%);border:0;background:#000}
.llwp-music.llwp-music .llwp-close{position:absolute;top:8px;right:8px;z-index:4;width:32px;height:32px;padding:0;margin:0;border:0;border-radius:50%;background:rgba(0,0,0,.65);color:#fff;font-size:16px;line-height:1;box-shadow:none;cursor:pointer}
.llwp-music.llwp-music .llwp-close:hover{background:rgba(0,0,0,.85);color:#fff}
.llwp-music.llwp-music .llwp-info{padding:12px 14px 4px}
.llwp-music.llwp-music .llwp-info h3{margin:0;padding:0;font-size:1.05rem;font-weight:600;color:var(--llwp-text);line-height:1.25}
.llwp-music.llwp-music .llwp-info p{margin:3px 0 0;font-size:.85rem;color:var(--llwp-muted)}
.llwp-music.llwp-music .llwp-toggle{display:flex;justify-content:space-between;align-items:center;width:100%;margin:0;padding:12px 14px;background:none;border:0;border-radius:0;box-shadow:none;color:var(--llwp-muted);font:inherit;font-size:.9rem;text-align:left;text-transform:none;letter-spacing:normal;cursor:pointer}
.llwp-music.llwp-music .llwp-toggle:hover,.llwp-music.llwp-music .llwp-toggle:focus{background:none;color:var(--llwp-accent)}
.llwp-music.llwp-music .llwp-toggle svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2.5;transition:transform .25s}
.llwp-music.llwp-music .open .llwp-toggle svg{transform:rotate(180deg)}
.llwp-music.llwp-music .llwp-links{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}
.llwp-music.llwp-music .open .llwp-links{grid-template-rows:1fr}
.llwp-music.llwp-music .llwp-links>div{overflow:hidden;min-height:0}
.llwp-music.llwp-music .llwp-pills{display:flex;flex-wrap:wrap;gap:8px;padding:2px 14px 14px}
.llwp-music.llwp-music .llwp-pills a{padding:7px 14px;border:1px solid var(--llwp-line);border-radius:999px;color:var(--llwp-text);font-size:.85rem;text-decoration:none;transition:border-color .15s,color .15s}
.llwp-music.llwp-music .llwp-pills a:hover{border-color:var(--llwp-accent);color:var(--llwp-accent)}
.llwp-music.llwp-music button:focus-visible,.llwp-music.llwp-music a:focus-visible{outline:2px solid var(--llwp-accent);outline-offset:-2px}
@media(prefers-reduced-motion:reduce){.llwp-music.llwp-music *{transition:none!important}}

/* phones */
@media(max-width:767px){
  .llwp-music.llwp-music.llwp-m-grid{grid-template-columns:repeat(2,1fr)}
  .llwp-music.llwp-music.llwp-m-grid .llwp-play svg{width:46px;height:46px;padding:13px}
  .llwp-music.llwp-music.llwp-m-grid .llwp-info{padding:10px 12px 2px}
  .llwp-music.llwp-music.llwp-m-grid .llwp-toggle{padding:10px 12px;font-size:.85rem}
  .llwp-music.llwp-music.llwp-m-grid .llwp-pills{padding:2px 12px 12px}

  .llwp-music.llwp-music.llwp-m-list{grid-template-columns:1fr}
  .llwp-music.llwp-music.llwp-m-list .llwp-card{display:grid;grid-template-columns:var(--llwp-thumb) 1fr auto;grid-template-areas:"m i t" "l l l";align-items:center}
  .llwp-music.llwp-music.llwp-m-list .llwp-card.vid{grid-column:1;grid-template-columns:1fr auto;grid-template-areas:"m m" "i t" "l l"}
  .llwp-music.llwp-music.llwp-m-list .llwp-media{grid-area:m;aspect-ratio:auto;width:var(--llwp-thumb);height:var(--llwp-thumb)}
  .llwp-music.llwp-music.llwp-m-list .llwp-card.vid .llwp-media{width:100%;height:auto;aspect-ratio:1}
  .llwp-music.llwp-music.llwp-m-list .llwp-info{grid-area:i;min-width:0;padding:8px 12px}
  .llwp-music.llwp-music.llwp-m-list .llwp-info h3,.llwp-music.llwp-music.llwp-m-list .llwp-info p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .llwp-music.llwp-music.llwp-m-list .llwp-toggle{grid-area:t;align-self:stretch;width:auto;padding:0 16px}
  .llwp-music.llwp-music.llwp-m-list .llwp-lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .llwp-music.llwp-music.llwp-m-list .llwp-links{grid-area:l}
  .llwp-music.llwp-music.llwp-m-list .llwp-play svg{opacity:1;width:34px;height:34px;padding:9px}
  .llwp-music.llwp-music.llwp-m-list .llwp-pills{padding:2px 12px 12px}
}

/* SoundCloud player (hidden) + waveform on the cover */
.llwp-music.llwp-music .llwp-sc{position:absolute;inset:0;opacity:0;pointer-events:none;z-index:0}
.llwp-music.llwp-music .llwp-sc iframe{display:block;width:100%;height:100%;border:0}
.llwp-music.llwp-music .sc-show .llwp-sc{opacity:1;pointer-events:auto;z-index:3}
.llwp-music.llwp-music .llwp-wave{position:absolute;left:0;right:0;bottom:0;z-index:1;height:46px;padding:0 10px 8px;display:flex;align-items:flex-end;gap:1px;background:linear-gradient(transparent,rgba(0,0,0,.55));cursor:pointer;touch-action:none}
.llwp-music.llwp-music .llwp-wave i{flex:1;min-width:1px;border-radius:1px;background:rgba(255,255,255,.35)}
.llwp-music.llwp-music .llwp-wave i.r{background:rgba(255,255,255,.75)}
.llwp-music.llwp-music .llwp-wave i.on{background:var(--llwp-accent)}
.llwp-music.llwp-music .has-wave .llwp-bar{display:none}
@media(max-width:767px){.llwp-music.llwp-music.llwp-m-list .llwp-wave{height:28px;padding:0 4px 4px}}

/* simulated waveform: bars underneath, transparent range slider on top */
.llwp-music.llwp-music .llwp-seek{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:pointer;background:none;-webkit-appearance:none;appearance:none}
.llwp-music.llwp-music .llwp-sim:has(.llwp-seek:focus-visible){outline:2px solid var(--llwp-accent);outline-offset:-2px}
