/* Season 1 Soundtrack (soundtrack.html): the site's tokens (site.css), one card per track */
.st{padding-top:calc(var(--head) + 40px)}
.st-note{margin-top:10px;color:var(--faint);font:500 14px/1.5 var(--body)}
.tracks{display:grid;gap:14px;margin:34px auto 0;max-width:860px;counter-reset:t}
.trk{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px 18px;transition:border-color .2s,box-shadow .2s}
.trk.on{border-color:var(--pink);box-shadow:0 0 0 1px var(--pink),0 10px 40px rgba(255,79,184,.18)}
.trk-top{display:flex;align-items:center;gap:14px}
.trk .no{font:400 30px/1 var(--display);color:var(--gold);min-width:44px}
.trk .meta{flex:1;min-width:0}
.trk h3{font:400 24px/1.1 var(--display);letter-spacing:.02em;color:var(--text);overflow-wrap:anywhere}
.trk .sub{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:5px;font:600 14px/1.3 var(--cond);letter-spacing:.06em;text-transform:uppercase}
.trk .lane{color:var(--cyan)}.trk .set{color:var(--muted)}
.trk .set::before{content:"\25B8  ";color:var(--pink)}
.trk .len{font:600 16px/1 var(--mono);color:var(--muted)}
.trk audio{display:block;width:100%;margin-top:12px;height:40px;color-scheme:dark}
.lyr{margin-top:10px}
.lyr summary{cursor:pointer;font:700 14px/1 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--pink);padding:6px 0;width:max-content}
.lyr-body{margin-top:8px;padding:12px 14px;border-radius:12px;background:var(--ink2);color:var(--muted);font:400 16px/1.55 var(--body);max-height:340px;overflow:auto}
.lyr-body .sec{margin-top:10px;font:700 12px/1.2 var(--cond);letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.lyr-body .sec:first-child{margin-top:0}
.st-cta{text-align:center;margin-top:34px}
@media (max-width:560px){.trk{padding:14px}.trk .no{font-size:24px;min-width:34px}.trk h3{font-size:20px}.trk .len{font-size:14px}}
.st-hero{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:34px;align-items:center;max-width:980px;margin:0 auto}
.st-cover{display:block;border-radius:18px;overflow:hidden;box-shadow:0 0 0 1px var(--line),0 18px 60px rgba(255,79,184,.28),0 0 90px rgba(79,216,255,.12)}
.st-cover img{width:100%;height:auto}
.st-head{text-align:left}
.st-head .lead{margin-left:0;margin-right:0}
@media (max-width:820px){.st-hero{grid-template-columns:1fr;gap:22px;justify-items:center}.st-cover{max-width:420px}.st-head{text-align:center}}
.trk .share{display:inline-flex;align-items:center;gap:6px;margin-left:4px;padding:7px 11px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--pink);font:700 13px/1 var(--cond);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.trk .share:hover{border-color:var(--pink)}
.trk .share.ok{color:var(--gold);border-color:var(--gold)}
.trk .share svg{width:15px;height:15px}
.trk.target{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 10px 40px rgba(255,210,63,.18)}
.tap-play{display:block;width:100%;margin-top:12px;padding:14px 16px;border:0;border-radius:12px;background:var(--pink);color:#fff;font:400 22px/1.1 var(--display);letter-spacing:.03em;cursor:pointer;animation:tp 1.4s ease-in-out infinite}
@keyframes tp{0%,100%{box-shadow:0 0 0 0 rgba(255,79,184,.55)}50%{box-shadow:0 0 0 10px rgba(255,79,184,0)}}
@media (max-width:560px){.trk .share span{display:none}.trk .share{padding:8px}}
