:root{--font-mono:ui-monospace, "Cascadia Mono", "Segoe UI Mono", Consolas, "Liberation Mono", monospace;--type-body:9pt;--type-heading:16pt;--type-weight:400;--layout-max:960px;--page:#f4f4f1;--surface:#f8f8f5;--surface-hover:#fff;--control-hi:#fff;--control-mid:#efefeb;--control-low:#dfe0dc;--text:#171817;--text-soft:#555955;--text-muted:#737773;--border:#a8aaa5;--grid-line:#a8aca83d;--scroll-thumb:#8e938e;--scroll-thumb-hover:#6e746e;--shadow:#282b281c;font-family:var(--font-mono);font-size:var(--type-body);font-weight:var(--type-weight);color:var(--text);background:var(--page);font-synthesis:none;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;line-height:1.3}:root[data-theme=dark]{--page:#090a0f;--surface:#0e0f15;--surface-hover:#15161e;--control-hi:#17181f;--control-mid:#13141a;--control-low:#101117;--text:#eeeef3;--text-soft:#b9b9c5;--text-muted:#9292a1;--border:#3d3e48;--grid-line:#bdbdd01c;--scroll-thumb:#4a4c59;--scroll-thumb-hover:#696c7b;--shadow:#00000070;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}html{scrollbar-gutter:stable}@supports not selector(::-webkit-scrollbar){html{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) var(--page)}}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--page)}::-webkit-scrollbar-corner{background:var(--page)}::-webkit-scrollbar-thumb{border:3px solid var(--page);background:var(--scroll-thumb);background-clip:padding-box;border-radius:999px;min-height:36px}::-webkit-scrollbar-thumb:hover{background:var(--scroll-thumb-hover);border:0;border-radius:0}::-webkit-scrollbar-button{-webkit-appearance:none;background:0 0;border:0;width:0;height:0;display:none}::-webkit-scrollbar-button:single-button{-webkit-appearance:none;background:0 0;border:0;width:0;height:0;display:none}::-webkit-scrollbar-button:vertical:decrement{-webkit-appearance:none;background:0 0;border:0;width:0;height:0;display:none}::-webkit-scrollbar-button:vertical:increment{-webkit-appearance:none;background:0 0;border:0;width:0;height:0;display:none}::-webkit-scrollbar-button:horizontal:decrement{-webkit-appearance:none;background:0 0;border:0;width:0;height:0;display:none}::-webkit-scrollbar-button:horizontal:increment{-webkit-appearance:none;background:0 0;border:0;width:0;height:0;display:none}*{box-sizing:border-box;font-family:inherit;font-size:inherit;font-weight:inherit}body{background:var(--page);min-width:320px;min-height:100vh;margin:0;transition:background .16s,color .16s}button,input{font:inherit}button{touch-action:manipulation}.round,.toolbar-actions button{appearance:none}main{place-items:center;min-height:100vh;padding:16px;display:grid;overflow:hidden}.sequencer-grid{--cell:max(16px, min(calc(var(--layout-max) / 10.5), calc((100vw - 32px) / 10.5), calc((100dvh - 32px) / 11)));grid-template-columns:calc(var(--cell) * 1.5) repeat(9, var(--cell));grid-template-rows:repeat(11, var(--cell));width:max-content;max-width:calc(100vw - 32px);display:grid;position:relative}.sequencer-grid>:not(.grid-guide){z-index:1;position:relative}.sequencer-grid:before,.sequencer-grid:after,.grid-guide:before,.grid-guide:after{content:"";z-index:0;background:var(--grid-line);pointer-events:none;position:absolute}.sequencer-grid:before,.grid-guide:before{width:1px;top:-100vh;bottom:-100vh}.sequencer-grid:after,.grid-guide:after{height:1px;left:-100vw;right:-100vw}.sequencer-grid:before{left:0}.sequencer-grid:after{top:0}.grid-guide{pointer-events:none;position:relative}.grid-guide:before,.grid-guide:after{display:none}.grid-guide:nth-child(-n+10):before{display:block;right:0}.grid-guide:nth-child(10n+1):after{display:block;bottom:0}.toolbar{width:100%;min-width:0;padding:0 calc(var(--cell) * .16);grid-area:1/1/auto/-1;grid-template-columns:max-content minmax(0,1fr) max-content minmax(0,1fr) max-content;align-items:center;display:grid}.midi-control,.toolbar-actions button{border:1px solid var(--border);background:var(--surface);min-width:36px;height:36px;color:var(--text);cursor:pointer;border-radius:7px}.midi-control{white-space:nowrap;grid-column:1;align-items:center;gap:9px;width:100%;min-width:0;max-width:max-content;padding:0 12px;display:flex;overflow:hidden}.midi-control span:last-child{text-overflow:ellipsis;overflow:hidden}.toolbar-actions{grid-column:3;gap:8px;display:flex}.toolbar-actions button{place-items:center;width:58px;padding:0 8px;display:grid}.toolbar-actions button:hover:not(:disabled),.midi-control:hover{border-color:var(--text-soft);background:var(--surface-hover)}.toolbar-actions button:disabled{opacity:.35;cursor:default}.toolbar-actions .theme-toggle.light{background:#fffbea;border-color:#d0bd62;box-shadow:0 0 8px #e5c94c55}.toolbar-actions .theme-toggle.dark{background:#1c1824;border-color:#66547f;box-shadow:0 0 9px #9b5de550,0 0 5px #e65ca433}.tempo-display{color:var(--text);text-align:center;flex-direction:column;grid-column:5;justify-content:center;justify-self:end;align-items:center;gap:1px;display:flex}.tempo-display strong{font-size:var(--type-heading);font-variant-numeric:tabular-nums;line-height:1}.tempo-display span{color:var(--text-muted);letter-spacing:.14em}.round{width:calc(var(--cell) * .72);height:calc(var(--cell) * .72);border:1px solid var(--border);background:radial-gradient(circle at 42% 34%, var(--control-hi) 0 18%, var(--control-mid) 68%, var(--control-low) 100%);box-shadow:0 2px 4px var(--shadow), inset 0 1px #ffffff40;color:var(--text);text-align:center;cursor:pointer;border-radius:50%;place-self:center;place-items:center;padding:0;display:grid}:root[data-theme=dark] .round:not(.green):not(.yellow):not(.red){background:linear-gradient(145deg, var(--control-hi), var(--control-low));box-shadow:0 1px 2px var(--shadow), inset 0 1px #ffffff0a}.round:active,.pad:active{transform:translateY(1px);box-shadow:inset 0 2px 3px #282b2820}.transport-icon{color:currentColor}.pad{width:calc(var(--cell) * .86);height:calc(var(--cell) * .86);border:1px solid var(--border);background:linear-gradient(145deg, var(--control-hi), var(--control-mid) 72%, var(--control-low));min-width:0;box-shadow:0 2px 4px var(--shadow), inset 0 1px #ffffff40;cursor:pointer;border-radius:8%;place-self:center;transition:border-color 70ms,background 70ms,box-shadow 70ms}:root[data-theme=dark] .pad:not(.green):not(.yellow):not(.red):not(.playhead){background:linear-gradient(145deg, var(--control-hi), var(--control-low));box-shadow:0 1px 2px var(--shadow), inset 0 1px #ffffff0a}.pad:hover{border-color:var(--text-soft)}.pad:disabled{cursor:default}.pad:disabled:hover{border-color:var(--border)}.pad.green{background:radial-gradient(circle,#c9f2c3,#81d876 68%,#63bd59);border-color:#43ad38;box-shadow:0 0 9px #43c63842,inset 0 1px #efffed}.pad.yellow{background:radial-gradient(circle,#fff4b5,#ead967 68%,#cfba3c);border-color:#c4a91b;box-shadow:0 0 9px #e4cc3345,inset 0 1px #fffbea}.pad.red{background:radial-gradient(circle,#ffc9c3,#ec8178 68%,#d65c52);border-color:#d34a40;box-shadow:0 0 9px #e34b4042,inset 0 1px #fff1ef}.pad.playhead{background:radial-gradient(circle,#fff4b5,#ead967 68%,#cfba3c);border-color:#c4a91b;box-shadow:0 0 9px #e4cc3345,inset 0 1px #fffbea}.round.red{color:#70221c;background:radial-gradient(circle,#ffc9c3,#ec8178 68%,#d65c52);border-color:#d34a40;box-shadow:0 0 8px #e34b403d}.round.green{color:#1d5f18;background:radial-gradient(circle,#c9f2c3,#81d876 68%,#63bd59);border-color:#43ad38;box-shadow:0 0 8px #43c6383d}.round.yellow{color:#675707;background:radial-gradient(circle,#fff4b5,#ead967 68%,#cfba3c);border-color:#c4a91b;box-shadow:0 0 8px #e4cc333d}.round:not(.static-indicator):hover:not(:disabled){border-color:var(--text-soft)}.round:disabled{border:1px dashed var(--border);box-shadow:none;color:var(--text-muted);cursor:default;background:0 0}.round:disabled:active{box-shadow:none;transform:none}.round.static-indicator{cursor:default;pointer-events:none;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:flex}.round.static-indicator:active{transform:none}.side span{color:currentColor}.track-label{width:100%;min-width:0;padding:0 calc(var(--cell) * .16);white-space:normal;overflow-wrap:anywhere;text-align:right;letter-spacing:.08em;color:var(--text-soft);justify-content:flex-end;place-self:stretch stretch;align-items:center;display:flex}.track-label.fx-current{color:var(--text);text-underline-offset:.24em;text-decoration:underline;text-decoration-thickness:1px}.step-number{padding-top:calc(var(--cell) * .08);color:var(--text-soft);place-self:start center}.status-dot{background:#8b8e89;border-radius:50%;flex:none;width:8px;height:8px;box-shadow:0 0 0 3px #67696618}.status-dot.online{background:#55df55;box-shadow:0 0 9px #55df55}.file-input{display:none}.status-line{min-width:0;padding:calc(var(--cell) * .42) calc(var(--cell) * .2) calc(var(--cell) * .04);color:var(--text-muted);text-align:center;overflow-wrap:anywhere;grid-area:11/1/auto/-1;justify-content:center;place-self:stretch stretch;align-items:center;gap:12px;display:flex}.project-status{color:var(--text)}.sequencer-grid>.toolbar,.expanded-view>.toolbar{grid-template-columns:calc(var(--cell) * 1.5) repeat(9, var(--cell));padding:0}.sequencer-grid>.toolbar .midi-control,.expanded-view>.toolbar .midi-control{margin-left:calc(var(--cell) * .09);grid-column:1/4}.sequencer-grid>.toolbar .toolbar-actions,.expanded-view>.toolbar .toolbar-actions{display:contents}.sequencer-grid>.toolbar .toolbar-actions button,.expanded-view>.toolbar .toolbar-actions button{width:calc(var(--cell) * .82);place-self:center;min-width:0;padding:0 3px;overflow:hidden}.toolbar .toolbar-actions button:first-of-type{grid-column:4}.toolbar .toolbar-actions button:nth-of-type(2){grid-column:5}.toolbar .toolbar-actions button:nth-of-type(3){grid-column:6}.toolbar .toolbar-actions button:nth-of-type(4){grid-column:7}.toolbar .toolbar-actions button:nth-of-type(5){grid-column:8}.toolbar .toolbar-actions button:nth-of-type(6){grid-column:9}.sequencer-grid>.toolbar .tempo-display,.expanded-view>.toolbar .tempo-display{grid-column:10;place-self:center}.expanded-main{padding:16px;display:block;overflow:visible}.expanded-view{--cell:max(16px, min(calc(var(--layout-max) / 10.5), calc((100vw - 32px) / 10.5), calc((100dvh - 32px) / 11)));--sheet-row:calc(var(--cell) * .5);width:calc(var(--cell) * 10.5);isolation:isolate;margin:0 auto;position:relative}.expanded-view:before{content:"";z-index:0;top:-100vh;bottom:-100vh;left:calc(var(--cell) * 1.5);background:repeating-linear-gradient(to right, var(--grid-line) 0 1px, transparent 1px var(--cell));pointer-events:none;position:absolute;right:0}.expanded-view:after{content:"";z-index:0;background:var(--grid-line);width:1px;box-shadow:calc(var(--cell) * 10.5) 0 0 var(--grid-line);pointer-events:none;position:absolute;top:-100vh;bottom:-100vh;left:0}.expanded-view>*{z-index:1;position:relative}.expanded-view>.toolbar{z-index:10;height:var(--cell);isolation:isolate;position:sticky;top:0}.expanded-view>.toolbar:before{content:"";z-index:-1;inset-block:0;background:linear-gradient(to bottom, var(--page) 0 calc(100% - 1px), var(--grid-line) calc(100% - 1px));pointer-events:none;position:absolute;left:calc(-50vw + 50%);right:calc(-50vw + 50%)}.expanded-view>.toolbar:after{content:"";z-index:11;background:var(--grid-line);width:1px;box-shadow:calc(var(--cell) * 1.5) 0 0 var(--grid-line), calc(var(--cell) * 2.5) 0 0 var(--grid-line), calc(var(--cell) * 3.5) 0 0 var(--grid-line), calc(var(--cell) * 4.5) 0 0 var(--grid-line), calc(var(--cell) * 5.5) 0 0 var(--grid-line), calc(var(--cell) * 6.5) 0 0 var(--grid-line), calc(var(--cell) * 7.5) 0 0 var(--grid-line), calc(var(--cell) * 8.5) 0 0 var(--grid-line), calc(var(--cell) * 9.5) 0 0 var(--grid-line), calc(var(--cell) * 10.5) 0 0 var(--grid-line);pointer-events:none;position:absolute;top:0;bottom:0;left:0}.expanded-view>.toolbar .midi-control,.expanded-view>.toolbar .toolbar-actions button,.expanded-view>.toolbar .tempo-display{z-index:12;position:relative}.expanded-content{gap:0;display:grid}.expanded-section,.sheet-group,.sheet-block{display:contents}.sheet-subheader{height:var(--cell);grid-template-columns:calc(var(--cell) * 1.5) repeat(9, var(--cell));top:calc(var(--cell) - 2px);z-index:20;isolation:isolate;pointer-events:none;align-items:center;display:grid;position:sticky}.sheet-subheader>*{grid-row:1}.sheet-subheader>.round{z-index:23;position:relative}.round.collapse-toggle{pointer-events:auto;justify-content:center;align-items:center;display:flex}.round.collapse-toggle[aria-expanded=false]{opacity:.48;box-shadow:none}.static-indicator-clear{width:calc(var(--cell) - 2px);height:calc(var(--cell) - 2px);background:var(--page);z-index:22;pointer-events:none;place-self:center;position:relative}.sheet-sticky-background{height:0;top:calc(var(--cell) - 2px);z-index:15;pointer-events:none;position:sticky}.sheet-sticky-background:before{content:"";height:var(--cell);background:linear-gradient(to bottom, var(--page) 0 calc(100% - 1px), var(--grid-line) calc(100% - 1px));position:absolute;top:0;left:calc(-50vw + 50%);right:calc(-50vw + 50%)}.sheet-sticky-background:after{content:"";width:1px;height:var(--cell);background:var(--grid-line);box-shadow:calc(var(--cell) * 1.5) 0 0 var(--grid-line), calc(var(--cell) * 2.5) 0 0 var(--grid-line), calc(var(--cell) * 3.5) 0 0 var(--grid-line), calc(var(--cell) * 4.5) 0 0 var(--grid-line), calc(var(--cell) * 5.5) 0 0 var(--grid-line), calc(var(--cell) * 6.5) 0 0 var(--grid-line), calc(var(--cell) * 7.5) 0 0 var(--grid-line), calc(var(--cell) * 8.5) 0 0 var(--grid-line), calc(var(--cell) * 9.5) 0 0 var(--grid-line), calc(var(--cell) * 10.5) 0 0 var(--grid-line);position:absolute;top:0;left:0}.sheet-play-overlay{grid-template-columns:calc(var(--cell) * 1.5) repeat(9, var(--cell));height:0;top:calc(var(--cell) - 2px);z-index:30;pointer-events:none;display:grid;position:sticky}.sheet-play-overlay>.round{margin-top:calc(var(--cell) * .14);pointer-events:auto;z-index:31;grid-column:9;justify-self:center}.sheet-grid{grid-template-columns:calc(var(--cell) * 1.5) repeat(9, var(--cell));grid-template-rows:repeat(8, var(--sheet-row));display:grid;position:relative}.sheet-grid:before{content:"";z-index:0;background:repeating-linear-gradient(to bottom, transparent 0 calc(var(--sheet-row) - 1px), var(--grid-line) calc(var(--sheet-row) - 1px) var(--sheet-row));pointer-events:none;position:absolute;inset:0 calc(-50vw + 50%)}.sheet-grid .track-label,.sheet-grid .pad,.sheet-grid .round{z-index:1;position:relative}.sheet-grid-row{display:contents}.track-label.sheet-row-label{height:var(--sheet-row);padding:0 calc(var(--cell) * .16)}.pad.sheet-pad{width:calc(var(--cell) * .86);height:calc(var(--cell) * .36)}.sheet-grid.active-grid:before{background-color:#5a605a0f}:root[data-theme=dark] .sheet-grid.active-grid:before{background-color:#d7dae60a}.round.sheet-tag{width:calc(var(--cell) * .72);height:calc(var(--cell) * .36);white-space:nowrap;justify-content:center;align-items:center;padding:0 2px;display:flex;overflow:hidden}@media (width<=580px){.midi-control{gap:5px;padding:0 6px}.midi-control span:last-child{max-width:20px}.toolbar-actions{gap:3px}.toolbar-actions button{width:36px;padding:0 3px}.midi-control,.toolbar-actions button{min-width:28px;height:30px}}