.studio-player{--sp-accent:#5dffb0;--sp-teal:#2dd4bf;--sp-amber:#fbbf24;--sp-bg:#02061766;--sp-border:#ffffff1c;--sp-text:#dbeafe;--sp-muted:#7dd3c7;--sp-dim:#64748b;isolation:isolate;border:1px solid var(--sp-border);background:radial-gradient(circle at 92% 8%, #fbbf2414, transparent 42%), radial-gradient(circle at 8% 12%, #2dd4bf26, transparent 42%), linear-gradient(180deg, var(--sp-bg) 0%, #02061770 100%);backdrop-filter:blur(32px)saturate(1.28);color:var(--sp-text);border-radius:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:13px;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff1f,inset 0 -18px 42px #02061738,0 0 0 1px #0000002e,0 0 15px #f59e0b66,0 0 60px #f59e0b26,0 20px 68px #00000070,-14px 0 44px #2dd4bf1a}.studio-player-fixed{z-index:15;position:sticky;top:3.75rem;box-shadow:inset 0 1px #ffffff1f,inset 0 -18px 42px #02061747,0 0 0 1px #00000047,0 0 16px #f59e0b75,0 0 68px #f59e0b2e,0 22px 72px #00000094,-16px 0 48px #2dd4bf1c}.sp-bar{align-items:center;gap:.75rem;padding:.875rem 1rem;display:flex}.sp-transport{flex-shrink:0;align-items:center;gap:.125rem;display:flex}.sp-btn{color:var(--sp-muted);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:1px solid #0000;border-radius:.5rem;justify-content:center;align-items:center;min-width:36px;min-height:36px;padding:.375rem;transition:color .15s,background .15s,border-color .15s,box-shadow .15s;display:inline-flex}.sp-btn:hover,.sp-btn:active{color:var(--sp-accent);background:#5dffb014;border-color:#5dffb029;box-shadow:0 0 18px #5dffb014}.sp-play{width:2.75rem;height:2.75rem;color:var(--sp-accent);background:radial-gradient(circle at 65% 35%,#fbbf2433,#0000 58%),#5dffb01a;border:1.5px solid #5dffb047;border-radius:50%;box-shadow:inset 0 1px #ffffff1f,0 0 24px #5dffb02e}.sp-play:hover,.sp-play:active{background:radial-gradient(circle at 65% 35%,#fbbf2442,#0000 58%),#5dffb029;border-color:#5dffb066;box-shadow:inset 0 1px #ffffff2e,0 0 28px #5dffb047,0 0 44px #fbbf241a}.sp-loop[data-mode=track],.sp-loop[data-mode=playlist]{color:var(--sp-accent);background:#5dffb014;border-color:#5dffb033;box-shadow:0 0 14px #5dffb01f}.sp-loop{width:5.5rem;color:var(--sp-muted);box-shadow:none;background:0 0;border-color:#0000;grid-template-columns:16px minmax(0,1fr);place-items:center start;gap:.45rem;padding-inline:.55rem .65rem;display:inline-grid}.sp-loop-icon{opacity:.9;flex:none}.sp-loop-label{text-transform:uppercase;letter-spacing:.2em;text-align:left;white-space:nowrap;width:100%;font-size:10px;line-height:1}.sp-loop:hover,.sp-loop:active{color:var(--sp-accent)}.sp-loop[data-mode=track]:hover,.sp-loop[data-mode=track]:active,.sp-loop[data-mode=playlist]:hover,.sp-loop[data-mode=playlist]:active{background:#5dffb01f;border-color:#5dffb047;box-shadow:0 0 16px #5dffb029}.sp-info{flex-direction:column;flex:1;gap:.25rem;min-width:0;display:flex}.sp-title{color:#f1f5f9;white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;text-decoration:none;transition:color .15s;overflow:hidden}.sp-title:hover{color:var(--sp-accent)}.sp-time{color:var(--sp-dim);font-variant-numeric:tabular-nums;letter-spacing:.04em;font-size:11px}.sp-progress-wrap{cursor:pointer;touch-action:none;width:100%;height:2.875rem;padding:0 1rem .625rem;position:relative}.sp-waveform-canvas{border-radius:.375rem;width:100%;height:2.25rem;display:none}.sp-live-waveform-canvas{z-index:2;opacity:0;pointer-events:none;border-radius:.375rem;width:calc(100% - 2rem);height:2.25rem;transition:opacity .2s ease-out;display:block;position:absolute;top:0;left:1rem}.sp-live-waveform-canvas.sp-live-waveform-visible{opacity:1}.sp-progress-wrap.sp-has-waveform .sp-waveform-canvas{display:block}.sp-progress-wrap.sp-has-waveform .sp-progress-bar{display:none}.sp-progress-bar{background:#ffffff14;border-radius:3px;height:6px;position:relative;top:.875rem;overflow:visible;box-shadow:inset 0 0 0 1px #ffffff06}.sp-progress-fill{background:linear-gradient(90deg, var(--sp-teal), var(--sp-accent) 48%, var(--sp-amber));border-radius:3px;width:0%;transition:width .1s linear;position:absolute;top:0;bottom:0;left:0;box-shadow:0 0 10px #2dd4bf47,0 0 16px #fbbf2429}.sp-progress-thumb{background:var(--sp-amber);opacity:0;pointer-events:none;border-radius:50%;width:14px;height:14px;transition:opacity .15s,left .1s linear;position:absolute;top:50%;left:0%;transform:translate(-50%,-50%);box-shadow:0 0 0 3px #020705f2,0 0 16px #fbbf2480,0 0 28px #2dd4bf2e}.sp-progress-wrap:hover .sp-progress-thumb,.sp-progress-wrap:active .sp-progress-thumb{opacity:1}.sp-right{flex-shrink:0;align-items:center;gap:.25rem;display:flex}.sp-vol-wrap{align-items:center;gap:.25rem;display:flex}.sp-vol-slider{appearance:none;cursor:pointer;background:linear-gradient(90deg,#2dd4bf47,#fbbf242e);border-radius:2px;outline:none;width:72px;height:4px}.sp-vol-slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--sp-amber);cursor:pointer;border-radius:50%;width:14px;height:14px;box-shadow:0 0 8px #fbbf2473}.sp-vol-slider::-moz-range-thumb{background:var(--sp-amber);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px;box-shadow:0 0 8px #fbbf2473}.sp-list-wrap{background:#02070529;border-top:1px solid #ffffff14}.sp-list-header{justify-content:space-between;align-items:center;padding:.625rem 1rem;display:flex}.sp-list-actions{align-items:center;gap:.5rem;display:flex}.sp-reset-queue,.sp-clear-all{cursor:pointer;font:inherit;text-transform:uppercase;letter-spacing:.12em;-webkit-tap-highlight-color:transparent;border:1px solid #0000;border-radius:.375rem;padding:.25rem .5rem;font-size:10px;transition:border-color .15s,color .15s,background .15s}.sp-reset-queue{color:#5dffb0db;background:#5dffb014;border-color:#5dffb029;box-shadow:0 0 14px #5dffb014}.sp-reset-queue:hover,.sp-reset-queue:active{color:var(--sp-accent);background:#5dffb021;border-color:#5dffb047}.sp-clear-all{color:#f87171d1;background:#f871710d;border-color:#f871711f}.sp-clear-all:hover,.sp-clear-all:active{color:#f87171;background:#f871711f;border-color:#f871713d}.sp-list-count{text-transform:uppercase;letter-spacing:.15em;color:var(--sp-muted);font-size:11px}.sp-list-toggle{color:var(--sp-muted);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:.375rem;justify-content:center;align-items:center;min-width:32px;min-height:32px;padding:.25rem;transition:color .15s;display:inline-flex}.sp-list-toggle:hover{color:var(--sp-text)}.sp-list-chevron{transition:transform .2s}.sp-list-toggle[aria-expanded=true] .sp-list-chevron{transform:rotate(180deg)}.sp-list{max-height:440px;margin:0;padding:0;list-style:none;overflow-y:auto}.sp-list.sp-list-collapsed{display:none}.sp-list-item{cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;border-top:1px solid #ffffff0b;align-items:center;gap:.625rem;min-height:44px;padding:.625rem 1rem;transition:background .15s;display:flex}.sp-list-item:hover{background:#2dd4bf0e}.sp-list-item[data-active=true]{border-left:3px solid var(--sp-accent);background:linear-gradient(90deg,#5dffb01f,#2dd4bf0e),#ffffff05;padding-left:calc(1rem - 3px)}.sp-list-item[data-active=true] .sp-list-title{color:var(--sp-accent);text-shadow:0 0 12px #5dffb03d;font-weight:600}.sp-list-item[data-active=true] .sp-list-idx{color:var(--sp-accent)}.sp-list-reorder{flex-direction:column;flex-shrink:0;gap:1px;display:flex}.sp-reorder-btn{color:var(--sp-dim);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:3px;justify-content:center;align-items:center;width:22px;height:16px;transition:color .15s,background .15s;display:inline-flex}.sp-reorder-btn:hover,.sp-reorder-btn:active{color:var(--sp-accent);background:#5dffb014}.sp-list-idx{color:var(--sp-dim);text-align:right;flex-shrink:0;min-width:1.5rem;font-size:11px}.sp-list-title{white-space:nowrap;text-overflow:ellipsis;min-width:0;color:var(--sp-text);flex:1;font-size:13px;transition:color .15s;overflow:hidden}.sp-list-item:hover .sp-list-title{color:#f1f5f9}.sp-list-dur{color:var(--sp-dim);font-variant-numeric:tabular-nums;flex-shrink:0;font-size:11px}.sp-list-remove{color:var(--sp-dim);cursor:pointer;opacity:0;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:.375rem;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;transition:opacity .15s,color .15s,background .15s;display:inline-flex}.sp-list-item:hover .sp-list-remove{opacity:1}.sp-list-remove:hover,.sp-list-remove:active{color:#f87171;background:#f871711a}.sp-list-item.sp-drag-over{border-top:2px solid var(--sp-accent);padding-top:calc(.625rem - 1px)}@media (width<=640px){.sp-bar{flex-wrap:wrap;gap:.5rem;padding:.75rem}.sp-right{order:3;justify-content:flex-end;width:100%;padding-top:.25rem}.sp-vol-slider{width:100px}.sp-list-remove{opacity:.6}.sp-title{font-size:13px}}.studio-player .hidden{display:none!important}.sp-list::-webkit-scrollbar{width:5px}.sp-list::-webkit-scrollbar-track{background:0 0}.sp-list::-webkit-scrollbar-thumb{background:#2dd4bf38;border-radius:3px}