*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#eeecea;--bg2:#e3e1dc;--bg3:#d0cec6;--card:#fafaf7;--brd:#cac6bc;--brd2:#aaa69c;--tx:#1c1a17;--tx2:#555250;--tx3:#88847e;--blue:#2563eb;--bluel:#dbeafe;--bluedk:#1e3a8a;--green:#059669;--greenl:#d1fae5;--amber:#d97706;--amberl:#fef3c7;--amberdk:#92400e;--red:#dc2626;--redl:#fee2e2;--reddk:#7f1d1d;--purple:#7c3aed;--purplel:#ede9fe;--purpledk:#4c1d95;--r:6px;--rl:10px;--ff:"JetBrains Mono",monospace}body{font-family:var(--ff);font-size:11px;line-height:1.5;background:var(--bg);color:var(--tx);min-height:100vh}.app{display:flex;height:100vh;overflow:hidden}.col-l{flex:1;min-width:0;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:10px}.col-r{width:282px;flex-shrink:0;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:10px;background:var(--bg2);border-left:.5px solid var(--brd)}@media (max-width:820px){.app{flex-direction:column;height:auto;overflow:auto}.col-r{width:100%;border-left:none;border-top:.5px solid var(--brd)}}.card{background:var(--card);border:.5px solid var(--brd);border-radius:var(--rl);padding:11px 13px;box-shadow:0 1px 3px #00000010}.ct{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3);margin-bottom:9px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}.badge{font-size:8px;padding:1px 7px;border-radius:10px;border:.5px solid transparent;white-space:nowrap}.badge.sampled{background:var(--bluel);color:var(--bluedk);border-color:var(--blue)}.badge.synth{background:var(--greenl);color:#065f46;border-color:var(--green)}.badge.drums{background:var(--purplel);color:var(--purpledk);border-color:var(--purple)}.badge.loading{background:var(--amberl);color:var(--amberdk);border-color:var(--amber);animation:pulse 1s ease-in-out infinite}.badge.ok{background:var(--greenl);color:#065f46;border-color:var(--green)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.bgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:10px}@media (min-width:560px){.bgrid{grid-template-columns:repeat(8,1fr)}}.bs{padding:7px 4px;border-radius:var(--r);border:.5px solid var(--brd);background:var(--bg2);cursor:pointer;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1px;min-height:56px;justify-content:center;position:relative;user-select:none;transition:border-color .1s,transform .1s}.bs:hover{border-color:var(--brd2);transform:translateY(-1px)}.bs.sel{background:var(--bluel);border-color:var(--blue)}.bs.sel.dsel{background:var(--purplel);border-color:var(--purple)}.bs.play{outline:2px solid var(--green);outline-offset:-2px}.bs-n{position:absolute;top:3px;left:5px;font-size:7px;color:var(--tx3)}.bs-ic{font-size:13px;line-height:1}.bs-nm{font-size:9px;font-weight:700;color:var(--tx);line-height:1.2}.bs.sel .bs-nm{color:var(--bluedk)}.bs.sel.dsel .bs-nm{color:var(--purpledk)}.bs-ct{font-size:7px;color:var(--tx3)}.bs-ty{font-size:6px;padding:0 3px;border-radius:4px;margin-top:1px}.bs-ty.sampled{background:var(--bluel);color:var(--bluedk)}.bs-ty.synth{background:var(--greenl);color:#065f46}.bs-ty.drums{background:var(--purplel);color:var(--purpledk)}.picker{padding:10px 12px;border-radius:var(--r);background:var(--bg);border:.5px solid var(--brd)}.pk-info{font-size:10px;color:var(--tx2);margin-bottom:8px}.pk-form{display:flex;align-items:center;gap:6px;flex-wrap:wrap}select.pksel{font-size:10px;font-family:var(--ff);padding:5px 7px;border-radius:var(--r);border:.5px solid var(--brd);background:var(--card);color:var(--tx);flex:1;min-width:120px}.pk-btn{padding:5px 12px;border-radius:var(--r);border:.5px solid var(--blue);background:var(--bluel);color:var(--bluedk);font-size:10px;font-family:var(--ff);cursor:pointer;font-weight:700;transition:all .15s}.pk-btn:hover{background:var(--blue);color:#fff}.pk-btn:disabled{opacity:.4;cursor:default}.sb{display:flex;align-items:center;gap:8px}.led{width:9px;height:9px;border-radius:50%;background:var(--brd);flex-shrink:0;transition:all .25s}.led.ok{background:var(--green);box-shadow:0 0 0 2px #05966932}.led.err{background:var(--red);box-shadow:0 0 0 2px #dc262632}.led.warn{background:var(--amber)}.sb-inf{flex:1;min-width:0}.sb-main{font-size:11px;color:var(--tx2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sb-dev{font-size:9px;color:var(--tx3);margin-top:1px}.act{padding:5px 11px;border-radius:var(--r);border:.5px solid var(--blue);background:var(--bluel);color:var(--bluedk);font-size:10px;font-family:var(--ff);cursor:pointer;font-weight:700;transition:all .15s}.act:hover{background:var(--blue);color:#fff}.act.on{background:var(--greenl);border-color:var(--green);color:#064e3b;cursor:default}.selrow{display:flex;align-items:center;gap:5px;margin-top:8px;flex-wrap:wrap}.lbl{font-size:9px;color:var(--tx3);letter-spacing:.07em;text-transform:uppercase}select.sc{font-size:10px;font-family:var(--ff);padding:3px 5px;border-radius:var(--r);border:.5px solid var(--brd);background:var(--bg);color:var(--tx)}.latrow{display:flex;align-items:center;gap:8px;margin-top:8px;padding-top:8px;border-top:.5px solid var(--brd)}.latlbl{font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:.06em}.latval{font-size:11px;font-weight:700;color:var(--green)}.mrow{display:flex;align-items:center;gap:8px;margin-bottom:10px}.mbpm{width:62px;font-size:26px;font-weight:700;font-family:var(--ff);border:none;border-bottom:.5px solid var(--brd);background:transparent;color:var(--tx);outline:none;text-align:center}.mbpm:focus{border-bottom-color:var(--blue)}.bpml{font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:.07em}.mbtn{flex:1;padding:8px;border-radius:var(--r);border:.5px solid var(--brd);background:var(--bg2);font-size:12px;cursor:pointer;color:var(--tx);font-family:var(--ff);font-weight:700}.mbtn.run{background:var(--greenl);border-color:var(--green);color:#065f46}.tapbtn{padding:8px 10px;border-radius:var(--r);border:.5px solid var(--brd);background:var(--bg2);font-size:10px;cursor:pointer;color:var(--tx2);font-family:var(--ff)}.tapbtn:active{background:var(--bg3)}.bdots{display:flex;gap:7px;justify-content:center;margin:10px 0}.bdot{width:12px;height:12px;border-radius:50%;background:var(--brd);border:.5px solid var(--brd2)}.bdot.on{background:var(--blue);border-color:var(--blue);box-shadow:0 0 8px #2563eb60}.bdot.accent.on{background:var(--amber);border-color:var(--amber);box-shadow:0 0 8px #d9770660}.mrow2{display:flex;align-items:center;gap:6px;margin-bottom:7px}.mrow2 label{font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:.06em;flex-shrink:0}.mrow2 input[type=range]{flex:1;cursor:pointer;accent-color:var(--blue)}.mrow2 .vv{font-size:10px;color:var(--tx3);min-width:26px;text-align:right}.crow{display:flex;align-items:center;gap:8px;margin-bottom:8px}.crow:last-child{margin-bottom:0}.clbl{font-size:9px;color:var(--tx3);min-width:52px;flex-shrink:0;letter-spacing:.06em;text-transform:uppercase}.nc{display:flex;align-items:center;gap:4px}.nb{width:20px;height:20px;border-radius:50%;border:.5px solid var(--brd);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--tx);font-family:var(--ff)}.nb:hover{background:var(--bg2)}.nv{font-size:13px;font-weight:700;min-width:28px;text-align:center;font-family:var(--ff)}.nv.hi{color:var(--amber)}input[type=range]{accent-color:var(--blue)}.vv{font-size:10px;color:var(--tx3);min-width:30px;text-align:right;font-family:var(--ff)}.mutbtn{padding:4px 9px;border-radius:var(--r);border:.5px solid var(--brd);background:transparent;font-size:10px;font-family:var(--ff);cursor:pointer;color:var(--tx)}.mutbtn.on{background:var(--redl);border-color:var(--red);color:var(--reddk)}.mg{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;margin-bottom:8px}.mb{padding:5px 2px;border-radius:var(--r);border:.5px solid var(--brd);background:var(--bg);cursor:pointer;text-align:center;min-height:36px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.mb-n{font-size:10px;font-weight:700;color:var(--tx3);font-family:var(--ff)}.mb-s{font-size:7px;color:var(--tx3);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}.mb.has{border-color:var(--brd2)}.mb.has .mb-n{color:var(--tx2)}.mb.cur{background:var(--bluel);border-color:var(--blue)}.mb.cur .mb-n{color:var(--bluedk)}.mact{display:flex;gap:5px;margin-bottom:10px}.mact button{flex:1;padding:6px 3px;border-radius:var(--r);border:.5px solid var(--brd);background:transparent;font-size:10px;font-family:var(--ff);cursor:pointer;color:var(--tx)}.mact .svb{background:var(--bluel);border-color:var(--blue);color:var(--bluedk)}.mhelp{padding:9px 11px;border-radius:var(--r);background:var(--bg);border:.5px solid var(--brd)}.mstep{display:flex;align-items:flex-start;gap:8px;font-size:9px;color:var(--tx3);line-height:1.6;margin-bottom:3px}.mstepn{width:16px;height:16px;border-radius:50%;background:var(--bluel);color:var(--bluedk);font-size:8px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}.mon{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mi{display:flex;flex-direction:column;gap:3px}.mi-l{font-size:9px;color:var(--tx3);text-transform:uppercase;letter-spacing:.07em}.mi-bar{height:5px;background:var(--bg);border-radius:3px;position:relative;overflow:hidden;border:.5px solid var(--brd)}.mi-f{height:100%;border-radius:3px;position:absolute;top:0;left:0}.mi-f.b{background:var(--blue)}.mi-f.g{background:var(--green)}.mi-f.a{background:var(--amber)}.mi-mark{position:absolute;left:50%;top:0;width:1px;height:100%;background:var(--brd2);z-index:1}.mi-v{font-size:9px;color:var(--tx3);font-family:var(--ff)}.mi.susr{flex-direction:row;align-items:center;gap:6px}.susdot{width:10px;height:10px;border-radius:50%;background:var(--bg);border:.5px solid var(--brd2);flex-shrink:0}.susdot.on{background:var(--green);border-color:var(--green)}.ihd{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;flex-wrap:wrap;gap:5px}.ititle{font-size:12px;font-weight:700;color:var(--tx);font-family:var(--ff)}.imeta{display:flex;align-items:center;gap:6px}.fsbtn{padding:4px 9px;border-radius:var(--r);border:.5px solid var(--brd);background:var(--bg2);font-size:10px;font-family:var(--ff);cursor:pointer;color:var(--tx2)}.fsbtn:hover{border-color:var(--brd2);background:var(--bg3)}.pw{overflow-x:auto;padding-bottom:3px}.pno{position:relative;height:110px;display:flex;user-select:none}.wk{position:relative;width:34px;height:108px;border:.5px solid var(--brd);background:var(--card);border-radius:0 0 5px 5px;cursor:pointer;flex-shrink:0}.wk:hover{background:var(--bg2)}.wk.pr{background:#93c5fd!important;border-color:var(--blue)!important}.kl{position:absolute;bottom:7px;left:50%;transform:translate(-50%);font-size:8px;color:var(--tx3);pointer-events:none;font-family:var(--ff);font-weight:700;text-align:center;line-height:1.3}.phint{margin-top:7px;font-size:9px;color:var(--tx3)}.dgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:2px 0}@media (max-width:480px){.dgrid{grid-template-columns:repeat(3,1fr)}}.dp{padding:16px 4px;border-radius:var(--r);border:none;cursor:pointer;text-align:center;color:#fff;font-family:var(--ff);font-weight:700;user-select:none;touch-action:none;transition:filter .05s,transform .06s}.dp-n{display:block;font-size:11px;font-weight:700;letter-spacing:.04em}.dp-k{display:block;font-size:9px;opacity:.6;margin-top:4px}.dp.hit{filter:brightness(1.4);transform:scale(.93)}.ntd{display:flex;flex-wrap:wrap;gap:5px;min-height:26px;align-items:center}.nt{display:flex;align-items:center;gap:5px;padding:3px 8px;border-radius:var(--r);border:.5px solid var(--brd);background:var(--bg)}.nt.sus{border-color:var(--amber);background:var(--amberl)}.nt-n{font-size:11px;font-weight:700;font-family:var(--ff)}.nt.sus .nt-n{color:var(--amberdk)}.nt-v{width:24px;height:3px;background:var(--bg3);border-radius:2px;overflow:hidden}.nt-vb{height:100%;background:var(--blue);border-radius:2px}.nt.sus .nt-vb{background:var(--amber)}.nt-ph{font-size:11px;color:var(--tx3);font-family:var(--ff)}.fsmod{display:none;position:fixed;inset:0;background:#141210;z-index:300;flex-direction:column}.fsmod.open{display:flex}.fstb{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-bottom:.5px solid #2a2724;flex-shrink:0}.fst{color:#d4d2cc;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-family:var(--ff)}.fscl{padding:7px 16px;border-radius:var(--r);border:.5px solid #555;background:transparent;color:#bbb;cursor:pointer;font-size:11px;font-family:var(--ff)}.fscl:hover{background:#2a2724;color:#fff}.fsbd{flex:1;overflow:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px}.pnolg{position:relative;height:200px;display:flex;user-select:none;flex-shrink:0}.wklg{position:relative;width:48px;height:198px;border:.5px solid #555;background:#f0ede8;border-radius:0 0 6px 6px;cursor:pointer;flex-shrink:0}.wklg:hover{background:#e0ddd8}.wklg.pr{background:#93c5fd!important;border-color:#3b82f6!important}.kllg{position:absolute;bottom:10px;left:50%;transform:translate(-50%);font-size:10px;color:#999;pointer-events:none;font-family:var(--ff);font-weight:700;text-align:center;line-height:1.3}.fshint{margin-top:24px;font-size:10px;color:#666;font-family:var(--ff);text-align:center}.dglg{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;max-width:900px;width:100%}.dplg{padding:28px 8px;border-radius:10px;border:none;cursor:pointer;text-align:center;color:#fff;font-family:var(--ff);font-weight:700;user-select:none;touch-action:none;transition:filter .05s,transform .07s}.dplg-n{display:block;font-size:14px;font-weight:800;letter-spacing:.06em}.dplg-k{display:block;font-size:11px;opacity:.55;margin-top:6px}.dplg.hit{filter:brightness(1.4);transform:scale(.92)}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%) translateY(6px);padding:7px 16px;border-radius:var(--r);background:#1c1a17;color:#e8e6e2;font-size:11px;font-family:var(--ff);opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;z-index:999;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}