.sp-card{--sp-accent:#e5b878;--sp-accent-hi:#f2cf96;--sp-accent-lo:#e8a45c;--sp-on-accent:#171006;--sp-shadow:#1c1e2299;background:radial-gradient(120% 90% at 0% 0%, color-mix(in srgb, var(--sp-accent) 14%, transparent) 0%, transparent 55%), linear-gradient(180deg, #1a1d22 0%, #0e0f12 100%);box-shadow:inset 0 1px 0 #ffffff0d, 0 40px 80px -36px var(--sp-shadow);color:#f2efe9;border:1px solid #ffffff1a;border-radius:18px;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);display:grid;overflow:hidden}.sp-now{border-right:1px solid #ffffff12;flex-direction:column;gap:26px;padding:40px 40px 32px;display:flex}.sp-now__label{font-family:var(--font-geist-mono), monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--sp-accent);font-size:11px;font-weight:600}.sp-now__title{letter-spacing:-.02em;color:#fff;text-wrap:balance;margin-top:12px;font-size:clamp(28px,3.6vw,44px);font-weight:900;line-height:1.04}.sp-now__byline{color:#f2efe999;margin-top:8px;font-size:15px}.sp-wave{cursor:pointer;border-radius:6px;outline:none;align-items:center;gap:2px;height:96px;display:flex}.sp-wave:focus-visible{box-shadow:0 0 0 2px var(--sp-accent)}.sp-wave span{background:#ffffff29;border-radius:2px;flex:1 1 0;min-width:1px;transition:background .15s}.sp-wave span.is-played{background:linear-gradient(180deg, var(--sp-accent-hi) 0%, var(--sp-accent-lo) 100%)}.sp-wave:hover span:not(.is-played){background:#ffffff42}.sp-transport{justify-content:space-between;align-items:center;gap:16px;display:flex}.sp-time{min-width:40px;font-family:var(--font-geist-mono), monospace;color:#f2efe98c;font-variant-numeric:tabular-nums;font-size:12px}.sp-time:last-child{text-align:right}.sp-buttons{align-items:center;gap:18px;display:flex}.sp-play{appearance:none;background:linear-gradient(180deg, var(--sp-accent-hi) 0%, var(--sp-accent) 55%, var(--sp-accent-lo) 100%);width:68px;height:68px;color:var(--sp-on-accent);cursor:pointer;box-shadow:inset 0 1px 0 #ffffff80, 0 10px 30px -8px color-mix(in srgb, var(--sp-accent) 70%, transparent);border:0;border-radius:999px;justify-content:center;align-items:center;transition:transform .12s,box-shadow .2s;display:inline-flex}.sp-play:not(.is-playing) svg{margin-left:3px}.sp-play:hover{transform:scale(1.05)}.sp-play:active{transform:scale(.97)}.sp-play.is-playing{box-shadow:inset 0 1px 0 #ffffff80, 0 0 0 6px color-mix(in srgb, var(--sp-accent) 16%, transparent), 0 10px 34px -6px color-mix(in srgb, var(--sp-accent) 85%, transparent)}.sp-skip{appearance:none;color:#f2efe9cc;cursor:pointer;background:#ffffff0a;border:1px solid #ffffff1f;border-radius:999px;justify-content:center;align-items:center;width:40px;height:40px;transition:background .15s,color .15s;display:inline-flex}.sp-skip:hover{color:#fff;background:#ffffff1a}.sp-play:focus-visible,.sp-skip:focus-visible,.sp-row:focus-visible{outline:2px solid var(--sp-accent);outline-offset:2px}.sp-credit{letter-spacing:.04em;color:#f2efe973;margin-top:auto;font-size:12px}.sp-list{flex-direction:column;gap:2px;margin:0;padding:14px;list-style:none;display:flex}.sp-row{appearance:none;width:100%;color:inherit;text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px 16px;transition:background .15s,border-color .15s;display:grid}.sp-row:hover{background:#ffffff0d}.sp-row.is-active{background:color-mix(in srgb, var(--sp-accent) 10%, transparent);border-color:color-mix(in srgb, var(--sp-accent) 28%, transparent)}.sp-row__num{font-family:var(--font-geist-mono), monospace;color:#f2efe973;justify-content:center;align-items:center;font-size:12px;display:inline-flex}.sp-row.is-active .sp-row__num{color:var(--sp-accent)}.sp-row__text{flex-direction:column;gap:3px;min-width:0;display:flex}.sp-row__title{color:#fff;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:700;overflow:hidden}.sp-row__byline{color:#f2efe980;text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.sp-row__dur{font-family:var(--font-geist-mono), monospace;color:#f2efe973;font-variant-numeric:tabular-nums;font-size:12px}.sp-eq{align-items:flex-end;gap:2px;height:14px;display:inline-flex}.sp-eq i{background:var(--sp-accent);transform-origin:bottom;border-radius:1px;width:3px;height:100%;animation:.9s ease-in-out infinite sp-eq}.sp-eq i:nth-child(2){animation-delay:-.3s}.sp-eq i:nth-child(3){animation-delay:-.6s}@keyframes sp-eq{0%,to{transform:scaleY(.3)}50%{transform:scaleY(1)}}@media (prefers-reduced-motion:reduce){.sp-eq i{animation:none;transform:scaleY(.7)}}@media (max-width:860px){.sp-card{grid-template-columns:1fr}.sp-now{border-bottom:1px solid #ffffff12;border-right:0;gap:22px;padding:28px 22px 24px}.sp-wave{gap:1.5px;height:72px}.sp-list{padding:8px}.sp-row{padding:12px}}.sp-foot{flex-direction:column;gap:14px;margin-top:auto;display:flex}.sp-chain{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.sp-chain li{background:#ffffff0a;border:1px solid #ffffff1a;border-radius:999px;align-items:baseline;gap:8px;padding:7px 12px;font-size:13px;line-height:1.2;display:inline-flex}.sp-chain__role{font-family:var(--font-geist-mono), monospace;letter-spacing:.14em;text-transform:uppercase;color:#f2efe980;font-size:10px;font-weight:600}.sp-chain__plugin{color:#fff;font-weight:700}.sp-chain__plugin--link{text-decoration:underline;-webkit-text-decoration-color:color-mix(in srgb, var(--sp-accent) 55%, transparent);text-decoration-color:color-mix(in srgb, var(--sp-accent) 55%, transparent);text-underline-offset:3px}.sp-chain__plugin--link:hover{color:var(--sp-accent)}
