.stp{--stp-size:min(72vw,520px);--stp-base-light:#ececea;--stp-base-dark:#232324;--stp-base:var(--stp-base-light);--stp-accent:var(--accent);--stp-dimple:rgba(0,0,0,0.12);--stp-highlight:rgba(255,255,255,0.28);--stp-highlight-soft:rgba(255,255,255,0.06);--stp-shadow-inner:rgba(0,0,0,0.16);--stp-fg:var(--fg);--stp-fg-dim:var(--fg-soft);display:flex;flex-direction:column;align-items:center;gap:1.8rem;width:100%;user-select:none;-webkit-user-select:none}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .stp{--stp-base:var(--stp-base-dark);--stp-dimple:rgba(0,0,0,0.35);--stp-highlight:rgba(255,255,255,0.10);--stp-highlight-soft:rgba(255,255,255,0.03);--stp-shadow-inner:rgba(0,0,0,0.42)}}:root[data-theme=dark] .stp{--stp-base:var(--stp-base-dark);--stp-dimple:rgba(0,0,0,0.35);--stp-highlight:rgba(255,255,255,0.10);--stp-highlight-soft:rgba(255,255,255,0.03);--stp-shadow-inner:rgba(0,0,0,0.42)}.stp_body{position:relative;width:var(--stp-size);height:var(--stp-size);border-radius:50%;background:var(--stp-base);background-image:radial-gradient(ellipse 70% 50% at 45% 28%,var(--stp-highlight),transparent),radial-gradient(circle at 50% 50%,var(--stp-highlight-soft),transparent 65%),radial-gradient(ellipse 80% 40% at 50% 78%,var(--stp-shadow-inner),transparent);box-shadow:inset 0 2px 8px rgba(255,255,255,.12),inset 0 -3px 10px var(--stp-shadow-inner);cursor:default;touch-action:none;perspective:800px;will-change:transform;flex-shrink:0}.stp_body:after{content:"";position:absolute;left:8%;right:8%;bottom:-10px;height:20px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(0,0,0,.18) 0,transparent 70%);pointer-events:none;z-index:-1}.stp_tilt{width:100%;height:100%;border-radius:50%;transform-style:preserve-3d;will-change:transform}.stp_band{position:absolute;display:flex;align-items:center;justify-content:center;z-index:2;touch-action:none}.stp_band[data-dir=n]{top:10%;flex-direction:column}.stp_band[data-dir=n],.stp_band[data-dir=s]{left:50%;transform:translateX(-50%);width:20px;height:32%}.stp_band[data-dir=s]{bottom:10%;flex-direction:column-reverse}.stp_band[data-dir=e]{right:10%;flex-direction:row-reverse}.stp_band[data-dir=e],.stp_band[data-dir=w]{top:50%;transform:translateY(-50%);height:20px;width:32%}.stp_band[data-dir=w]{left:10%;flex-direction:row}.stp_led{width:8px;height:8px;border-radius:50%;flex-shrink:0;transition:transform .15s cubic-bezier(.16,1,.3,1)}.stp_band[data-dir=n] .stp_led,.stp_band[data-dir=s] .stp_led{margin:2.5px 0}.stp_band[data-dir=e] .stp_led,.stp_band[data-dir=w] .stp_led{margin:0 2.5px}.stp_led[data-on=false]{background:var(--stp-dimple);box-shadow:none}.stp_led[data-on=true]{background:var(--stp-accent);box-shadow:0 0 6px 1px var(--stp-accent),0 0 18px 3px color-mix(in srgb,var(--stp-accent) 40%,transparent)}.stp_led[data-on=true][data-pop=true]{transform:scale(1.25)}.stp_centre{width:64px;height:64px;border-radius:50%;z-index:3;cursor:pointer;border:none;padding:0;background:color-mix(in srgb,var(--stp-base) 88%,black);box-shadow:inset 0 2px 6px var(--stp-shadow-inner),inset 0 -1px 3px rgba(255,255,255,.06)}.stp_centre,.stp_centre:after{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.stp_centre:after{content:"";width:12px;height:12px;border-radius:50%;transition:background .3s ease,box-shadow .3s ease}.stp_centre[data-playing=false]:after{background:var(--stp-dimple);box-shadow:none}.stp_centre[data-playing=true]:after{background:var(--stp-accent);box-shadow:0 0 8px 2px var(--stp-accent),0 0 24px 4px color-mix(in srgb,var(--stp-accent) 35%,transparent)}.stp_centre:focus-visible{outline:2px solid var(--stp-accent);outline-offset:3px}.stp_info{text-align:center;display:flex;flex-direction:column;align-items:center;gap:.9rem}.stp_title{font-size:15px;font-weight:480;letter-spacing:-.01em;line-height:1.3;color:var(--stp-fg)}.stp_artist{font-size:13px;color:var(--stp-fg-dim);margin-top:-.5rem}.stp_dots{display:flex;gap:12px;align-items:center}.stp_dot{width:10px;height:10px;border-radius:50%;border:none;padding:0;cursor:pointer;transition:background .2s ease,opacity .2s ease;background:var(--stp-fg-dim)}.stp_dot[data-current=true]{background:var(--stp-accent)}.stp_dot[data-dead=true]{opacity:.3;cursor:not-allowed;text-decoration:line-through;position:relative}.stp_dot[data-dead=true]:after{content:"";position:absolute;top:50%;left:-2px;right:-2px;height:1.5px;background:var(--stp-fg-dim);transform:translateY(-50%)}.stp_dot:focus-visible{outline:2px solid var(--stp-accent);outline-offset:2px}.stp_band:focus-visible{outline:none}.stp_band:focus-visible .stp_led:last-child{outline:2px solid var(--stp-accent);outline-offset:3px;border-radius:50%}@media (prefers-reduced-motion:reduce){.stp_led{transition:none!important}.stp_body,.stp_tilt{will-change:auto}}.stp_layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:4vw;align-items:center;width:100%}.stp_stone_col{align-items:center;gap:1.8rem}.stp_list,.stp_stone_col{display:flex;flex-direction:column}.stp_list{gap:2px;outline:none;overflow-y:auto}.stp_row{display:grid;grid-template-columns:1.6rem minmax(0,1fr) auto;align-items:center;gap:.7rem;padding:.55rem .65rem;border-radius:12px;cursor:pointer;background:transparent;transition:background .15s ease;color:inherit}.stp_row:hover{background:rgba(255,255,255,.08)}.stp_row[data-stp-current=true]{background:rgba(255,255,255,.1)}.stp_row[data-stp-current=true] .stp_num{color:var(--stp-accent)}.stp_row[data-stp-dead=true]{opacity:.42;cursor:not-allowed}.stp_row[data-stp-dead=true]:hover{background:transparent}.stp_num{font-size:.68rem;font-variant-numeric:tabular-nums;color:var(--stp-fg-dim);letter-spacing:.04em}.stp_row_meta{display:flex;flex-direction:column;min-width:0;gap:.12rem}.stp_row_title{font-size:.86rem;line-height:1.25;color:var(--stp-fg)}.stp_row_artist,.stp_row_title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stp_row_artist,.stp_row_dur{font-size:.72rem;color:var(--stp-fg-dim)}.stp_row_dur{font-variant-numeric:tabular-nums;white-space:nowrap}.stp_unavailable{font-size:.62rem;letter-spacing:.04em;text-transform:uppercase;color:var(--stp-fg-dim);white-space:nowrap}.stp_mini_leds{display:flex;align-items:center;gap:4px}.stp_mini_led{width:6px;height:6px;border-radius:50%;background:var(--stp-accent);flex-shrink:0}.stp_mini_led[data-lit=true]{box-shadow:0 0 4px 1px color-mix(in srgb,var(--stp-accent) 50%,transparent)}@media (min-width:900px){.stp_dots{display:none}}@media (max-width:899px){.stp_layout{grid-template-columns:1fr}}.stp_list:focus-visible{outline:2px solid var(--stp-accent);outline-offset:2px}.stp_row:focus-visible{outline:2px solid var(--stp-accent);outline-offset:2px}