:root{--bg:#16161b;--panel:#1f1f26;--line:#2e2e38;--text:#e6e6ea;--muted:#9a9aa5;--accent:#734dcb;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;font:13px/1.4 system-ui,Malgun Gothic,sans-serif}body{min-width:1280px;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);flex-direction:column;display:flex}header{background:var(--panel);border-bottom:1px solid var(--line);padding:8px 20px}.bar{flex-wrap:wrap;align-items:center;gap:6px 10px;min-height:32px;display:flex}.sep{background:var(--line);width:1px;height:22px;margin:0 8px}.group{white-space:nowrap;align-items:center;gap:4px;display:inline-flex}.cat{flex-wrap:wrap;align-items:center;gap:6px 10px;display:inline-flex}.cat-title{white-space:nowrap;font-weight:700}.practice-only.off{opacity:.4;pointer-events:none}.button-only[hidden],.piano-only[hidden]{display:none}#time{white-space:nowrap}.group[hidden],.bar[hidden]{display:none}.transport,.transport .cat{flex-wrap:nowrap}.transport #seek{flex:50%;width:auto;min-width:120px;max-width:50%}.spacer{flex:1}.about{color:var(--muted);align-items:center;gap:6px;font-size:12px;text-decoration:none;display:inline-flex}.about:hover{color:var(--text)}#play{min-width:56px;font-size:15px}#settingsBtn{padding:1px 8px;font-size:15px}.menu-anchor{position:relative}.menu{z-index:10;background:var(--panel);border:1px solid var(--line);border-radius:8px;flex-direction:column;gap:14px;padding:12px 14px;display:flex;position:absolute;top:calc(100% + 4px);right:0;box-shadow:0 6px 20px #00000080}.menu[hidden]{display:none}.menu-group{flex-direction:column;align-items:flex-start;gap:6px;display:flex}.menu>*+*{border-top:1px solid var(--line);padding-top:14px}.menu-foot button{width:100%}.range-note{text-align:center;min-width:2.6em}.dual-range{width:200px;height:18px;display:inline-block;position:relative}.dual-track,.dual-fill{border-radius:2px;height:4px;position:absolute;top:7px}.dual-track{background:#3a3a46;left:0;right:0}.dual-fill{background:var(--accent)}.dual-range input{pointer-events:none;appearance:none;background:0 0;width:100%;margin:0;position:absolute;inset:0}.dual-range input::-webkit-slider-runnable-track{background:0 0}.dual-range input::-webkit-slider-thumb{pointer-events:auto;-webkit-appearance:none;border:2px solid var(--accent);cursor:pointer;background:#e6e6ea;border-radius:50%;width:14px;height:14px}.muted{color:var(--muted)}.mono{font-variant-numeric:tabular-nums;white-space:nowrap}label{cursor:pointer;white-space:nowrap;align-items:center;gap:4px;display:inline-flex}button,.btn,select{color:var(--text);font:inherit;cursor:pointer;background:#2a2a33;border:1px solid #3a3a46;border-radius:6px;padding:3px 10px}button:hover,.btn:hover{background:#34343f}button.primary{background:var(--accent);border-color:var(--accent);min-width:40px}button.active{outline:2px solid #ffd54f}#rate,#rowGap,#hitWindow,#latency{width:90px}#metronome{width:70px}.swing-track{border-left:2px solid var(--muted);border-right:2px solid var(--muted);width:200px;height:14px;margin:0 5px;display:inline-block;position:relative}.swing-track:before{content:"";background:#2a2a33;height:2px;position:absolute;top:6px;left:0;right:0}.swing-tick{background:var(--muted);width:1px;margin-left:-.5px;position:absolute}.swing-tick.mid{height:10px;top:2px}.swing-tick.short{height:6px;top:4px}.swing-dot,.swing-mark{border-radius:50%;width:9px;height:9px;margin-left:-4.5px;position:absolute;top:2.5px}.swing-dot{opacity:.75;background:#fff}.swing-mark{background:#1e88e5;animation:1.2s ease-out forwards swing-fade}@keyframes swing-fade{0%{opacity:.6}to{opacity:0}}#midiIn,#defaultVoice{max-width:200px}main{flex:1;min-height:400px;max-height:max(80vw,1024px);position:relative}#parts{border:1px solid var(--line);background:#1f1f26d9;border-radius:8px;flex-direction:column;gap:4px;padding:6px 8px;font-size:12px;display:flex;position:absolute;overflow:hidden}.track-head,.track-row{grid-template-columns:minmax(0,1fr) 110px 48px 80px 24px 24px 24px;align-items:center;gap:4px;display:grid}.head-icon{display:inline-flex}.head-treble,.head-bass{font-weight:700}.head-treble{color:#a486ea}.head-bass{color:#3eccc2}.track-row input[data-column=tracks]{accent-color:#8963e3}.track-row input[data-column=bassTracks]{accent-color:#2da9a1}.track-head{color:var(--muted)}.track-head>:not(:first-child),.track-row>input{justify-self:center;margin:0}.track-row select{width:100%;min-width:0;padding:1px 4px}.track-row input[type=range]{width:100%;margin:0}.track-row input[type=checkbox]{touch-action:none}.track-rows{flex-direction:column;flex:1;gap:2px;min-height:0;display:flex;overflow-y:auto}.track-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.track-name small{color:var(--muted)}.song-bar{border-bottom:1px solid var(--line);align-items:center;gap:8px;padding-bottom:4px;display:flex}#songName{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:13px;font-weight:700;overflow:hidden}.song-bar button{padding:1px 8px;font-size:12px}#parts.empty>:not(.drop-zone),#parts:not(.empty)>.drop-zone{display:none}.drop-zone{border:2px dashed var(--line);border-radius:8px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:10px;display:flex}.drop-zone:hover,body.dragging .drop-zone{border-color:var(--accent)}.drop-zone .btn{padding:8px 20px;font-size:15px}#openSample{margin-top:6px;font-size:12px}#stageBox{position:absolute;inset:0}canvas{width:100%;height:100%;display:block}#error{color:#fff;cursor:pointer;z-index:10;background:#7f1d1d;border-radius:6px;max-width:60%;padding:6px 10px;font-size:12px;position:fixed;bottom:12px;left:12px}#error[hidden]{display:none}body.dragging main{outline:3px dashed var(--accent);outline-offset:-8px}