:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.card{padding:2em}#app{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.uploader[data-v-2ad9ef62]{display:flex;flex-direction:column;gap:18px;padding:16px;background:#0a0a0ad9;border-radius:16px;border:1px solid rgba(255,255,255,.1);min-height:260px;color:#fff;font-size:.9rem}.hidden-input[data-v-2ad9ef62]{display:none}.panel-section[data-v-2ad9ef62]{border-top:1px solid rgba(255,255,255,.1);padding-top:12px}.panel-section[data-v-2ad9ef62]:first-of-type{border-top:none;padding-top:0}.panel-section h3[data-v-2ad9ef62]{margin:0 0 8px;font-size:1rem;letter-spacing:.5px;text-transform:uppercase;font-weight:600}.panel-section-header[data-v-2ad9ef62]{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}.global-track-actions[data-v-2ad9ef62]{display:flex;gap:8px;flex-wrap:wrap}.global-track-actions button[data-v-2ad9ef62]{border-radius:999px;padding:4px 14px;font-size:.75rem;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;cursor:pointer}.section-note[data-v-2ad9ef62]{margin:0;color:#ffffffb3;font-size:.8rem}.track-item[data-v-2ad9ef62]{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;gap:12px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.06)}.track-title[data-v-2ad9ef62]{display:flex;align-items:center;gap:8px}.track-info[data-v-2ad9ef62]{display:flex;align-items:center;gap:12px}.track-name[data-v-2ad9ef62]{margin:0;font-weight:600}.track-name+small[data-v-2ad9ef62]{display:block;font-size:.75rem;color:#ffffffa6}.track-dot[data-v-2ad9ef62]{width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,#ff5f5f,#ffd15f);display:inline-block}.track-controls[data-v-2ad9ef62]{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.track-status-pill[data-v-2ad9ef62]{font-size:.7rem;letter-spacing:.3px;padding:2px 10px;border-radius:999px;background:#00c87326;color:#00ffb0;display:inline-flex;margin:4px 0 8px}.track-btn[data-v-2ad9ef62]{border-radius:8px;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;font-size:.75rem;padding:4px 10px;cursor:pointer}.track-btn.active[data-v-2ad9ef62]{background:#1effc0;border-color:transparent;color:#050608}.playalong-btn[data-v-2ad9ef62]{background:transparent;border:1px solid rgba(255,255,255,.4);padding:4px 10px;border-radius:999px;color:#fff;font-size:.75rem;cursor:pointer}.playalong-btn.active[data-v-2ad9ef62]{background:#00c173;border-color:transparent;color:#040508}.hand-select[data-v-2ad9ef62]{border-radius:8px;border:1px solid rgba(255,255,255,.25);background:#ffffff0d;color:#fff;font-size:.75rem;padding:4px 8px;cursor:pointer}.device-status-row[data-v-2ad9ef62]{display:flex;align-items:center;gap:12px;border-radius:12px;padding:10px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08)}.status-dot[data-v-2ad9ef62]{width:14px;height:14px;border-radius:50%;background:#ffffff4d;border:1px solid rgba(255,255,255,.5);transition:background .2s}.status-dot.connected[data-v-2ad9ef62]{background:#25d366;border-color:transparent}.status-dot.active[data-v-2ad9ef62]{box-shadow:0 0 8px 2px #fff9}.status-text[data-v-2ad9ef62]{flex:1}.activity-dot[data-v-2ad9ef62]{width:12px;height:12px;border-radius:50%;background:#ffffff4d;transition:box-shadow .2s}.activity-dot.active[data-v-2ad9ef62]{box-shadow:0 0 10px 3px #00ff8a}.device-picker[data-v-2ad9ef62]{width:100%;background:#ffffff0d;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;padding:6px 10px;margin-bottom:12px}.device-settings[data-v-2ad9ef62]{display:flex;gap:16px;flex-wrap:wrap;align-items:center}.device-settings input[type=range][data-v-2ad9ef62]{width:180px}.transpose-value[data-v-2ad9ef62]{font-size:.75rem;margin-left:8px;display:inline-block;color:#fffc}.playalong-warning[data-v-2ad9ef62]{margin:4px 0;font-size:.75rem;color:#ffbb79;letter-spacing:.2px}.playalong-btn.disabled[data-v-2ad9ef62]{opacity:.4;cursor:not-allowed}.loading-skeleton[data-v-2ad9ef62]{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px}.loading-skeleton p[data-v-2ad9ef62]{margin:0;font-size:.85rem;opacity:.7}.skeleton-bars[data-v-2ad9ef62]{display:flex;flex-direction:column;gap:6px}.skeleton-bars span[data-v-2ad9ef62]{height:6px;border-radius:999px;background:linear-gradient(135deg,#fff3,#ffffff0d);opacity:.7}.canvas-container[data-v-99e3146e]{position:relative;width:100%;height:100%;min-height:360px;background:#000}.main-canvas[data-v-99e3146e],.piano-canvas[data-v-99e3146e]{position:absolute;top:0;left:0;width:100%;height:100%}.piano-canvas[data-v-99e3146e]{pointer-events:none}.top-control-bar[data-v-1f2d821d]{position:sticky;top:0;z-index:200;background:#000000eb;padding:var(--panel-padding);display:flex;flex-direction:column;gap:clamp(10px,2vw,20px);border-bottom:1px solid rgba(255,255,255,.08);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.top-row[data-v-1f2d821d]{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));align-items:center;gap:clamp(10px,1.5vw,20px)}.top-row[data-v-1f2d821d]>*{min-width:0}.top-control-bar[data-v-1f2d821d]{position:sticky;top:0;z-index:200;background:#000000eb;padding:var(--panel-padding);display:flex;flex-direction:column;gap:clamp(10px,1.5vw,18px);border-bottom:1px solid rgba(255,255,255,.08);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.top-row[data-v-1f2d821d]{display:flex;align-items:center;gap:clamp(10px,1.8vw,20px);flex-wrap:wrap}.panel-toggle[data-v-1f2d821d]{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.3);padding:6px 14px;border-radius:999px;cursor:pointer;font-size:.9rem}.upload-group[data-v-1f2d821d]{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.user-group[data-v-1f2d821d]{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.user-label[data-v-1f2d821d]{font-size:.75rem;color:#fffc}.user-btn[data-v-1f2d821d]{border-radius:999px;border:none;background:linear-gradient(135deg,#ffb347,#f73);color:#050505;padding:6px 14px;font-weight:600;cursor:pointer}.upload-button[data-v-1f2d821d]{background:linear-gradient(135deg,#1effb1,#4ce0ff);border:none;color:#000;padding:8px 20px;border-radius:999px;font-weight:600;cursor:pointer}.file-name[data-v-1f2d821d]{font-size:.85rem;opacity:.75;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.transport[data-v-1f2d821d]{display:flex;align-items:center;gap:clamp(10px,1.5vw,16px);flex-wrap:wrap;flex:1}.play-toggle[data-v-1f2d821d]{background:#12b759;border:none;color:#fff;padding:12px 28px;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;box-shadow:0 8px 22px #00000073}.play-toggle[data-v-1f2d821d]:disabled{opacity:.5;cursor:not-allowed}.secondary-actions[data-v-1f2d821d]{display:flex;gap:8px}.secondary[data-v-1f2d821d]{background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff;padding:6px 14px;border-radius:8px;font-size:.85rem;cursor:pointer}.secondary[data-v-1f2d821d]:disabled{opacity:.5;cursor:not-allowed}.time-display[data-v-1f2d821d]{font-family:JetBrains Mono,SF Mono,monospace;font-size:.9rem;opacity:.85}.loop-row[data-v-1f2d821d]{display:flex;align-items:center;justify-content:space-between;gap:clamp(10px,2vw,20px);flex-wrap:wrap}.loop-controls[data-v-1f2d821d]{display:flex;align-items:center;gap:clamp(8px,1.5vw,14px);flex-wrap:wrap}.loop-btn[data-v-1f2d821d]{background:#111;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:8px;padding:6px 14px;cursor:pointer}.loop-btn.active[data-v-1f2d821d]{background:#1effc0;border-color:transparent;color:#040508}.loop-text[data-v-1f2d821d]{font-size:.85rem;opacity:.85}.tempo-controls[data-v-1f2d821d]{display:flex;align-items:center;gap:clamp(8px,1.5vw,14px);flex-wrap:wrap}.tempo-label[data-v-1f2d821d]{display:flex;align-items:center;gap:6px;font-size:.85rem;letter-spacing:.5px;text-transform:uppercase;opacity:.8}.tempo-label small[data-v-1f2d821d]{font-size:.7rem;color:#fff9}.tempo-slider[data-v-1f2d821d]{display:flex;align-items:center;gap:8px}.tempo-slider button[data-v-1f2d821d]{border:none;background:#ffffff1a;color:#fff;padding:4px 10px;border-radius:8px;cursor:pointer}.tempo-slider input[type=range][data-v-1f2d821d]{width:160px}.tempo-value[data-v-1f2d821d]{font-family:JetBrains Mono,monospace;font-size:.8rem}.mode-selector[data-v-1f2d821d]{display:flex;gap:8px;align-items:center}.mode-btn[data-v-1f2d821d]{background:#ffffff14;border:1px solid rgba(255,255,255,.3);color:#fff;padding:6px 14px;border-radius:999px;cursor:pointer;font-size:.85rem}.mode-btn.active[data-v-1f2d821d]{background:#ffb347;border-color:transparent;color:#050608}.progress-wrap[data-v-1f2d821d]{position:relative;width:100%;border-radius:calc(var(--panel-radius) * .7);display:flex;flex-direction:column;gap:clamp(8px,1vw,12px);padding:clamp(6px,.8vw,10px);background:#ffffff05}.top-control-bar.collapsed[data-v-1f2d821d]{padding-bottom:8px}.progress-toolbar[data-v-1f2d821d]{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}.menu-toggle[data-v-1f2d821d]{border:1px solid rgba(255,255,255,.4);background:#ffffff0d;color:#fff;padding:6px 16px;border-radius:999px;cursor:pointer;font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;transition:background .2s ease,color .2s ease}.menu-toggle[data-v-1f2d821d]:hover{background:#fff3}.pan-controls[data-v-1f2d821d]{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.pan-btn[data-v-1f2d821d]{border:none;background:#ffffff26;color:#fff;width:32px;height:32px;border-radius:8px;font-size:1rem;cursor:pointer;transition:background .2s ease}.pan-btn[data-v-1f2d821d]:hover{background:#ffffff4d}.pan-label[data-v-1f2d821d]{font-size:.75rem;color:#ffffffb3;font-family:JetBrains Mono,monospace}.progress-canvas[data-v-1f2d821d]{width:100%;height:32px;border-radius:10px;border:1px solid rgba(255,255,255,.1);cursor:pointer}.progress-tooltip[data-v-1f2d821d]{position:absolute;top:-32px;transform:translate(-50%);background:#000c;padding:4px 8px;border-radius:6px;font-size:.75rem;border:1px solid rgba(255,255,255,.2);pointer-events:none}@media(max-width:768px){.top-row[data-v-1f2d821d],.loop-row[data-v-1f2d821d]{flex-direction:column;align-items:flex-start}.transport[data-v-1f2d821d],.loop-controls[data-v-1f2d821d],.tempo-controls[data-v-1f2d821d],.tempo-slider input[type=range][data-v-1f2d821d]{width:100%}}.practice-feedback[data-v-57f8eb23]{position:absolute;top:clamp(90px,9vh,140px);right:var(--main-padding);padding:var(--panel-padding);border-radius:calc(var(--panel-radius) * .5);font-weight:600;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);max-width:clamp(180px,24vw,260px)}.practice-feedback.success[data-v-57f8eb23]{background:#25d37626;color:#0cf38f}.practice-feedback.warning[data-v-57f8eb23]{background:#ffe50026;color:#fff176}.practice-feedback.error[data-v-57f8eb23]{background:#ff444426;color:#ff6b6b}.practice-feedback.info[data-v-57f8eb23]{background:#6495ed33;color:#9fb4ff}.fade-enter-active[data-v-57f8eb23],.fade-leave-active[data-v-57f8eb23]{transition:opacity .3s ease}.fade-enter-from[data-v-57f8eb23],.fade-leave-to[data-v-57f8eb23]{opacity:0}.practice-stats-panel[data-v-767ac189]{position:absolute;top:clamp(160px,12vh,220px);left:var(--main-padding);background:#040404d9;padding:var(--panel-padding);border-radius:calc(var(--panel-radius) * .8);border:1px solid rgba(255,255,255,.1);display:flex;gap:clamp(14px,2vw,20px);font-size:.85rem;z-index:100;flex-wrap:wrap}.stat .label[data-v-767ac189]{display:block;font-size:.7rem;opacity:.7;text-transform:uppercase;letter-spacing:1px}.stat strong[data-v-767ac189]{font-size:1rem}.shortcuts-overlay[data-v-0219d667]{position:fixed;inset:0;background:#030303d9;display:flex;align-items:center;justify-content:center;z-index:250}.overlay-inner[data-v-0219d667]{background:#0a0a0af2;border-radius:var(--panel-radius);padding:clamp(18px,2vw,32px);border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:clamp(240px,70vw,420px);max-width:clamp(320px,80vw,480px);width:min(420px,90vw)}.overlay-inner h4[data-v-0219d667]{margin:0 0 16px;font-size:1.1rem;letter-spacing:.2em;text-transform:uppercase;color:#fffc}.overlay-inner ul[data-v-0219d667]{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}.overlay-inner li[data-v-0219d667]{display:flex;justify-content:space-between;gap:12px;font-size:.9rem;color:#ffffffe6}.combo[data-v-0219d667]{font-weight:700;letter-spacing:.1em;text-transform:uppercase}.description[data-v-0219d667]{opacity:.8}.edit-menu[data-v-6b2be224]{background:#ffffff05;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:12px;color:#fff}.tabs[data-v-6b2be224]{display:flex;gap:8px}.tabs button[data-v-6b2be224]{flex:1;padding:8px 0;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:transparent;color:#fff;cursor:pointer}.tabs button.active[data-v-6b2be224]{background:#00ff8a;color:#020a06;border-color:transparent}.tab-content[data-v-6b2be224]{display:flex;flex-direction:column;gap:10px}.filter-row[data-v-6b2be224]{display:flex;gap:10px;flex-wrap:wrap}.filter-row label[data-v-6b2be224]{display:flex;flex-direction:column;font-size:.75rem;letter-spacing:.3px;color:#ffffffb3}.filter-row input[data-v-6b2be224],.filter-row select[data-v-6b2be224],.edit-menu textarea[data-v-6b2be224]{border-radius:8px;border:1px solid rgba(255,255,255,.2);background:#ffffff14;padding:6px 8px;color:#fff}.mini[data-v-6b2be224]{border:none;border-radius:999px;padding:6px 14px;background:#ffffff1a;color:#fff;cursor:pointer}.copy-btn[data-v-6b2be224]{border:1px solid rgba(255,255,255,.3);background:#00ff8a1f;color:#00ff8a}.note-table[data-v-6b2be224]{max-height:220px;overflow-y:auto;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:6px;background:#ffffff03}.note-row[data-v-6b2be224]{display:grid;grid-template-columns:repeat(12,minmax(60px,1fr));gap:8px;font-size:.75rem;padding:4px 0;border-bottom:1px solid rgba(255,255,255,.08)}.note-row[data-v-6b2be224]:last-child{border-bottom:none}.note-row.header[data-v-6b2be224]{border-bottom:1px solid rgba(255,255,255,.2);font-size:.7rem;letter-spacing:.3px;text-transform:uppercase;color:#ffffffb3}.empty[data-v-6b2be224]{text-align:center;color:#ffffff80;padding:10px 0;font-size:.8rem}.primary[data-v-6b2be224]{border:none;background:linear-gradient(135deg,#17fbd8,#00a884);color:#020a06;padding:8px 16px;border-radius:999px;font-weight:600;cursor:pointer}.library-sidebar[data-v-6af18ef8]{position:fixed;top:0;right:0;bottom:0;width:min(1100px,90vw);background:#040404;border-left:1px solid rgba(255,255,255,.08);padding:24px;display:flex;flex-direction:column;gap:16px;z-index:1000;box-shadow:0 0 30px #0009}.library-header[data-v-6af18ef8]{display:flex;align-items:center;justify-content:space-between;gap:12px}.close-btn[data-v-6af18ef8]{background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;padding:6px 16px;border-radius:999px;cursor:pointer}.song-panel[data-v-6af18ef8]{display:flex;flex-direction:column;gap:12px}.filter-grid[data-v-6af18ef8]{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}.filter-grid input[data-v-6af18ef8],.filter-grid select[data-v-6af18ef8]{border-radius:8px;padding:6px 8px;background:#ffffff14;border:1px solid rgba(255,255,255,.2);color:#fff}.song-list[data-v-6af18ef8]{display:flex;flex-direction:column;gap:16px;max-height:calc(100vh - 260px);overflow-y:auto}.group[data-v-6af18ef8]{background:#ffffff05;border:1px solid rgba(255,255,255,.05);border-radius:16px;padding:14px}.song-card[data-v-6af18ef8]{padding:14px;border-radius:14px;border:1px solid transparent;background:#ffffff05;display:flex;flex-direction:column;gap:12px}.song-card.active[data-v-6af18ef8]{border-color:#3dd598;background:#3dd59814}.song-info[data-v-6af18ef8]{display:flex;align-items:center;justify-content:space-between}.card-actions[data-v-6af18ef8]{display:flex;flex-wrap:wrap;gap:8px}.card-actions button[data-v-6af18ef8]{border-radius:8px;background:#ffffff14;border:none;padding:6px 10px;color:#fff;cursor:pointer}.expander[data-v-6af18ef8]{padding-top:12px}.card-loading[data-v-6af18ef8]{display:inline-flex;align-items:center;gap:6px;font-size:.75rem;color:#c5ffe5;margin-top:6px}.loading-indicator[data-v-6af18ef8]{width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,.25);border-top-color:#00ff8a;animation:spin-6af18ef8 .8s linear infinite}.status-badge[data-v-6af18ef8]{font-size:.8rem;padding:4px 12px;border-radius:999px;color:#050505;font-weight:600}.status-badge.uploaded[data-v-6af18ef8]{background:#1effb1}.status-badge.dirty[data-v-6af18ef8]{background:#ffb347}.status-badge.local[data-v-6af18ef8]{background:#ffffff4d}@keyframes spin-6af18ef8{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:768px){.library-sidebar[data-v-6af18ef8]{width:100%;height:100%;border-radius:0;padding:18px}}.user-login-overlay[data-v-612dd2bf]{position:fixed;inset:0;background:#000000a6;display:flex;align-items:center;justify-content:center;z-index:1100}.user-login-panel[data-v-612dd2bf]{width:min(360px,90vw);background:#020303;border-radius:18px;padding:24px;border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 45px #0000008c;position:relative;display:flex;flex-direction:column;gap:12px}.user-login-panel h3[data-v-612dd2bf]{margin:0;font-size:1.2rem}.user-login-panel p[data-v-612dd2bf]{margin:0;color:#fffc;font-size:.9rem}.user-login-panel input[data-v-612dd2bf]{border-radius:10px;border:1px solid rgba(255,255,255,.25);background:#ffffff0d;color:#fff;padding:10px 12px;font-size:.95rem}.user-login-panel input[data-v-612dd2bf]:focus{outline:none;border-color:#fff9}.login-actions[data-v-612dd2bf]{display:flex;gap:8px;flex-wrap:wrap}.user-login-panel button[data-v-612dd2bf]{border-radius:999px;border:none;padding:8px 16px;font-weight:600;cursor:pointer}.user-login-panel .primary[data-v-612dd2bf]{background:linear-gradient(135deg,#1effb1,#4ce0ff);color:#050505}.user-login-panel .secondary[data-v-612dd2bf]{background:#ffffff14;color:#fff;border:1px solid rgba(255,255,255,.25)}.status-line[data-v-612dd2bf]{font-size:.85rem;color:#ffffffb3}.status-line.error[data-v-612dd2bf]{color:#ff8b8b}.close-btn[data-v-612dd2bf]{position:absolute;top:10px;right:10px;background:transparent;border:none;color:#ffffffb3;font-size:1.3rem;cursor:pointer}:root{--main-padding: clamp(20px, 2.5vw, 40px);--panel-padding: clamp(16px, 1.75vw, 26px);--panel-width: clamp(260px, 26vw, 360px);--panel-radius: clamp(18px, 2vw, 24px);--layout-gap: clamp(16px, 2vw, 32px);--topbar-h: 72px;--player-min-h: 620px}body,html{margin:0;padding:0;background:#040404;color:#fff;font-family:Inter,system-ui,sans-serif;min-height:100vh}#app[data-v-692622ef]{min-height:100vh}.app-shell[data-v-692622ef]{min-height:100vh;background:radial-gradient(circle at top,rgba(11,123,255,.25),transparent 50%),#030303;display:flex;flex-direction:column}.session-banner[data-v-692622ef]{align-self:flex-start;margin:24px;padding:6px 16px;border-radius:999px;background:#121212e6;border:1px solid rgba(255,255,255,.25);font-size:.85rem;color:#d3f4ff}.session-banner.error[data-v-692622ef]{background:#ff575733;border-color:#ff575799;color:#ffb8b8}.content-shell[data-v-692622ef]{flex:1;position:relative;padding:0 var(--main-padding);display:flex;align-items:stretch;min-height:calc(100vh - var(--topbar-h))}.side-panel[data-v-692622ef]{position:absolute;top:0;bottom:0;right:0;width:0;max-width:var(--panel-width);padding:0;opacity:0;pointer-events:none;overflow:hidden;transition:width .3s ease,opacity .3s ease,padding .3s ease;background:#040404f2;border-left:1px solid rgba(255,255,255,.08);box-shadow:-10px 0 30px #000000a6;z-index:30}.side-panel.open[data-v-692622ef]{width:var(--panel-width);padding:var(--panel-padding);opacity:1;pointer-events:all}.panel-inner[data-v-692622ef]{display:flex;flex-direction:column;gap:16px;height:100%;overflow:auto}.main-area[data-v-692622ef]{flex:1;display:flex;flex-direction:column;padding:var(--main-padding);padding-bottom:var(--main-padding);position:relative;width:100%;max-width:none;margin:0 auto;overflow:visible;gap:0}.canvas-wrapper[data-v-692622ef]{flex:1;position:relative;border-radius:var(--panel-radius);overflow:hidden;background:radial-gradient(circle at top,rgba(18,123,255,.12),transparent 55%),#030303;box-shadow:0 30px 80px #000000a6;border:1px solid rgba(255,255,255,.08);min-height:var(--player-min-h);height:auto;max-height:none;box-sizing:border-box}.canvas-wrapper canvas[data-v-692622ef]{position:absolute;inset:0;width:100%;height:100%;z-index:2}.canvas-wrapper[data-v-692622ef]:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.04),transparent 70%);z-index:0}.canvas-wrapper[data-v-692622ef]:after{content:"";position:absolute;left:6px;right:6px;bottom:68px;height:2px;background:linear-gradient(90deg,#fff0,#ffffff73,#fff0);filter:blur(.5px);pointer-events:none;z-index:1}.song-loading-overlay[data-v-692622ef]{position:absolute;inset:0;background:#030303d9;border-radius:var(--panel-radius);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:20;pointer-events:none}.loading-spinner[data-v-692622ef]{width:56px;height:56px;border-radius:50%;border:5px solid rgba(255,255,255,.2);border-top-color:#00ff8a;animation:spin-692622ef 1s linear infinite}.song-loading-overlay p[data-v-692622ef]{margin:0;font-size:.9rem;color:#ffffffe6}.empty-state[data-v-692622ef]{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;font-size:1.1rem;color:#fffc;pointer-events:none}.empty-state button[data-v-692622ef]{pointer-events:all;border:none;background:linear-gradient(135deg,#ff7a18,#af002d 70%);color:#fff;padding:10px 26px;border-radius:999px;font-weight:600;cursor:pointer}.error-banner[data-v-692622ef]{position:absolute;top:72px;left:50%;transform:translate(-50%);background:#ff32321f;border:1px solid rgba(255,50,50,.6);color:#ff6b6b;padding:10px 20px;border-radius:12px;display:flex;gap:12px;align-items:center;z-index:100;pointer-events:none}.error-banner button[data-v-692622ef]{border:none;background:#ffffff1f;color:#fff;padding:4px 12px;border-radius:999px;cursor:pointer}@media(max-width:1024px){.side-panel[data-v-692622ef]{position:fixed;bottom:0;left:0;right:0;width:100%;max-height:60%;height:auto;padding:var(--panel-padding);background:#030303f2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:50;box-shadow:0 -15px 35px #0009;border-top-left-radius:16px;border-top-right-radius:16px;border-left:none;opacity:0;pointer-events:none;transform:translateY(12px);transition:opacity .25s ease,transform .25s ease}.side-panel.open[data-v-692622ef]{opacity:1;pointer-events:all;transform:translateY(0)}.main-area[data-v-692622ef]{padding:var(--main-padding);padding-bottom:var(--main-padding)}.canvas-wrapper[data-v-692622ef]{min-height:540px}}@media(max-width:600px){.panel-inner[data-v-692622ef]{gap:12px}.canvas-wrapper[data-v-692622ef]{min-height:480px}}@keyframes spin-692622ef{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
