:root{--bg:#eef0f3;--panel:#fff;--text:#1d2330;--muted:#5d6677;--border:#d5d9e0;--accent:#2f6fdb;--ok:#1f8a4c;--warn:#b36b00;--error:#c0392b;--grid:#0000000b;--grid-strong:#00000052;--grid-beat:#00000024;--loop-ruler:#2fa36b;--tempo:#c4661f;--signature:#8a4fd6;--keysig:#16837a;--marker:#c23c74;--note-selected:#f2994a;--ghost:#6e6e7838;--black-key:#0000000b;--playhead:#e5484d;--loop:#2f6fdb1f;--selection:#2f6fdb24;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:system-ui,-apple-system,Segoe UI,Hiragino Sans,Noto Sans JP,sans-serif;font-size:14px}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#121418;--panel:#1b1e24;--text:#e4e7ec;--muted:#9aa3b2;--border:#323844;--accent:#6c9cf0;--ok:#4cc27f;--warn:#e0a040;--error:#ef6b5c;--grid:#ffffff0d;--grid-strong:#ffffff47;--grid-beat:#ffffff1f;--loop-ruler:#4cc27f;--tempo:#f0a060;--signature:#b58cf0;--keysig:#4fc7bb;--marker:#f07aa8;--ghost:#c8c8d229;--black-key:#ffffff09;--loop:#6c9cf01f;--selection:#6c9cf024}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);margin:0}button{font:inherit;border:1px solid var(--border);background:var(--panel);color:var(--text);cursor:pointer;border-radius:5px;padding:4px 10px}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button:disabled{opacity:.5;cursor:not-allowed}select,input{font:inherit;color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:4px;padding:2px 4px}input[type=checkbox]{padding:0}a{color:var(--accent)}.note{color:var(--muted);font-size:.9rem}.error-text{color:var(--error)}.warn-text{color:var(--warn)}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.shell{flex-direction:column;height:100vh;min-height:560px;display:flex}.shell>.menubar,.shell>.toolbar,.shell>.banner,.shell>.statusbar{flex:none}.menubar{background:var(--panel);border-bottom:1px solid var(--border);gap:2px;padding:2px 8px;display:flex}.menu{position:relative}.menu-title{background:0 0;border:none;padding:4px 10px}.menu-title[aria-expanded=true]{background:var(--selection)}.menu-items{z-index:50;background:var(--panel);border:1px solid var(--border);border-radius:6px;min-width:240px;max-height:calc(100vh - 60px);padding:4px;position:absolute;top:100%;left:0;overflow-y:auto;box-shadow:0 6px 24px #0000002e}.menu-items hr{border:none;border-top:1px solid var(--border);margin:4px 0}.menu-sub{position:relative}.menu-items .submenu{z-index:51}.menu-item.has-sub[aria-expanded=true]{background:var(--selection)}.context-menu-root .menu-items{min-width:220px}.menu-item{text-align:left;white-space:nowrap;background:0 0;border:none;grid-template-columns:1.2em 1fr auto;gap:8px;width:100%;padding:4px 8px;display:grid}.menu-item .label{white-space:nowrap}.menu-item .shortcut{padding-left:16px}.menu-item:hover:not(:disabled){background:var(--selection)}.menu-item .shortcut,.menu-item .reason{color:var(--muted);font-size:.85em}.menu-item .reason{max-width:18em}.toolbar{background:var(--panel);border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;gap:8px;padding:6px 10px;display:flex}.toolbar-group{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.toolbar .sep{background:var(--border);width:1px;height:22px}.toolbar-sub{padding:4px 10px}.zoom-buttons button{min-width:24px;height:20px;padding:0 8px;font-size:.9rem;line-height:1}.arr-corner{box-sizing:border-box;border-bottom:1px solid var(--border);flex:none;justify-content:flex-end;align-items:center;padding:0 4px;display:flex}.arr-tools{margin-right:auto}.arr-tools .icon-btn{height:20px;padding:0 6px}.arr-tools .icon-btn .icon{width:14px;height:14px}.segmented{display:inline-flex}.segmented button{border-radius:0}.segmented button:first-child{border-radius:5px 0 0 5px}.segmented button:last-child{border-radius:0 5px 5px 0;margin-left:-1px}.segmented button.on{background:var(--accent);color:#fff;border-color:var(--accent)}.transport{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.transport .position{min-width:8ch;padding:0 4px;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:1.2rem}.transport .time{color:var(--muted);font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace}.seek-bar{flex:120px;min-width:80px;height:22px}.seek-bar canvas{touch-action:none;border-radius:4px;outline:none;width:100%;height:22px;display:block}.seek-bar canvas:focus-visible{box-shadow:0 0 0 2px var(--accent)}.transport .bar-input{width:4em;margin:0 2px}.transport .pending-edits{color:var(--warn);white-space:nowrap;font-size:.75rem}.banner{background:var(--selection);border-bottom:1px solid var(--border);align-items:center;gap:8px;padding:6px 12px;display:flex}.banner.error{color:var(--error);border-color:var(--error);background:0 0}.workspace{border-bottom:1px solid var(--border);flex:1 1 0;min-height:100px;display:flex;overflow:hidden}.arrangement{background:var(--panel);flex:1;min-width:0;display:flex;overflow:hidden}.track-headers{border-right:1px solid var(--border);flex-direction:column;flex:none;width:220px;display:flex;overflow:hidden}.tempo-lane-label{color:var(--tempo);border-top:1px solid var(--border);border-bottom:1px solid var(--border);box-sizing:border-box;flex:none;align-items:center;padding:0 10px;font-size:11px;display:flex}.marker-lane-label{color:var(--marker);border-top:none}.track-headers-clip{flex:1;min-height:0;position:relative;overflow:hidden}.track-header{border-bottom:1px solid var(--border);cursor:pointer;align-items:center;gap:4px;padding:0 6px;display:flex}.track-header.selected{background:var(--selection)}.track-header{-webkit-user-select:none;user-select:none}.track-header.dragging{opacity:.5}.track-grip{text-align:center;width:12px;color:var(--muted);letter-spacing:-3px;cursor:grab;touch-action:none;flex:none;margin-left:-2px;font-size:11px;line-height:1}.track-grip:hover{color:var(--text)}.track-header.dragging .track-grip{cursor:grabbing}.track-drop-line{border-top:2px solid var(--accent);pointer-events:none;z-index:1;height:0;position:absolute;left:0;right:0}.track-color{border-radius:2px;flex:none;width:4px;height:70%}.track-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.track-name-input{flex:1;min-width:0}.track-meta{color:var(--muted);font-family:ui-monospace,monospace;font-size:.8rem}button.toggle{padding:1px 6px;font-size:.75rem}button.toggle.on{background:var(--accent);border-color:var(--accent);color:#fff}button.toggle.arm.on{background:var(--error);border-color:var(--error)}.arrangement-scroll,.roll-scroll{flex:1;position:relative;overflow:auto}.sticky-canvas{position:sticky;top:0;left:0}.sticky-canvas canvas{position:absolute;top:0;left:0}.overlay-canvas{pointer-events:none}.inspector{background:var(--panel);border-left:1px solid var(--border);flex-direction:column;flex:none;gap:8px;width:240px;padding:8px 10px;display:flex;overflow:auto}.inspector h3{margin:0;font-size:.95rem}.inspector label{color:var(--muted);flex-direction:column;gap:2px;font-size:.85rem;display:flex}.inspector-row{gap:8px;display:flex}.inspector-row label{flex:1}.editor-panel{background:var(--panel);flex-direction:column;flex:1.8 1 0;min-height:160px;display:flex}.tabs{border-bottom:1px solid var(--border);align-items:center;gap:2px;padding:2px 8px 0;display:flex}.tabs>button[role=tab]{border-bottom:none;border-radius:5px 5px 0 0}.tabs>button[role=tab].on{background:var(--bg);font-weight:600}.tab-track{margin-left:auto}.editor-body{flex-direction:column;flex:1;min-height:0;display:flex}.placeholder{color:var(--muted);padding:16px}.piano-roll{flex-direction:column;flex:1;min-height:0;display:flex}.roll-main{flex:1;min-height:0;display:flex}.roll-grid:focus{outline:2px solid var(--accent);outline-offset:-2px}.controller-lane{border-top:1px solid var(--border);flex:none;align-items:flex-start;padding:4px 0;display:flex}.lane-label{flex:none;padding:0 2px}.lane-select{flex:1;min-width:0;padding:1px;font-size:.7rem}.statusbar{color:var(--muted);background:var(--panel);border-top:1px solid var(--border);flex-wrap:wrap;gap:16px;padding:3px 10px;font-size:.8rem;display:flex}.statusbar .grow{text-align:right;text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.dialog{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:8px;width:100%;max-width:min(640px,100vw - 32px);padding:0}.dialog::backdrop{background:#00000059}.dialog.wide{max-width:min(960px,100vw - 32px)}.dialog.wide .dialog-body{max-height:78vh}.help-layout{grid-template-columns:160px 1fr;gap:16px;min-height:60vh;display:grid}.help-nav{border-right:1px solid var(--border);flex-direction:column;align-self:start;gap:2px;padding-right:10px;display:flex;position:sticky;top:0}.help-nav button{text-align:left;background:0 0;border:none;border-radius:5px;padding:5px 8px}.help-nav button.on{background:var(--selection);color:var(--accent);font-weight:600}.help-body h3{margin:0 0 8px;font-size:1.1rem}.help-body h4{margin:14px 0 4px;font-size:.95rem}.help-body ul{padding-left:1.2em}.help-body li{margin:4px 0;line-height:1.5}.help-fig{margin:12px 0 16px}.help-fig img{border:1px solid var(--border);border-radius:8px;width:100%;height:auto;display:block}.help-fig figcaption{color:var(--muted);margin-top:6px;font-size:.8rem;line-height:1.5}.help-body .summary td:first-child{white-space:nowrap}.help-key{border:1px solid var(--border);background:var(--bg);border-bottom-width:2px;border-radius:4px;padding:0 5px;font:.85em system-ui,sans-serif;display:inline-block}.about-head{align-items:center;gap:14px;margin-bottom:10px;display:flex}.about-head h3{margin:0;font-size:1.3rem}.about h4{margin:14px 0 4px;font-size:.95rem}@media (width<=640px){.help-layout{grid-template-columns:1fr}.help-nav{border-right:none;border-bottom:1px solid var(--border);flex-flow:wrap;padding:0 0 6px;position:static}}.dialog header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.dialog header h2{margin:0;font-size:1rem}.dialog .startup-brand{justify-content:flex-start;gap:14px;padding:16px 18px 12px}.dialog .startup-brand h2{letter-spacing:.02em;font-size:1.5rem}.app-logo{flex:none;display:block}.dialog-body{max-height:70vh;padding:12px 14px;overflow:auto}.features{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px;margin:0;padding:0;list-style:none;display:grid}.features li[data-ok=true]{color:var(--ok)}.features li[data-ok=false],.issues li[data-severity=warning]{color:var(--warn)}.saved-list{padding:0;list-style:none}.saved-list li{margin:4px 0}table.summary{border-collapse:collapse;width:100%;font-size:.9rem}table.summary td{border-bottom:1px solid var(--border);padding:4px 6px}@media (width<=900px){.inspector{display:none}.track-headers{width:150px}}.drum-editor{flex-direction:column;flex:1;min-height:0;display:flex}.drum-toolbar{white-space:nowrap;border-bottom:1px solid var(--border);flex-wrap:nowrap;align-items:center;gap:8px;padding:2px 8px;display:flex;overflow:hidden}.drum-main{flex:1;min-height:0;display:flex}.drum-scroll{flex:1;position:relative;overflow:auto}.drum-names{background:var(--panel);border-right:1px solid var(--border);z-index:1;position:absolute;top:0;left:0;overflow:hidden}.drum-lane-name{border-bottom:1px solid var(--grid);align-items:center;gap:2px;padding-right:2px;font-size:.78rem;display:flex}.drum-lane-name .lane-name{text-align:left;white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:inherit;background:0 0;border:none;flex:1;padding:0 4px;overflow:hidden}.drum-lane-name .pitch{color:var(--muted);font-family:ui-monospace,monospace}.drum-lane-name .lane-tools{display:none}.drum-lane-name:hover .lane-tools{display:inline-flex}.drum-lane-name .lane-tools button{background:0 0;border:none;padding:0 3px;font-size:.65rem}.drum-lane-name input{width:100%;font-size:inherit}.drum-pads{border-left:1px solid var(--border);flex:none;width:230px;min-height:0;padding:6px;overflow:auto}.pad-grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.pad{touch-action:none;flex-direction:column;justify-content:center;align-items:center;height:44px;padding:2px;display:flex}.pad.on{background:var(--note-selected);color:#fff;border-color:var(--note-selected)}.pad-name{text-align:center;font-size:.72rem;line-height:1.1}.pad-keys{color:var(--muted);font-size:.7rem}.pad.on .pad-keys{color:#fff}.mode-active{color:var(--accent);font-weight:600}kbd{border:1px solid var(--border);border-radius:3px;padding:0 4px;font-family:ui-monospace,monospace}.key-bindings h3{margin:12px 0 4px;font-size:.95rem}@media (width<=900px){.drum-pads{display:none}}.list-editor{flex-direction:column;flex:1;min-height:0;display:flex}.toolbar-sep{background:var(--border);flex:none;width:1px;height:18px;margin:0 4px}button.link{color:var(--accent);cursor:pointer;background:0 0;border:none;padding:0 4px;text-decoration:underline}.list-toolbar{white-space:nowrap;border-bottom:1px solid var(--border);flex-wrap:nowrap;align-items:center;gap:6px;padding:2px 8px;display:flex;overflow-x:auto}.list-notice{color:var(--muted);padding:2px 8px;font-size:.8rem}.list-body{flex:1;min-height:0;display:flex}.list-grid{outline:none;flex-direction:column;flex:1;min-width:0;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:.85rem;display:flex}.list-grid:focus-visible{box-shadow:inset 0 0 0 2px var(--accent)}.list-header,.list-row{grid-template-columns:4.5em 4em 5em 3.5em 5.5em 5.5em 4.5em 6.5em 1fr;align-items:center;display:grid}.list-header{border-bottom:1px solid var(--border);color:var(--muted);padding:2px 0}.list-scroll{flex:1;position:relative;overflow:auto}.list-row{border-bottom:1px solid var(--grid);cursor:default;position:absolute;left:0;right:0}.list-row.static{padding:2px 8px;display:block;position:static}.list-row.selected{background:var(--selection)}.list-row.playing{box-shadow:inset 4px 0 0 var(--playhead);background:#e5484d14}.list-row.cat-sysex,.list-row.cat-meta,.list-row.cat-raw{color:var(--muted)}.lc{white-space:nowrap;text-overflow:ellipsis;padding:0 6px;position:relative;overflow:hidden}.lc-meas,.lc-step,.lc-key,.lc-st,.lc-gt,.lc-vel,.lc-tick{text-align:right}.lc.cursor{outline:2px solid var(--accent);outline-offset:-2px}.cell-input{width:100%;font:inherit;padding:0 2px}.hidden-badge{color:var(--warn);font-size:.65rem;position:absolute;top:1px;left:1px}.readout{color:var(--muted);background:0 0;border:1px dashed #0000;padding:2px 4px;font-size:.85rem}.readout:hover,.readout:focus-visible{border-color:var(--border);color:var(--text)}.tempo-editor{flex-direction:column;height:100%;min-height:0;display:flex}.tempo-rows{flex:1;min-height:0;padding:0 8px 8px;font-size:.85rem;overflow:auto}.tempo-row{border-bottom:1px solid var(--border);grid-template-columns:8.5em 6em minmax(14em,1fr) auto;align-items:center;gap:8px;padding:3px 0;display:grid}.tempo-row.head{background:var(--panel);color:var(--muted);z-index:1;font-size:.75rem;position:sticky;top:0}.tempo-row .pos{width:7.5em;font-family:ui-monospace,monospace}.tempo-row .kind{font-weight:600}.tempo-row.kind-tempo .kind{color:var(--tempo)}.tempo-row.kind-time-signature .kind{color:var(--signature)}.tempo-row.kind-key-signature .kind{color:var(--keysig)}.tempo-row.kind-marker .kind{color:var(--marker)}.tm-root{z-index:40;background:var(--tm-bg);color:var(--tm-text);flex-direction:column;font-family:DotGothic16,Osaka-Mono,Osaka−等幅,MS Gothic,BIZ UDGothic,ui-monospace,Menlo,monospace;display:flex;position:fixed;inset:0}.tm-rcm{--tm-bg:#000;--tm-text:#5ec8f0;--tm-head-bg:#4cc24c;--tm-head-text:#c8ffb0;--tm-tag-bg:#4cc24c;--tm-tag-text:#10301a;--tm-num-bg:#e8e8e8;--tm-num-text:#0a1a50;--tm-title-bg:#d8d8d8;--tm-title-text:#101010;--tm-mode-bg:#5ec8e8;--tm-mode-text:#0a2a6a;--tm-now-first-bg:#e8e8e8;--tm-now-first-text:#8a8a8a;--tm-now:#f0e050;--tm-staff:#3ad14a;--tm-now-first-dot:#fff;--tm-dim:#2f7f9a}.tm-retro-blue{--tm-bg:#0b1f7a;--tm-text:#f2f4ff;--tm-head-bg:#2a40b0;--tm-head-text:#fff;--tm-tag-bg:#ffef5a;--tm-tag-text:#0b1f7a;--tm-num-bg:#fff;--tm-num-text:#0b1f7a;--tm-title-bg:#2a40b0;--tm-title-text:#fff;--tm-mode-bg:#ffef5a;--tm-mode-text:#0b1f7a;--tm-now-first-bg:#ffef5a;--tm-now-first-text:#0b1f7a;--tm-now:#ffef5a;--tm-staff:#9fb0ff;--tm-now-first-dot:#fff;--tm-dim:#9fb0ff}.tm-retro-green{--tm-bg:#050805;--tm-text:#4dff7a;--tm-head-bg:#1d5a2a;--tm-head-text:#d7ffd9;--tm-tag-bg:#4dff7a;--tm-tag-text:#050805;--tm-num-bg:#d7ffd9;--tm-num-text:#050805;--tm-title-bg:#1d5a2a;--tm-title-text:#d7ffd9;--tm-mode-bg:#4dff7a;--tm-mode-text:#050805;--tm-now-first-bg:#d7ffd9;--tm-now-first-text:#050805;--tm-now:#d7ffd9;--tm-staff:#2a9a48;--tm-now-first-dot:#fff;--tm-dim:#2a9a48}.tm-modern{--tm-bg:var(--panel);--tm-text:var(--text);--tm-head-bg:var(--selection);--tm-head-text:var(--text);--tm-tag-bg:var(--accent);--tm-tag-text:#fff;--tm-num-bg:var(--bg);--tm-num-text:var(--text);--tm-title-bg:var(--bg);--tm-title-text:var(--text);--tm-mode-bg:var(--accent);--tm-mode-text:#fff;--tm-now-first-bg:var(--playhead);--tm-now-first-text:#fff;--tm-now:var(--playhead);--tm-staff:var(--muted);--tm-now-first-dot:var(--playhead);--tm-dim:var(--muted)}.tm-titlebar,.tm-trackbar{white-space:nowrap;align-items:stretch;gap:.3em;padding:.15em .3em;display:flex}.tm-tag{background:var(--tm-tag-bg);color:var(--tm-tag-text);padding:0 .3em}.tm-num{background:var(--tm-num-bg);color:var(--tm-num-text);padding:0 .3em}.tm-title{text-overflow:ellipsis;background:var(--tm-title-bg);min-width:0;color:var(--tm-title-text);flex:1;padding:0 .4em;overflow:hidden}.tm-pos{background:var(--tm-title-bg);color:var(--tm-title-text);text-align:right;min-width:12ch;padding:0 .4em}.tm-statusbar{flex-wrap:wrap;align-items:center;gap:6px 10px;padding:2px .4em 4px;display:flex}.tm-group{align-items:center;gap:6px;display:inline-flex}.tm-right{margin-left:auto}.tm-sep{background:var(--tm-dim);opacity:.6;width:1px;height:18px}.tm-statusbar label{color:var(--tm-text);opacity:.85;align-items:center;gap:4px;font-family:system-ui,sans-serif;font-size:12px;display:inline-flex}.tm-statusbar select,.tm-statusbar button{color:var(--tm-text);border:1px solid var(--tm-dim);background:0 0;border-radius:4px;padding:1px 8px;font-family:system-ui,sans-serif;font-size:12px}.tm-statusbar button.on{background:var(--tm-mode-bg);color:var(--tm-mode-text);border-color:var(--tm-mode-bg)}.tm-statusbar option{color:#000}.tm-transport button{min-width:2.2em;font-family:ui-monospace,Menlo,monospace}.tm-back{font-weight:600}.tm-mode-box{background:var(--tm-mode-bg);color:var(--tm-mode-text);padding:0 .6em}.tm-panes{background:var(--tm-dim);flex:1;gap:2px;min-height:0;display:grid}.tm-layout-single{grid-template-columns:1fr}.tm-layout-columns-2{grid-template-columns:1fr 1fr}.tm-layout-rows-2{grid-template-rows:1fr 1fr}.tm-layout-quad{grid-template-rows:1fr 1fr;grid-template-columns:1fr 1fr}.tm-pane{background:var(--tm-bg);flex-direction:column;min-width:0;min-height:0;display:flex}.tm-track-select{font:inherit;background:var(--tm-title-bg);color:var(--tm-title-text);border:none;border-radius:0;flex:1;min-width:0}.tm-muted{color:var(--tm-now)}.tm-pane-body{flex:1;min-height:0;display:flex}.tm-list{flex-direction:column;flex:1;min-width:0;display:flex}.tm-staff{width:28%;min-width:140px;max-width:320px;height:100%}.tm-row{white-space:pre;grid-template-columns:4ch 4ch 5ch 4ch 5ch 5ch 4ch;column-gap:1.2ch;padding:0 .6ch;line-height:1.25;display:grid}.tm-row>span{text-align:right;overflow:hidden}.tm-row>.c-note{text-align:left}.tm-row>.c-step{text-align:right}.tm-colhead{background:var(--tm-head-bg);color:var(--tm-head-text)}.tm-body{flex:1;min-height:0;overflow:hidden}.tm-row.now{color:var(--tm-now)}.tm-row.now-first{background:var(--tm-now-first-bg);color:var(--tm-now-first-text)}.tm-rest{min-height:1.3em;color:var(--tm-dim);padding:0 .6ch;font-size:.8em}.record-controls{align-items:center;gap:4px;display:inline-flex}button.record{color:var(--error);font-size:1rem;line-height:1}button.record.on{background:var(--error);color:#fff;border-color:var(--error)}.count-in,.rec-label{color:var(--error);font-family:ui-monospace,monospace;font-weight:700}.step-panel{border-bottom:1px solid var(--border);background:var(--selection);flex-wrap:wrap;align-items:center;gap:8px;padding:4px 8px;font-size:.85rem;display:flex}.step-cursor{font-family:ui-monospace,monospace}.form-grid{flex-direction:column;gap:10px;display:flex}.form-grid label{flex-direction:column;gap:2px;display:flex}.sysex-item{border-bottom:1px solid var(--border);flex-direction:column;gap:4px;padding:6px 0;display:flex}.hex{word-break:break-all;font-family:ui-monospace,monospace}.hex-input{width:100%;font-family:ui-monospace,monospace}.conductor-row{align-items:center;gap:6px;display:flex}.conductor-row input{width:6em}:is(.form-grid label:has(>input[type=checkbox]),.saved-list label){flex-flow:wrap;align-items:center;gap:6px;display:flex}.arrangement-canvas,.roll-grid,.roll-keys,.lane-canvas,.drum-canvas{touch-action:none}.splitter{touch-action:none;cursor:row-resize;background:var(--border);border-top:1px solid var(--panel);border-bottom:1px solid var(--panel);flex:none;height:6px}.splitter:hover,.splitter:focus-visible{background:var(--accent);outline:none}.editor-panel.collapsed{flex:none;min-height:0}.collapse-btn{margin-left:6px;padding:0 8px}.controller-lane.collapsed{padding:2px 0}.lane-label{align-items:flex-start;gap:2px;display:flex}.lane-label .collapse-btn{margin-left:0;padding:0 3px;font-size:10px}.editor-tools{align-items:center;gap:8px;margin-left:12px;padding-bottom:2px;display:inline-flex}.editor-tools .segmented button{padding:2px 10px}.mixer{background:var(--bg);flex-direction:column;flex:1;min-height:0;display:flex}.mixer-strips{flex:1;gap:4px;min-height:0;padding:6px;display:flex;overflow-x:auto}.mixer-note{margin:0;padding:2px 8px 4px;font-size:.75rem}.strip{background:var(--panel);border:1px solid var(--border);border-radius:6px;flex-direction:column;flex:none;align-items:center;gap:4px;width:92px;min-height:0;padding:0 4px 6px;display:flex}.strip.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}.strip.silent .fader-fill,.strip.silent .knob-value{opacity:.35}.strip-head{border-top:4px solid;border-radius:6px 6px 0 0;align-items:center;gap:4px;width:calc(100% + 8px);padding:4px 4px 2px;font-size:.8rem;font-weight:600;display:flex}.strip-index{color:var(--muted);font-family:ui-monospace,monospace;font-size:.7rem}.strip-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.strip-program{text-align:center;white-space:nowrap;text-overflow:ellipsis;width:100%;font-size:.68rem;overflow:hidden}.strip-knobs{grid-template-columns:1fr 1fr;gap:2px 0;display:grid}.knob{flex-direction:column;align-items:center;line-height:1.05;display:flex;position:relative}.knob svg{cursor:ns-resize;touch-action:none;outline:none}.knob svg:focus-visible .knob-body{stroke:var(--accent);stroke-width:2px}.knob-track{fill:none;stroke:var(--border);stroke-width:3px;stroke-linecap:round}.knob-value{fill:none;stroke-width:3px;stroke-linecap:round}.knob-body{fill:var(--bg);stroke:var(--muted);stroke-width:1px}.knob-pointer{stroke:var(--text);stroke-width:2px;stroke-linecap:round}.knob-label{color:var(--muted);text-transform:uppercase;letter-spacing:.02em;white-space:nowrap;font-size:.6rem}.knob-auto{margin:0;position:absolute;top:0;right:-1px}.knob-value-text{font-family:ui-monospace,monospace;font-size:.68rem}.knob.unset .knob-pointer,.knob.unset .knob-value-text{opacity:.4}.knob.unset .knob-value{opacity:.25}.fader{flex:1;justify-content:center;gap:14px;width:100%;min-height:80px;padding:8px 18px 8px 0;display:flex}.fader-scale{width:18px;color:var(--muted);font-family:ui-monospace,monospace;font-size:.55rem;position:relative}.fader-scale span{position:absolute;right:0;transform:translateY(50%)}.fader-track{background:var(--border);cursor:ns-resize;touch-action:none;border-radius:5px;outline:none;width:10px;position:relative}.fader-track:focus-visible{box-shadow:0 0 0 2px var(--accent)}.fader-fill{opacity:.85;border-radius:5px;position:absolute;bottom:0;left:0;right:0}.fader-thumb{background:linear-gradient(var(--panel), var(--bg));border:1px solid var(--muted);border-radius:3px;width:26px;height:14px;position:absolute;left:50%;transform:translate(-50%,50%);box-shadow:0 1px 2px #00000040}.fader-thumb:after{content:"";background:var(--text);height:1px;position:absolute;top:50%;left:4px;right:4px}.fader.unset .fader-fill{opacity:.3}.strip-volume{font-family:ui-monospace,monospace;font-size:.8rem}.strip-buttons{gap:2px;display:flex}.strip-buttons .toggle{padding:1px 6px}button.toggle.solo.on{background:#e0a020;border-color:#e0a020}.strip-channel{color:var(--muted);white-space:nowrap;height:1rem;font-family:ui-monospace,monospace;font-size:.75rem;line-height:1rem;overflow:hidden}.lane-swatch{vertical-align:middle;border-radius:2px;width:8px;height:8px;margin-right:3px;display:inline-block}.auto-mark{background:var(--accent);color:#fff;border-radius:2px;margin-left:2px;padding:0 2px;font-size:.55rem;font-weight:700;line-height:1.2;display:inline-block}.fader{position:relative}.fader-auto{position:absolute;top:0;right:2px}.meter{background:linear-gradient(#e5484d 0%,#e6c33a 18%,#2fbf5b 38% 100%);border-radius:2px;width:6px;position:relative;overflow:hidden}.meter-cover{background:var(--border);height:100%;position:absolute;top:0;left:0;right:0}.meter.clip{box-shadow:0 0 0 1px #e5484d}@media (width>=1100px){.toolbar{flex-wrap:nowrap}.toolbar .transport{flex-wrap:nowrap;flex:auto;min-width:0}.toolbar .transport>*{white-space:nowrap;flex:none}.toolbar .transport>.seek-bar{flex:80px;min-width:60px}.toolbar .toolbar-group{white-space:nowrap;flex-wrap:nowrap;flex:none}}@media (width<=1399px){.transport .time{display:none}}.transport .bar-input{width:3.4em}.input-mode-switch{border-radius:6px}.input-mode-switch button{padding:3px 8px}.mode-key{opacity:.65;margin-left:4px;font:.7rem/1 system-ui,sans-serif}button.on .mode-key{opacity:.85}.quantize-form fieldset,.startup-form fieldset{border:1px solid var(--border);border-radius:6px;flex-direction:column;gap:4px;margin:0;padding:6px 10px;display:flex}.quantize-form legend,.startup-form legend{color:var(--muted);padding:0 4px;font-size:.8rem}.quantize-form fieldset label,.startup-form fieldset label{flex-direction:row;align-items:flex-start;gap:6px}.quantize-form input[type=range]{flex:1;min-width:160px}.quantize-form .pct{width:4.5em}.audio-ok{color:var(--ok)}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.icon{display:block}.icon-btn{justify-content:center;align-items:center;padding:4px 8px;display:inline-flex}.icon-toggle{border:1px solid var(--border);background:var(--panel);color:var(--muted);cursor:pointer;border-radius:5px;justify-content:center;align-items:center;padding:4px 7px;display:inline-flex;position:relative}.icon-toggle input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.icon-toggle:has(input:checked){background:var(--accent);border-color:var(--accent);color:#fff}.icon-toggle:has(input:focus-visible){box-shadow:0 0 0 2px var(--accent)}.segmented .icon-btn.on{color:#fff}.icon-text{margin-left:4px;font-size:.8rem}.tm-views{gap:0;display:inline-flex}.tm-views button{color:var(--tm-text);border:1px solid var(--tm-dim);background:0 0;border-radius:0;padding:1px 10px}.tm-views button:first-child{border-radius:4px 0 0 4px}.tm-views button:last-child{border-radius:0 4px 4px 0}.tm-views button+button{margin-left:-1px}.tm-views button.on{background:var(--tm-mode-bg);color:var(--tm-mode-text);border-color:var(--tm-mode-bg)}.visual-roll{flex-direction:column;flex:1;min-height:0;display:flex}.visual-legend{color:var(--tm-text);flex-wrap:wrap;gap:4px 14px;padding:2px 10px 4px;font-family:system-ui,sans-serif;font-size:12px;display:flex}.visual-legend i{vertical-align:-1px;border-radius:2px;width:10px;height:10px;margin-right:4px;display:inline-block}.visual-legend .off{opacity:.4}.visual-canvas{flex:1;width:100%;min-height:0;display:block}