:root{color:#28303a;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--accent:#3869ad;--muted:#697382;--line:#e4e7ec;--panel:#fff;font-synthesis:none;background:#f5f6f8;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{flex-direction:column;height:100dvh;margin:0;display:flex;overflow:hidden}#app{flex-direction:column;flex:1;min-height:0;display:flex}button,input,select,textarea{font:inherit;color:inherit;border:1px solid var(--line);background:#fff;border-radius:6px}button{cursor:pointer;white-space:nowrap;padding:7px 11px;font-size:12px;font-weight:500}button:hover{background:#edf2f9}button:active{background:#e0e9f6}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}button.primary:hover{background:#2c568f}button.quiet{color:var(--muted);background:0 0;border-color:#0000}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:3px}input,select{min-width:0;padding:7px 8px;font-size:12px}input[type=range],input[type=checkbox]{accent-color:var(--accent)}input[type=number]{width:80px}textarea{resize:vertical;width:100%;min-height:105px;padding:12px;font-size:13px;line-height:1.6}label{font-size:12px;line-height:1.6;display:block}label input:not([type=checkbox]),label select{margin-top:4px;display:block}h1,h2,h3,p{margin:0}h1,h2{font-size:14px;font-weight:600}a{color:inherit;text-decoration:none}small,.hint{color:var(--muted);font-size:11px;line-height:1.6}code,kbd,.event-list{font-family:SFMono-Regular,Consolas,monospace}kbd{color:var(--muted);margin-left:8px;font-size:10px}summary{cursor:pointer;color:var(--muted);padding:10px 0;font-size:12px}[hidden]{display:none!important}.topbar{border-bottom:1px solid var(--line);flex-shrink:0;align-items:center;gap:20px;min-height:76px;padding:16px 24px;display:flex}.wordmark{letter-spacing:-1px;white-space:nowrap;font-size:20px;font-weight:650}.wordmark span{color:var(--muted);margin-left:5px;font-weight:400}.session-picker{text-overflow:ellipsis;flex-shrink:0;width:160px;max-width:190px}.session{min-width:100px;max-width:210px;margin-right:auto}.session input{background:0 0;border:0;width:100%;padding:0;font-size:13px}.session span{color:var(--muted);margin-top:5px;font-size:10px;display:block}.transport{align-items:center;gap:6px;display:flex}.topbar output{color:var(--muted);max-width:160px;font-size:11px}.topbar output.playing{color:var(--accent)}.project-menu{z-index:6;position:absolute;top:8px;right:22px}.project-menu>summary{border-radius:6px;padding:7px 12px;list-style:none}.project-menu[open]>summary{background:#edf2f9}.sessionbar{border:1px solid var(--line);background:#fff;border-radius:8px;flex-direction:column;gap:7px;width:240px;padding:12px;display:flex;position:absolute;top:36px;right:0;box-shadow:0 8px 30px #24334b14}.section-label{display:none}#connection{color:var(--muted);padding:6px;font-size:10px}.workspace{background:#fff;flex:1;min-height:0;display:flex;position:relative}.editor-panel{flex-direction:column;flex:1;min-width:0;display:flex;position:relative}.tabbar{border-bottom:1px solid var(--line);align-items:center;gap:5px;min-height:52px;padding:7px 112px 7px 18px;display:flex;position:relative}#tabs{gap:4px;display:flex;overflow-x:auto}#tabs button{color:var(--muted);background:0 0;border:0;border-radius:5px;padding:9px 14px}#tabs button[aria-selected=true]{color:#2e568d;background:#eef3fa}#new-tab{border:0;padding:3px 10px;font-size:19px;font-weight:400}#tab-menu{position:relative}#tab-menu summary{padding:6px 10px;list-style:none}#tab-menu>div{z-index:5;border:1px solid var(--line);background:#fff;border-radius:8px;flex-direction:column;gap:5px;padding:8px;display:flex;position:absolute;top:34px;left:0;box-shadow:0 8px 30px #24334b14}#editor{flex:1;min-height:0;overflow:hidden}.tab-editor,.tab-editor .cm-editor{height:100%}.editor-footer{min-height:34px;color:var(--muted);border-top:1px solid #f0f1f4;justify-content:space-between;align-items:center;padding:0 24px;font-size:10px;display:flex}.inline-slider{vertical-align:middle;width:76px;height:15px;margin:0 8px 0 0;padding:0}.inline-slider.selected{outline:1px solid var(--accent);outline-offset:3px}#mapping-context{z-index:4;border:1px solid var(--line);background:#fff;border-radius:10px;width:280px;padding:8px;position:absolute;bottom:40px;left:24px;box-shadow:0 10px 35px #24334b1a}.mapping-setup{padding:8px}.mapping-setup>select{width:100%;margin:5px 0 10px}.mapping-setup>button{margin:0 3px 8px 0}.mapping-setup .hint{margin-top:5px}.sound-panel{background:var(--panel);height:100%;overflow-y:auto}.panel-heading{justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;display:flex}.panel-heading>span{color:var(--muted);font-size:10px}.panel-heading h1 small{margin-top:3px;font-weight:400;display:block}.generate-form{border-bottom:1px solid var(--line);padding:8px 18px 18px}.generate-form>label{margin-bottom:8px}.generate-form>.primary{width:100%;margin:10px 0}.form-row{align-items:center;gap:12px;margin:12px 0;display:flex}.form-row>label{flex:1;min-width:0}.check{align-items:center;gap:6px;display:flex}.library-heading{justify-content:space-between;align-items:center;padding:16px 18px 8px;display:flex}.asset{border-radius:6px;gap:5px;margin-bottom:4px;padding:6px;display:flex}.asset.selected{background:#eaf0f9}.asset-select{text-align:left;white-space:normal;background:0 0;border:0;flex:1;align-items:center;gap:10px;min-width:0;display:flex}.asset-select strong{-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;font-weight:500;line-height:1.5;display:-webkit-box;overflow:hidden}.asset-select small{margin-top:4px;font-size:10px;display:block}.sample-mark{color:var(--accent);font-size:25px}.asset>button:last-child{align-self:center;padding:6px;font-size:10px}.empty{color:var(--muted);text-align:center;padding:24px 16px}.empty-wave{display:none}.empty p{margin-top:8px;font-size:12px;line-height:1.8}.empty.small{font-size:12px}.assignment{border-top:1px solid var(--line);padding:18px}.assignment>button{width:100%}.assignment select{width:100%;margin:7px 0 10px}.assignment details button{margin-bottom:8px}.drawer-bar{border-top:1px solid var(--line);background:#f5f6f8;flex-shrink:0;order:3;align-items:center;gap:5px;padding:8px 20px;display:flex}.drawer-bar button{background:0 0;border-color:#0000}.drawer-bar button[aria-expanded=true]{color:#2e568d;background:#e6edf7}.footer-hint{color:var(--muted);margin-left:auto;font-size:10px}#drawer{border-top:1px solid var(--line);background:#fbfcfd;flex-shrink:0;order:2;height:300px;max-height:65dvh;position:relative}#drawer-resize{cursor:ns-resize;z-index:3;touch-action:none;width:100%;height:8px;position:absolute;top:-4px;left:0}#drawer-resize:after{content:"";background:#c7ced8;border-radius:3px;width:35px;height:3px;margin:2px auto;display:block}#composition-content,#midi-content,#devices-content,#library-content{height:100%;overflow:auto}#devices-content{padding:20px 24px 36px}#devices-content h2{margin:0 0 8px}#devices-content .form-row{flex-wrap:wrap;max-width:800px}#available-ports{flex:1;min-width:0;max-width:100%}.device-connection{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;padding:14px 0;display:flex}.device-connection>div{overflow-wrap:anywhere;min-width:0}.device-connection span{color:var(--muted);margin-top:4px;display:block}#device-activity{overflow-wrap:anywhere}.composition-toolbar{align-items:center;gap:24px;padding:18px 24px;display:flex}.composition-toolbar label{align-items:center;gap:7px;font-size:11px;display:flex}.composition-toolbar input{width:65px;margin:0!important}#arrangement-status{color:var(--muted);margin-left:auto;font-size:11px}#sequencer-scroll{padding:0 0 22px;overflow:auto}#sequencer{position:relative}#ruler{height:24px;color:var(--muted);font-size:10px;display:flex}#ruler span{border-left:1px solid var(--line);flex:0 0 64px;padding-left:5px}.lane{border-top:1px solid var(--line);background:repeating-linear-gradient(90deg,#0000 0 63px,#e9edf3 63px 64px);height:60px;position:relative}.lane:last-of-type{border-bottom:1px solid var(--line)}.lane-empty{color:var(--muted);padding:20px 12px;font-size:11px}.clip{color:#31547d;text-align:left;background:#e6eefb;border:1px solid #c8d8ef;height:50px;padding:6px 10px;position:absolute;top:4px;overflow:hidden}.clip strong{text-overflow:ellipsis;font-weight:500;display:block;overflow:hidden}.clip small{color:#506a8e;font-size:10px}.clip-resize{cursor:ew-resize;touch-action:none;background:#3869ad0c;width:10px;height:100%;position:absolute;top:0;right:0}#playhead{background:var(--accent);pointer-events:none;width:1px;position:absolute;top:0;bottom:0}.controller-panel .panel-heading{padding:16px 24px 6px}.controller-panel .panel-heading>div:first-child{align-items:center;gap:18px;display:flex}.controller-panel .hint{align-items:center;gap:6px;display:flex}#controller-channel{width:45px;padding:4px}.controller-options{gap:8px;display:flex}.route-status{color:var(--muted);padding:0 24px;font-size:10px}.controls{grid-template-columns:minmax(400px,1fr) minmax(350px,1fr);gap:45px;max-width:1400px;padding:18px 24px;display:grid}.continuous{grid-template-columns:repeat(8,minmax(0,1fr));gap:16px;display:grid}.control{flex-direction:column;align-items:center;gap:6px;min-width:0;display:flex}.control>span:first-child{white-space:nowrap;font-size:10px}.control input[type=range]{width:100%;margin-top:0}.control small{justify-content:space-between;gap:3px;width:100%;font-size:9px;display:flex}.dial{width:40px;height:40px;transform:rotate(var(--turn));background:#fff;border:2px solid #bdc9d9;border-radius:50%;margin:6px 0;position:relative}.dial i{background:var(--accent);width:2px;height:11px;position:absolute;top:3px;left:calc(50% - 1px)}.fader input[type=range]{writing-mode:vertical-lr;direction:rtl;width:24px;height:86px}.performance{flex-direction:column;gap:12px;display:flex}.pads{grid-template-columns:repeat(8,1fr);gap:5px;display:grid}.pad{background:#edf2f8;flex-direction:column;align-items:center;padding:7px 3px;font-size:9px;display:flex}.pad span{color:var(--accent);font-size:10px}.pad small{display:none}.keys{grid-template-columns:repeat(12,1fr);gap:2px;height:65px;display:grid}.key{background:#fff;border-radius:0 0 4px 4px;justify-content:center;align-items:flex-end;padding:5px 0;font-size:9px;display:flex}.key.black{color:#fff;background:#354151;height:44px}.key.pressed,.pad.pressed{color:#243e61;background:#b9cfee!important}.midi-advanced{padding:0 24px 20px}.midi-advanced[open]{grid-template-columns:1fr 1fr;gap:15px;display:grid}.midi-advanced>summary{grid-column:1/-1}.mapping-panel,.monitor-panel{border-top:1px solid var(--line);min-width:0}.binding{align-items:center;gap:8px;padding:10px 18px;display:flex}.binding>div{flex:1;min-width:0}.binding strong{font-size:12px;font-weight:500}.binding span{color:var(--muted);margin-top:4px;font-size:10px;display:block}.binding button{border:0}.binding.missing strong{color:#985329}.slots-section,.devices{border-top:1px solid var(--line)}.slot,.devices{padding:10px 18px}.slot-heading{justify-content:space-between;margin-bottom:6px;font-size:11px;display:flex}.slot-heading span{color:var(--muted)}.variation{gap:4px;margin-bottom:4px;display:flex}.variation button:first-child{text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.variation .active{border-color:var(--accent)}.slot-code{overflow-wrap:anywhere;margin-top:6px;font-size:10px;display:block}.profile{padding:8px 0}.profile>span{color:var(--muted);font-size:10px}.profile select,.profile>input{max-width:100%;margin-top:5px;display:block}.receipt{overflow-wrap:anywhere;padding:10px 18px;font-size:11px;line-height:1.6}.event-list{max-height:220px;padding:8px 18px;font-size:10px;overflow:auto}.event-list>div{justify-content:space-between;gap:8px;padding:4px 0;display:flex}.event-list b,.event-list strong{font-weight:500}#layout-editor{grid-template-columns:repeat(8,1fr);gap:12px;padding:20px 24px;display:grid}#notice{color:#31547d;opacity:0;pointer-events:none;z-index:10;background:#f1f6fd;border:1px solid #c8d8ef;border-radius:8px;max-width:min(90vw,640px);padding:12px 18px;font-size:12px;line-height:1.6;position:fixed;bottom:65px;left:50%;transform:translate(-50%)}#notice.visible{opacity:1}#notice.error{color:#874820;background:#fff4ed;border-color:#e9cbb7}dialog{border:1px solid var(--line);max-width:min(440px,90vw);color:inherit;border-radius:12px;padding:24px;box-shadow:0 16px 60px #24334b20}dialog::backdrop{background:#23304730}dialog h2{margin-bottom:16px}dialog p{color:var(--muted);font-size:12px;line-height:1.7}dialog input{width:100%}@media (width<=1050px){.topbar{flex-wrap:wrap;gap:12px;padding:14px 18px}.topbar output{font-size:10px}.controls{grid-template-columns:1fr;gap:20px}.performance{max-width:600px}}@media (width<=650px){.topbar{flex-wrap:wrap;gap:10px;min-height:115px;padding:12px}.wordmark{font-size:18px}.session{max-width:145px;margin-left:auto;margin-right:0}.transport{flex:1;order:3}.transport button{padding:7px}#evaluate kbd{display:none}#sounds-toggle{order:4}.topbar output{flex-basis:100%;order:5;max-width:none}.project-menu{top:8px;right:6px}.tabbar{gap:0;padding:7px 82px 7px 8px}#tabs button{padding:9px}.editor-footer{padding:0 12px}.footer-hint{display:none}.drawer-bar{padding:8px}.tools-open .workspace{display:none}.tools-open #drawer{flex:1;min-height:0;max-height:none;height:auto!important}.tools-open .project-menu,#drawer-resize{display:none}.composition-toolbar{flex-wrap:wrap;gap:12px;padding:18px 12px}#arrangement-status{width:100%;margin:0}#sequencer-scroll{padding:0 0 20px}.controller-panel .panel-heading{flex-direction:column;align-items:stretch;padding:18px 12px 8px}.controller-panel .panel-heading>div:first-child{justify-content:space-between}.controller-options{margin-top:6px}.route-status{padding:0 12px}.controls{padding:18px 12px}.continuous{grid-template-columns:repeat(4,1fr);gap:16px}.pads{grid-template-columns:repeat(4,1fr)}.midi-advanced{padding:0 12px 20px}.midi-advanced[open]{display:block}#layout-editor{grid-template-columns:repeat(3,1fr);padding:12px}.devices .form-row select{width:100%}#mapping-context{width:min(280px,100% - 24px);max-height:calc(100% - 55px);left:12px;overflow:auto}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}:root{--editor-bg:#fff;--text:#28303a;--selection:#dce7f8}.appearance-choice{white-space:nowrap;flex-shrink:0;padding:0}.session-actions{flex-shrink:0;align-items:center;gap:6px;display:flex}#add-session{padding:3px 10px;font-size:18px}:root[data-appearance=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#d6dce5;--text:#d6dce5;--editor-bg:#1e232b;--panel:#1e232b;--muted:#9aa6b7;--line:#343d49;--accent:#8ab5f0;--selection:#344760;background:#191d24}[data-appearance=dark] button,[data-appearance=dark] input,[data-appearance=dark] select,[data-appearance=dark] textarea{background:#252c36}[data-appearance=dark] button:hover{background:#303d50}[data-appearance=dark] button.primary{color:#14243a;background:#8ab5f0;border-color:#8ab5f0}[data-appearance=dark] .workspace,[data-appearance=dark] #mapping-context,[data-appearance=dark] #tab-menu>div,[data-appearance=dark] .sessionbar{background:#1e232b}[data-appearance=dark] .topbar,[data-appearance=dark] .drawer-bar{background:#191d24}[data-appearance=dark] #drawer,[data-appearance=dark] .sound-panel{background:#202630}[data-appearance=dark] .session input{background:0 0}[data-appearance=dark] #tabs button[aria-selected=true],[data-appearance=dark] .drawer-bar button[aria-expanded=true],[data-appearance=dark] .asset.selected{color:#bdd6f9;background:#2c3d55}[data-appearance=dark] .project-menu[open]>summary{background:#2c3d55}[data-appearance=dark] .editor-footer{border-color:var(--line)}[data-appearance=dark] .lane{background:repeating-linear-gradient(90deg,#0000 0 63px,#343d49 63px 64px)}[data-appearance=dark] .clip{color:#c0d7f6;background:#2c3d55;border-color:#4a6689}[data-appearance=dark] .clip small{color:#acbed6}[data-appearance=dark] .dial{background:#2d3643;border-color:#64758b}[data-appearance=dark] .pad{background:#2b3748}[data-appearance=dark] .key{color:#202630;background:#bfc9d7}[data-appearance=dark] .key.black{color:#d6dce5;background:#151a22}[data-appearance=dark] dialog{background:#252c36}[data-appearance=dark] #notice{color:#c0d7f6;background:#26374d;border-color:#4a6689}[data-appearance=dark] #notice.error{color:#f3c8a7;background:#442f24;border-color:#865d40}#drawer-learning{color:var(--accent);align-items:center;gap:12px;padding:8px 24px 0;font-size:11px;display:flex}@media (width<=650px){.session-picker{width:150px;max-width:calc(100vw - 180px);margin-left:auto}.session{flex-basis:100%;max-width:none;margin-left:0}}.cm-tooltip-autocomplete{border-radius:6px;max-width:min(540px,90vw);overflow:visible;background:var(--editor-bg)!important;color:var(--text)!important;border:1px solid var(--border)!important}.cm-tooltip-autocomplete>ul{border-radius:inherit;max-height:260px;font-size:13px}.cm-tooltip-autocomplete>ul>li{padding:5px 10px!important}.cm-tooltip-autocomplete>ul>li[aria-selected=true]{background:var(--selection)!important;color:var(--text)!important}.cm-completionDetail{color:var(--muted);margin-left:16px!important;font-style:normal!important}.cm-completionMatchedText{font-weight:700;text-decoration:none!important}@media (width<=650px){.session-actions{margin-left:auto}.session-actions .session-picker{width:130px;max-width:calc(100vw - 205px);margin-left:0}.appearance-choice{order:4}}#export-content{height:100%;overflow:auto}.export-panel{max-width:740px;padding:18px 24px 28px}.export-panel h2{margin:0 0 8px;font-size:15px}.export-options,.export-actions{flex-wrap:wrap;align-items:end;gap:14px;display:flex}.export-options label{flex:1;min-width:130px}#export-status{color:var(--muted);font-size:12px}#export-download{color:var(--accent);font-size:12px;text-decoration:underline}.context-menu{z-index:100;color:#24272d;border:1px solid var(--line);background:#fff;border-radius:8px;width:240px;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);padding:5px;position:fixed;overflow-y:auto;box-shadow:0 8px 30px #0002}.context-menu button{text-align:left;background:0 0;border:0;width:100%;padding:9px 10px;display:block}.context-menu button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.context-menu button:focus,.context-menu button:hover{background:#eef3fa}.context-menu button[aria-disabled=true]{color:var(--muted);cursor:default}.context-menu small{white-space:normal;font-size:10px;display:block}[data-appearance=dark] .context-menu{color:#e8eaf0;background:#202329}[data-appearance=dark] .context-menu button:focus,[data-appearance=dark] .context-menu button:hover{background:#303741}#clip-dialog .form-row:last-child{flex-wrap:wrap}.appearance-choice{cursor:pointer;display:inline-flex;position:relative}.appearance-choice input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.appearance-icon{border:1px solid var(--line);pointer-events:none;border-radius:6px;place-items:center;width:34px;height:34px;display:grid}.appearance-icon svg{width:19px;height:19px}.appearance-choice:hover .appearance-icon{background:var(--selection)}.appearance-choice input:focus-visible+.appearance-icon{outline:2px solid var(--accent);outline-offset:3px}.appearance-choice .theme-sun,.appearance-choice input:checked+.appearance-icon .theme-moon{display:none}.appearance-choice input:checked+.appearance-icon .theme-sun{display:block}.source-link{text-underline-offset:3px;padding:7px 8px;font-size:12px;text-decoration:underline}.source-link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}[data-color=blue]{--pattern-color:#528ee8}[data-color=cyan]{--pattern-color:#29a7c6}[data-color=teal]{--pattern-color:#2b9c8e}[data-color=green]{--pattern-color:#6b9e47}[data-color=amber]{--pattern-color:#bd962e}[data-color=orange]{--pattern-color:#d48243}[data-color=rose]{--pattern-color:#cf6c88}[data-color=violet]{--pattern-color:#9a7bd6}#tabs [data-tab]{border-top:3px solid var(--pattern-color);touch-action:none}#ruler{margin-left:0}.track-row{display:flex;position:relative}.track-header{z-index:10;box-sizing:border-box;background:var(--panel,#eee);border-bottom:1px solid var(--line);flex-wrap:wrap;flex:0 0 180px;align-items:center;gap:4px;width:180px;padding:8px;display:flex;position:sticky;left:0}.track-header strong{text-overflow:ellipsis;white-space:nowrap;width:100%;overflow:hidden}.track-header[aria-current=true]{box-shadow:inset 3px 0 var(--accent,#528ee8)}.track-header button{padding:3px 7px;font-size:11px}.track-row .lane{background-size:var(--grid,64px) 100%;flex:1;min-width:0}.clip[data-color]{background:color-mix(in srgb,var(--pattern-color) 24%,var(--panel,#fff));border:1px solid var(--pattern-color);border-left:4px solid var(--pattern-color);color:var(--text,#222);touch-action:none;overflow:hidden}.clip[data-muted=true]{opacity:.55;border-style:dashed}.clip:focus-visible{outline:2px solid var(--text,#222);outline-offset:2px}.drag-ghost{pointer-events:none;z-index:8;opacity:.8;padding:8px;position:absolute}.drag-ghost[data-invalid=true]{background:#d443;border-color:#d44}.snap-guide{background:var(--text,#222);pointer-events:none;z-index:9;width:2px;position:absolute;top:0;bottom:0}.color-picker{grid-template-columns:repeat(4,1fr);gap:8px;margin:16px 0;display:grid}.color-picker button{border-top:8px solid var(--pattern-color);text-transform:capitalize}.color-picker [aria-pressed=true]{outline:2px solid}#sequencer-scroll{max-height:calc(var(--drawer-height,300px) - 90px);overflow:auto}.track-row .lane{background-image:linear-gradient(to right,transparent calc(100% - 1px),var(--line) calc(100% - 1px));background-size:var(--grid,64px) 100%}.track-header{height:60px;padding:4px 8px}.clip small{color:inherit}.clip{min-width:0;padding:6px 4px}#ruler .track-corner{z-index:11;background:var(--panel);border-left:0;flex:0 0 180px;padding-left:8px;position:sticky;left:0}.track-header{text-align:left;border-right:1px solid var(--line);justify-content:flex-start}[data-track-solo][aria-pressed=true]{background:var(--accent);color:var(--panel);border-color:var(--accent)}#sequencer-scroll{isolation:isolate}.composition-drag-badge{z-index:1000;pointer-events:none;border:1px solid var(--pattern-color);border-left:4px solid var(--pattern-color);background:var(--panel);max-width:224px;color:var(--text);border-radius:6px;padding:10px 12px;font-size:12px;position:fixed;box-shadow:0 4px 16px #0003}.composition-dragging,.composition-dragging *{-webkit-user-select:none;user-select:none;cursor:grabbing!important}.drag-source{opacity:.6}.lane[data-drop-target=valid]{outline:2px solid var(--accent);outline-offset:-2px}.lane[data-drop-target=invalid]{outline-offset:-2px;outline:2px solid #c44}:root{--scroll-thumb:#8491a3;--scroll-thumb-hover:#68788d;--scroll-thumb-active:#526378}:root[data-appearance=dark]{--scroll-thumb:#66758a;--scroll-thumb-hover:#8291a5;--scroll-thumb-active:#a0aec0}@media (forced-colors:none){*{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) transparent}@supports selector(::-webkit-scrollbar){*{scrollbar-width:auto;scrollbar-color:auto}::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar-thumb{background:var(--scroll-thumb);background-clip:padding-box;border:2px solid #0000;border-radius:999px;min-width:28px;min-height:28px}::-webkit-scrollbar-thumb:hover{background-color:var(--scroll-thumb-hover)}::-webkit-scrollbar-thumb:active{background-color:var(--scroll-thumb-active)}::-webkit-scrollbar-button{width:0;height:0;display:none}}}.performance-destination{background:var(--selection);outline:1px solid var(--accent)}.performance-conflict{-webkit-text-decoration:underline wavy #b45309;text-decoration:underline wavy #b45309}.performance-panel{border-top:1px solid var(--border);max-height:45vh;padding:12px 20px;overflow:auto}.performance-panel .form-row{flex-wrap:wrap}.performance-panel [data-input]{border-left:3px solid var(--border);background:var(--editor-bg);padding:8px 12px}.performance-panel [data-input].midi-active{border-color:var(--accent);background:var(--selection);color:var(--text)}.performance-diff{grid-template-columns:1fr 1fr;gap:16px;display:grid}.performance-diff pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px}@media (width<=650px){.performance-diff{grid-template-columns:1fr}}.import-review{max-height:260px;overflow:auto}.import-row{border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:8px;padding:8px 0;display:flex}.import-row label{overflow-wrap:anywhere;flex:1}.import-row span{color:var(--muted);font-size:12px}[data-drop]{border:1px dashed var(--border);margin:8px 0;padding:12px}[data-level]{width:100%}audio[data-preview],audio[data-audio]{width:100%;margin:12px 0}[data-remote] label{overflow-wrap:anywhere;padding:6px 0;display:block}.performance-diff{margin:8px 0}.performance-diff h3{color:var(--muted);margin:4px 0;font-size:12px;font-weight:600}.performance-diff pre{background:var(--editor-bg);border-left:2px solid var(--border);max-height:130px;margin:0;padding:8px 10px;overflow:auto}.performance-diff [data-proposed]{border-left-color:var(--accent)}.performance-options{margin:8px 0}.performance-panel>.form-row{gap:6px;margin:6px 0}@media (width<=650px){.performance-panel{max-height:60vh}.performance-diff pre{max-height:90px}}.midi-composition{border-top:2px solid var(--accent);max-height:48vh;padding:12px 20px;overflow:auto}.midi-composition header{justify-content:space-between;align-items:center;display:flex}.midi-composition p{margin:6px 0}.midi-composition [data-midi-target]{color:var(--muted);font-size:12px}.midi-composition .form-row{flex-wrap:wrap;gap:6px;margin:10px 0}.midi-composition progress{width:100%;height:5px;accent-color:var(--accent)}.midi-composition [data-midi-input]{font-variant-numeric:tabular-nums;border-left:3px solid var(--border);padding-left:8px}.midi-composition.midi-active [data-midi-input]{border-color:var(--accent);background:var(--selection)}.midi-note-view{background:var(--editor-bg);border:1px solid var(--border);height:54px;position:relative;overflow:hidden}.midi-note-view span{background:var(--accent);border-radius:2px;min-width:3px;height:4px;position:absolute}.midi-loop-range{border-bottom:1px solid var(--border);background:var(--selection);flex-wrap:wrap;align-items:center;gap:12px;padding:8px 16px;display:flex}.midi-loop-range label{align-items:center;gap:6px;font-size:12px;display:flex}.midi-loop-range input[type=number]{width:70px}.midi-range-handles{flex:1;gap:0;min-width:180px;display:grid}.midi-range-handles input{width:100%;accent-color:var(--accent);height:12px}.midi-loop-range [data-midi-length]{font-variant-numeric:tabular-nums;font-size:12px}.midi-composition button[aria-pressed=true]{background:var(--accent);color:#fff;border-color:var(--accent)}.midi-composition [data-midi-sound]{color:var(--muted);font-size:12px}.midi-more{color:var(--muted);margin-top:8px;font-size:12px}.midi-more button{margin:6px 6px 0 0}#composition-content>.composition-toolbar,#composition-content>.midi-loop-range{flex-shrink:0}#composition-content>#sequencer-scroll{flex:1;min-height:0;max-height:none}:root{--surface-soft:#f5f6f8;--selection:#eaf0f8;--text:#28303a;--border:var(--line);--editor-bg:var(--panel)}:root[data-appearance=dark]{--surface-soft:#202329;--selection:#293649;--text:#e3e7ee}button,input,select,summary{min-height:34px}button,summary{transition:background-color .14s,color .14s,transform .14s}button:active:not(:disabled){transform:scale(.98)}button,input,select,textarea{border-radius:8px}.hint,.editor-footer,.footer-hint,#saved-state,#transport-state{font-size:12px}.topbar{flex-shrink:0;gap:14px;min-height:66px;padding:10px 20px}.topbar .project-menu{position:relative;top:auto;right:auto}.topbar .session{flex:1}.topbar .sessionbar{z-index:45}#patterns-menu{position:relative}#patterns-menu summary,.project-menu>summary{cursor:pointer;padding:8px 12px;list-style:none}.menu-sheet{z-index:45;border:1px solid var(--line);background:var(--panel);border-radius:14px;width:300px;padding:12px;position:absolute;top:42px;right:0;box-shadow:0 12px 36px #18223720}.menu-sheet input{width:100%;margin-bottom:8px}#pattern-list{max-height:320px;overflow:auto}#pattern-list button{text-align:left;background:0 0;border:0;justify-content:space-between;width:100%;display:flex}#pattern-list small{color:var(--muted)}.tabbar{gap:8px;min-height:52px;padding:8px 18px}.pattern-tab{border-radius:8px;align-items:center;display:flex}.pattern-tab:has([aria-selected=true]){background:var(--selection)}#tabs .pattern-tab button{padding:7px 10px}#tabs .tab-close{padding:4px 8px;font-size:18px}#expand-editor{margin-left:auto}.editor-footer{flex-wrap:wrap;gap:12px;min-height:52px;padding:8px 18px}.editor-footer .transport{margin-left:auto}#slider-hint:empty,#slider-hint,.footer-hint{display:none}#empty-editor{color:var(--muted);flex:1;align-content:center;justify-items:center;gap:12px;display:grid}#empty-editor[hidden]{display:none}.drawer-bar{padding:6px 18px}#drawer{background:var(--panel);max-height:75dvh}#composition-content:not([hidden]){flex-direction:column;display:flex;overflow:hidden}.composition-toolbar{background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap;gap:12px;padding:12px 18px}.composition-toolbar h2{display:none}.timeline-transport{align-items:center;gap:6px;display:flex}#composition-position{font-variant-numeric:tabular-nums;min-width:48px;font-size:12px}#composition-loop[aria-pressed=true]{background:var(--selection);color:var(--accent);border-color:var(--accent)}#arrangement-status[hidden]{display:none}#expand-composition{margin-left:auto}#sequencer-scroll{overscroll-behavior:contain;padding:0 0 12px}#ruler{z-index:20;background:var(--panel);touch-action:none;cursor:crosshair;height:40px;position:sticky;top:0}#ruler>span{padding-top:8px;font-size:11px}#ruler .track-corner{z-index:25}#timeline-range{background:var(--accent);opacity:.18;pointer-events:none;height:10px;position:absolute;top:27px}.range-handle{background:var(--accent);z-index:22;cursor:ew-resize;touch-action:none;border:0;border-radius:4px;width:12px;height:20px;min-height:20px;margin-left:-6px;padding:0;position:absolute;top:20px}#seek-handle{width:22px;height:22px;min-height:22px;color:var(--text);z-index:23;cursor:ew-resize;touch-action:none;background:0 0;border:0;margin-left:-11px;padding:0;position:absolute;top:0}#playhead{z-index:8;background:var(--text)}.range-details{position:relative}.range-details summary{cursor:pointer;padding:8px;font-size:12px}.range-details .midi-loop-range{z-index:30;background:var(--panel);border:1px solid var(--line);border-radius:12px;width:290px;padding:16px;position:absolute;top:36px;right:0;box-shadow:0 12px 30px #18223720}.midi-range-handles,body[data-expanded=editor] #drawer,body[data-expanded=composition] .workspace,body[data-expanded=library] .workspace{display:none}body[data-expanded=composition] #drawer,body[data-expanded=library] #drawer{flex:1;max-height:none;height:auto!important}body[data-expanded=composition] #drawer-resize,body[data-expanded=library] #drawer-resize{display:none}.sound-panel{padding:4px 24px 24px}.sound-panel>.panel-heading{gap:8px;padding:6px 0}.sound-panel>.panel-heading h1{flex:1}.sound-panel h1{letter-spacing:-.3px;font-size:18px}.sound-panel>label{width:calc(100% - 165px);margin-right:12px;display:inline-block}#sound-search{width:100%;padding:12px;font-size:15px}#library-source{width:145px}.library-heading{display:none}.asset-list{padding:0}.asset{border-bottom:1px solid var(--line);border-radius:0;align-items:center;gap:10px;margin:0;padding:10px 0}.asset.selected{background:var(--selection);border-radius:10px}.asset-select strong{font-size:14px}.asset-select small{color:var(--muted);font-size:12px;line-height:1.5}.asset>button:last-child{padding:8px 14px;font-size:14px}.asset-options{position:relative}.asset-options summary{cursor:pointer;padding:8px;list-style:none}.asset-options>div{z-index:3;background:var(--panel);border:1px solid var(--line);border-radius:12px;gap:6px;padding:8px;display:grid;position:absolute;right:0;box-shadow:0 8px 24px #18223720}#add-sounds{margin:0 0 8px}#add-sounds>summary{cursor:pointer;font-weight:500}.sound-panel .assignment{padding:16px 0}.sound-panel .assignment>button{display:none}.performance-panel,.midi-composition{background:var(--surface-soft);border-top:1px solid var(--line);max-height:38dvh;padding:12px 18px;overflow:auto}.performance-panel p,.midi-composition p{margin:6px 0;font-size:12px}.performance-panel .form-row,.midi-composition .form-row{gap:8px;margin:8px 0}.performance-options,.midi-more{margin-top:10px;font-size:12px}.performance-options>summary,.midi-more>summary{cursor:pointer}@media (width<=1000px){.topbar{gap:7px;padding:8px 12px}.wordmark span{display:none}.composition-toolbar,.editor-footer{gap:8px}.sound-panel{padding:4px 16px 16px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.library-test{z-index:4;background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:12px;padding:6px 0;display:flex;position:sticky;top:0}#library-midi-status{color:var(--muted);font-size:12px}[data-live-sound][aria-pressed=true]{background:var(--accent);color:var(--panel);border-color:var(--accent)}[data-preview-sound][data-playing],[data-preview][data-playing]{background:var(--selection);border-color:var(--accent);color:var(--accent)}#save-now{flex-shrink:0}#library-keys{flex-basis:100%;gap:3px;height:62px;display:flex}.asset-list>#library-keys{margin:4px 0 10px}#library-keys[hidden]{display:none}#library-keys button{touch-action:none;border-radius:4px 4px 8px 8px;flex:1}#library-keys .black{color:#fff;background:#303641;height:44px}@media (width<=700px){.sound-panel{padding:4px 12px 12px}}[data-appearance=dark] .asset-select{background:0 0}[data-appearance=dark] .asset.selected{background:var(--selection)}@media (width<=650px){.tools-open .topbar .project-menu{display:block}}.library-backdrop{z-index:99;-webkit-backdrop-filter:blur(6px);background:#18202c38;position:fixed;inset:0}.library-backdrop[hidden]{display:none}.sound-panel{border:1px solid var(--line);z-index:100;background:var(--panel);border-radius:22px 22px 0 0;width:min(920px,100vw - 48px);padding:20px 28px;position:fixed;inset:32px 24px 0 auto;overflow:auto;box-shadow:-12px 0 60px #18202c20}#notice{z-index:120}@media (width<=700px){.sound-panel{width:auto;padding:16px;inset:20px 8px 0}}.sound-panel{border-radius:22px;flex-direction:column;width:min(760px,100vw - 24px);height:auto;max-height:none;padding:0;display:flex;inset:12px 12px 12px auto;overflow:hidden}.sound-panel[hidden]{display:none}.library-header{border-bottom:1px solid var(--line);flex:none;padding:22px 24px 14px}.library-header .panel-heading{gap:8px;padding:0 0 18px}.library-header h1{flex:1;margin:0;font-size:20px}.library-header h1 small{color:var(--muted);margin-top:5px;font-size:12px;font-weight:400;display:block}.library-filters{grid-template-columns:minmax(0,1fr) 145px;align-items:end;gap:12px;display:grid}.library-filters label{min-width:0;margin:0;font-size:12px}.library-filters input,#library-source{width:100%;min-height:44px;margin:6px 0 0}#library-destination{margin:12px 0 0;line-height:1.5}#library-scroll{overscroll-behavior:contain;flex:1;min-height:0;padding:12px 24px 24px;overflow-y:auto}#library-scroll #add-sounds{border-bottom:1px solid var(--line);padding:12px 0 16px}#library-scroll .asset{gap:6px;min-height:76px}#library-scroll .asset>button{flex-shrink:0;min-height:40px}#library-scroll .asset-select{flex:1;padding:10px}.asset-select>span{min-width:0}.asset-select small{overflow-wrap:anywhere;-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.library-test{border-top:1px solid var(--line);border-bottom:0;flex:none;padding:14px 24px;position:static}#library-midi-status{line-height:1.5}.asset-options>div{bottom:100%}.sound-panel button:focus-visible,.sound-panel summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (width<=600px){.sound-panel{border-radius:18px;width:auto;inset:8px}.library-header{padding:18px 16px 12px}.library-header .panel-heading{flex-wrap:wrap}.library-header h1{flex-basis:45%}.library-filters{grid-template-columns:minmax(0,1fr) 112px;gap:8px}#library-scroll{padding:8px 16px 20px}#library-scroll .asset{flex-wrap:wrap;padding:10px 0}#library-scroll .asset-select{flex-basis:100%;padding:6px 8px}.library-test{padding:12px 16px}#library-keys{gap:2px;height:54px}#library-keys button{min-width:0;padding:0;font-size:10px}}.sound-panel{border-top:0;border-bottom:0;border-right:0;border-radius:0;width:min(760px,100vw);height:100dvh;inset:0 0 0 auto}.sound-repository{color:var(--accent)}@media (width<=600px){.sound-panel{border-radius:0;width:100%;inset:0}}#instrument-toolbar{border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:10px;padding:12px 20px;display:flex}#instrument-toolbar label{align-items:center;gap:8px;display:flex}#instrument-toolbar p{flex-basis:100%;margin:0}#instrument-state{font-size:12px}#instrument-state.error{color:#b33a36}#midi-output-controls{flex-wrap:wrap;flex-basis:100%;align-items:center;gap:10px;display:flex}#midi-output-controls select{max-width:min(360px,65vw)}#midi-output-controls input{width:180px;max-width:60vw}#midi-output-controls #midi-assignment{font-size:12px}.cm-completionInfo{max-width:min(440px,85vw);max-height:380px;overflow:auto;background:var(--panel)!important;color:var(--text)!important;border:1px solid var(--border)!important;padding:14px!important}.studio-function-doc{white-space:normal;font:13px/1.5 system-ui,sans-serif}.studio-function-doc>code{overflow-wrap:anywhere;font-weight:600}.studio-function-doc p{white-space:pre-line;margin:10px 0}.studio-function-doc h4{margin:12px 0 6px;font-size:12px}.studio-function-doc dl{margin:0}.studio-function-doc dt{overflow-wrap:anywhere;font-family:monospace;font-weight:600}.studio-function-doc dd{margin:2px 0 10px}.studio-function-doc pre{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--selection);padding:8px;font-size:12px}.studio-function-doc small{opacity:.7}#app[hidden],#sample-import-page[hidden]{display:none!important}#sample-import-page{background:var(--surface-soft);color:var(--text,#242830);z-index:40;padding:clamp(24px,5vw,72px);position:fixed;inset:0;overflow:auto}#sample-import-page>header{justify-content:space-between;gap:24px;max-width:1200px;margin:0 auto 64px;display:flex}#sample-import-page>header span{letter-spacing:.14em;opacity:.65;font-size:11px}#sample-import-page>h1,#sample-import-page>p,#sample-import-page>.import-columns,#sample-import-page>.browser-storage{max-width:1200px;margin-left:auto;margin-right:auto}#sample-import-page h1{letter-spacing:-.04em;margin-bottom:20px;font-size:clamp(32px,5vw,64px);line-height:1.08}#sample-import-page>p{opacity:.75;margin-bottom:48px}.import-columns{grid-template-columns:1fr 1fr;gap:48px;display:grid}.import-columns>div{border-top:1px solid var(--border,#ccc);min-width:0;padding-top:20px}.import-columns label{gap:8px;margin:16px 0;display:grid}.import-columns input:not([type=checkbox]){width:100%;min-width:0}.import-columns button{margin:4px 4px 4px 0}.import-columns .import-review{max-height:360px;overflow:auto}.import-columns .import-review label{overflow-wrap:anywhere;align-items:start;display:flex}.browser-storage{border-top:1px solid var(--border,#ccc);margin-top:56px;padding-top:24px}.import-page-link{margin:12px 0;display:inline-block}.import-nav{white-space:nowrap;font-size:12px}@media (width<=760px){.import-columns{grid-template-columns:1fr;gap:32px}#sample-import-page>header{margin-bottom:36px}.import-nav{display:none}}#sample-import-page h1:focus{outline:none}