:root{--bg:#0e0a0f;--bg-base:#0e0a0f;--bg-surface:#14000f;--bg-primary:#9650ff;--bg-primary-rgb:150, 80, 255;--bg-secondary:#ff7a8b;--bg-secondary-rgb:255, 122, 139;--bg-detail:#6be0ff;--bg-detail-rgb:107, 224, 255;--layout-device:laptop;--layout-vh-unit:1vh;--layout-header-vh:12;--layout-header-offset-gap-vh:1;--layout-header-inline-padding-vw:1.85;--layout-header-content-gap-vh:2;--layout-header-side-gap-vh:1.5;--layout-header-height:max(calc(var(--layout-header-vh) * 6px), calc(var(--layout-header-vh) * var(--layout-vh-unit)));--layout-header-content-gap:max(calc(var(--layout-header-content-gap-vh) * 6px), calc(var(--layout-header-content-gap-vh) * var(--layout-vh-unit)));--layout-header-side-gap:max(calc(var(--layout-header-side-gap-vh) * 6px), calc(var(--layout-header-side-gap-vh) * var(--layout-vh-unit)));--layout-header-offset:max(calc((var(--layout-header-vh) + var(--layout-header-offset-gap-vh)) * 6px), calc((var(--layout-header-vh) + var(--layout-header-offset-gap-vh)) * var(--layout-vh-unit)));font-family:Segoe UI,Arial,sans-serif}@supports (height:100dvh){:root{--layout-vh-unit:1dvh}}@media (width>=801px) and (width<=1199px){:root{--layout-device:tablet;--layout-header-inline-padding-vw:1.6;--layout-header-content-gap-vh:1.7;--layout-header-side-gap-vh:1.25}}@media (width<=800px){:root{--layout-device:mobile;--layout-header-inline-padding-vw:1.2;--layout-header-content-gap-vh:1.35;--layout-header-side-gap-vh:1.05}}@media (width<=800px) and (orientation:portrait){:root{--layout-header-vh:9.8;--layout-header-offset-gap-vh:.45;--layout-header-inline-padding-vw:.8;--layout-header-content-gap-vh:.4;--layout-header-side-gap-vh:.25}}@media (width>=801px) and (width<=1199px) and (orientation:portrait){:root{--layout-header-vh:19.2}}*{box-sizing:border-box}#app,#app *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#app input,#app textarea,#app select,#app option,#app [contenteditable=true],#app [contenteditable=true] *{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}html,body,#app{width:100%;min-height:100%;margin:0}body{background:#05050a}.piano-view.editor-mode .sheet-note.selected,.piano-view.editor-mode .sheet-sustain.selected{z-index:100!important;--editor-note-scale:1!important;background:linear-gradient(#ff69b4 0%,#ff1493 100%)!important;border:3px solid #ff69b4!important;box-shadow:0 0 30px #ff69b4cc!important}.note-edit-controls{--midi-edit-control-size:42px;--midi-edit-control-side-offset:56px;z-index:10000;pointer-events:auto;width:100%;height:100%;display:none;position:absolute}.note-edit-controls.visible{display:block}.note-edit-controls.selection-tools{background:linear-gradient(135deg,#2a120af0 0%,#521e0ce6 100%);border:1px solid #ffe2b880;border-radius:999px;justify-content:center;align-items:center;gap:.7rem;width:auto;height:auto;padding:.45rem;display:flex}.edit-control-btn{width:var(--midi-edit-control-size);height:var(--midi-edit-control-size);cursor:pointer;color:#fff;z-index:10001;appearance:none;background-clip:padding-box;border:2px solid #fffc;border-radius:50%;justify-content:center;align-items:center;font-size:15px;font-weight:700;display:flex;position:absolute;box-shadow:0 4px 12px #00000080}.edit-control-btn.selection-action{letter-spacing:.02em;border-radius:999px;width:auto;min-width:6.2rem;height:2.35rem;padding:0 1rem;font-size:.8rem;position:relative;inset:auto;transform:none}.note-edit-controls.selection-tools .edit-control-btn.selection-handle{border-radius:999px;width:2.35rem;min-width:2.35rem;height:2.35rem;padding:0;font-size:1rem;font-weight:900;position:relative;inset:auto;transform:none}.edit-control-btn.top,.edit-control-btn.top-left,.edit-control-btn.top-right,.edit-control-btn.bottom,.edit-control-btn.middle{font-family:Segoe UI Symbol,"Noto Sans Symbols 2",sans-serif;font-size:24px;font-weight:900;line-height:1}.edit-control-glyph{line-height:1;display:block;transform:translateY(-2px)}.edit-control-btn.middle{box-shadow:none;background:0 0;border-color:#0000;top:50%;left:50%;transform:translate(-50%,-50%)}.edit-control-btn.middle:hover{border-color:#fffffff2;box-shadow:0 4px 12px #00000080}.edit-control-btn.middle:active{border-color:#fff;box-shadow:0 3px 10px #00000073}.edit-control-btn.top{background:#e74c3c;top:0;left:50%;transform:translate(-50%)}.edit-control-btn.top-left,.edit-control-btn.top-right{box-shadow:none;white-space:pre-line;background:0 0;border-color:#0000;font-size:17px;line-height:.82;top:0}.edit-control-btn.top-left{left:calc(-1 * var(--midi-edit-control-side-offset));transform:translate(0,0)}.edit-control-btn.top-right{right:calc(-1 * var(--midi-edit-control-side-offset));transform:translate(0,0)}.edit-control-btn.bottom{background:#e74c3c;bottom:0;left:50%;transform:translate(-50%)}.edit-control-btn.left{left:calc(-1 * var(--midi-edit-control-side-offset));background:#2ecc71;top:50%;transform:translateY(-50%)}.edit-control-btn.right{right:calc(-1 * var(--midi-edit-control-side-offset));background:#e74c3c;top:50%;transform:translateY(-50%)}.edit-control-btn.velocity{left:calc(-1 * var(--midi-edit-control-side-offset));letter-spacing:.02em;background:linear-gradient(135deg,#1abc9c 0%,#16a085 100%);border-radius:50%;padding:0;font-size:11px;line-height:1}.edit-control-btn.duplicate{color:#3f1802f5;background:linear-gradient(135deg,#ffb347 0%,#ff8c42 100%)}.edit-control-btn.selection-expand-top,.edit-control-btn.selection-expand-bottom,.edit-control-btn.selection-diagonal-left,.edit-control-btn.selection-diagonal-right,.edit-control-btn.selection-move{color:#ebf6fffa;background:linear-gradient(135deg,#57b8ff 0%,#2f7fe6 100%)}.edit-control-btn.selection-diagonal-left,.edit-control-btn.selection-diagonal-right{white-space:pre-line;font-size:.86rem;line-height:.82}.edit-control-btn.delete-selection{background:linear-gradient(135deg,#ff6b6b 0%,#c0392b 100%)}.status-toast-stack[data-v-18d38488]{top:calc(var(--layout-header-height,76px) + clamp(10px, 1.8vh, 20px));z-index:100000;pointer-events:none;justify-items:end;gap:clamp(8px,1vh,12px);width:min(420px,100vw - 20px);display:grid;position:fixed;right:clamp(10px,1.6vw,24px)}.status-toast[data-v-18d38488]{--toast-accent:#f59e0b;border:1px solid #dce4f23d;border-left-color:var(--toast-accent);color:#f7f9fc;pointer-events:auto;background:#121418f0;border-left-width:4px;border-radius:8px;grid-template-columns:26px minmax(0,1fr);align-items:center;gap:10px;width:fit-content;max-width:100%;min-height:42px;padding:10px 12px 10px 10px;display:grid;overflow:hidden;box-shadow:0 14px 34px #00000057}.status-toast--success[data-v-18d38488]{--toast-accent:#22c55e}.status-toast--info[data-v-18d38488]{--toast-accent:#f59e0b}.status-toast--error[data-v-18d38488]{--toast-accent:#ef4444}.status-toast-text[data-v-18d38488]{overflow-wrap:anywhere;min-width:0;font-size:14px;font-weight:700;line-height:1.25}.status-toast-timer[data-v-18d38488]{width:24px;height:24px;color:var(--toast-accent);place-items:center;display:grid}.status-toast-timer svg[data-v-18d38488]{width:24px;height:24px;transform:rotate(-90deg)}.status-toast-timer circle[data-v-18d38488]{fill:none;stroke:currentColor;stroke-width:3px;stroke-linecap:round;stroke-dasharray:97.39;stroke-dashoffset:0;animation:status-toast-countdown-18d38488 var(--toast-duration) linear forwards}.status-toast-enter-active[data-v-18d38488]{transition:transform .24s,opacity .24s}.status-toast-leave-active[data-v-18d38488]{transition:transform .22s,opacity .22s}.status-toast-enter-from[data-v-18d38488],.status-toast-leave-to[data-v-18d38488]{opacity:0;transform:translate(calc(100% + 24px))}.status-toast-move[data-v-18d38488]{transition:transform .22s}@keyframes status-toast-countdown-18d38488{to{stroke-dashoffset:97.39px}}@media (width<=800px){.status-toast-stack[data-v-18d38488]{top:calc(var(--layout-header-height,64px) + 8px);width:calc(100vw - 16px);right:8px}}.embedded-player-host[data-v-a8a9af8f]{isolation:isolate;width:100vw;height:100dvh;position:relative;overflow:hidden}.embedded-player-host .bg[data-v-a8a9af8f]{z-index:0}.embedded-player-host[data-v-a8a9af8f] .piano-view{z-index:1;position:relative}.admin-panel-host[data-v-a8a9af8f]{justify-content:center;width:100%;display:flex}.app-shell[data-v-a8a9af8f]{--viewport-unit:1vh;--header-height:var(--layout-header-height,calc(12 * var(--layout-vh-unit,1vh)));--header-vh-unit:max(calc(.95 * var(--layout-vh-unit,1vh)), 6px);--header-control-size:clamp(42px, calc(7 * var(--layout-vh-unit,1vh)), calc(7 * var(--layout-vh-unit,1vh)));--header-inline-padding:calc(var(--layout-header-inline-padding-vw,1.85) * 1vw);--header-content-gap:var(--layout-header-content-gap,max(calc(var(--layout-header-content-gap-vh,2) * 6px), calc(var(--layout-header-content-gap-vh,2) * var(--layout-vh-unit,1vh))));--header-side-gap:var(--layout-header-side-gap,max(calc(var(--layout-header-side-gap-vh,1.5) * 6px), calc(var(--layout-header-side-gap-vh,1.5) * var(--layout-vh-unit,1vh))));min-height:100dvh;min-height:var(--app-viewport-height,100dvh);color:#dbe7ff;background:0 0;position:relative}.app-shell.portrait-vh-to-vw[data-v-a8a9af8f]{--viewport-unit:1vw}.app-shell.floating-sidebar-layout.portrait-vh-to-vw[data-v-a8a9af8f]{--header-height:61px;--header-vh-unit:6px;--header-control-size:calc(var(--header-height) * .7);--header-inline-padding:4px;--header-content-gap:3px;--header-side-gap:2px}.app-shell.tablet-portrait-layout[data-v-a8a9af8f],.app-shell.tablet-landscape-layout[data-v-a8a9af8f]{--header-height:61px;--header-vh-unit:6px;--header-control-size:calc(var(--header-height) * .7);--header-inline-padding:8px;--header-content-gap:10px;--header-side-gap:12px}.app-shell.phone-layout[data-v-a8a9af8f],.app-shell.floating-sidebar-layout.phone-layout.phone-portrait-layout.portrait-vh-to-vw[data-v-a8a9af8f]{--header-height:56px;--header-vh-unit:8px;--header-control-size:calc(var(--header-height) * .7);--header-inline-padding:2px;--header-content-gap:6px;--header-side-gap:8px}.app-shell.floating-sidebar-layout.phone-layout.phone-portrait-layout.portrait-vh-to-vw[data-v-a8a9af8f]{--header-content-gap:3px;--header-side-gap:4px}.app-shell.phone-layout[data-v-a8a9af8f]:not(.phone-portrait-layout){--header-height:56px;--header-inline-padding:8px;--header-content-gap:10px;--header-side-gap:12px}.app-shell.floating-sidebar-layout.phone-portrait-layout.portrait-vh-to-vw[data-v-a8a9af8f]{--header-height:56px}.app-shell .bg[data-v-a8a9af8f]{z-index:0;pointer-events:none;background-color:var(--bg-surface,#14000f);background-image:radial-gradient(120vw 90vh at 20% 25%, rgba(var(--bg-primary-rgb,150, 80, 255), var(--bg-ambient-primary-opacity,.24)) 0%, rgba(var(--bg-primary-rgb,150, 80, 255), 0) 62%), radial-gradient(90vw 78vh at 82% 18%, rgba(var(--bg-secondary-rgb,255, 122, 139), var(--bg-ambient-secondary-opacity,.2)) 0%, rgba(var(--bg-secondary-rgb,255, 122, 139), 0) 58%), radial-gradient(104vw 92vh at 56% 78%, rgba(var(--bg-detail-rgb,107, 224, 255), var(--bg-ambient-detail-opacity,.08)) 0%, rgba(var(--bg-detail-rgb,107, 224, 255), 0) 64%), linear-gradient(var(--bg-gradient-angle,135deg), var(--bg-base,#0e0a0f) 0%, var(--bg-surface,#14000f) var(--bg-gradient-balance,60%), var(--bg-surface,#14000f) 100%);contain:paint;background-repeat:no-repeat;transition:background .35s,background-color .35s;position:fixed;inset:0;overflow:hidden}.app-shell.theme-light .bg[data-v-a8a9af8f]{background-color:var(--bg-surface,#fffaf2);background-image:radial-gradient(125vw 94vh at 18% 18%, #ffffffb8 0%, #ffffff57 34%, #fff0 68%), radial-gradient(92vw 72vh at 82% 20%, rgba(var(--bg-secondary-rgb,216, 230, 255), .42) 0%, rgba(var(--bg-secondary-rgb,216, 230, 255), 0) 62%), radial-gradient(112vw 90vh at 52% 86%, rgba(var(--bg-primary-rgb,255, 216, 197), .34) 0%, rgba(var(--bg-primary-rgb,255, 216, 197), 0) 66%), linear-gradient(var(--bg-gradient-angle,132deg), var(--bg-base,#f7efe4) 0%, var(--bg-surface,#fffaf2) var(--bg-gradient-balance,58%), #fff 100%)}.app-shell .bg.bg-webgpu-active[data-v-a8a9af8f]{background:0 0}.app-shell .bg.bg-webgpu-active[data-v-a8a9af8f]:before,.app-shell .bg.bg-webgpu-active[data-v-a8a9af8f]:after{content:none;animation:none}.app-shell .bg[data-v-a8a9af8f]:before,.app-shell .bg[data-v-a8a9af8f]:after{content:"";pointer-events:none;transition:opacity .35s,transform .35s,filter .35s;position:absolute;inset:-8%}.app-shell .bg[data-v-a8a9af8f]:before{background-image:var(--bg-detail-before-image,none);background-repeat:var(--bg-detail-before-repeat,no-repeat);background-size:var(--bg-detail-before-size,100% 100%);background-position:var(--bg-detail-before-position,center);opacity:var(--bg-detail-before-opacity,1);filter:var(--bg-detail-before-filter,none);animation:var(--bg-detail-before-animation,none)}.app-shell .bg[data-v-a8a9af8f]:after{background-image:var(--bg-detail-after-image,none);background-repeat:var(--bg-detail-after-repeat,no-repeat);background-size:var(--bg-detail-after-size,100% 100%);background-position:var(--bg-detail-after-position,center);opacity:var(--bg-detail-after-opacity,1);filter:var(--bg-detail-after-filter,none);animation:var(--bg-detail-after-animation,none)}.header-container[data-v-a8a9af8f]{width:100%;height:var(--header-height);padding:0 var(--header-inline-padding);z-index:10;pointer-events:auto;background:linear-gradient(130deg,#3e1e18f2 0%,#7e3c2ae6 48%,#2f203af2 100%);border-bottom:.1vh solid #ffdc78b8;justify-content:center;align-items:center;display:flex;position:fixed;top:0;left:0;box-shadow:0 .2vh 1vh #00000080,0 0 4.2vh #ffd65a8c,0 0 1.8vh #ffba266b,inset 0 .1vh #fff5c42e}.header-theme-sunset-glass[data-v-a8a9af8f]{--btn-off-darkblue:#1f3f86;--btn-off-violet:#5a2ea6;--btn-on-lightblue:#71d1ff;--btn-on-pink:#ff76d8;background:linear-gradient(135deg,#561c0e 0%,#a84218 52%,#48140c 100%)!important;border-bottom:.1vh solid #ffa85cbf!important;box-shadow:0 .2vh 1vh #00000094,0 0 3.6vh #ff7c306b,0 0 1.6vh #ffab5c47,inset 0 .1vh #ffdeaa1f!important}.mobile-input-proxy[data-v-a8a9af8f]{z-index:6000;padding:calc(8px + env(safe-area-inset-top,0px)) 10px 10px;box-sizing:border-box;background:linear-gradient(135deg,#1f0b14fa 0%,#45182afa 100%);border-bottom:1px solid #ffce92c7;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;display:grid;position:fixed;top:0;left:0;right:0;box-shadow:0 8px 22px #0006,0 0 20px #ff96552e}.mobile-input-proxy-label[data-v-a8a9af8f]{color:#ffeed6e0;text-overflow:ellipsis;white-space:nowrap;grid-column:1/-1;min-width:0;font-size:12px;font-weight:800;line-height:1;overflow:hidden}.mobile-input-proxy-field[data-v-a8a9af8f]{color:#fff7eefa;width:100%;min-width:0;height:44px;box-shadow:none;background:#14121cdb;border:1px solid #ffa85cb8;border-radius:8px;outline:none;padding:0 12px;font-size:16px;font-weight:700;line-height:1.2}.mobile-input-proxy-field[data-v-a8a9af8f]:focus{border-color:#ffdcaaf0;box-shadow:0 0 0 2px #ffb57233}.mobile-input-proxy-done[data-v-a8a9af8f]{color:#fff;cursor:pointer;background:linear-gradient(135deg,#3ab45cf5 0%,#147436fa 100%);border:1px solid #beffc9e0;border-radius:999px;width:auto;min-width:52px;height:44px;padding:0 14px;font-size:16px;font-weight:900;line-height:1;box-shadow:0 4px 14px #00000052,0 0 14px #53eb7c3d}.app-shell.phone-layout .mobile-input-proxy[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .mobile-input-proxy[data-v-a8a9af8f]{padding:calc(6px + env(safe-area-inset-top,0px)) 10px 6px;grid-template-columns:auto minmax(0,1fr) auto;gap:8px}.app-shell.phone-layout .mobile-input-proxy-label[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .mobile-input-proxy-label[data-v-a8a9af8f]{grid-column:auto;max-width:28vw;font-size:13px;line-height:1}.app-shell.phone-layout .mobile-input-proxy-field[data-v-a8a9af8f],.app-shell.phone-layout .mobile-input-proxy-done[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .mobile-input-proxy-field[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .mobile-input-proxy-done[data-v-a8a9af8f]{height:38px}.piano-header[data-v-a8a9af8f]{width:100%;height:100%;padding:0 var(--header-inline-padding);justify-content:space-between;align-items:center;gap:var(--header-content-gap);display:flex}.piano-header-left[data-v-a8a9af8f],.piano-header-right[data-v-a8a9af8f]{align-items:center;gap:var(--header-side-gap);flex:1;display:flex}.piano-header-right[data-v-a8a9af8f]{justify-content:flex-end}.app-shell.floating-sidebar-layout.portrait-vh-to-vw .piano-header[data-v-a8a9af8f],.app-shell.floating-sidebar-layout.portrait-vh-to-vw .piano-header-left[data-v-a8a9af8f],.app-shell.floating-sidebar-layout.portrait-vh-to-vw .piano-header-right[data-v-a8a9af8f]{align-items:center}.app-shell.floating-sidebar-layout.portrait-vh-to-vw .piano-header[data-v-a8a9af8f]{padding-inline:0}.app-shell.floating-sidebar-layout.portrait-vh-to-vw .piano-header-right[data-v-a8a9af8f]{justify-content:flex-end;column-gap:var(--header-side-gap);row-gap:clamp(6px,1.2vw,10px)}.app-shell.phone-portrait-layout .piano-header[data-v-a8a9af8f]{place-content:center flex-end;align-items:center;gap:var(--header-content-gap);padding:0 var(--header-inline-padding);display:flex}.app-shell.phone-portrait-layout .piano-header-left[data-v-a8a9af8f],.app-shell.phone-portrait-layout .piano-header-right[data-v-a8a9af8f]{flex:none;justify-content:center;width:100%;min-width:0}.app-shell.phone-layout .piano-header-left[data-v-a8a9af8f]{display:none}.app-shell.phone-portrait-layout .piano-header-right[data-v-a8a9af8f]{justify-content:flex-end;column-gap:var(--header-side-gap);flex-wrap:wrap;align-content:center;align-items:center;row-gap:clamp(8px,1.8vw,12px)}.brand[data-v-a8a9af8f]{align-items:center;gap:calc(1 * var(--header-vh-unit));cursor:pointer;height:100%;color:inherit;background:0 0;border:0;padding:0;display:flex}.brand-home-icon[data-v-a8a9af8f]{display:none}.brand-logo[data-v-a8a9af8f]{height:calc(var(--header-height) * .816);width:auto;max-height:100%;max-width:min(78vw, calc(var(--header-height) * 2.72));object-fit:contain;filter:drop-shadow(0 0 .8vh #ffb65a73);display:block}.brand-text[data-v-a8a9af8f]{font-size:clamp(27px, calc(3.45 * var(--header-vh-unit)), 51px);letter-spacing:.02em;color:#fff1dcfa;text-shadow:0 0 .8vh #ffb65a73,0 0 1.5vh #ff7a4059;white-space:nowrap;font-weight:800;line-height:1}.admin-header-btn[data-v-a8a9af8f]{height:calc(var(--header-control-size) * .68);min-width:calc(var(--header-control-size) * 1.45);padding:0 calc(1.1 * var(--header-vh-unit));color:#fff1dcf5;font-size:clamp(13px, calc(1.35 * var(--header-vh-unit)), 18px);letter-spacing:0;cursor:pointer;background:#20120d85;border:1px solid #ffdcaaa8;border-radius:999px;font-weight:800;line-height:1;transition:background-color .18s,border-color .18s,box-shadow .18s;box-shadow:0 .24vh .9vh #00000047,inset 0 .08vh #ffe6be2e}.admin-header-btn[data-v-a8a9af8f]:hover,.admin-header-btn.active[data-v-a8a9af8f]{background:#ff8a0038;border-color:#ffe8c4f2;box-shadow:0 .3vh 1.2vh #00000059,0 0 1.4vh #ff964c52,inset 0 .08vh #ffe6be47}.app-shell.floating-sidebar-layout.portrait-vh-to-vw .brand-logo[data-v-a8a9af8f]{display:none}.app-shell.floating-sidebar-layout.portrait-vh-to-vw .brand-text[data-v-a8a9af8f]{font-size:clamp(22px,6vw,34px);display:inline-flex}.app-shell.phone-portrait-layout .brand[data-v-a8a9af8f]{height:auto}.app-shell.phone-layout .brand-text[data-v-a8a9af8f],.app-shell.phone-layout .admin-header-btn[data-v-a8a9af8f]{display:none}.app-shell.phone-layout:not(.phone-portrait-layout) .piano-header-left[data-v-a8a9af8f],.app-shell.tablet-portrait-layout .piano-header-left[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .piano-header-left[data-v-a8a9af8f]{flex:0 auto;min-width:0;display:flex}.app-shell.phone-layout:not(.phone-portrait-layout) .piano-header-right[data-v-a8a9af8f],.app-shell.tablet-portrait-layout .piano-header-right[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .piano-header-right[data-v-a8a9af8f]{flex:auto;column-gap:clamp(14px,2vw,24px)}.app-shell.phone-layout:not(.phone-portrait-layout) .piano-header-right[data-v-a8a9af8f]{column-gap:clamp(14px,3.2vh,22px)}.app-shell.tablet-landscape-layout .piano-header-right[data-v-a8a9af8f]{column-gap:clamp(6px,1vw,12px)}.app-shell.phone-layout:not(.phone-portrait-layout) .piano-header-right[data-v-a8a9af8f]>*,.app-shell.tablet-portrait-layout .piano-header-right[data-v-a8a9af8f]>*,.app-shell.tablet-landscape-layout .piano-header-right[data-v-a8a9af8f]>*{margin-left:clamp(2px,.5vw,6px)}.app-shell.tablet-landscape-layout .piano-header-right[data-v-a8a9af8f]>*{margin-left:clamp(0px,.2vw,2px)}.app-shell.phone-layout:not(.phone-portrait-layout) .piano-header-right[data-v-a8a9af8f]>:first-child,.app-shell.tablet-portrait-layout .piano-header-right[data-v-a8a9af8f]>:first-child,.app-shell.tablet-landscape-layout .piano-header-right[data-v-a8a9af8f]>:first-child{margin-left:0}.app-shell.phone-layout:not(.phone-portrait-layout) .brand-logo[data-v-a8a9af8f],.app-shell.tablet-portrait-layout.floating-sidebar-layout.portrait-vh-to-vw .brand-logo[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .brand-logo[data-v-a8a9af8f]{display:block}.app-shell.phone-layout:not(.phone-portrait-layout) .brand-text[data-v-a8a9af8f],.app-shell.tablet-portrait-layout.floating-sidebar-layout.portrait-vh-to-vw .brand-text[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .brand-text[data-v-a8a9af8f]{display:inline-flex}.app-shell.phone-layout:not(.phone-portrait-layout) .brand[data-v-a8a9af8f]{gap:5px}.app-shell.phone-layout:not(.phone-portrait-layout) .brand-logo[data-v-a8a9af8f]{height:calc(var(--header-height) * .64)}.app-shell.phone-layout:not(.phone-portrait-layout) .brand-text[data-v-a8a9af8f]{font-size:clamp(17px,4.4vh,24px)}.app-shell.tablet-portrait-layout .brand-logo[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .brand-logo[data-v-a8a9af8f]{height:calc(var(--header-height) * .68)}.app-shell.tablet-portrait-layout .brand-text[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .brand-text[data-v-a8a9af8f]{font-size:clamp(22px,3.8vh,30px)}.app-shell.phone-layout .piano-header-left[data-v-a8a9af8f]{flex:none;justify-content:flex-start;width:auto;min-width:0;display:flex}.app-shell.phone-portrait-layout .piano-header[data-v-a8a9af8f]{justify-content:space-between}.app-shell.phone-portrait-layout .piano-header-right[data-v-a8a9af8f]{flex:auto;width:auto}.app-shell.phone-layout .brand[data-v-a8a9af8f]{width:var(--header-control-size);height:var(--header-control-size);flex:0 0 var(--header-control-size);box-shadow:none;background:0 0;border:0;border-radius:0;justify-content:center}.app-shell.phone-layout .brand-logo[data-v-a8a9af8f],.app-shell.phone-layout .brand-text[data-v-a8a9af8f]{display:none}.app-shell.phone-layout .brand-home-icon[data-v-a8a9af8f]{fill:none;stroke:#fff4e4fa;stroke-width:1.9px;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 .45vh #ffb65a80);width:78%;height:78%;display:block}@media (width<=800px){.piano-header-left[data-v-a8a9af8f]{flex:none;width:auto;min-width:0;display:flex}.brand-logo[data-v-a8a9af8f],.brand-text[data-v-a8a9af8f]{display:none}.brand-home-icon[data-v-a8a9af8f]{display:block}}.app-shell.floating-sidebar-layout .lang-menu[data-v-a8a9af8f]{--lang-control-width:58px;margin-right:0}.app-shell.phone-layout .lang-menu[data-v-a8a9af8f]{--lang-control-width:70px;margin-right:0}.app-shell.floating-sidebar-layout .auth-split-btn[data-v-a8a9af8f]{font-size:14px}.app-shell.floating-sidebar-layout .auth-split-btn--login[data-v-a8a9af8f]{padding-inline:7px}.app-shell.floating-sidebar-layout .auth-split-btn--signup[data-v-a8a9af8f]{padding-inline:9px}.app-shell.phone-layout .auth-split-btn[data-v-a8a9af8f]{font-size:16px}.app-shell.phone-layout .auth-split-btn--login[data-v-a8a9af8f]{padding-inline:8px}.app-shell.phone-layout .auth-split-btn--signup[data-v-a8a9af8f]{padding-inline:10px}.header-btn[data-v-a8a9af8f]{border:max(1px, calc(.1 * var(--header-vh-unit))) solid #b0bcffc7;cursor:pointer;color:#f5f7fffa;text-shadow:0 0 calc(1 * var(--header-vh-unit)) #a0b4ff9e;background:linear-gradient(135deg, var(--btn-off-darkblue) 0%, var(--btn-off-violet) 100%);justify-content:center;align-items:center;font-weight:700;display:flex;position:relative;overflow:hidden;box-shadow:0 .4vh 2vh #00000073,0 0 2.8vh #5874d675,inset 0 .1vh #dce3ff33}.header-btn[data-v-a8a9af8f]:before{content:"";pointer-events:none;background:radial-gradient(circle,#d608a640 0%,#0000 70%);border-radius:50%;width:0;height:0;transition:width .6s,height .6s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.header-btn[data-v-a8a9af8f]:hover{background:linear-gradient(135deg, var(--btn-on-lightblue) 0%, var(--btn-on-pink) 100%);border-color:#e4baffe6;box-shadow:0 .8vh 3vh #00000080,0 0 4vh #c37aff9e,inset 0 .1vh #e9eeff4d}.header-btn[data-v-a8a9af8f]:hover:before{width:calc(20 * var(--header-vh-unit));height:calc(20 * var(--header-vh-unit))}.header-btn[data-v-a8a9af8f]:disabled{opacity:.6;cursor:not-allowed}.oval-btn[data-v-a8a9af8f]{height:var(--header-control-size);padding:0 calc(2 * var(--header-vh-unit));border-radius:calc(4.5 * var(--header-vh-unit));font-size:calc(1.55 * var(--header-vh-unit));min-width:calc(15 * var(--header-vh-unit));line-height:1.1}.round-btn[data-v-a8a9af8f]{width:var(--header-control-size);height:var(--header-control-size);font-size:calc(1.5 * var(--header-vh-unit));border-radius:50%;padding:0;line-height:1}.profile-avatar-btn[data-v-a8a9af8f]{padding:0}.profile-avatar-image[data-v-a8a9af8f]{object-fit:cover;width:100%;height:100%;display:block}.profile-avatar-fallback[data-v-a8a9af8f]{font-size:calc(2.2 * var(--header-vh-unit));font-weight:800}.profile-avatar-placeholder[data-v-a8a9af8f]{pointer-events:none;opacity:.42}.guest-only[data-v-a8a9af8f]{display:inline-flex}.auth-split-oval[data-v-a8a9af8f]{height:var(--header-control-size);border-radius:calc(4.5 * var(--header-vh-unit));border:max(1px, calc(.1 * var(--header-vh-unit))) solid #c4ceffb8;background:linear-gradient(90deg,#7a48ffe6 0%,#58a2ffe6 52%,#ff76d8e6 100%);flex:none;align-items:stretch;gap:0;display:inline-flex;overflow:hidden;box-shadow:0 .4vh 2vh #00000073,0 0 3vh #849aff80,inset 0 .1vh #ecf0ff40}.auth-split-btn[data-v-a8a9af8f]{color:#fffcf7fa;cursor:pointer;min-width:0;height:100%;font-size:clamp(13px, calc(1.55 * var(--header-vh-unit)), 20px);text-shadow:0 0 calc(1 * var(--header-vh-unit)) #e8ecff8c;-webkit-user-select:none;user-select:none;white-space:nowrap;background:0 0;border:none;border-radius:0;justify-content:center;align-items:center;font-weight:800;line-height:1;transition:background-color .25s,box-shadow .25s,color .25s;display:inline-flex}.auth-split-btn--login[data-v-a8a9af8f]{min-width:calc(7.2 * var(--header-vh-unit));padding:0 calc(.9 * var(--header-vh-unit));flex:none}.auth-split-btn--signup[data-v-a8a9af8f]{min-width:max-content;padding:0 calc(1.15 * var(--header-vh-unit));flex:0 auto}.auth-split-btn+.auth-split-btn[data-v-a8a9af8f]{border-left:max(1px, calc(.18 * var(--header-vh-unit))) solid #cedcff94}.auth-split-btn[data-v-a8a9af8f]:hover{box-shadow:inset 0 0 calc(2.2 * var(--header-vh-unit)) #e4ebff3d;background:#ffffff14}.auth-split-btn.active[data-v-a8a9af8f]{box-shadow:inset 0 0 calc(2.6 * var(--header-vh-unit)) #f3f7ff5c;background:#ffffff2e}.settings-menu[data-v-a8a9af8f],.lang-menu[data-v-a8a9af8f]{--header-menu-bg:radial-gradient(28vh 18vh at 10% 0%, #23004447, transparent 100%), radial-gradient(24vh 18vh at 94% 14%, #2a0079, transparent 100%), linear-gradient(145deg, #190031fc 0%, #240358fc 100%);--header-menu-border:#1dc1c9b8;--header-menu-shadow:#050008c2;--header-menu-glow:#ffaa0047;--header-menu-inset:#ffbe8429;--header-menu-text:#fff0daf7;--header-menu-muted:#ffd3aab3;--header-menu-hover:#beb42438;--header-menu-active-bg:linear-gradient(135deg, #ff770078, #b806066b);--header-menu-active-text:#fff8ed;--header-menu-danger:#ffb0b0;position:relative}.app-shell.theme-light .settings-menu[data-v-a8a9af8f],.app-shell.theme-light .lang-menu[data-v-a8a9af8f]{--header-menu-bg:radial-gradient(28vh 18vh at 8% 0%, #ffe8daf5, transparent 68%), radial-gradient(24vh 18vh at 96% 12%, #ff86243d, transparent 70%), linear-gradient(145deg, #fffffffb 0%, #fff6f0fc 54%, #f8e2d9f9 100%);--header-menu-border:#ae581e94;--header-menu-shadow:#4b1f0c57;--header-menu-glow:#ff862438;--header-menu-inset:#ffffffeb;--header-menu-text:#462412f0;--header-menu-muted:#844a269e;--header-menu-hover:#ff862429;--header-menu-active-bg:linear-gradient(135deg, #ff86243d, rgba(var(--bg-primary-rgb,240, 219, 219), .88));--header-menu-active-text:#3e1c0afa;--header-menu-danger:#a3342f}.settings-btn[data-v-a8a9af8f]{width:var(--header-control-size);min-width:var(--header-control-size);height:var(--header-control-size);border-radius:50%;padding:0}.settings-icon[data-v-a8a9af8f]{width:clamp(24px, calc(var(--header-control-size) * .52), 42px);height:clamp(24px, calc(var(--header-control-size) * .52), 42px);display:block}.app-shell.phone-layout .settings-icon[data-v-a8a9af8f]{width:calc(var(--header-control-size) * .62);height:calc(var(--header-control-size) * .62)}.settings-dropdown[data-v-a8a9af8f]{border:.15vh solid var(--header-menu-border);background:var(--header-menu-bg);min-width:clamp(220px,24vh,340px);box-shadow:0 1.45vh 4.2vh var(--header-menu-shadow), 0 .35vh 1.6vh var(--header-menu-glow), 0 0 0 .1vh var(--header-menu-inset) inset;-webkit-backdrop-filter:blur(1.1vh)saturate(145%);z-index:25;border-radius:1.35vh;gap:.2vh;padding:1vh .7vh;display:grid;position:absolute;top:calc(100% + .55vh);right:0;overflow:hidden}.settings-dropdown[data-v-a8a9af8f]:before,.lang-dropdown[data-v-a8a9af8f]:before{content:"";border-radius:inherit;pointer-events:none;border:.1vh solid #ffffff14;position:absolute;inset:.12vh}.settings-dropdown[data-v-a8a9af8f]:after,.lang-dropdown[data-v-a8a9af8f]:after{content:"";pointer-events:none;background:linear-gradient(90deg,#0000,#ffdab2ad,#0000);border-radius:999px;height:.12vh;position:absolute;top:.25vh;left:.9vh;right:.9vh}.settings-menu-item[data-v-a8a9af8f]{width:100%;color:var(--header-menu-text);text-align:left;cursor:pointer;z-index:1;background:0 0;border:none;border-radius:.8vh;justify-content:flex-start;align-items:center;padding:clamp(10px,1.05vh,16px) clamp(10px,1.1vh,18px);font-size:clamp(18px,2.2vh,32px);font-weight:700;line-height:1.2;text-decoration:none;transition:background .16s,color .16s;display:inline-flex;position:relative}.settings-menu-item[data-v-a8a9af8f]:hover{background:var(--header-menu-hover)}.settings-menu-item[data-v-a8a9af8f]:disabled{opacity:.55;cursor:not-allowed}.settings-menu-item--danger[data-v-a8a9af8f]{color:var(--header-menu-danger)}.settings-menu-discord-note[data-v-a8a9af8f]{color:var(--header-menu-muted);text-underline-offset:.18em;padding:clamp(8px,.9vh,13px) clamp(10px,1.1vh,18px);font-size:clamp(13px,1.55vh,20px);font-weight:600;line-height:1.35;text-decoration:underline;display:block}.settings-menu-discord-note[data-v-a8a9af8f]:hover{color:var(--header-menu-text)}.lang-menu[data-v-a8a9af8f]{--lang-trigger-color:#ecf3fff7;--lang-control-width:clamp(74px, calc(9.4 * var(--header-vh-unit)), 118px);flex:0 0 var(--lang-control-width);width:var(--lang-control-width);min-width:var(--lang-control-width);height:var(--header-control-size);justify-content:center;align-items:center;display:flex}.lang-menu[data-v-a8a9af8f]:after{content:"";width:100%;height:calc(1.1 * var(--header-vh-unit));position:absolute;top:100%;left:0}.lang-menu--light[data-v-a8a9af8f]{--lang-trigger-color:#fff0dcfa}.lang-trigger[data-v-a8a9af8f]{color:var(--lang-trigger-color);grid-template-columns:clamp(18px, calc(2.5 * var(--header-vh-unit)), 32px) 2.35ch clamp(16px, calc(2.2 * var(--header-vh-unit)), 28px);justify-content:center;align-items:center;column-gap:calc(.74 * var(--header-vh-unit));width:100%;padding:0 calc(.55 * var(--header-vh-unit));height:100%;font-size:clamp(18px, calc(2.25 * var(--header-vh-unit)), 30px);cursor:pointer;background:0 0;border:none;font-weight:700;display:grid}.app-shell.phone-layout .lang-trigger[data-v-a8a9af8f]{grid-template-columns:22px 2.1ch 16px;column-gap:2px;font-size:20px}.lang-globe[data-v-a8a9af8f]{width:clamp(18px, calc(2.5 * var(--header-vh-unit)), 32px);height:clamp(18px, calc(2.5 * var(--header-vh-unit)), 32px);fill:none;stroke:currentColor;stroke-width:1.8px}.app-shell.phone-layout .lang-globe[data-v-a8a9af8f]{width:22px;height:22px}.lang-current[data-v-a8a9af8f]{text-align:center;justify-content:center;width:2.35ch;line-height:1;display:inline-flex}.lang-chevron[data-v-a8a9af8f]{width:clamp(16px, calc(2.2 * var(--header-vh-unit)), 28px);height:clamp(16px, calc(2.2 * var(--header-vh-unit)), 28px);fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}.app-shell.phone-layout .lang-chevron[data-v-a8a9af8f]{width:16px;height:16px}.lang-menu:hover .lang-chevron[data-v-a8a9af8f],.lang-menu:focus-within .lang-chevron[data-v-a8a9af8f]{transform:rotate(180deg)}.lang-dropdown[data-v-a8a9af8f]{background:var(--header-menu-bg);border:.15vh solid var(--header-menu-border);min-width:clamp(220px,24vh,340px);box-shadow:0 1.45vh 4.2vh var(--header-menu-shadow), 0 .35vh 1.6vh var(--header-menu-glow), 0 0 0 .1vh var(--header-menu-inset) inset;-webkit-backdrop-filter:blur(1.1vh)saturate(145%);opacity:0;pointer-events:none;z-index:25;border-radius:1.35vh;gap:.2vh;padding:1vh .7vh;transition:opacity .18s,transform .18s;display:grid;position:absolute;top:calc(100% + .55vh);left:0;overflow:hidden;transform:translateY(-.4vh)}.lang-menu:hover .lang-dropdown[data-v-a8a9af8f],.lang-menu:focus-within .lang-dropdown[data-v-a8a9af8f]{opacity:1;pointer-events:auto;transform:translateY(0)}.lang-dropdown button[data-v-a8a9af8f]{color:var(--header-menu-text);justify-content:flex-start;align-items:center;gap:calc(.8 * var(--header-vh-unit));text-align:left;cursor:pointer;z-index:1;background:0 0;border:none;border-radius:.8vh;padding:clamp(10px,1.05vh,16px) clamp(10px,1.1vh,18px);font-size:clamp(18px,2.2vh,32px);font-weight:700;line-height:1.2;transition:background .16s,color .16s;display:inline-flex;position:relative}.lang-dropdown button[data-v-a8a9af8f]:hover{background:var(--header-menu-hover)}.lang-dropdown button.active[data-v-a8a9af8f]{background:var(--header-menu-active-bg);color:var(--header-menu-active-text)}.lang-option-code[data-v-a8a9af8f]{min-width:calc(3.6 * var(--header-vh-unit));letter-spacing:.04em;font-weight:800}.lang-option-label[data-v-a8a9af8f]{font-weight:700}.theme-toggle-btn[data-v-a8a9af8f]{width:var(--header-control-size);min-width:var(--header-control-size);height:var(--header-control-size);border-radius:50%;padding:0}.theme-icon[data-v-a8a9af8f]{width:clamp(36px, calc(var(--header-control-size) * .75), 66px);height:clamp(36px, calc(var(--header-control-size) * .75), 66px);fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round}.app-shell.phone-layout .theme-icon[data-v-a8a9af8f]{width:calc(var(--header-control-size) * .75);height:calc(var(--header-control-size) * .75)}.theme-icon--sun circle[data-v-a8a9af8f]{fill:currentColor;stroke:none}.theme-icon--sun path[data-v-a8a9af8f]{stroke:currentColor}.theme-icon--moon path[data-v-a8a9af8f]{fill:currentColor;stroke:none}.floating-sidebar-toggle[data-v-a8a9af8f],.floating-sidebar-backdrop[data-v-a8a9af8f]{display:none}.layout[data-v-a8a9af8f]{height:var(--app-viewport-height,calc(100 * var(--viewport-unit)));padding-top:var(--header-height);z-index:1;display:block;position:relative;overflow:visible}.stage[data-v-a8a9af8f]{width:100%;height:calc(var(--app-viewport-height,calc(100 * var(--viewport-unit))) - var(--header-height));grid-template-columns:clamp(280px,20vw,420px) minmax(0,1fr);align-items:stretch;gap:0;display:grid;overflow:visible}.pane[data-v-a8a9af8f]{border:.2vh solid color-mix(in oklab, var(--pane-accent,#f9681f) 55%, transparent);background:linear-gradient(180deg, color-mix(in oklab, var(--pane-accent,#f9681f) 5%, transparent), #08080c57);-webkit-backdrop-filter:blur(1vh)saturate(135%);border-radius:5vh;position:relative;overflow:hidden;box-shadow:0 2.6vh 8vh #0000008c,inset 0 0 0 .1vh #ffffff12}.pane[data-v-a8a9af8f]:hover{border-color:color-mix(in oklab, var(--pane-accent,#f9681f) 70%, transparent);box-shadow:0 1.6vh 4.8vh #000000a6, 0 0 0 .1vh color-mix(in oklab, var(--pane-accent,#f9681f) 35%, transparent) inset, 0 1vh 3.4vh color-mix(in oklab, var(--pane-accent,#f9681f) 25%, transparent)}.pane[data-v-a8a9af8f]:before{content:"";border-radius:inherit;pointer-events:none;opacity:0;background:radial-gradient(63vh 48vh at var(--px-pane,50%) var(--py-pane,50%), color-mix(in oklab, var(--pane-accent,#f9681f) 35%, transparent) 0%, color-mix(in oklab, var(--pane-accent,#f9681f) 14%, transparent) 35%, transparent 72%);filter:blur(.5vh);transition:opacity .25s;position:absolute;inset:0}.pane[data-v-a8a9af8f]:hover:before{opacity:1}.pane--left[data-v-a8a9af8f]{--pane-accent:#f9681f;-webkit-backdrop-filter:none;box-shadow:none;padding-left:clamp(10px, calc((var(--header-inline-padding) * 2) - 1.6vh), 28px);box-sizing:border-box;background:0 0;border:none;border-radius:0;transition:none;overflow:visible}.pane--left[data-v-a8a9af8f]:before{display:none}.pane--left[data-v-a8a9af8f]:hover{box-shadow:none;background:0 0;border-color:#0000}.pane--right[data-v-a8a9af8f]{--pane-accent:#f9d51f;box-shadow:none;-webkit-backdrop-filter:none;background:0 0;border:none;display:grid}.pane--right[data-v-a8a9af8f]:hover{box-shadow:none;background:0 0;border-color:#0000}.pane--right[data-v-a8a9af8f]:before{display:none}.content-pane[data-v-a8a9af8f]{padding:clamp(2px,.2vh,4px) clamp(8px,.8vh,10px) clamp(10px,1.2vh,14px);background:0 0;border:none;border-radius:0;flex-direction:column;justify-content:flex-start;min-height:100%;margin:clamp(12px,1.8vh,18px);padding-top:clamp(28px,5vh,46px);display:flex;overflow:auto}.content-pane--landing[data-v-a8a9af8f]{padding-top:clamp(6px,1.1vh,14px)}.content-pane[data-v-a8a9af8f]>*{width:100%;margin-left:auto;margin-right:auto}.sidebar[data-v-a8a9af8f]{grid-template-rows:auto auto auto 1fr auto;gap:clamp(12px,1.8vh,18px);height:100%;padding:clamp(16px,2.4vh,24px) clamp(10px,1.6vh,16px);display:grid}.sidebar-column[data-v-a8a9af8f],.sidebar-column--right[data-v-a8a9af8f]{display:contents}.sidebar-spacer[data-v-a8a9af8f]{min-height:0}.sidebar-pane[aria-label="Tools Gruppe 1"][data-v-a8a9af8f]{order:1}.sidebar-pane[aria-label="Tools Gruppe 2"][data-v-a8a9af8f]{order:2}.sidebar-pane[aria-label="Tools Gruppe 3"][data-v-a8a9af8f]{order:3}.sidebar-spacer[data-v-a8a9af8f]{order:4}.sidebar-pane[aria-label="Tools Gruppe 4"][data-v-a8a9af8f]{order:5}.sidebar-pane[data-v-a8a9af8f]{--pane-accent:#f9681f;border:max(1px, .2vh) solid color-mix(in oklab, var(--pane-accent) 55%, transparent);background:linear-gradient(180deg, color-mix(in oklab, var(--pane-accent) 5%, transparent), #08080c57);-webkit-backdrop-filter:blur(1vh)saturate(135%);border-radius:clamp(16px,2.2vh,22px);flex-direction:column;justify-content:center;gap:clamp(7px,.9vh,9px);padding:clamp(9px,1.2vh,12px) clamp(10px,1.4vh,14px);display:flex;position:relative;overflow:hidden;box-shadow:0 2vh 5vh #00000073,inset 0 0 0 .1vh #ffffff0f}.sidebar-pane[data-v-a8a9af8f]:hover{border-color:color-mix(in oklab, var(--pane-accent) 70%, transparent);box-shadow:0 1.2vh 3.6vh #00000094, 0 0 0 .1vh color-mix(in oklab, var(--pane-accent) 35%, transparent) inset, 0 .8vh 2.2vh color-mix(in oklab, var(--pane-accent) 25%, transparent)}.sidebar-pane[data-v-a8a9af8f]:before{content:"";border-radius:inherit;pointer-events:none;opacity:0;background:radial-gradient(40vh 24vh at var(--px-pane,50%) var(--py-pane,50%), color-mix(in oklab, var(--pane-accent) 35%, transparent) 0%, color-mix(in oklab, var(--pane-accent) 14%, transparent) 35%, transparent 72%);filter:blur(.4vh);transition:opacity .25s;position:absolute;inset:0}.sidebar-pane[data-v-a8a9af8f]:hover:before{opacity:1}.app-shell.theme-light .sidebar-pane[data-v-a8a9af8f]{background:#f3eee6;border-color:#53463733;box-shadow:0 1.4vh 3.8vh #34291b29,inset 0 0 0 .1vh #ffffffb8}.app-shell.theme-light .sidebar-pane[data-v-a8a9af8f]:hover{border-color:#70539e5c;box-shadow:0 1.2vh 3.4vh #34291b33,inset 0 0 0 .1vh #70539e29}.app-shell.theme-light .sidebar-pane[data-v-a8a9af8f]:before{background:radial-gradient(40vh 24vh at var(--px-pane,50%) var(--py-pane,50%), #70539e29 0%, #f3eee61f 42%, transparent 74%)}.sidebar-link[data-v-a8a9af8f]{color:#ffecd6fa;text-align:left;cursor:pointer;background:0 0;border:none;justify-content:flex-start;align-items:center;gap:clamp(8px,1.1vh,11px);min-width:0;padding:clamp(5px,.6vh,7px) 2px;font-size:clamp(13px,1.45vh,15px);font-weight:700;line-height:1.15;display:flex}.app-shell.theme-light:not(.floating-sidebar-layout) .sidebar-link[data-v-a8a9af8f],.app-shell.theme-light:not(.floating-sidebar-layout) .link-label[data-v-a8a9af8f],.app-shell.theme-light:not(.floating-sidebar-layout) .social-link[data-v-a8a9af8f]{color:#0b0b0b;text-shadow:none}.sidebar-link.active .link-label[data-v-a8a9af8f],.sidebar-link:hover .link-label[data-v-a8a9af8f]{color:#ffc882;text-shadow:0 0 1.1vh #ff994294}.link-icon[data-v-a8a9af8f]{color:#ffad5ef5;text-shadow:0 0 .7vh #ff994270;justify-content:center;align-items:center;width:clamp(30px,3.8vh,42px);min-width:clamp(30px,3.8vh,42px);font-size:clamp(22px,2.8vh,31px);display:inline-flex}.app-shell.theme-light:not(.floating-sidebar-layout) .link-icon[data-v-a8a9af8f],.app-shell.theme-light:not(.floating-sidebar-layout) .social-glyph[data-v-a8a9af8f]{color:#7c3aed;text-shadow:none}.sidebar-link.active .link-icon[data-v-a8a9af8f],.sidebar-link:hover .link-icon[data-v-a8a9af8f]{color:#ffc882}.app-shell.theme-light:not(.floating-sidebar-layout) .sidebar-link.active .link-label[data-v-a8a9af8f],.app-shell.theme-light:not(.floating-sidebar-layout) .sidebar-link:hover .link-label[data-v-a8a9af8f],.app-shell.theme-light:not(.floating-sidebar-layout) .social-link[data-v-a8a9af8f]:hover{color:#0b0b0b;text-shadow:none}.app-shell.theme-light:not(.floating-sidebar-layout) .sidebar-link.active .link-icon[data-v-a8a9af8f],.app-shell.theme-light:not(.floating-sidebar-layout) .sidebar-link:hover .link-icon[data-v-a8a9af8f],.app-shell.theme-light:not(.floating-sidebar-layout) .social-link:hover .social-glyph[data-v-a8a9af8f]{color:#6d28d9;text-shadow:none}.link-icon svg[data-v-a8a9af8f]{fill:none;stroke:currentColor;stroke-width:1.85px;stroke-linecap:round;stroke-linejoin:round;width:86%;height:86%;display:block}.link-icon--solid svg[data-v-a8a9af8f]{fill:currentColor;stroke:none}.link-label[data-v-a8a9af8f]{color:#fff3dcf5;letter-spacing:0;word-spacing:normal;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:clamp(17px,2.1vh,22px);font-weight:700;line-height:1.05;overflow:hidden}.social-grid[data-v-a8a9af8f]{grid-template-columns:repeat(4,1fr);gap:clamp(6px,.8vh,8px);margin-top:.2vh;display:grid}.social-link[data-v-a8a9af8f]{color:#fff3dcf5;cursor:pointer;text-shadow:0 0 .6vh #ffa95a52;background:0 0;border:none;justify-content:center;align-items:center;padding:clamp(3px,.4vh,4px);display:inline-flex}.social-link[data-v-a8a9af8f]:hover{color:#ffcb8c;text-shadow:0 0 1.1vh #ffa2488c}.social-glyph[data-v-a8a9af8f]{color:#ffad5efa;justify-content:center;align-items:center;width:clamp(30px,3.8vh,42px);height:clamp(30px,3.8vh,42px);display:inline-flex}.social-glyph svg[data-v-a8a9af8f]{fill:currentColor;width:clamp(29px,3.6vh,40px);height:clamp(29px,3.6vh,40px);display:block}.card[data-v-a8a9af8f]{-webkit-backdrop-filter:none;box-shadow:none;box-sizing:border-box;background:0 0;border:none;border-radius:1.8vh;gap:1vh;width:100%;margin-bottom:1.1vh;margin-left:auto;margin-right:auto;padding:1.4vh;display:grid}.card.container-wide[data-v-a8a9af8f]{width:min(92%,1440px);padding-left:1vh;padding-right:1vh}.card.container-medium[data-v-a8a9af8f]{width:min(72%,1040px)}.card.container-narrow[data-v-a8a9af8f]{width:min(48%,680px)}.card.container-narrow.play-area-card[data-v-a8a9af8f]{width:min(82%,1100px)}.card>h2[data-v-a8a9af8f]{text-align:center;margin:0 0 .8vh;padding-top:1vh;font-size:3vh}.piano2midi-card[data-v-a8a9af8f]{background:0 0;gap:1.8vh;width:min(78%,1180px);padding:.6vh .2vh 1.4vh}.landing-page[data-v-a8a9af8f]{color:#fff7ec;box-sizing:border-box;align-self:start;gap:18px;width:min(96%,1180px);padding:0 0 28px;display:grid}.landing-hero[data-v-a8a9af8f]{grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);align-items:start;gap:22px;display:grid}.landing-hero-copy[data-v-a8a9af8f]{gap:14px;min-width:0;display:grid}.landing-hero h1[data-v-a8a9af8f]{color:#fffaf3;letter-spacing:0;text-wrap:balance;margin:0;font-size:clamp(32px,5.6vh,58px);font-weight:920;line-height:1.02}.landing-midi-hint[data-v-a8a9af8f]{color:#fff1dcb8;border-left:3px solid #7ee6bd;margin:0;padding:2px 0 2px 12px;font-size:clamp(14px,1.8vh,17px);font-weight:720;line-height:1.35}.landing-can-intro[data-v-a8a9af8f]{color:#fffaf3;margin:2px 0 -2px;font-size:clamp(17px,2.25vh,22px);font-weight:900;line-height:1.2}.landing-subtitle[data-v-a8a9af8f]{color:#fff1dcd6;counter-reset:landing-steps;gap:8px;max-width:760px;margin:0;padding:0;font-size:clamp(16px,2.25vh,22px);font-weight:650;line-height:1.42;list-style:none;display:grid}.landing-subtitle li[data-v-a8a9af8f]{counter-increment:landing-steps;min-width:0;padding-left:34px;position:relative}.landing-subtitle li[data-v-a8a9af8f]:before{content:counter(landing-steps);color:#102018;background:#7ee6bd;border-radius:999px;place-items:center;width:23px;height:23px;font-size:13px;font-weight:950;line-height:1;display:grid;position:absolute;top:.1em;left:0;box-shadow:0 0 12px #7ee6bd6b}.landing-actions[data-v-a8a9af8f]{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.landing-hero-side[data-v-a8a9af8f]{align-content:start;gap:12px;min-width:0;display:grid}.landing-actions--right[data-v-a8a9af8f]{justify-content:center}.landing-btn[data-v-a8a9af8f]{color:#fffaf3;letter-spacing:0;text-align:center;cursor:pointer;border:1px solid #ffe4be47;border-radius:8px;justify-content:center;align-items:center;min-width:0;min-height:44px;padding:0 16px;font-size:15px;font-weight:900;line-height:1.1;text-decoration:none;transition:border-color .18s,background-color .18s,transform .18s,box-shadow .18s;display:inline-flex}.landing-btn[data-v-a8a9af8f]:hover{transform:translateY(-1px)}.landing-btn--primary[data-v-a8a9af8f]{color:#160a03;background:#e8752b;border-color:#ffd6aaeb;box-shadow:0 10px 24px #e8752b42}.landing-btn--secondary[data-v-a8a9af8f]{background:#225ad6;border-color:#96beffb8}.landing-btn--ghost[data-v-a8a9af8f]{background:#ffffff0f;border-color:#ffebd247}.landing-btn--support[data-v-a8a9af8f]{color:#f9fffb;background:#16895b;border-color:#96ffcd94;width:fit-content}.landing-btn--placeholder[data-v-a8a9af8f]{visibility:hidden;pointer-events:none}.landing-source-panel[data-v-a8a9af8f]{justify-self:center;width:min(100%,420px);display:grid}.landing-source-buttons[data-v-a8a9af8f]{grid-template-columns:minmax(0,1fr);gap:8px;display:grid}.landing-source-tile[data-v-a8a9af8f]{--landing-tile-accent:#8b6cff;--landing-tile-accent-2:#62d6ff;border:1px solid color-mix(in srgb, var(--landing-tile-accent) 58%, #ffffff1f);background:linear-gradient(145deg, color-mix(in srgb, var(--landing-tile-accent) 11%, transparent), #ffffff0a);color:#fffaf4;text-align:center;cursor:pointer;border-radius:8px;grid-template-rows:42px auto auto;align-content:center;justify-items:center;gap:5px;min-width:0;min-height:108px;padding:9px;display:grid;box-shadow:inset 0 0 0 1px #ffffff0a}.landing-source-tile--community[data-v-a8a9af8f]{--landing-tile-accent:#ffb35c;--landing-tile-accent-2:#66e6a3}.landing-source-tile[data-v-a8a9af8f]:hover{box-shadow:0 10px 25px #00000042, 0 0 20px color-mix(in srgb, var(--landing-tile-accent) 34%, transparent);border-color:#ffffff8f}.landing-source-icon[data-v-a8a9af8f]{width:40px;height:40px;color:var(--landing-tile-accent-2);filter:drop-shadow(0 0 8px color-mix(in srgb, var(--landing-tile-accent) 38%, transparent));place-items:center;display:grid}.landing-source-icon svg[data-v-a8a9af8f]{fill:none;stroke:currentColor;stroke-width:1.85px;stroke-linecap:round;stroke-linejoin:round;width:92%;height:92%}.landing-source-icon--solid svg[data-v-a8a9af8f]{fill:currentColor;stroke:none}.landing-source-title[data-v-a8a9af8f]{color:currentColor;overflow-wrap:anywhere;max-width:100%;font-size:14px;font-weight:900;line-height:1.05}.landing-source-subtitle[data-v-a8a9af8f]{color:#fffaf0b3;overflow-wrap:anywhere;max-width:100%;font-size:11px;font-weight:750;line-height:1.15}.landing-coffee-card[data-v-a8a9af8f]{background:linear-gradient(#1e1812f5,#0d0e14fa),linear-gradient(90deg,#f4c15d1f,#4ea3ff14);border:1px solid #f4c15d6b;border-radius:8px;align-content:start;justify-items:stretch;gap:clamp(12px,1.8vh,18px);min-width:0;padding:clamp(18px,2.8vh,28px);display:grid;position:relative;overflow:hidden;box-shadow:0 16px 36px #00000052,inset 0 1px #ffffff14}.landing-coffee-card[data-v-a8a9af8f]:before{content:"";background:linear-gradient(90deg,#f4c15d,#e8752b,#7ee6bd);height:5px;position:absolute;inset:0 0 auto}.landing-coffee-card[data-v-a8a9af8f]:after{content:"";background:#ffffff29;height:1px;position:absolute;inset:5px 0 auto}.landing-coffee-card p[data-v-a8a9af8f]{color:#fff1dcd1;margin:0;font-size:clamp(15px,2.1vh,19px);font-weight:720;line-height:1.44}.landing-coffee-card .landing-btn[data-v-a8a9af8f]{color:#211407;background:#f4c15d;border-color:#ffe7bab8;justify-self:center;min-width:min(100%,260px);min-height:clamp(52px,6.2vh,64px);padding:0 clamp(22px,3.2vh,34px);font-size:clamp(18px,2.35vh,23px);font-weight:950;box-shadow:0 10px 22px #f4c15d3d}.app-shell.theme-light .landing-page[data-v-a8a9af8f],.app-shell.theme-light .landing-hero h1[data-v-a8a9af8f]{color:#171019}.app-shell.theme-light .landing-subtitle[data-v-a8a9af8f],.app-shell.theme-light .landing-midi-hint[data-v-a8a9af8f],.app-shell.theme-light .landing-coffee-card p[data-v-a8a9af8f]{color:#171019b8}.app-shell.theme-light .landing-can-intro[data-v-a8a9af8f]{color:#171019}.app-shell.theme-light .landing-btn--ghost[data-v-a8a9af8f]{color:#201629;background:#ffffff6b;border-color:#2016293d}.app-shell.theme-light .landing-coffee-card[data-v-a8a9af8f]{background:#ffffff9e;border-color:#422d4824;box-shadow:0 10px 28px #3225361a,inset 0 1px #ffffffdb}.app-shell.theme-light .landing-source-tile[data-v-a8a9af8f]{color:#201629;border-color:color-mix(in srgb, var(--landing-tile-accent) 46%, #20162933);background:linear-gradient(145deg, color-mix(in srgb, var(--landing-tile-accent) 16%, #f5f0fac2), #eee8f485);box-shadow:0 8px 20px #1c132c2e,inset 0 1px #ffffff61}.app-shell.theme-light .landing-source-subtitle[data-v-a8a9af8f]{color:#201629a3}@media (width>=1200px){.stage[data-v-a8a9af8f]{grid-template-columns:clamp(320px,24vw,360px) minmax(0,1fr)}.card.container-wide[data-v-a8a9af8f]{width:min(96%,1120px)}.card.container-medium[data-v-a8a9af8f]{width:min(86%,900px)}.card.container-narrow[data-v-a8a9af8f]{width:min(68%,680px)}.card.container-narrow.play-area-card[data-v-a8a9af8f]{width:min(82%,1100px)}.piano2midi-card[data-v-a8a9af8f]{width:min(90%,980px)}.landing-page[data-v-a8a9af8f]{width:min(94%,1120px)}.app-shell:not(.floating-sidebar-layout) .link-label[data-v-a8a9af8f]{text-overflow:ellipsis;white-space:normal;overflow-wrap:anywhere;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}}@media (width<=1199px){.app-shell.floating-sidebar-layout .landing-page[data-v-a8a9af8f]{gap:14px;width:min(100%,940px);padding-bottom:18px}.landing-hero[data-v-a8a9af8f]{grid-template-columns:1fr;gap:14px}.landing-hero h1[data-v-a8a9af8f]{font-size:clamp(30px,5.2vh,48px)}.landing-subtitle[data-v-a8a9af8f]{font-size:clamp(15px,2.2vh,20px)}}@media (width<=760px){.landing-page[data-v-a8a9af8f]{gap:12px;width:100%}.landing-hero-copy[data-v-a8a9af8f]{gap:11px}.landing-hero h1[data-v-a8a9af8f]{font-size:clamp(28px,4.8vh,38px);line-height:1.02}.landing-subtitle[data-v-a8a9af8f]{font-size:15px;line-height:1.36}.landing-actions[data-v-a8a9af8f]{grid-template-columns:1fr;gap:8px;display:grid}.landing-btn[data-v-a8a9af8f]{width:100%;min-height:42px;padding-inline:12px;font-size:14px}.landing-coffee-card[data-v-a8a9af8f]{gap:10px;padding:10px}}.piano2midi-optimizer[data-v-a8a9af8f]{background:#211a3cb8;border:1px solid #7971abc2;border-radius:1.7vh;gap:.9vh;width:min(100%,860px);margin:0 auto;padding:1.3vh 1.4vh;display:grid}.piano2midi-optimizer-title[data-v-a8a9af8f]{color:#efe8cf;margin:0;font-size:clamp(20px,3vh,34px);font-weight:700}.piano2midi-optimizer-subtitle[data-v-a8a9af8f]{color:#efe8cfd1;margin:0;font-size:clamp(13px,2.1vh,18px)}.piano2midi-optimizer-field[data-v-a8a9af8f]{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.8vh;display:grid}.piano2midi-optimizer-input[data-v-a8a9af8f]{color:#fff;background:#442957;border:1px solid #ae581e;border-radius:1.1vh;min-height:clamp(48px,6.6vh,68px);padding:0 1vh;font-size:clamp(16px,2.2vh,22px)}.piano2midi-optimizer-input[data-v-a8a9af8f]::placeholder{color:#ffffffbd}.piano2midi-optimizer-btn[data-v-a8a9af8f]{color:#fff;background:linear-gradient(135deg,#e8a142f5,#c67e28fa);border:1px solid #ecb04ef2;border-radius:1.1vh;min-height:clamp(48px,6.6vh,68px);padding:0 1.3vh;font-size:clamp(16px,2.25vh,24px);font-weight:700}.piano2midi-optimizer-btn[data-v-a8a9af8f]:disabled{opacity:.6;cursor:not-allowed}.piano2midi-optimizer-feedback[data-v-a8a9af8f]{color:#ffcc9e;margin:0;font-size:clamp(13px,1.9vh,18px)}.piano2midi-title[data-v-a8a9af8f]{text-align:center;letter-spacing:.02vh;color:#e9a45f;margin:0;padding-top:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(42px,7.6vh,108px);line-height:.95}.piano2midi-subtitle[data-v-a8a9af8f]{text-align:center;color:#efe8cf;margin:0;font-size:clamp(22px,3.8vh,52px);line-height:1.2}.piano2midi-youtube-field[data-v-a8a9af8f]{background:#2a214cb3;border:1px solid #53467cc7;border-radius:2.1vh;align-items:center;gap:1.2vh;width:100%;padding:1.1vh 1.5vh;display:flex}.piano2midi-youtube-icon[data-v-a8a9af8f]{flex:none;width:clamp(34px,4.8vh,54px);height:clamp(24px,3.4vh,40px)}.piano2midi-youtube-icon svg[data-v-a8a9af8f]{width:100%;height:100%;display:block}.piano2midi-youtube-icon svg path[data-v-a8a9af8f]:first-child{fill:#ea2328}.piano2midi-youtube-icon svg path[data-v-a8a9af8f]:last-child{fill:#1e1234}.piano2midi-youtube-input[data-v-a8a9af8f]{width:100%;box-shadow:none;color:#f8f0dc;background:0 0;border:none;outline:none;flex:1;padding:0;font-size:clamp(20px,3.2vh,38px)}.piano2midi-youtube-input[data-v-a8a9af8f]::placeholder{color:#d3cdbfb3}.piano2midi-divider[data-v-a8a9af8f]{align-items:center;gap:1.8vh;display:flex}.piano2midi-divider span[data-v-a8a9af8f]{background:#e9e6dcd1;flex:1;height:.22vh}.piano2midi-divider strong[data-v-a8a9af8f]{color:#efe8cf;font-size:clamp(28px,4.2vh,56px);line-height:1}.piano2midi-dropzone[data-v-a8a9af8f]{cursor:pointer;background:#362b5a8f;border:.35vh dashed #5f6352b8;border-radius:2vh;justify-items:center;gap:1vh;width:100%;padding:2.6vh 1.8vh;display:grid;position:relative}.piano2midi-dropzone.is-drag-active[data-v-a8a9af8f]{background:#433769cc;border-color:#8f9874f2}.piano2midi-file-input[data-v-a8a9af8f]{opacity:0;cursor:pointer;position:absolute;inset:0}.piano2midi-drop-icon[data-v-a8a9af8f]{color:#d8a060;width:clamp(58px,7.4vh,90px);height:clamp(58px,7.4vh,90px)}.piano2midi-drop-icon svg[data-v-a8a9af8f]{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:100%;height:100%;display:block}.piano2midi-drop-title[data-v-a8a9af8f]{text-align:center;color:#efe8cf;font-size:clamp(24px,3.8vh,44px);font-weight:700}.piano2midi-drop-subtitle[data-v-a8a9af8f]{text-align:center;color:#e4a260;font-size:clamp(20px,3.2vh,34px);font-weight:700}.piano2midi-selected-file[data-v-a8a9af8f]{text-align:center;white-space:nowrap;text-overflow:ellipsis;color:#f8f0dc;max-width:100%;font-size:clamp(16px,2.4vh,26px);overflow:hidden}.piano2midi-consent[data-v-a8a9af8f]{color:#efe8cf;align-items:flex-start;gap:1.2vh;font-size:clamp(18px,2.7vh,30px);line-height:1.35;display:flex}.piano2midi-consent-checkbox[data-v-a8a9af8f]{background:#534d7ab8;border:1px solid #636085e6;border-radius:.7vh;width:clamp(22px,2.9vh,34px);height:clamp(22px,2.9vh,34px);margin-top:.35vh}.piano2midi-start-btn[data-v-a8a9af8f]{color:#efe8cf;background:#2b214fd1;border:1px solid #584c82e6;border-radius:2vh;justify-content:center;align-items:center;gap:1.2vh;width:100%;min-height:clamp(62px,8vh,92px);font-size:clamp(24px,3.8vh,40px);font-weight:700;display:inline-flex}.piano2midi-start-btn svg[data-v-a8a9af8f]{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:clamp(24px,3.2vh,36px);height:clamp(24px,3.2vh,36px)}.piano2midi-start-btn[data-v-a8a9af8f]:disabled{opacity:.55;cursor:not-allowed}.piano2midi-result-link[data-v-a8a9af8f]{justify-self:center;width:fit-content}.piano2midi-processing-layout[data-v-a8a9af8f]{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:stretch;gap:1.6vh;display:grid}.piano2midi-processing-video[data-v-a8a9af8f]{background:#241c42cc;border:1px solid #5c537ecc;border-radius:1.8vh;min-height:34vh;overflow:hidden}.piano2midi-video-embed[data-v-a8a9af8f]{border:none;width:100%;height:100%;min-height:34vh}.piano2midi-video-fallback[data-v-a8a9af8f]{text-align:center;color:#efe8cf;place-content:center;gap:.8vh;width:100%;height:100%;min-height:34vh;padding:1.2vh;display:grid}.piano2midi-video-fallback strong[data-v-a8a9af8f]{font-size:clamp(20px,3.1vh,32px)}.piano2midi-video-fallback span[data-v-a8a9af8f]{color:#efe8cfcc;font-size:clamp(14px,2.1vh,22px)}.piano2midi-processing-side[data-v-a8a9af8f]{background:#241c42c7;border:1px solid #5c537ecc;border-radius:1.8vh;align-content:start;gap:1.2vh;padding:1.4vh 1.2vh;display:grid}.piano2midi-queue-label[data-v-a8a9af8f]{color:#efe8cf;margin:0;font-size:clamp(16px,2.5vh,28px);font-weight:700}.piano2midi-wave-text[data-v-a8a9af8f]{color:#e8a45d;letter-spacing:.02vh;flex-wrap:wrap;gap:.04em;min-height:clamp(30px,4.2vh,52px);margin:0;font-size:clamp(24px,3.8vh,46px);font-weight:700;display:flex}.piano2midi-wave-text span[data-v-a8a9af8f]{animation:1.45s ease-in-out infinite piano2midi-wave-a8a9af8f;display:inline-block}.piano2midi-wave-text.is-complete span[data-v-a8a9af8f]{color:#efe8cf;text-shadow:none;animation:none}.piano2midi-coffee-btn[data-v-a8a9af8f]{color:#f4ecda;text-align:left;background:#312557d1;border:1px solid #6e609bdb;border-radius:1.2vh;gap:.7vh;width:100%;padding:1vh 1.1vh;font-size:clamp(14px,2.1vh,20px);line-height:1.35;display:grid}.piano2midi-coffee-main[data-v-a8a9af8f]{background:#1c1438b8;border:1px solid #8c78c3b3;border-radius:1vh;align-items:center;gap:.7vh;width:fit-content;padding:.45vh .75vh;font-size:clamp(18px,2.7vh,30px);font-weight:700;display:inline-flex}.piano2midi-coffee-icon[data-v-a8a9af8f]{width:clamp(24px,3.1vh,34px);height:clamp(24px,3.1vh,34px);display:inline-flex}.piano2midi-coffee-icon svg[data-v-a8a9af8f]{fill:currentColor;stroke:none;width:100%;height:100%}.piano2midi-coffee-support[data-v-a8a9af8f]{color:#f4ecdae6;font-size:clamp(13px,1.9vh,18px);display:block}.piano2midi-play-highlight[data-v-a8a9af8f]{color:#ffffffeb;width:100%;min-height:clamp(52px,7vh,84px);box-shadow:none;cursor:not-allowed;background:#70707e73;border:1px solid #828291d9;border-radius:1.4vh;font-size:clamp(22px,3.7vh,40px);font-weight:800;animation:none;transform:none}.piano2midi-play-highlight.is-ready[data-v-a8a9af8f]{color:#fff;cursor:pointer;background:linear-gradient(135deg,#e8a142f5,#c67e28fa);border:1px solid #ecb04ef2}.piano2midi-play-highlight[data-v-a8a9af8f]:disabled{opacity:1}.support-card[data-v-a8a9af8f]{align-items:center}.support-link[data-v-a8a9af8f]{width:fit-content}.kofi-embed[data-v-a8a9af8f]{background:#f9f9f9;border:none;border-radius:1vh;width:100%;min-height:712px;padding:4px;display:block}.connect-auth-compact[data-v-a8a9af8f]{gap:1.1vh;width:100%;margin-top:0;display:grid}.auth-title[data-v-a8a9af8f]{text-align:center;margin:.4vh 0 .3vh;font-size:2.6vh;font-weight:700}.auth-label[data-v-a8a9af8f]{color:#ecf4ffe6;margin:.3vh 0 0;font-size:1.95vh;font-weight:600}.auth-divider[data-v-a8a9af8f]{align-items:center;gap:1.4vh;margin:1.8vh 0 1.9vh;display:flex}.auth-divider-line[data-v-a8a9af8f]{background:#d2ddf061;flex:1;height:1px}.auth-divider-text[data-v-a8a9af8f]{color:#ecf4ffd6;font-size:2.4vh;font-weight:600;line-height:1}.auth-divider-signup[data-v-a8a9af8f]{margin-top:2.1vh;margin-bottom:1.1vh}.auth-divider-signup .auth-divider-text[data-v-a8a9af8f]{font-size:2.3vh}.auth-title-divider[data-v-a8a9af8f]{margin-top:1vh}.auth-input[data-v-a8a9af8f]{color:#f5f9ff;background:#d6e4ff33;height:5.2vh;padding:.95vh 1.2vh;font-size:clamp(16px,1.95vh,22px)}.auth-input[data-v-a8a9af8f]::placeholder{color:#ecf4ffcc}.auth-field[data-v-a8a9af8f]{background:#d6e4ff29;border:1px solid #ecf4ff1a;border-radius:1.4vh;grid-template-columns:4.6vh 1fr 4.2vh;align-items:center;gap:.4vh;height:5.6vh;padding:0 .7vh;display:grid}.auth-field-icon[data-v-a8a9af8f]{color:#adbbd0eb;justify-content:center;align-items:center;width:2.7vh;height:2.7vh;margin-left:.4vh;display:inline-flex}.auth-field-icon svg[data-v-a8a9af8f]{width:100%;height:100%;display:block}.auth-field-input[data-v-a8a9af8f]{color:#f5f9ff;background:0 0;border:none;border-radius:0;outline:none;padding:.2vh 0;font-size:clamp(16px,2.05vh,22px);font-weight:600}.auth-field-input[data-v-a8a9af8f]::placeholder{color:#adbbd0f5;font-weight:600}.auth-field-action[data-v-a8a9af8f]{color:#adbbd0eb;cursor:pointer;background:0 0;border:none;border-radius:.8vh;justify-content:center;align-items:center;width:3.2vh;height:3.2vh;padding:0;display:inline-flex}.auth-field-action svg[data-v-a8a9af8f]{width:2.6vh;height:2.6vh;display:block}.auth-field-action[data-v-a8a9af8f]:hover{color:#cbdbf3}.auth-btn[data-v-a8a9af8f]{border-radius:1.1vh;justify-content:center;align-items:center;height:5.6vh;padding:.95vh 1.2vh;font-size:2.05vh;font-weight:700;text-decoration:none;display:inline-flex}.auth-btn.primary[data-v-a8a9af8f]{color:#42220cfa;background:linear-gradient(135deg,#ffcc78f2 0%,#ffad58e6 100%)}.auth-btn.secondary[data-v-a8a9af8f]{color:#f2f7ff;background:#d6e4ff33}.auth-link-shell[data-v-a8a9af8f]{background:0 0;border:none;border-radius:0;justify-content:center;align-items:center;width:100%;height:5.6vh;display:inline-flex}.auth-link-text[data-v-a8a9af8f]{color:#9ec6fff2;text-underline-offset:.2vh;cursor:pointer;background:0 0;border:none;justify-self:center;padding:.2vh 0;font-size:1.9vh;font-weight:600;text-decoration:underline}.auth-link-text[data-v-a8a9af8f]:hover{color:#c1ddff}.auth-feedback[data-v-a8a9af8f]{text-align:center;margin:.8vh 0 0;font-size:1.55vh;font-weight:600}.auth-feedback--success[data-v-a8a9af8f]{color:#a9ffd1}.auth-feedback--info[data-v-a8a9af8f]{color:#b7d9ff}.auth-feedback--error[data-v-a8a9af8f]{color:#ffb0b0}.auth-btn.google[data-v-a8a9af8f]{color:#fff;background:#1a73e8;justify-content:center;gap:1.1vh;padding:.6vh 1.2vh;box-shadow:0 .35vh 1.4vh #1a73e861}.auth-btn.google[data-v-a8a9af8f]:hover{background:#1765cc}.auth-google-icon[data-v-a8a9af8f]{color:#1a73e8;background:#fff;border-radius:.8vh;justify-content:center;align-items:center;width:3.4vh;height:3.4vh;font-family:Arial,Helvetica,sans-serif;font-size:2vh;font-weight:800;display:inline-flex}.grid-2[data-v-a8a9af8f]{grid-template-columns:1fr 1fr;gap:12px;display:grid}input[data-v-a8a9af8f],select[data-v-a8a9af8f],button[data-v-a8a9af8f],.btn[data-v-a8a9af8f]{color:#eaf2ff;box-shadow:none;background:#0b131ee6;border:none;border-radius:10px;padding:8px 10px}input[data-v-a8a9af8f]{border-radius:0}.app-text-input[data-v-a8a9af8f]{color:#fff;background:#442957;border:1px solid #ae581e;border-radius:10px;font-size:16px}.app-text-input[data-v-a8a9af8f]::placeholder{color:#ffffffbd}button[data-v-a8a9af8f],a[data-v-a8a9af8f],.btn[data-v-a8a9af8f],[role=button][data-v-a8a9af8f],[role=menuitem][data-v-a8a9af8f]{-webkit-tap-highlight-color:transparent}button[data-v-a8a9af8f],.btn[data-v-a8a9af8f]{cursor:pointer}.btn[data-v-a8a9af8f]{justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.btn.secondary[data-v-a8a9af8f]{background:#1b375fa6;border-color:#6095e973}.avatar[data-v-a8a9af8f]{object-fit:cover;border:none;border-radius:999px;width:72px;height:72px}#stripe-embedded-checkout[data-v-a8a9af8f]{min-height:600px}.app-shell.portrait-vh-to-vw .layout[data-v-a8a9af8f]{padding-top:var(--header-height)}.app-shell.floating-sidebar-layout[data-v-a8a9af8f]{--floating-sidebar-edge:clamp(12px, 3vw, 24px);--floating-sidebar-gap:clamp(8px, 1.7vw, 12px);--floating-sidebar-toggle-size:clamp(48px, 12vw, 68px);--floating-sidebar-width:min(82vw, 430px);--floating-sidebar-max-height:min(680px, calc(var(--app-viewport-height,100dvh) - var(--header-height) - var(--floating-sidebar-toggle-size) - var(--floating-sidebar-edge) - var(--floating-sidebar-edge) - var(--floating-sidebar-edge) - var(--floating-sidebar-gap)));--floating-sidebar-radius:clamp(14px, 3vw, 24px);--floating-sidebar-padding-y:clamp(12px, 2.6vw, 18px);--floating-sidebar-padding-x:clamp(10px, 2.2vw, 16px);--floating-sidebar-pane-padding-y:clamp(7px, 1.5vw, 11px);--floating-sidebar-pane-padding-x:clamp(10px, 2vw, 14px);--floating-sidebar-pane-gap:clamp(4px, 1vw, 7px);--floating-sidebar-link-gap:clamp(7px, 1.5vw, 10px);--floating-sidebar-icon-size:clamp(24px, 5.6vw, 36px);--floating-sidebar-label-size:clamp(15px, 3.45vw, 22px)}.app-shell.phone-layout[data-v-a8a9af8f]{--floating-sidebar-edge:clamp(14px, 3.8vw, 24px);--floating-sidebar-gap:clamp(8px, 2vw, 12px);--floating-sidebar-toggle-size:clamp(66px, 17vw, 82px);--floating-sidebar-width:min(90vw, 460px);--floating-sidebar-radius:clamp(18px, 4vw, 28px);--floating-sidebar-padding-y:clamp(12px, 3.2vw, 18px);--floating-sidebar-padding-x:clamp(12px, 3.2vw, 18px);--floating-sidebar-pane-padding-y:clamp(8px, 2.1vw, 12px);--floating-sidebar-pane-padding-x:clamp(12px, 3vw, 18px);--floating-sidebar-pane-gap:clamp(5px, 1.4vw, 8px);--floating-sidebar-link-gap:clamp(9px, 2.3vw, 13px);--floating-sidebar-icon-size:clamp(34px, 8.5vw, 44px);--floating-sidebar-label-size:clamp(20px, 5.1vw, 27px)}.app-shell.tablet-portrait-layout[data-v-a8a9af8f]{--floating-sidebar-edge:clamp(12px, 2.1vw, 18px);--floating-sidebar-gap:clamp(5px, 1vw, 8px);--floating-sidebar-toggle-size:clamp(52px, 8vw, 62px);--floating-sidebar-width:min(82vw, 430px);--floating-sidebar-radius:clamp(14px, 2.4vw, 20px);--floating-sidebar-padding-y:clamp(8px, 1.45vw, 12px);--floating-sidebar-padding-x:clamp(8px, 1.45vw, 12px);--floating-sidebar-pane-padding-y:clamp(5px, .85vw, 8px);--floating-sidebar-pane-padding-x:clamp(8px, 1.25vw, 12px);--floating-sidebar-pane-gap:clamp(3px, .65vw, 5px);--floating-sidebar-link-gap:clamp(6px, 1vw, 8px);--floating-sidebar-icon-size:clamp(24px, 3.7vw, 30px);--floating-sidebar-label-size:clamp(15px, 2.2vw, 18px)}.app-shell.phone-layout[data-v-a8a9af8f]:not(.phone-portrait-layout),.app-shell.tablet-landscape-layout[data-v-a8a9af8f]{--floating-sidebar-edge:clamp(6px, 1.9vh, 12px);--floating-sidebar-gap:clamp(4px, 1.2vh, 8px);--floating-sidebar-toggle-size:clamp(38px, 9vh, 54px);--floating-sidebar-width:min(92vw, calc(100vw - var(--floating-sidebar-toggle-size) - var(--floating-sidebar-edge) - var(--floating-sidebar-edge) - var(--floating-sidebar-gap)));--floating-sidebar-radius:clamp(12px, 3.1vh, 22px);--floating-sidebar-padding-y:clamp(4px, 1.1vh, 8px);--floating-sidebar-padding-x:clamp(5px, 1.45vh, 11px);--floating-sidebar-pane-padding-y:clamp(3px, .8vh, 7px);--floating-sidebar-pane-padding-x:clamp(5px, 1.4vh, 11px);--floating-sidebar-pane-gap:clamp(2px, .65vh, 5px);--floating-sidebar-link-gap:clamp(5px, 1.2vh, 8px);--floating-sidebar-icon-size:clamp(24px, 6vh, 36px);--floating-sidebar-label-size:clamp(14px, 3.7vh, 20px);--floating-sidebar-link-min-height:clamp(32px, 8.4vh, 47px);--floating-sidebar-link-padding-y:clamp(1px, .65vh, 5px);--floating-sidebar-social-padding-y:clamp(4px, 1vh, 8px)}@media (width<=800px) and (height<=520px){.app-shell.phone-layout[data-v-a8a9af8f]:not(.phone-portrait-layout){--floating-sidebar-gap:clamp(3px, .9vh, 6px);--floating-sidebar-padding-y:clamp(2px, .8vh, 6px);--floating-sidebar-pane-padding-y:clamp(1px, .55vh, 5px);--floating-sidebar-pane-gap:clamp(1px, .45vh, 4px);--floating-sidebar-link-gap:clamp(4px, .9vh, 6px);--floating-sidebar-icon-size:clamp(22px, 5.4vh, 31px);--floating-sidebar-label-size:clamp(13px, 3.3vh, 18px);--floating-sidebar-link-min-height:clamp(29px, 7.4vh, 41px);--floating-sidebar-link-padding-y:clamp(0px, .4vh, 3px);--floating-sidebar-social-padding-y:clamp(3px, .65vh, 6px)}}@media (width<=800px) and (height<=760px){.app-shell.phone-portrait-layout[data-v-a8a9af8f]{--floating-sidebar-edge:clamp(10px, 2.6vw, 16px);--floating-sidebar-gap:clamp(4px, 1vw, 7px);--floating-sidebar-toggle-size:clamp(56px, 13vw, 72px);--floating-sidebar-width:min(82vw, 430px);--floating-sidebar-radius:clamp(15px, 3vw, 22px);--floating-sidebar-padding-y:clamp(8px, 1.8vw, 12px);--floating-sidebar-padding-x:clamp(9px, 2vw, 13px);--floating-sidebar-pane-padding-y:clamp(4px, .95vw, 7px);--floating-sidebar-pane-padding-x:clamp(9px, 2vw, 13px);--floating-sidebar-pane-gap:clamp(2px, .6vw, 4px);--floating-sidebar-link-gap:clamp(6px, 1.35vw, 9px);--floating-sidebar-icon-size:clamp(28px, 6.2vw, 36px);--floating-sidebar-label-size:clamp(17px, 4vw, 23px)}}.app-shell.floating-sidebar-layout .layout[data-v-a8a9af8f]{height:100dvh;height:var(--app-viewport-height,100dvh);min-height:100dvh;min-height:var(--app-viewport-height,100dvh);padding-top:var(--header-height);z-index:auto}.app-shell.floating-sidebar-layout .stage[data-v-a8a9af8f]{height:calc(100vh - var(--header-height));height:calc(100svh - var(--header-height));height:calc(100dvh - var(--header-height));height:calc(var(--app-viewport-height,100dvh) - var(--header-height));min-height:calc(100vh - var(--header-height));min-height:calc(100svh - var(--header-height));min-height:calc(100dvh - var(--header-height));min-height:calc(var(--app-viewport-height,100dvh) - var(--header-height));grid-template-columns:1fr}.app-shell.floating-sidebar-layout .pane--left[data-v-a8a9af8f]{top:calc(var(--header-height) + var(--floating-sidebar-edge));right:var(--floating-sidebar-edge);bottom:calc(var(--floating-sidebar-edge) + var(--floating-sidebar-toggle-size) + var(--floating-sidebar-gap));width:var(--floating-sidebar-width);z-index:50;opacity:0;pointer-events:none;justify-content:flex-end;align-items:flex-end;max-height:none;transition:opacity .2s,transform .2s;display:flex;position:fixed;transform:translateY(clamp(8px,1.8vw,16px))scale(.98)}.app-shell.phone-layout:not(.phone-portrait-layout) .pane--left[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .pane--left[data-v-a8a9af8f]{top:auto;right:calc(var(--floating-sidebar-edge) + var(--floating-sidebar-toggle-size) + var(--floating-sidebar-gap));bottom:var(--floating-sidebar-edge);height:auto;max-height:calc(var(--app-viewport-height,100dvh) - var(--header-height) - var(--floating-sidebar-edge) - var(--floating-sidebar-edge))}.app-shell.floating-sidebar-layout.floating-sidebar-open .pane--left[data-v-a8a9af8f]{opacity:1;pointer-events:none;transform:translateY(0)scale(1)}.app-shell.floating-sidebar-layout .sidebar[data-v-a8a9af8f]{overscroll-behavior:contain;height:auto;max-height:100%;padding:var(--floating-sidebar-padding-y) var(--floating-sidebar-padding-x);gap:var(--floating-sidebar-gap);border-radius:var(--floating-sidebar-radius);pointer-events:none;background:#120817;border:max(1px,.18vw) solid #ffb25e73;flex-direction:column;display:flex;overflow-y:auto;box-shadow:0 clamp(12px,1.6vw,24px) clamp(28px,5.8vw,64px) #0000008f}.app-shell.phone-layout:not(.phone-portrait-layout) .sidebar[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .sidebar[data-v-a8a9af8f]{height:max-content;max-height:calc(var(--app-viewport-height,100dvh) - var(--header-height) - var(--floating-sidebar-edge) - var(--floating-sidebar-edge));align-content:end;place-items:stretch stretch;column-gap:var(--floating-sidebar-gap);min-height:0;padding-block:var(--floating-sidebar-padding-y);grid-template-rows:auto;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);row-gap:0;display:grid}.app-shell.phone-layout:not(.phone-portrait-layout) .sidebar-column[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .sidebar-column[data-v-a8a9af8f]{gap:var(--floating-sidebar-gap);flex-direction:column;min-width:0;display:flex}.app-shell.phone-layout:not(.phone-portrait-layout) .sidebar-column--navigation[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .sidebar-column--navigation[data-v-a8a9af8f]{grid-area:1/1}.app-shell.phone-layout:not(.phone-portrait-layout) .sidebar-column--right[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .sidebar-column--right[data-v-a8a9af8f]{gap:var(--floating-sidebar-gap);flex-direction:column;grid-area:1/2;min-width:0;height:100%;display:flex}.app-shell.phone-layout:not(.phone-portrait-layout) .sidebar-column--tools[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .sidebar-column--tools[data-v-a8a9af8f]{gap:var(--floating-sidebar-gap);flex-direction:column;display:flex}.app-shell.phone-layout:not(.phone-portrait-layout) .sidebar-column--socials[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .sidebar-column--socials[data-v-a8a9af8f]{gap:var(--floating-sidebar-gap);flex-direction:column;flex:auto;min-height:0;display:flex}.app-shell.floating-sidebar-layout.floating-sidebar-open .sidebar[data-v-a8a9af8f]{pointer-events:auto}.app-shell.floating-sidebar-layout .sidebar-spacer[data-v-a8a9af8f]{display:none}.app-shell.floating-sidebar-layout .sidebar-pane[data-v-a8a9af8f]{padding:var(--floating-sidebar-pane-padding-y) var(--floating-sidebar-pane-padding-x);gap:var(--floating-sidebar-pane-gap);-webkit-backdrop-filter:none;background:#201024;border-color:#ff94529e;box-shadow:0 .9vh 2.4vh #0000006b,inset 0 0 0 .1vh #ffdfbe14}.app-shell.floating-sidebar-layout .sidebar-link[data-v-a8a9af8f]{gap:var(--floating-sidebar-link-gap);padding:clamp(5px,1vw,8px) clamp(2px,.4vw,5px)}.app-shell.phone-layout .sidebar-link[data-v-a8a9af8f]{min-height:clamp(46px,11.5vw,58px);padding:clamp(8px,2.2vw,12px) clamp(3px,.8vw,6px)}@media (width<=800px) and (height<=760px){.app-shell.phone-portrait-layout .sidebar-link[data-v-a8a9af8f]{min-height:clamp(38px,8.5vw,48px);padding:clamp(4px,1vw,7px) clamp(2px,.55vw,4px)}}.app-shell.phone-layout:not(.phone-portrait-layout) .sidebar-link[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .sidebar-link[data-v-a8a9af8f]{min-height:var(--floating-sidebar-link-min-height);padding:var(--floating-sidebar-link-padding-y) clamp(2px, .6vh, 4px)}.app-shell.tablet-portrait-layout .sidebar-link[data-v-a8a9af8f]{padding:clamp(4px,.75vw,6px) clamp(2px,.45vw,4px)}.app-shell.floating-sidebar-layout .link-icon[data-v-a8a9af8f]{width:var(--floating-sidebar-icon-size);min-width:var(--floating-sidebar-icon-size);font-size:calc(var(--floating-sidebar-icon-size) * .75)}.app-shell.floating-sidebar-layout .link-label[data-v-a8a9af8f]{font-size:var(--floating-sidebar-label-size);flex:auto}.app-shell.phone-layout .sidebar-pane[data-v-a8a9af8f]{border-radius:clamp(18px,4vw,24px)}.app-shell.tablet-portrait-layout .sidebar-pane[data-v-a8a9af8f]{justify-content:flex-start}.app-shell.phone-layout:not(.phone-portrait-layout) .sidebar-pane[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .sidebar-pane[data-v-a8a9af8f]{border-radius:clamp(10px,2.4vh,16px);justify-content:flex-start;align-self:stretch;width:100%;height:fit-content}.app-shell.phone-layout:not(.phone-portrait-layout) .sidebar-column--socials .sidebar-pane[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .sidebar-column--socials .sidebar-pane[data-v-a8a9af8f]{height:100%;min-height:calc(var(--floating-sidebar-icon-size) + (var(--floating-sidebar-social-padding-y) * 2));padding-block:var(--floating-sidebar-social-padding-y);flex:auto;justify-content:center;align-self:stretch}@media (width<=800px) and (height<=760px){.app-shell.phone-portrait-layout .sidebar-column--socials .sidebar-pane[data-v-a8a9af8f]{padding-block:clamp(5px,1.1vw,8px)}}.app-shell.portrait-vh-to-vw .piano2midi-card[data-v-a8a9af8f]{gap:2.4vw;padding:1.2vw .4vw 2vw}.app-shell.portrait-vh-to-vw .piano2midi-optimizer[data-v-a8a9af8f]{border-radius:2.6vw;gap:1.2vw;padding:2.1vw 2.3vw}.app-shell.portrait-vh-to-vw .piano2midi-optimizer-title[data-v-a8a9af8f]{font-size:clamp(18px,4.2vw,30px)}.app-shell.portrait-vh-to-vw .piano2midi-optimizer-subtitle[data-v-a8a9af8f]{font-size:clamp(12px,3.2vw,19px)}.app-shell.portrait-vh-to-vw .piano2midi-optimizer-field[data-v-a8a9af8f]{grid-template-columns:1fr;gap:1.4vw}.app-shell.portrait-vh-to-vw .piano2midi-optimizer-input[data-v-a8a9af8f],.app-shell.portrait-vh-to-vw .piano2midi-optimizer-btn[data-v-a8a9af8f]{border-radius:2vw;min-height:10vw;font-size:clamp(16px,3.7vw,24px)}.app-shell.portrait-vh-to-vw .piano2midi-optimizer-feedback[data-v-a8a9af8f]{font-size:clamp(12px,3vw,18px)}.app-shell.portrait-vh-to-vw .piano2midi-title[data-v-a8a9af8f]{font-size:clamp(44px,11vw,120px)}.app-shell.portrait-vh-to-vw .piano2midi-subtitle[data-v-a8a9af8f]{font-size:clamp(20px,4.5vw,46px)}.app-shell.portrait-vh-to-vw .piano2midi-youtube-field[data-v-a8a9af8f]{border-radius:2.6vw;gap:1.4vw;padding:1.6vw 2vw}.app-shell.portrait-vh-to-vw .piano2midi-youtube-icon[data-v-a8a9af8f]{width:6.8vw;height:4.8vw}.app-shell.portrait-vh-to-vw .piano2midi-youtube-input[data-v-a8a9af8f]{font-size:clamp(18px,4vw,34px)}.app-shell.portrait-vh-to-vw .piano2midi-divider[data-v-a8a9af8f]{gap:2.1vw}.app-shell.portrait-vh-to-vw .piano2midi-divider strong[data-v-a8a9af8f]{font-size:clamp(22px,5.1vw,48px)}.app-shell.portrait-vh-to-vw .piano2midi-dropzone[data-v-a8a9af8f]{border-width:.35vw;border-radius:2.8vw;gap:1.3vw;padding:3.4vw 2.2vw}.app-shell.portrait-vh-to-vw .piano2midi-drop-icon[data-v-a8a9af8f]{width:9.8vw;height:9.8vw}.app-shell.portrait-vh-to-vw .piano2midi-drop-title[data-v-a8a9af8f]{font-size:clamp(20px,4.5vw,40px)}.app-shell.portrait-vh-to-vw .piano2midi-drop-subtitle[data-v-a8a9af8f]{font-size:clamp(16px,3.7vw,30px)}.app-shell.portrait-vh-to-vw .piano2midi-selected-file[data-v-a8a9af8f]{font-size:clamp(14px,3.3vw,24px)}.app-shell.portrait-vh-to-vw .piano2midi-consent[data-v-a8a9af8f]{gap:1.5vw;font-size:clamp(14px,3.8vw,30px)}.app-shell.portrait-vh-to-vw .piano2midi-consent-checkbox[data-v-a8a9af8f]{width:4.2vw;height:4.2vw;margin-top:.45vw}.app-shell.portrait-vh-to-vw .piano2midi-start-btn[data-v-a8a9af8f]{border-radius:2.8vw;gap:1.7vw;min-height:10vw;font-size:clamp(20px,4.7vw,38px)}.app-shell.portrait-vh-to-vw .piano2midi-start-btn svg[data-v-a8a9af8f]{width:4.2vw;height:4.2vw}.app-shell.floating-sidebar-layout .social-grid[data-v-a8a9af8f]{gap:clamp(6px,1.3vw,10px)}.app-shell.floating-sidebar-layout .social-glyph[data-v-a8a9af8f]{width:var(--floating-sidebar-icon-size);height:var(--floating-sidebar-icon-size)}.app-shell.floating-sidebar-layout .social-glyph svg[data-v-a8a9af8f]{width:calc(var(--floating-sidebar-icon-size) * .624);height:calc(var(--floating-sidebar-icon-size) * .624)}.app-shell.floating-sidebar-layout .floating-sidebar-toggle[data-v-a8a9af8f]{right:var(--floating-sidebar-edge);bottom:var(--floating-sidebar-edge);z-index:60;width:var(--floating-sidebar-toggle-size);min-width:0;height:var(--floating-sidebar-toggle-size);padding:calc(var(--floating-sidebar-toggle-size) * .16);justify-content:center;align-items:center;gap:calc(var(--floating-sidebar-toggle-size) * .1);background:#353842eb;border:max(1px,.18vw) solid #c8d4eb73;border-radius:clamp(9px,1.8vw,14px);flex-direction:column;display:inline-flex;position:fixed;box-shadow:0 clamp(8px,1vw,14px) clamp(18px,2.8vw,34px) #0006}.app-shell.phone-layout .floating-sidebar-toggle[data-v-a8a9af8f],.app-shell.tablet-portrait-layout .floating-sidebar-toggle[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .floating-sidebar-toggle[data-v-a8a9af8f]{background:#3538423d;border-color:#dce2f0c7;box-shadow:0 clamp(5px,1.2vh,10px) clamp(10px,2.8vh,22px) #00000047}.app-shell.theme-light.phone-layout .floating-sidebar-toggle[data-v-a8a9af8f],.app-shell.theme-light.tablet-portrait-layout .floating-sidebar-toggle[data-v-a8a9af8f],.app-shell.theme-light.tablet-landscape-layout .floating-sidebar-toggle[data-v-a8a9af8f]{border-color:#000000c7}.app-shell.floating-sidebar-layout .floating-sidebar-toggle-bar[data-v-a8a9af8f]{width:calc(var(--floating-sidebar-toggle-size) * .54);height:max(3px, calc(var(--floating-sidebar-toggle-size) * .055));background:#f0f3fcf2;border-radius:999px;display:block}.app-shell.theme-light.phone-layout .floating-sidebar-toggle-bar[data-v-a8a9af8f],.app-shell.theme-light.tablet-portrait-layout .floating-sidebar-toggle-bar[data-v-a8a9af8f],.app-shell.theme-light.tablet-landscape-layout .floating-sidebar-toggle-bar[data-v-a8a9af8f]{background:#000000eb}.app-shell.floating-sidebar-layout .floating-sidebar-backdrop[data-v-a8a9af8f]{z-index:45;background:#00000040;border:none;border-radius:0;display:block;position:fixed;inset:0}.app-shell.floating-sidebar-layout .content-pane[data-v-a8a9af8f]{margin:clamp(6px,1vw,12px);padding-top:clamp(8px,1.2vw,18px)}.app-shell.floating-sidebar-layout .content-pane.content-pane--landing[data-v-a8a9af8f]{padding-top:clamp(4px,.7vw,10px)}.app-shell.phone-portrait-layout .content-pane[data-v-a8a9af8f]{margin-inline:clamp(3px,.5vw,6px)}.app-shell.floating-sidebar-layout .card.container-wide[data-v-a8a9af8f],.app-shell.floating-sidebar-layout .card.container-medium[data-v-a8a9af8f],.app-shell.floating-sidebar-layout .card.container-narrow[data-v-a8a9af8f]{width:100%;padding-left:clamp(8px,1.4vh,16px);padding-right:clamp(8px,1.4vh,16px)}.app-shell.phone-layout:not(.phone-portrait-layout) .card.account-card[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .card.account-card[data-v-a8a9af8f]{width:min(100%,860px);padding-left:clamp(10px,2.2vh,18px);padding-right:clamp(10px,2.2vh,18px)}.app-shell.phone-layout:not(.phone-portrait-layout) .play-area-card[data-v-a8a9af8f],.app-shell.tablet-landscape-layout .play-area-card[data-v-a8a9af8f]{margin-top:auto;margin-bottom:auto}.app-shell.tablet-landscape-layout[data-v-a8a9af8f]{height:var(--app-viewport-height,100dvh);overflow:hidden}.app-shell.tablet-landscape-layout .layout[data-v-a8a9af8f]{height:var(--app-viewport-height,100dvh);min-height:0;padding-top:var(--header-height);overflow:hidden}.app-shell.tablet-landscape-layout .stage[data-v-a8a9af8f]{height:calc(var(--app-viewport-height,100dvh) - var(--header-height));min-height:0;overflow:hidden}.app-shell.tablet-landscape-layout .pane--right[data-v-a8a9af8f]{min-height:0;overflow:hidden}.app-shell.tablet-landscape-layout .content-pane[data-v-a8a9af8f]{justify-content:normal;place-items:center;height:100%;min-height:0;margin:0;padding:0 1.5vw;display:grid;overflow:hidden}.app-shell.tablet-landscape-layout .content-pane[data-v-a8a9af8f]>*{transform:scale(var(--tablet-landscape-content-scale,1));transform-origin:50%;margin-top:0;margin-bottom:0}.app-shell.phone-portrait-layout .card.container-wide[data-v-a8a9af8f],.app-shell.phone-portrait-layout .card.container-medium[data-v-a8a9af8f],.app-shell.phone-portrait-layout .card.container-narrow[data-v-a8a9af8f]{padding-left:clamp(4px,.7vh,8px);padding-right:clamp(4px,.7vh,8px)}.app-shell.portrait-vh-to-vw .card.container-wide[data-v-a8a9af8f],.app-shell.portrait-vh-to-vw .card.container-medium[data-v-a8a9af8f],.app-shell.portrait-vh-to-vw .card.container-narrow[data-v-a8a9af8f]{min-height:0}.app-shell.mobile-input-active .layout[data-v-a8a9af8f]{height:var(--app-viewport-height,100dvh)!important;min-height:var(--app-viewport-height,100dvh)!important}.app-shell.mobile-input-active .stage[data-v-a8a9af8f]{height:calc(var(--app-viewport-height,100dvh) - var(--header-height))!important;min-height:calc(var(--app-viewport-height,100dvh) - var(--header-height))!important}.app-shell.mobile-input-active .content-pane[data-v-a8a9af8f]{min-height:0}.app-shell.mobile-input-active .header-container[data-v-a8a9af8f]{backface-visibility:hidden;transform:translateZ(0)}@media (width<=980px){.header-container[data-v-a8a9af8f]{height:var(--header-height)}.layout[data-v-a8a9af8f]{padding-top:var(--header-height)}.stage[data-v-a8a9af8f]{width:100%;height:calc((100 * var(--viewport-unit)) - var(--header-height))}.grid-2[data-v-a8a9af8f]{grid-template-columns:1fr}.card.container-wide[data-v-a8a9af8f],.card.container-medium[data-v-a8a9af8f],.card.container-narrow[data-v-a8a9af8f]{width:100%;padding-left:1.4vh;padding-right:1.4vh}.piano2midi-processing-layout[data-v-a8a9af8f]{grid-template-columns:1fr}.piano2midi-processing-video[data-v-a8a9af8f],.piano2midi-video-embed[data-v-a8a9af8f],.piano2midi-video-fallback[data-v-a8a9af8f]{min-height:24vh}}@media (width<=767px){.app-shell.phone-portrait-layout .brand-text[data-v-a8a9af8f]{display:none}}@keyframes piano2midi-wave-a8a9af8f{0%,to{color:#e8a45d99;text-shadow:0 0 #e8a45d00}50%{color:#ffcd91;text-shadow:0 0 1.2vh #e8a45d8c}}@keyframes piano2midi-play-pulse-a8a9af8f{0%,to{transform:scale(1);box-shadow:0 0 1.3vh #77ffbb73}50%{transform:scale(1.03);box-shadow:0 0 2.4vh #90ffcbc7}}@keyframes bg-flash-a8a9af8f{0%,10%,12%,36%,38%,62%,64%,to{filter:var(--bg-detail-before-filter,none) brightness(1)}11%{filter:var(--bg-detail-before-filter,none) brightness(1.9)}37%{filter:var(--bg-detail-before-filter,none) brightness(1.55)}63%{filter:var(--bg-detail-before-filter,none) brightness(2.05)}}@keyframes bg-flash-secondary-a8a9af8f{0%,18%,20%,47%,49%,78%,80%,to{filter:var(--bg-detail-after-filter,none) brightness(1)}19%{filter:var(--bg-detail-after-filter,none) brightness(1.85)}48%{filter:var(--bg-detail-after-filter,none) brightness(1.5)}79%{filter:var(--bg-detail-after-filter,none) brightness(2)}}@keyframes bg-drift-a8a9af8f{0%{transform:translate(-1.9%,-1.2%)rotate(-1.4deg)scale(1.02)}24%{transform:translate(.8%,-.6%)rotate(.2deg)scale(1.045)}52%{transform:translate(2.5%,1.6%)rotate(1.8deg)scale(1.03)}76%{transform:translate(-.5%,2.2%)rotate(.4deg)scale(1.05)}to{transform:translate(-1.9%,-1.2%)rotate(-1.4deg)scale(1.02)}}@keyframes bg-drift-reverse-a8a9af8f{0%{transform:translate(1.6%,1.1%)rotate(1.2deg)scale(.985)}18%{transform:translate(2.3%,-.3%)rotate(1.9deg)scale(1.01)}47%{transform:translate(-1.2%,-1.7%)rotate(-1.3deg)scale(1.035)}73%{transform:translate(-2.6%,.8%)rotate(-2deg)scale(1.015)}to{transform:translate(1.6%,1.1%)rotate(1.2deg)scale(.985)}}@keyframes bg-flicker-a8a9af8f{0%,16%,34%,58%,to{opacity:var(--bg-detail-before-opacity,1)}10%,26%{opacity:calc(var(--bg-detail-before-opacity,1) * .52)}42%{opacity:var(--bg-detail-before-opacity,1)}74%{opacity:calc(var(--bg-detail-before-opacity,1) * .62)}}@keyframes bg-flicker-secondary-a8a9af8f{0%,22%,48%,76%,to{opacity:var(--bg-detail-after-opacity,1)}12%,36%{opacity:calc(var(--bg-detail-after-opacity,1) * .5)}62%{opacity:var(--bg-detail-after-opacity,1)}84%{opacity:calc(var(--bg-detail-after-opacity,1) * .58)}}