@font-face{font-family:Geist;src:url(/fonts/Geist-Variable.woff2)format("woff2");font-weight:100 900;font-style:normal;font-display:swap}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;accent-color:var(--ink-muted);--canvas:#161616;--panel:#1e1e1e;--raised:#292929;--line:#383838;--ink:#ededed;--ink-muted:#9b9b9b;--over:#ff4d4d;--hue-0:#f2b84b;--hue-1:#e8735a;--hue-2:#d65c8e;--hue-3:#9b6fe0;--hue-4:#5c8de8;--hue-5:#3fb7c9;--hue-6:#4cc38a;--hue-7:#b5d65c;--hue-8:#e39a5f;--hue-9:#c77dba;--hue-10:#6fa8dc;--hue-11:#7ed6c3;--font:"Geist", system-ui, sans-serif;--track-col-width:112px;--row-height:40px}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--canvas);color:var(--ink);font-family:var(--font);font-feature-settings:"tnum";-webkit-font-smoothing:antialiased;font-size:13px}#root{height:100%}button,input,select{font-feature-settings:inherit;color:inherit;font-family:inherit}button{background:var(--raised);border:1px solid var(--line);color:var(--ink);cursor:pointer;border-radius:2px;padding:4px 8px;font-size:13px}button:hover{border-color:var(--ink-muted)}button:disabled{opacity:.5;cursor:default}input,select{background:var(--raised);border:1px solid var(--line);color:var(--ink);border-radius:2px;padding:2px 6px}a{color:var(--ink)}input[type=range]{appearance:none;cursor:pointer;background:0 0;border:none;padding:0}input[type=range]::-webkit-slider-runnable-track{background:var(--raised);border:1px solid var(--line);border-radius:2px}input[type=range]::-moz-range-track{background:var(--raised);border:1px solid var(--line);border-radius:2px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--ink-muted);border:none;border-radius:2px}input[type=range]::-moz-range-thumb{background:var(--ink-muted);border:none;border-radius:2px}input[type=range]:hover::-webkit-slider-thumb{background:var(--ink)}input[type=range]:active::-webkit-slider-thumb{background:var(--ink)}input[type=range]:hover::-moz-range-thumb{background:var(--ink)}input[type=range]:active::-moz-range-thumb{background:var(--ink)}input[type=range]:not(.fader-vertical){height:12px}input[type=range]:not(.fader-vertical)::-webkit-slider-runnable-track{height:4px}input[type=range]:not(.fader-vertical)::-moz-range-track{height:4px}input[type=range]:not(.fader-vertical)::-webkit-slider-thumb{width:10px;height:12px;margin-top:-4px}input[type=range]:not(.fader-vertical)::-moz-range-thumb{width:10px;height:12px}select{appearance:none;background-color:var(--raised);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath d='M0 0L4 5L8 0Z' fill='%239B9B9B'/%3E%3C/svg%3E");background-position:right 7px center;background-repeat:no-repeat;padding-right:20px}select:hover,select:focus-visible{border-color:var(--ink-muted)}:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.tabular-nums{font-feature-settings:"tnum"}@media (prefers-reduced-motion:reduce){.beat-pulse{animation:none!important}}@keyframes beat-pulse{0%{opacity:1}to{opacity:.55}}.tabular-nums,input,select,[role=slider],[aria-valuenow],.meter-label,.knob-label,.compressor-meter-label,.piano-roll-toolbar,.clip-view-toolbar,.step-grid-pages,table{font-variant-numeric:tabular-nums}.knob{-webkit-user-select:none;user-select:none;touch-action:none;flex-direction:column;align-items:center;gap:2px;min-width:44px;max-width:68px;display:flex}.knob-dial{cursor:ns-resize;border-radius:50%}.knob-dial:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.knob-track{stroke:var(--raised);stroke-linecap:round}.knob-value,.knob-pointer{stroke-linecap:round}.knob.dragging .knob-dial{cursor:ns-resize}.knob-label{color:var(--ink-muted);text-align:center;min-height:14px;font-size:12px;line-height:1.15}.knob-value-readout{color:var(--ink)}.knob-group{background:var(--panel);border:1px solid var(--line);border-radius:2px;flex-direction:column;gap:4px;padding:6px 8px;display:flex}.knob-group-title{color:var(--ink-muted);font-size:12px}.knob-grid{flex-wrap:wrap;gap:10px;display:flex}.knob-grid-2col{grid-template-columns:repeat(2,1fr);gap:2px 6px;display:grid}.knob-column{flex:none;width:108px}.segmented{border:1px solid var(--line);border-radius:2px;flex-wrap:wrap;width:100%;display:flex;overflow:hidden}.segmented-option{background:var(--raised);border:none;border-right:1px solid var(--line);color:var(--ink-muted);border-radius:0;flex:auto;padding:2px 3px;font-size:10px}.segmented-option:last-child{border-right:none}.segmented-option.selected{color:var(--ink);border-bottom:2px solid var(--ink)}.segmented-option:hover{color:var(--ink)}.session-grid{flex-direction:row;flex:auto;align-items:flex-start;min-height:0;display:flex;overflow-y:auto}.grid-tracks-scroll{flex:auto;min-width:0;overflow-x:auto}.tracks-area{flex-direction:row;display:flex}.track-column{width:var(--track-col-width);flex:0 0 var(--track-col-width);border-right:1px solid var(--line);flex-direction:column;display:flex}.track-column.track-selected .track-header{outline:2px solid var(--ink);outline-offset:-2px}.track-header{height:var(--row-height);background:var(--panel);border-bottom:1px solid var(--line);cursor:pointer;align-items:center;gap:4px;padding:0 6px;display:flex;overflow:hidden}.track-colour-dot{border-radius:50%;flex:none;width:8px;height:8px}.track-name{text-overflow:ellipsis;white-space:nowrap;flex:auto;font-size:12px;overflow:hidden}.track-remove{color:var(--ink-muted);visibility:hidden;background:0 0;border:none;padding:0 2px;font-size:13px;line-height:1}.track-header:hover .track-remove{visibility:visible}.add-track-column{border-right:none;justify-content:flex-start;align-items:center}.add-track,.add-scene{border:1px dashed var(--line);color:var(--ink-muted);width:100%;height:var(--row-height);background:0 0}.slot{width:100%;height:var(--row-height);background:var(--raised);border-bottom:1px solid var(--line);cursor:pointer;border-radius:2px;justify-content:center;align-items:center;display:flex;position:relative}.slot.selected{outline:2px solid var(--ink);outline-offset:-2px}.slot.drag-over{outline:2px dashed var(--ink-muted);outline-offset:-2px}.slot-peaks{pointer-events:none;width:96px;height:32px}.slot-ring{pointer-events:none;position:absolute;top:50%;right:4px;transform:translateY(-50%)}.slot.playing .slot-ring circle{animation:.5s ease-in-out infinite alternate beat-pulse}.slot-hint{text-align:center;color:var(--ink-muted);background:var(--raised);pointer-events:none;justify-content:center;align-items:center;padding:2px;font-size:12px;line-height:1.1;display:none;position:absolute;inset:0}.slot.empty:hover .slot-hint,.slot.empty:focus-visible .slot-hint{display:flex}.slot-progress{background:var(--ink);opacity:.7;pointer-events:none;height:2px;position:absolute;bottom:0;left:0}.track-stop{background:var(--panel);border:none;border-bottom:1px solid var(--line);height:24px;color:var(--ink-muted);font-size:11px}.mixer-strip{background:var(--panel);flex-direction:column;align-items:center;gap:6px;padding:6px 4px;display:flex}.fader-pair{flex-direction:row;align-items:flex-end;gap:4px;height:96px;display:flex}.meter-track{background:var(--raised);border-radius:2px;align-items:flex-end;width:8px;height:96px;display:flex;overflow:hidden}.meter-fill{background:var(--ink);width:100%}.meter-fill.over{background:var(--over)}.fader-vertical{writing-mode:vertical-lr;direction:rtl;width:16px;height:96px}.fader-vertical::-webkit-slider-runnable-track{width:4px}.fader-vertical::-moz-range-track{width:4px}.fader-vertical::-webkit-slider-thumb{width:16px;height:10px;margin-left:-6px}.fader-vertical::-moz-range-thumb{width:16px;height:10px}.meter-label{color:var(--ink-muted);font-size:11px}.mixer-field{flex-direction:column;align-items:center;gap:2px;width:100%;display:flex}.mixer-field-label{color:var(--ink-muted);font-size:10px}.mixer-field input[type=range]{width:90%}.msa-row{gap:2px;display:flex}.msa-row button{width:20px;height:20px;padding:0;font-size:11px}.msa-row button.active{background:var(--ink);color:var(--canvas)}.arm-button.active{background:var(--over);color:var(--canvas)}.scene-rail{border-left:1px solid var(--line);flex-direction:column;flex:none;width:110px;display:flex}.scene-rail-header{height:var(--row-height);border-bottom:1px solid var(--line);background:var(--panel)}.scene-row{height:var(--row-height);border-bottom:1px solid var(--line);align-items:center;gap:4px;padding:0 6px;display:flex}.scene-name{text-overflow:ellipsis;white-space:nowrap;flex:auto;font-size:12px;overflow:hidden}.scene-launch,.scene-remove{color:var(--ink-muted);background:0 0;border:none;padding:0 2px}.browser-panel{border-right:1px solid var(--line);background:var(--panel);flex-direction:column;flex:0 0 160px;min-height:0;display:flex}.browser-panel.collapsed{flex:none}.panel-header{height:var(--row-height);border-bottom:1px solid var(--line);flex:none;align-items:center;gap:6px;padding:0 8px;display:flex}.collapse-toggle{color:var(--ink-muted);background:0 0;border:none;padding:0}.browser-body{flex-direction:column;flex:auto;gap:8px;min-height:0;padding:8px;display:flex}.browser-list{flex:auto;margin:0;padding:0;list-style:none;overflow-y:auto}.browser-item{cursor:grab;border-radius:2px;padding:4px 6px;font-size:12px}.browser-item:hover{background:var(--raised)}.browser-devices{border-top:1px solid var(--line);flex-direction:column;gap:4px;padding-top:8px;display:flex}.browser-devices-header{color:var(--ink-muted);font-size:11px}.drop-zone{border:1px dashed var(--line);color:var(--ink-muted);text-align:center;background:0 0;padding:16px 8px;font-size:12px}.add-track-menu-wrapper{width:100%;display:flex;position:relative}.add-track-menu-wrapper .add-track{flex:auto}.add-track-menu{top:var(--row-height);z-index:10;background:var(--raised);border:1px solid var(--line);flex-direction:column;min-width:130px;display:flex;position:absolute;left:0}.add-track-menu button{text-align:left;background:0 0;border:none;border-radius:0}.add-track-menu button:hover{background:var(--panel)}.device-panel{background:var(--panel);border-top:1px solid var(--line);flex:none;align-items:flex-start;gap:10px;min-height:32px;padding:6px 10px;display:flex}.device-panel.collapsed{min-height:0}.device-panel .collapse-toggle{color:var(--ink-muted);background:0 0;border:none;padding:0}.device-panel-empty{color:var(--ink-muted);font-size:12px}.device-panel-row{flex-wrap:wrap;align-items:flex-start;gap:10px;display:flex}.device-panel-track{font-size:13px}.device-panel-sep{color:var(--ink-muted)}.device-instance{border:1px solid var(--line);border-radius:2px;align-items:flex-start;gap:10px;padding:4px 8px;display:flex}.device-name{color:var(--ink-muted);padding-top:2px;font-size:12px}.param-control{align-items:center;gap:4px;display:flex}.param-name{color:var(--ink-muted);font-size:11px}.param-value-row{cursor:ns-resize;align-items:center;gap:4px;display:flex}.param-value{border:1px solid var(--line);background:var(--raised);border-radius:2px;width:52px;padding:1px 4px;font-size:12px}.param-formatted{display:none}.device-remove,.device-panel-row .add-device{border:1px solid var(--line);color:var(--ink-muted);background:0 0}.project-page{flex-direction:column;height:100%;display:flex}.transport-bar{height:var(--row-height);background:var(--panel);border-bottom:1px solid var(--line);flex:none;align-items:center;gap:10px;padding:0 10px;display:flex}.transport-play,.transport-stop{width:28px;height:28px;padding:0}.transport-position{min-width:5ch;font-size:32px;font-weight:600}.transport-tempo{width:64px}.transport-spacer{flex:auto}.people-list{color:var(--ink-muted);align-items:center;gap:8px;font-size:12px;display:flex}.people-label{color:var(--ink-muted)}.person{align-items:center;gap:4px;display:flex}.person-dot{border-radius:50%;width:6px;height:6px}.transport-menu{color:var(--ink-muted);background:0 0;border:none}.import-error{background:var(--panel);color:var(--over);border-bottom:1px solid var(--line);padding:6px 10px;font-size:12px}.project-body{flex-direction:row;flex:auto;min-height:0;display:flex}.grid-empty-wrapper,div.grid-empty{color:var(--ink-muted);flex-direction:column;flex:auto;justify-content:flex-start;align-items:flex-start;gap:10px;padding:10px 6px;display:flex}p.grid-empty{color:var(--ink-muted);margin:0}.project-list-page{max-width:640px;margin:0 auto;padding:32px 16px}.project-list-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.project-list{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.project-row{background:var(--panel);border:1px solid var(--line);border-radius:2px;justify-content:space-between;align-items:center;padding:4px 8px;display:flex}.project-open{text-align:left;background:0 0;border:none;flex:auto}.project-delete{color:var(--ink-muted);background:0 0;border:none}.confirm-delete{color:var(--over);align-items:center;gap:6px;font-size:12px;display:flex}.project-list-empty{color:var(--ink-muted)}.project-section{margin-top:24px}.project-section h2{color:var(--ink-muted);margin:0 0 8px;font-size:15px;font-weight:600}.project-role{color:var(--ink-muted);font-size:12px}.project-move{font-size:12px}.account-section{justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px;display:flex}.account-signed-in{color:var(--ink-muted);font-size:13px}.sign-in{background:var(--panel);border:1px solid var(--line);border-radius:2px;flex-direction:column;align-items:flex-start;gap:10px;width:100%;padding:16px;display:flex}.sign-in-form{flex-direction:column;gap:8px;width:100%;display:flex}.sign-in-copy{color:var(--ink-muted);margin:0}.sign-in-row{gap:8px;display:flex}.sign-in-row input{flex:auto}.sign-in-error{color:var(--over);margin:0;font-size:12px}.sign-in-sent{margin:0}.sign-in-github{align-self:flex-start}.share-overlay{z-index:100;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.share-panel{background:var(--panel);border:1px solid var(--line);border-radius:2px;min-width:360px;padding:20px}.share-panel h2{margin-top:0;font-size:15px}.share-create{align-items:flex-end;gap:10px;margin-bottom:12px;display:flex}.share-create label{color:var(--ink-muted);flex-direction:column;gap:4px;font-size:12px;display:flex}.share-error{color:var(--over);font-size:12px}.share-links{flex-direction:column;gap:4px;margin:0 0 12px;padding:0;list-style:none;display:flex}.share-link-row{background:var(--raised);border:1px solid var(--line);border-radius:2px;align-items:center;gap:8px;padding:4px 8px;display:flex}.share-link-role{text-transform:capitalize;min-width:5ch}.share-link-meta{color:var(--ink-muted);flex:auto;font-size:12px}.share-empty{color:var(--ink-muted)}.transport-share{font-size:12px}.share-accept-page{flex-direction:column;align-items:flex-start;gap:12px;max-width:420px;margin:80px auto 0;padding:0 16px;display:flex}.share-accept-copy{color:var(--ink-muted)}.shortcuts-overlay{z-index:100;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.shortcuts-panel{background:var(--panel);border:1px solid var(--line);border-radius:2px;min-width:280px;padding:20px}.shortcuts-panel dl{grid-template-columns:auto 1fr;gap:4px 12px;margin:12px 0;display:grid}.shortcuts-panel dt{font-size:12px;font-weight:600}.shortcuts-panel dd{color:var(--ink-muted);margin:0;font-size:12px}.transport-overflow{position:relative}.transport-overflow-menu{top:var(--row-height);z-index:100;background:var(--raised);border:1px solid var(--line);flex-direction:column;gap:6px;min-width:200px;padding:6px;display:flex;position:absolute;right:0}.transport-overflow-menu>button{text-align:left;background:0 0;border:none}.transport-overflow-menu>button:hover{background:var(--panel)}.transport-overflow-section{border-top:1px solid var(--line);flex-direction:column;gap:4px;padding-top:4px;display:flex}.transport-overflow-label{color:var(--ink-muted);font-size:11px}.transport-overflow-note{color:var(--ink-muted);margin:0;font-size:11px}.piano-roll-panel{background:var(--panel);border-top:1px solid var(--line);flex-direction:row;flex:none;height:260px;display:flex}.piano-roll-tabs{border-right:1px solid var(--line);flex-direction:column;flex:none;display:flex}.piano-roll-tabs button{color:var(--ink-muted);writing-mode:vertical-lr;text-orientation:mixed;background:0 0;border:none;border-radius:0;padding:8px 10px}.piano-roll-tabs button.active{background:var(--raised);color:var(--ink)}.piano-roll-panel-body{flex-direction:column;flex:auto;min-width:0;display:flex}.piano-roll{flex-direction:column;flex:auto;min-height:0;display:flex}.piano-roll-toolbar{border-bottom:1px solid var(--line);color:var(--ink-muted);flex:none;align-items:center;gap:10px;padding:4px 8px;font-size:12px;display:flex}.piano-roll-body{flex-direction:row;flex:auto;min-height:0;display:flex;overflow:hidden}.piano-roll-keys{flex:0 0 40px;position:relative;overflow:hidden}.piano-roll-key{background:var(--ink);border-bottom:1px solid var(--panel);position:relative}.piano-roll-key.black{background:var(--canvas);width:70%}.piano-roll-key.lit{box-shadow:inset 0 0 0 1px var(--ink)}.piano-roll-key-label{color:var(--ink-muted);font-size:8px;position:absolute;bottom:-1px;right:3px}.piano-roll-scroll{flex:auto;position:relative;overflow:auto}.piano-roll-loop-brace{z-index:2;height:8px;position:sticky;top:0}.loop-region{background:var(--ink-muted);opacity:.35;height:8px;position:absolute;top:0}.loop-handle{background:var(--ink);cursor:ew-resize;width:6px;height:8px;position:absolute;top:0;transform:translate(-3px)}.piano-roll-grid{background-color:var(--raised);background-image:linear-gradient(to bottom, var(--line) 1px, transparent 1px), linear-gradient(to right, var(--line) 1px, transparent 1px);cursor:crosshair;background-repeat:repeat;position:relative}.piano-roll-note{box-sizing:border-box;border-radius:2px;position:absolute}.piano-roll-note.selected{outline:2px solid var(--ink);outline-offset:-1px}.piano-roll-note.draft{opacity:.6;border:1px dashed var(--ink);pointer-events:none}.piano-roll-note.sounding{filter:brightness(1.5);box-shadow:0 0 0 1px var(--ink)}.piano-roll-note-resize{cursor:ew-resize;width:6px;position:absolute;top:0;bottom:0;right:0}.piano-roll-playhead{background:var(--ink);z-index:3;pointer-events:none;width:2px;position:absolute;top:0;bottom:0}.piano-roll-velocity{border-top:1px solid var(--line);background:var(--raised);flex:none;margin-left:40px;position:relative;overflow:hidden}.piano-roll-velocity-scroll{height:100%;position:relative}.velocity-bar{cursor:ns-resize;border-radius:1px 1px 0 0;position:absolute;bottom:0}.velocity-bar.selected{outline:1px solid var(--ink)}.eq-panel,.compressor-panel,.sampler-panel{align-items:center;gap:12px;display:flex}.eq-curve{background:var(--raised);border:1px solid var(--line);border-radius:2px}.eq-params,.sampler-params{flex-wrap:wrap;gap:8px;display:flex}.compressor-meter{border:1px solid var(--line);background:var(--raised);border-radius:2px;flex-direction:column;flex:none;justify-content:center;align-items:center;gap:4px;width:96px;height:60px;display:flex}.compressor-meter-label{color:var(--ink-muted);font-size:11px}.compressor-meter-status{color:var(--ink-muted);font-size:12px;font-style:italic}.compressor-params{flex-wrap:wrap;gap:8px;display:flex}.sampler-waveform{border:1px solid var(--line);border-radius:2px;flex:none;position:relative;overflow:hidden}.sampler-waveform-canvas{display:block}.sampler-waveform-empty{color:var(--ink-muted);pointer-events:none;justify-content:center;align-items:center;font-size:11px;display:flex;position:absolute;inset:0}.sampler-handle{background:var(--ink);cursor:ew-resize;width:2px;position:absolute;top:0;bottom:0;transform:translate(-1px)}.sampler-handle-loop{background:var(--ink-muted)}.knob-panel-row{align-items:flex-start;gap:6px;padding-bottom:4px;display:flex;overflow:auto hidden}.synth-presets{flex:none;position:relative}.synth-presets-menu{z-index:1;background:var(--panel);border:1px solid var(--line);border-radius:2px;flex-direction:column;min-width:80px;display:flex;position:absolute;top:100%;left:0}.synth-presets-menu button{text-align:left;background:0 0;border:none;border-radius:0}.synth-presets-menu button:hover{background:var(--raised)}.drums-panel{flex-direction:column;gap:4px;min-width:0;display:flex}.drums-panel-header{align-items:center;gap:8px;display:flex}.drums-kit-select{width:150px}.onscreen-keyboard{background:var(--panel);border-top:1px solid var(--line);align-items:center;gap:8px;padding:6px 10px;display:flex}.onscreen-keyboard-octaves{flex:none;align-items:center;gap:4px;display:flex}.osk-octave{width:22px;height:22px;padding:0}.osk-octave-label{color:var(--ink-muted);text-align:center;min-width:18px;font-size:11px}.onscreen-keyboard-keys{touch-action:none;-webkit-user-select:none;user-select:none;flex:none;height:56px;position:relative}.osk-key{border:1px solid var(--line);box-sizing:border-box;border-radius:0 0 2px 2px;position:absolute;top:0}.osk-key.white{background:var(--ink);z-index:1;height:56px}.osk-key.black{background:var(--canvas);z-index:2;width:18px;height:34px}.osk-key.white.active{background:var(--ink-muted)}.osk-key.black.active{background:var(--raised)}.drum-pads-wrapper{padding:6px 10px}.drum-pads{touch-action:none;-webkit-user-select:none;user-select:none;gap:4px;display:flex}.drum-pad{text-align:center;background:var(--ink);border:1px solid var(--line);box-sizing:border-box;border-radius:2px;justify-content:center;align-items:center;width:56px;height:44px;display:flex}.drum-pad.active{background:var(--ink-muted)}.drum-pad-label{color:var(--canvas);pointer-events:none;font-size:10px;line-height:1.1}.clip-view{flex-direction:column;flex:auto;min-height:0;display:flex}.clip-view-toolbar{border-bottom:1px solid var(--line);color:var(--ink-muted);flex:none;align-items:center;gap:14px;padding:4px 8px;font-size:12px;display:flex}.clip-view-empty{color:var(--ink-muted);padding:16px;font-size:13px}.clip-view-scroll{flex:auto;position:relative;overflow:auto}.clip-view-loop-brace{z-index:3;height:8px;position:sticky;top:0}.clip-view-marker-row{z-index:2;position:relative}.warp-marker-handle{cursor:ew-resize;border-radius:2px;width:10px;height:100%;position:absolute;top:0;transform:translate(-5px)}.warp-marker-handle.selected{outline:2px solid var(--ink);outline-offset:-1px}.clip-view-waveform{background-color:var(--raised);background-image:linear-gradient(to right, var(--line) 1px, transparent 1px), linear-gradient(to right, var(--line) 1.5px, transparent 1.5px);cursor:crosshair;background-repeat:repeat-x;position:relative}.clip-view-canvas{pointer-events:none;display:block}.warp-marker-line{opacity:.9;pointer-events:none;width:2px;position:absolute;top:0;bottom:0;transform:translate(-1px)}.warp-marker-line.selected{outline:2px solid var(--ink);outline-offset:-1px}.step-grid{flex-direction:column;flex:auto;min-height:0;display:flex;overflow:auto}.step-grid-pages{border-bottom:1px solid var(--line);flex:none;gap:2px;padding:4px 8px;display:flex}.step-grid-pages button{background:var(--raised);color:var(--ink-muted);border:none;padding:2px 8px;font-size:11px}.step-grid-pages button.active{background:var(--ink);color:var(--panel)}.step-grid-rows{grid-auto-rows:24px;align-items:stretch;gap:2px 1px;padding:8px;display:grid}.step-grid-label{color:var(--ink-muted);white-space:nowrap;text-overflow:ellipsis;align-items:center;padding-right:6px;font-size:11px;display:flex;overflow:hidden}.step-grid-cell{background:var(--raised);border:none;border-radius:2px;min-width:16px;padding:0;position:relative}.step-grid-cell.beat-start{margin-left:4px}.step-grid-cell.on{opacity:.75}.step-grid-cell.on.accent{opacity:1;box-shadow:0 0 0 1px var(--ink) inset}.step-grid-cell.playing{outline:2px solid var(--ink);outline-offset:-2px}.step-grid-cell.dot:after{content:"";background:var(--ink-muted);pointer-events:none;border-radius:50%;width:4px;height:4px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.step-grid-cell:focus-visible{outline:2px solid var(--ink);outline-offset:1px}