.jam-panels{display:flex;flex-direction:column;gap:10px;min-width:0}.jam-panel{min-width:0;overflow:hidden;border-radius:12px;background:var(--ph-bg);box-shadow:0 1px 2px rgba(0,0,0,.18)}.jam-panel[data-skin=jt90]{--ph-bg:#141414;--ph-accent:#f87171;--ph-glow:rgba(239,68,68,0.55);--ph-text:#fafafa;--ph-dim:#8f8f8f;--ph-rule:#2a2a2a;--ph-font:"Space Grotesk",system-ui,sans-serif;--ph-mono:"JetBrains Mono",ui-monospace,monospace}.jam-panel[data-skin=jt30]{--ph-bg:#141414;--ph-accent:#fbbf24;--ph-glow:rgba(245,158,11,0.55);--ph-text:#fafafa;--ph-dim:#8f8f8f;--ph-rule:#2a2a2a;--ph-font:"Space Grotesk",system-ui,sans-serif;--ph-mono:"JetBrains Mono",ui-monospace,monospace}.jam-panel[data-skin=jt10]{--ph-bg:#2a2a2a;--ph-accent:#6aa8f0;--ph-glow:rgba(74,144,217,0.55);--ph-text:#f0f0f0;--ph-dim:#9a9a9a;--ph-rule:#444;--ph-font:"Space Grotesk",system-ui,sans-serif;--ph-mono:"JetBrains Mono",ui-monospace,monospace}.jam-panel[data-skin=jb202]{--ph-bg:#162130;--ph-accent:#6ff1c3;--ph-glow:rgba(79,209,163,0.55);--ph-text:#e8e8e8;--ph-dim:#88aa99;--ph-rule:#24404a;--ph-font:"SF Mono","Monaco","Inconsolata","Roboto Mono",monospace;--ph-mono:var(--ph-font)}.jam-panel[data-skin=jb01]{--ph-bg:#2a2018;--ph-accent:#ffb840;--ph-glow:rgba(240,160,48,0.55);--ph-text:#f5e8d8;--ph-dim:#a89880;--ph-rule:#3d3025;--ph-font:"SF Mono","Monaco","Inconsolata","Roboto Mono",monospace;--ph-mono:var(--ph-font)}.jam-panel[data-skin=fx]{--ph-bg:#1b1d27;--ph-accent:#8aeaff;--ph-glow:rgba(94,224,255,0.5);--ph-text:#e8e8ec;--ph-dim:#8d93a8;--ph-rule:#2b3044;--ph-font:"SF Mono","Monaco","Inconsolata","Roboto Mono",monospace;--ph-mono:var(--ph-font)}.jam-panel-head{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:0 14px 0 16px;border:0;background:var(--ph-bg);color:var(--ph-text);font-family:var(--ph-font);text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}.jam-panel-head:active{background:color-mix(in srgb,var(--ph-bg) 88%,#fff)}.jam-panel-bar{display:flex;align-items:stretch;background:var(--ph-bg)}.jam-panel-bar .jam-panel-head{flex:1;min-width:0}.jam-panel-bar .jb-ms{display:inline-flex;align-items:center;gap:4px;padding:0 12px 0 0}.jam-panel.is-open .jam-panel-bar{border-bottom:1px solid var(--ph-rule)}.jam-panels .jb-ms--panel .jb-ms-key{background:rgba(255,255,255,.07);color:var(--ph-dim);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}.jam-panels .jb-ms--panel .jb-ms-key.m.on{background:#ff5a1f;color:#fff;box-shadow:0 0 10px rgba(255,90,31,.6)}.jam-panels .jb-ms--panel .jb-ms-key.s.on{background:#19b27a;color:#fff;box-shadow:0 0 10px rgba(25,178,122,.6)}.jam-panel.is-silenced .jam-panel-name,.jam-panel.is-silenced .jam-panel-sum{opacity:.45}.jam-panel.is-silenced .jam-panel-led{opacity:.35;box-shadow:none}.jam-panel-led{flex:none;width:8px;height:8px;border-radius:50%;background:var(--ph-accent);box-shadow:0 0 6px var(--ph-glow),0 0 14px var(--ph-glow);transition:transform .18s ease-out,box-shadow .18s ease-out,filter .18s ease-out}.jam-panel-led.hit{transform:scale(1.6);filter:brightness(1.8);box-shadow:0 0 4px #fff,0 0 12px var(--ph-glow),0 0 26px var(--ph-glow);transition-duration:.03s}.jam-panels .voice-panel-led{transition:transform .18s ease-out,box-shadow .18s ease-out,filter .18s ease-out}.jam-panels .voice-panel-led.hit{transform:scale(1.6);filter:brightness(1.9);box-shadow:0 0 4px #fff,0 0 12px currentColor;transition-duration:.03s}.jam-panels .jam-voice-led{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:7px;vertical-align:middle;background:#3a3a3a;box-shadow:inset 0 1px 1px #000;transition:transform .18s ease-out,box-shadow .18s ease-out,background .18s ease-out}.jam-panels .jam-voice-led.hit{background:#ff5a1f;box-shadow:0 0 4px #fff,0 0 12px #ff5a1f;transform:scale(1.5);transition-duration:.03s}.jam-panel-name{flex:none;font-size:15px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ph-accent);white-space:nowrap}.jam-panel-name small{margin-left:8px;font-size:11px;font-weight:500;letter-spacing:.04em;text-transform:none;color:var(--ph-dim)}.jam-panel-sum{flex:1;min-width:0;text-align:right;font-family:var(--ph-mono);font-size:11px;color:var(--ph-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.jam-panel-chev{flex:none;width:8px;height:8px;margin:-4px 2px 0;border-right:1.5px solid var(--ph-dim);border-bottom:1.5px solid var(--ph-dim);transform:rotate(45deg);transition:transform .15s,margin .15s}.jam-panel.is-open .jam-panel-chev{margin:4px 2px 0;transform:rotate(-135deg)}.jam-panel-body{min-width:0}.jam-panels .control,.jam-panels .knob-group,.jam-panels .knob-wrapper{position:relative}.jam-knob-float{position:absolute;left:50%;top:-32px;transform:translateX(-50%);padding:3px 9px;border-radius:6px;background:#14161a;color:#ff4f1f;font-family:JetBrains Mono,ui-monospace,monospace;font-size:14px;font-weight:600;letter-spacing:.02em;white-space:nowrap;pointer-events:none;z-index:5;box-shadow:0 2px 8px rgba(0,0,0,.55),0 0 0 1px rgba(255,79,31,.5)}.jam-panels .jam-dragging .knob-value{color:#ff4f1f;font-size:12px;font-weight:600}.jam-panels .jam-dragging .knob,.jam-panels .jam-dragging .slider{outline:2px solid #ff4f1f;outline-offset:2px}.jam-panels .skin-fx,.jam-panels .skin-jb01,.jam-panels .skin-jb202,.jam-panels .skin-jt10,.jam-panels .skin-jt30,.jam-panels .skin-jt90{padding:0;max-width:100%;border-radius:0;background-image:none}.jam-panels .skin-fx .fx-panel,.jam-panels .skin-jb01 .drum-machine,.jam-panels .skin-jb202 .synth-panel,.jam-panels .skin-jt10 .synth-container,.jam-panels .skin-jt30 .panel,.jam-panels .skin-jt90 .panel{width:auto;max-width:none;margin:0;padding:12px;border:0;border-radius:0;box-shadow:none}.jam-panels .skin-jb01 .voices-section,.jam-panels .skin-jb202 .controls-grid,.jam-panels .skin-jt30 .controls,.jam-panels .skin-jt90 .voice-controls{margin-bottom:0}.jam-panels .skin-fx .knob-group,.jam-panels .skin-jb01 .knob-group,.jam-panels .skin-jb202 .knob-group,.jam-panels .skin-jt10 .control,.jam-panels .skin-jt30 .knob-wrapper,.jam-panels .skin-jt90 .knob-wrapper{min-width:0;max-width:100%}.jam-panels .knob-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.jam-panels .skin-jt10 .knob-value{color:var(--text-secondary)}.jam-panels .skin-jb01 .voice-channel.jam-master .voice-name{background:var(--accent-dim);color:#1a1512}.jam-panels:not(.jam-panels--narrow) .skin-jt10 .control-panel{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.jam-panels:not(.jam-panels--narrow) .skin-jb202 .controls-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.jam-panels:not(.jam-panels--narrow) .skin-jb202 .filter-section{grid-column:auto}.jam-panels:not(.jam-panels--narrow) .skin-fx .knob-row,.jam-panels:not(.jam-panels--narrow) .skin-jb202 .knob-row{flex-wrap:wrap;align-items:flex-end}.jam-panels:not(.jam-panels--narrow) .skin-jb01 .voices-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}.jam-panels:not(.jam-panels--narrow) .skin-jb01 .knob{width:44px;height:44px}.jam-panels:not(.jam-panels--narrow) .skin-jb01 .knob:after{top:6px;height:12px;width:3px}.jam-panels:not(.jam-panels--narrow) .skin-jb01 .knob-group label{font-size:10px}.jam-panels:not(.jam-panels--narrow) .skin-jb01 .knob-value{font-size:10.5px}.jam-panels:not(.jam-panels--narrow) .skin-jb202 .knob{width:44px;height:44px}.jam-panels:not(.jam-panels--narrow) .skin-jb202 .knob:after{top:6px;width:3px;height:11px}.jam-panels:not(.jam-panels--narrow) .skin-jb202 .knob.knob-large{width:52px;height:52px}.jam-panels:not(.jam-panels--narrow) .skin-jb202 .knob.knob-large:after{top:7px;height:13px}.jam-panels:not(.jam-panels--narrow) .skin-jb202 .knob.knob-small{width:40px;height:40px}.jam-panels:not(.jam-panels--narrow) .skin-jb202 .knob.knob-small:after{top:5px;width:3px;height:10px}.jam-panels:not(.jam-panels--narrow) .skin-jb202 .knob-group label{font-size:10px}.jam-panels:not(.jam-panels--narrow) .skin-jb202 .knob-value{font-size:10.5px}.jam-panels:not(.jam-panels--narrow) .skin-fx .knob{width:44px;height:44px}.jam-panels:not(.jam-panels--narrow) .skin-fx .knob.knob-large{width:52px;height:52px}.jam-panels:not(.jam-panels--narrow) .skin-fx .knob-group label{font-size:10px}.jam-panels:not(.jam-panels--narrow) .skin-fx .knob-value{font-size:10.5px}.jam-panels:not(.jam-panels--narrow) .skin-jt90 .voice-controls{padding:12px}.jam-panels:not(.jam-panels--narrow) .skin-jt90 .params-grid{gap:10px}.jam-panels:not(.jam-panels--narrow) .skin-jt90 .voice-panel{min-width:150px;flex:1 1 150px;padding:10px}.jam-panels:not(.jam-panels--narrow) .skin-jt90 .knob-wrapper .knob{width:44px;height:44px}.jam-panels:not(.jam-panels--narrow) .skin-jt90 .knob-wrapper .knob:before{width:3px;height:13px}.jam-panels:not(.jam-panels--narrow) .skin-jt90 .knob-label,.jam-panels:not(.jam-panels--narrow) .skin-jt90 .knob-value{font-size:10px}.jam-panels:not(.jam-panels--narrow) .skin-jt30 .controls,.jam-panels:not(.jam-panels--narrow) .skin-jt30 .knob-group{flex-wrap:wrap;justify-content:center}.jam-panels:not(.jam-panels--narrow) .skin-jt10 .control label,.jam-panels:not(.jam-panels--narrow) .skin-jt10 .knob-value,.jam-panels:not(.jam-panels--narrow) .skin-jt30 .knob-label,.jam-panels:not(.jam-panels--narrow) .skin-jt30 .knob-value{font-size:10px}.jam-panels:not(.jam-panels--narrow) .skin-jt10 .knob.small{width:40px;height:40px}.jam-panels:not(.jam-panels--narrow) .skin-jt10 .knob.small:before{height:12px}.jam-panels:not(.jam-panels--narrow) .skin-jt10 .slider{width:40px;height:100px}.jam-panels:not(.jam-panels--narrow) .skin-jt10 .slider:before{width:32px;height:16px;bottom:calc(var(--value, 50%) - 8px)}.jam-panels--narrow .skin-fx .knob-row,.jam-panels--narrow .skin-jb202 .knob-row,.jam-panels--narrow .skin-jt10 .controls-row,.jam-panels--narrow .skin-jt30 .knob-group{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:14px 0}.jam-panels--narrow .skin-fx .knob-row>*,.jam-panels--narrow .skin-jb202 .knob-row>*,.jam-panels--narrow .skin-jt10 .controls-row>*,.jam-panels--narrow .skin-jt30 .knob-group>*{flex:0 0 25%;max-width:25%;min-width:0}.jam-panels--narrow .skin-jb202 .controls-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.jam-panels--narrow .skin-jb202 .env-section,.jam-panels--narrow .skin-jb202 .filter-section,.jam-panels--narrow .skin-jb202 .output-section{grid-column:1/-1}.jam-panels--narrow .skin-jb202 .control-section{padding:12px 6px}.jam-panels--narrow .skin-jb202 .control-section h3{font-size:11px;margin-bottom:12px}.jam-panels--narrow .skin-jb202 .osc-section .knob-row>*{flex-basis:33.333%;max-width:33.333%}.jam-panels--narrow .skin-jb202 .wave-toggle{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:0 2px 12px}.jam-panels--narrow .skin-jb202 .wave-btn{padding:0;min-height:32px;font-size:10px}.jam-panels--narrow .skin-jb202 .knob{width:44px;height:44px}.jam-panels--narrow .skin-jb202 .knob:after{top:6px;width:3px;height:11px}.jam-panels--narrow .skin-jb202 .knob.knob-large{width:56px;height:56px}.jam-panels--narrow .skin-jb202 .knob.knob-large:after{top:7px;height:14px}.jam-panels--narrow .skin-jb202 .knob.knob-small{width:40px;height:40px}.jam-panels--narrow .skin-jb202 .knob.knob-small:after{top:5px;width:3px;height:10px}.jam-panels--narrow .skin-jb202 .knob-group{gap:5px}.jam-panels--narrow .skin-jb202 .knob-group label{font-size:10px}.jam-panels--narrow .skin-jb202 .knob-value{font-size:11px;min-width:0}.jam-panels--narrow .skin-jt30 .controls{display:flex;flex-direction:column;align-items:stretch;gap:14px;padding:12px 6px 14px}.jam-panels--narrow .skin-jt30 .controls-divider{display:none}.jam-panels--narrow .skin-jt30 .waveform-toggle{display:grid;grid-template-columns:repeat(2,80px);gap:4px;width:max-content;margin:0 auto}.jam-panels--narrow .skin-jt30 .wave-btn{width:auto;height:36px;font-size:11px;font-weight:600;letter-spacing:.1em}.jam-panels--narrow .skin-jt30 .knob{width:48px;height:48px}.jam-panels--narrow .skin-jt30 .knob-wrapper{gap:5px}.jam-panels--narrow .skin-jt30 .knob-label{font-size:10px}.jam-panels--narrow .skin-jt30 .knob-value{font-size:11px}.jam-panels--narrow .skin-jt10 .control-panel{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:dense}.jam-panels--narrow .skin-jt10 .env-section,.jam-panels--narrow .skin-jt10 .filter-section,.jam-panels--narrow .skin-jt10 .lfo-section,.jam-panels--narrow .skin-jt10 .vco-section{grid-column:1/-1}.jam-panels--narrow .skin-jt10 .section{padding:12px 6px 14px;gap:12px}.jam-panels--narrow .skin-jt10 .section h3{font-size:11px;margin:0;text-align:center}.jam-panels--narrow .skin-jt10 .control{gap:5px}.jam-panels--narrow .skin-jt10 .control label{font-size:10px;color:var(--text-secondary)}.jam-panels--narrow .skin-jt10 .knob-value{font-size:11px}.jam-panels--narrow .skin-jt10 .knob.small{width:40px;height:40px}.jam-panels--narrow .skin-jt10 .knob.small:before{height:12px}.jam-panels--narrow .skin-jt10 .slider{width:44px;height:120px}.jam-panels--narrow .skin-jt10 .slider:before{width:36px;height:16px;bottom:calc(var(--value, 50%) - 8px)}.jam-panels--narrow .skin-jt10 .sub-section .controls-row>*,.jam-panels--narrow .skin-jt10 .volume-section .controls-row>*{flex-basis:100%;max-width:100%}.jam-panels--narrow .skin-jt10 .sub-mode-switch{align-items:center;gap:6px}.jam-panels--narrow .skin-jt10 .mode-label{font-size:10px}.jam-panels--narrow .skin-jt10 .mode-buttons{gap:4px}.jam-panels--narrow .skin-jt10 .mode-btn{min-width:40px;min-height:32px;padding:0 8px;font-size:11px}.jam-panels--narrow .skin-jt10 .lfo-section{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:14px 0}.jam-panels--narrow .skin-jt10 .lfo-section h3{flex:0 0 100%}.jam-panels--narrow .skin-jt10 .lfo-section .controls-row,.jam-panels--narrow .skin-jt10 .lfo-section .lfo-destinations{display:contents}.jam-panels--narrow .skin-jt10 .lfo-section .control{flex:0 0 25%;max-width:25%}.jam-panels--narrow .skin-jt10 .lfo-section .lfo-waveform{flex:0 0 100%;order:1;display:flex;justify-content:center;flex-wrap:wrap;gap:4px}.jam-panels--narrow .skin-jt10 .wave-btn{min-height:32px;padding:0 10px;font-size:11px}.jam-panels--narrow .skin-jt90 .voice-controls{padding:0;background:none;border:0}.jam-panels--narrow .skin-jt90 .params-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.jam-panels--narrow .skin-jt90 .voice-panel{min-width:0;padding:10px 6px 12px}.jam-panels--narrow .skin-jt90 .voice-panel-header{margin:0 4px 10px;padding-bottom:8px}.jam-panels--narrow .skin-jt90 .voice-panel-name{font-size:11px}.jam-panels--narrow .skin-jt90 .knobs-container{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:12px 0}.jam-panels--narrow .skin-jt90 .knobs-container>*{flex:0 0 33.333%;max-width:33.333%}.jam-panels--narrow .skin-jt90 .knob-wrapper{gap:5px}.jam-panels--narrow .skin-jt90 .knob-wrapper .knob{width:44px;height:44px}.jam-panels--narrow .skin-jt90 .knob-wrapper .knob:before{width:3px;height:13px}.jam-panels--narrow .skin-jt90 .knob-label{font-size:10px}.jam-panels--narrow .skin-jt90 .knob-value{font-size:10.5px}.jam-panels--narrow .skin-jt90 .voice-panel.jam-master{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:8px 14px 8px 10px}.jam-panels--narrow .skin-jt90 .voice-panel.jam-master .voice-panel-header{margin:0;padding:0;border:0}.jam-panels--narrow .skin-jt90 .voice-panel.jam-master .knobs-container{display:flex}.jam-panels--narrow .skin-jt90 .voice-panel.jam-master .knob-wrapper{flex:0 0 auto;max-width:none;flex-direction:row;align-items:center;gap:10px}.jam-panels--narrow .skin-jb01 .voices-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.jam-panels--narrow .skin-jb01 .voice-channel{padding:10px 6px 12px}.jam-panels--narrow .skin-jb01 .voice-header{margin:0 4px 10px;padding-bottom:8px}.jam-panels--narrow .skin-jb01 .voice-name{font-size:11px;padding:3px 8px}.jam-panels--narrow .skin-jb01 .voice-knobs{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:12px 0}.jam-panels--narrow .skin-jb01 .voice-knobs>*{flex:0 0 33.333%;max-width:33.333%}.jam-panels--narrow .skin-jb01 .knob-group{gap:5px}.jam-panels--narrow .skin-jb01 .knob{width:44px;height:44px}.jam-panels--narrow .skin-jb01 .knob:after{top:6px;width:3px;height:12px}.jam-panels--narrow .skin-jb01 .knob-group label{font-size:10px}.jam-panels--narrow .skin-jb01 .knob-value{font-size:10.5px;min-width:0}.jam-panels--narrow .skin-jb01 .voice-channel.jam-master{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:8px 14px 8px 10px}.jam-panels--narrow .skin-jb01 .voice-channel.jam-master .voice-header{margin:0;padding:0;border:0}.jam-panels--narrow .skin-jb01 .voice-channel.jam-master .voice-knobs{display:flex}.jam-panels--narrow .skin-jb01 .voice-channel.jam-master .knob-group{flex:0 0 auto;max-width:none;flex-direction:row;align-items:center;gap:10px}.jam-panels--narrow .skin-fx .control-section{padding:12px 6px 14px}.jam-panels--narrow .skin-fx .wave-toggle{gap:4px}.jam-panels--narrow .skin-fx .wave-btn{min-height:32px;padding:0 10px;font-size:10px}.jam-panels--narrow .skin-fx .fx-choice--many .wave-toggle{width:100%}.jam-panels--narrow .skin-fx .fx-choice--many .wave-btn{flex:0 0 calc((100% - 8px) / 3);padding:0 4px;overflow:hidden;text-overflow:ellipsis}.jam-panels--narrow .skin-fx .fx-choice-label{font-size:10px}.jam-panels--narrow .skin-fx .knob{width:44px;height:44px}.jam-panels--narrow .skin-fx .knob:after{top:6px;height:11px}.jam-panels--narrow .skin-fx .knob.knob-large{width:56px;height:56px}.jam-panels--narrow .skin-fx .knob.knob-large:after{top:7px;height:14px}.jam-panels--narrow .skin-fx .knob-group{gap:5px;min-width:0}.jam-panels--narrow .skin-fx .knob-group label{font-size:10px}.jam-panels--narrow .skin-fx .knob-value{font-size:11px;min-width:0}.jb .seq-pick{position:relative}.jb .seq-pick select{-webkit-appearance:none;appearance:none;width:100%;height:44px;padding:0 40px 0 14px;border:0;border-radius:11px;background:var(--panel-4);color:var(--ink);font-family:var(--font-panel-stack);font-weight:600;font-size:15px;letter-spacing:.1em;text-transform:uppercase;box-shadow:0 2px 0 var(--rule),inset 0 1px 0 #fff;cursor:pointer}.jb .seq-pick select:active{transform:translateY(1px);box-shadow:0 1px 0 var(--rule),inset 0 1px 0 #fff}.jb .seq-pick:after{content:"▾";position:absolute;right:14px;top:50%;transform:translateY(-52%);font-size:15px;color:var(--ink-2);pointer-events:none}.jb .seq-head{display:flex;align-items:center;gap:10px;margin:18px 0 8px}.jb .seq-head .rule{flex:1;height:1px;background:var(--rule)}.jb .seq-led-key .jb-led{margin-right:2px}.jb .seq-pills{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 0 4px}.jb .seq-pills::-webkit-scrollbar{display:none}.jb .seq-pill{flex:none;min-width:58px;height:46px;padding:0 10px;border:0;border-radius:10px;background:var(--panel-4);color:var(--ink);box-shadow:0 2px 0 var(--rule),inset 0 1px 0 #fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;transition:transform .05s,box-shadow .05s}.jb .seq-pill:active{transform:translateY(2px);box-shadow:0 0 0 var(--rule),inset 0 1px 0 #fff}.jb .seq-pill .n{font-family:var(--font-panel-stack);font-weight:600;font-size:17px;line-height:1}.jb .seq-pill .b{font-family:var(--font-mono-stack);font-size:10px;line-height:1;color:var(--ink-3);letter-spacing:.02em}.jb .seq-pill.on{background:var(--ink);color:var(--panel-2);box-shadow:0 2px 0 #000,inset 0 1px 0 rgba(255,255,255,.12)}.jb .seq-pill.on .b{color:var(--led-off)}.jb .seq-pill.silent .n{opacity:.45}.jb .seq-pill{position:relative}.jb .seq-pill .led{position:absolute;top:6px;right:6px;width:6px;height:6px;border-radius:50%;background:var(--led-off);box-shadow:inset 0 1px 1px rgba(0,0,0,.25);transition:transform .18s ease-out,box-shadow .18s ease-out,background .18s ease-out}.jb .seq-pill.playing .led{background:var(--orange);box-shadow:0 0 6px var(--orange)}.jb .seq-pill.playing.beat .led{transform:scale(1.6);box-shadow:0 0 4px #fff,0 0 12px var(--orange);transition-duration:.03s}.jb .seq-caption{margin-top:6px;min-height:16px}.jb .seq-ov{display:flex;gap:8px;margin:14px 0 6px}.jb .seq-ov-bar{flex:1;display:flex;gap:3px;min-width:0}.jb .seq-ov-page{position:relative;flex:1;display:flex;gap:2px;min-width:0;padding:8px 2px;border:0;background:none;cursor:pointer}.jb .seq-ov-page.on:before{content:"";position:absolute;inset:4px 0;border-radius:3px;box-shadow:inset 0 0 0 1.5px var(--ink)}.jb .seq-ov-cell{flex:1;height:4px;border-radius:1px;background:var(--led-off);opacity:.6;min-width:0}.jb .seq-ov-cell.hit{background:var(--orange);opacity:1}.jb .seq-ov-cell.now{box-shadow:0 0 0 1.5px var(--ink);opacity:1}.jb .seq-nav{display:flex;align-items:center;gap:10px;margin:6px 0 10px}.jb .seq-nav .jb-key{width:56px;height:44px;padding:0;font-size:22px;letter-spacing:0;flex:none}.jb .seq-nav-readout{flex:1;text-align:center;font-family:var(--font-mono-stack);font-size:12px;letter-spacing:.06em;color:var(--ink-2)}.jb .seq-nav-readout b{font-weight:500;color:var(--ink)}.jb .seq-grid{display:grid;grid-template-columns:52px repeat(8,minmax(0,1fr));gap:4px;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.jb .seq-grid.wide{grid-template-columns:52px repeat(16,minmax(0,1fr))}.jb .seq-grid.off{opacity:.35;pointer-events:none}.jb .seq-colhead{height:18px;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono-stack);font-size:11px;color:var(--ink-3);letter-spacing:.02em}.jb .seq-colhead.now{color:var(--orange);font-weight:500}.jb .seq-lbl{display:flex;align-items:center;padding-left:2px;min-width:0;overflow:hidden;font-family:var(--font-panel-stack);font-weight:600;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap}.jb .seq-lbl.muted{color:var(--ink-3);opacity:.55}.jb .seq-pad{--inner:inset 0 1px 2px rgba(0,0,0,0.16);--ring:0 0 0 0 transparent;position:relative;height:38px;padding:0;border:0;border-radius:6px;min-width:0;background:var(--panel-3);color:var(--ink);box-shadow:var(--inner),var(--ring);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .06s,box-shadow .06s}.jb .seq-pad:active{transform:translateY(1px)}.jb .seq-pad.beat{background:color-mix(in srgb,var(--panel-3) 86%,var(--ink))}.jb .seq-pad.hit{background:var(--orange);--inner:inset 0 1px 0 rgba(255,255,255,0.35),0 1px 0 rgba(0,0,0,0.18)}.jb .seq-pad.acc{--inner:inset 0 0 0 2px var(--ink),inset 0 1px 0 rgba(255,255,255,0.35)}.jb .seq-pad.acc:after{content:"";position:absolute;top:5px;right:5px;width:5px;height:5px;border-radius:50%;background:var(--ink)}.jb .seq-pad.now{--ring:0 0 0 1.5px var(--ink)}.jb .seq-pad.sel{--ring:0 0 0 2px var(--cobalt)}.jb .seq-pad.sel.now{--ring:0 0 0 2px var(--cobalt),0 0 0 3.5px var(--panel-4)}.jb .seq-pad--note{height:48px}.jb .seq-pad--note .note{font-family:var(--font-mono-stack);font-size:12px;font-weight:500;letter-spacing:0;line-height:1;display:block;transform:translateY(-2px)}.jb .seq-pad--note .slide{position:absolute;top:3px;left:5px;font-family:var(--font-mono-stack);font-size:11px;line-height:1;color:var(--ink)}.jb .seq-pad--note .pitch{position:absolute;left:4px;bottom:4px;height:2px;border-radius:1px;background:var(--ink);min-width:2px}.jb .seq-editor{margin-top:12px;padding:12px 12px 14px}.jb .seq-editor-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.jb .seq-editor-head .keys{display:flex;gap:6px}.jb .seq-editor-head .keys .jb-key{width:48px;height:40px;padding:0;font-size:20px;letter-spacing:0}.jb .seq-note-row{display:flex;align-items:baseline;gap:12px;margin-top:6px}.jb .seq-note{font-family:var(--font-panel-stack);font-weight:700;font-size:34px;line-height:1;letter-spacing:.02em;color:var(--ink);min-width:64px}.jb .seq-note.off{color:var(--ink-3)}.jb .seq-keys{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:12px}.jb .seq-keys--3{grid-template-columns:repeat(3,minmax(0,1fr))}.jb .seq-keys .jb-key{height:44px;padding:0 4px;font-size:13px;letter-spacing:.08em;min-width:0}.jb .seq-foot{display:flex;align-items:center;gap:8px;margin-top:16px}.jb .seq-foot .spacer{flex:1}.jb .seq-foot .jb-key--xs{min-width:36px}.jb .seq-foot .armed{color:var(--orange);box-shadow:inset 0 0 0 1.5px var(--orange)}.jb .seq-empty{padding:14px 12px}.jb .seq-hint{margin-top:4px}