.pattern-controls{min-width:0;font:10px var(--mono,monospace);margin:8px 0}.pattern-controls button{color:#ccc;min-height:34px;font:inherit;cursor:pointer;background:#303030;border:1px solid #111;border-color:#555 #111 #111 #555;padding:6px 9px}.pattern-toolbar{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.pattern-inline-navigation{flex-shrink:0;align-items:center;gap:3px;display:flex}.pattern-inline-navigation [data-pattern-action=previous],.pattern-inline-navigation [data-pattern-action=next]{padding:3px 7px;font-size:18px;line-height:1}.pattern-inline-navigation .pattern-page-trigger{min-width:67px}.pattern-controls .pattern-trigger{text-align:left;background:#202020;flex:150px;justify-content:space-between;align-items:center;gap:8px;min-width:0;display:flex}.pattern-trigger:after{content:"›";font-size:18px;line-height:1}.pattern-controls button[aria-pressed=true]{color:#111;background:#d5d5d5;border-color:#eee #666 #666 #eee}.pattern-controls button:disabled{opacity:.35;cursor:default}.pattern-controls button:focus-visible{outline-offset:2px;outline:2px solid #fff}.pattern-dialog{box-sizing:border-box;color:#ddd;width:min(480px,100vw - 24px);max-height:calc(100dvh - 32px);font:11px var(--mono,monospace);background:#181818;border:2px solid #555;border-color:#aaa #555 #555 #aaa;margin:auto;padding:16px;overflow:auto;box-shadow:7px 7px #0009}.pattern-dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0009}.pattern-fluid-mirror{z-index:2;opacity:0;mix-blend-mode:difference;pointer-events:none;position:absolute;inset:0 auto auto 0}.pattern-dialog-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.pattern-dialog-header h2{font:600 13px var(--mono,monospace);margin:0}.pattern-dialog-header button{width:34px;font-size:18px}.pattern-settings{gap:12px;display:grid}.pattern-setting{flex-wrap:wrap;align-items:center;gap:5px;display:flex}.pattern-setting>span{color:#aaa;width:100%}.pattern-setting button{flex:1 1 0}.pattern-navigation{background:#1d252b;border:1px solid #596671;min-width:0;margin-top:6px;padding:8px}.pattern-settings[hidden],.pattern-navigation[hidden]{display:none}.pattern-page-label{color:#aaa;margin:0 0 8px}.pattern-pages{overscroll-behavior:contain;scrollbar-width:thin;grid-template-columns:repeat(auto-fit,minmax(38px,1fr));align-content:start;gap:5px;min-width:0;max-height:min(35dvh,280px);padding:3px 3px 5px;display:grid;position:relative;overflow:auto}.pattern-pages button{min-width:0;padding:6px 3px}.pattern-pages button[data-playing=true]{box-shadow:inset 0 -3px #fff}.pattern-pages button[aria-pressed=true][data-playing=true]{box-shadow:inset 0 -3px #222}.pattern-dialog-actions{grid-template-columns:minmax(0,1fr);gap:6px;margin-top:16px;display:grid}@media (width<=600px){.pattern-inline-navigation{width:100%}.pattern-inline-navigation .pattern-page-trigger{flex:1}.pattern-controls .pattern-trigger{min-height:34px;padding:7px 8px;font-size:9px}.pattern-dialog{padding:12px}.pattern-dialog button{min-height:40px;padding:6px}.pattern-dialog-actions{gap:5px}}.vocal-instrument{min-width:0}.vocal-instrument .vocal-sample-picker{gap:8px;margin:0 14px 12px;display:grid}.vocal-instrument .vocal-banks{flex-wrap:wrap;justify-content:flex-start;min-width:0}.vocal-instrument .vocal-sounds{grid-template-columns:repeat(8,minmax(0,1fr));display:grid}.vocal-instrument .vocal-sounds button{white-space:normal;min-width:0}.vocal-instrument button[aria-pressed=true]{color:#19222a;background:#d9e1e8;border-color:#f0f5f9}.vocal-instrument .vocal-waveform{background:#141b21;border:1px solid #626e79;height:116px;margin:0 14px;position:relative}.vocal-waveform svg{width:100%;height:100%;position:absolute;inset:0}.vocal-waveform path{fill:#a2b4c3}.vocal-waveform .vocal-trim-shade{fill:#111a23;opacity:.78}.vocal-waveform .vocal-trim-line{stroke:#f4f7fa;stroke-width:2px;vector-effect:non-scaling-stroke}.vocal-instrument .vocal-trim{pointer-events:none;height:44px;position:absolute;left:0;right:0}.vocal-instrument .vocal-trim-start{top:0}.vocal-instrument .vocal-trim-end{bottom:0}.vocal-trim>span{color:#e1e8ee;background:#15212add;padding:3px;font-size:9px;position:absolute;left:6px}.vocal-trim-end>span{bottom:0;left:auto;right:6px}.vocal-instrument .vocal-trim input{appearance:none;pointer-events:none;background:0 0;width:100%;height:100%;margin:0;position:absolute;inset:0}.vocal-trim input::-webkit-slider-thumb{-webkit-appearance:none;cursor:ew-resize;pointer-events:auto;touch-action:none;background:#6f8395b8;border:2px solid #f1f5f8;border-radius:0;width:20px;height:38px}.vocal-trim input::-moz-range-thumb{cursor:ew-resize;pointer-events:auto;touch-action:none;background:#6f8395b8;border:2px solid #f1f5f8;border-radius:0;width:16px;height:34px}.vocal-trim input:focus-visible{outline-offset:2px;outline:2px solid #e4edf5}.vocal-instrument .vocal-waveform-info{color:#b9c6d0;flex-wrap:wrap;align-items:center;gap:10px;margin:8px 14px;font-size:10px;display:flex}.vocal-waveform-info #vocal-loop{margin-left:auto}.vocal-instrument .vocal-status-row{align-items:center;gap:8px;margin:0 14px 10px;display:flex}.vocal-instrument .vocal-status-row:has(.vocal-status:empty){display:none}.vocal-instrument .vocal-status{font-size:10px;line-height:1.6}.vocal-instrument #vocal-host-capability{border:1px solid #8798a7;margin:0 14px 10px;padding:8px}.vocal-instrument .vocal-controls{grid-template-columns:repeat(8,minmax(0,1fr))}.vocal-instrument>.instrument-pattern-controls{margin:8px 14px 12px}.vocal-instrument .vocal-roll-tools{flex-wrap:wrap;align-items:center;gap:8px;margin:0 14px 8px;font-size:10px;display:flex}.vocal-instrument .vocal-octaves,.vocal-instrument .vocal-note-actions{align-items:center;gap:4px;display:flex}.vocal-instrument .vocal-note-actions{flex-wrap:wrap;margin-left:auto}.vocal-instrument .vocal-roll-tools button{min-height:32px;padding:6px 8px;font-size:10px}.vocal-instrument .vocal-roll{border:1px solid #657583;height:340px;margin:0 14px;position:relative}.vocal-roll canvas{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:crosshair;width:100%;height:100%;display:block}.vocal-roll .matrix-access{inset:24px 8px 8px 36px}@media (width<=650px){.vocal-instrument .vocal-banks{grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.vocal-instrument .vocal-controls,.vocal-instrument .vocal-sounds{grid-template-columns:repeat(4,minmax(0,1fr))}.vocal-instrument .vocal-sample-picker,.vocal-instrument .vocal-waveform,.vocal-instrument .vocal-waveform-info,.vocal-instrument .vocal-status-row,.vocal-instrument .vocal-roll-tools,.vocal-instrument .vocal-roll,.vocal-instrument>.instrument-pattern-controls{margin-left:9px;margin-right:9px}.vocal-instrument .vocal-note-actions{width:100%;margin-left:0}.vocal-instrument .vocal-note-actions button{flex:1;padding:6px 4px;font-size:9px}.vocal-instrument .vocal-roll{height:360px}}.vocal-instrument .vocal-rhythms{justify-content:flex-start;margin:8px 14px}.material-instrument{min-width:0}.material-instrument .material-status{border:1px solid #8798a7;margin:0 14px 10px;padding:8px;font-size:10px;line-height:1.6}.material-instrument .material-surface-tools{color:#b9c6d0;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin:0 14px 8px;font-size:10px;line-height:1.6;display:flex}.material-instrument .material-octaves{justify-content:space-between;align-items:center;gap:8px;margin-left:auto;display:flex}.material-instrument .material-octaves button{min-width:36px;min-height:34px;padding:4px 8px}.material-instrument .material-surface{background:#101315;border:1px solid #657583;height:244px;margin:0 14px 12px}.material-instrument .material-surface canvas{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:crosshair;width:100%;height:100%;display:block}.material-instrument .material-surface canvas:focus-visible{outline-offset:3px;outline:2px solid #e4edf5}.material-instrument .material-surface canvas[aria-disabled=true]{opacity:.55;cursor:default}.material-instrument .material-sound-controls,.material-instrument .material-sequence,.material-instrument .material-automation-details{border:1px solid #515c65;min-width:0;margin:0 14px 12px}.material-instrument summary{cursor:pointer;color:#dbe3eb;-webkit-user-select:none;user-select:none;background:#20292f;min-height:36px;padding:8px 10px;font-size:11px;line-height:20px}.material-instrument summary:focus-visible{outline-offset:2px;outline:2px solid #e4edf5}.material-instrument summary span{color:#a6b6c3;margin-left:8px;font-size:10px}.material-instrument .material-sounds{grid-template-columns:repeat(6,minmax(0,1fr));margin:10px;display:grid}.material-instrument .material-sounds button{white-space:normal;min-width:0;min-height:36px}.material-instrument button[aria-pressed=true]{color:#19222a;background:#d9e1e8;border-color:#f0f5f9}.material-instrument .material-controls{grid-template-columns:repeat(8,minmax(0,1fr));padding:8px 6px 14px}.material-instrument .material-sequence>.instrument-pattern-controls{margin:10px}.material-instrument .material-note-tools{gap:8px;margin:0;padding:0 10px 10px}.material-instrument .material-note-tools>div{flex-wrap:wrap;gap:4px;display:flex}.material-instrument .material-note-tools button{min-height:34px;padding:6px 9px;font-size:10px}.material-instrument .material-note-matrix{height:240px;margin:0 10px 10px}.material-instrument .instrument-automation{margin:0;padding:10px}@media (width<=650px){.material-instrument .material-surface,.material-instrument .material-surface-tools,.material-instrument .material-sound-controls,.material-instrument .material-sequence,.material-instrument .material-automation-details{margin-left:9px;margin-right:9px}.material-instrument .material-surface{height:256px}.material-instrument .material-controls{grid-template-columns:repeat(4,minmax(0,1fr))}.material-instrument .material-sounds{grid-template-columns:repeat(3,minmax(0,1fr))}.material-instrument .material-note-tools>div{width:100%}.material-instrument .material-note-tools button{flex:1}.material-instrument .material-note-matrix,.material-instrument .material-sequence>.instrument-pattern-controls{margin-left:5px;margin-right:5px}.material-instrument .material-note-matrix{height:260px}.material-instrument .instrument-automation{padding:8px 5px}}.session-panel{color:#ededed;min-width:0;max-width:1040px;font:11px var(--mono,"IBM Plex Mono", monospace);background:#202225;border:2px solid #777;border-top:0;margin:auto;padding:12px}.session-panel[hidden],.session-panel [hidden]{display:none!important}.session-panel .session-heading,.session-panel .session-summary,.session-panel .session-actions{flex-wrap:wrap;align-items:center;gap:8px 16px;display:flex}.session-panel .session-heading{justify-content:space-between;margin-bottom:12px}.session-panel h2{font:600 12px var(--mono,"IBM Plex Mono", monospace);margin:0}.session-panel .session-summary{gap:6px 12px;font-size:10px}.session-panel #session-status{background:#32363b;border:1px solid #72767c;padding:3px 6px}.session-panel .session-start,.session-panel .session-active{gap:12px;display:grid}.session-panel button{color:#eee;min-height:36px;font:inherit;cursor:pointer;touch-action:manipulation;background:#353a40;border:1px solid #3a3d42;border-color:#92969b #3a3d42 #3a3d42 #92969b;justify-self:start;padding:7px 12px}.session-panel .session-primary{color:#151515;background:linear-gradient(#f2f2f2,#b9b9b9);border-top-color:#fff;border-left-color:#fff;font-weight:600}.session-panel button:disabled{opacity:.45;cursor:default}.session-panel .session-link-row{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;min-width:0;margin:0;display:grid}.session-panel input{color:#f2f2f2;width:100%;min-width:0;min-height:36px;font:inherit;background:#111316;border:1px solid #777d85;border-color:#070809 #777d85 #777d85 #070809;border-radius:0;padding:7px 9px}.session-panel input:focus-visible,.session-panel button:focus-visible{outline-offset:2px;outline:2px solid #fff}.session-panel .session-help,.session-panel .session-message{overflow-wrap:anywhere;margin:0;line-height:1.6}.session-panel .session-help{color:#bdc3ca;font-size:10px}.session-panel .session-message{background:#31353a;border-left:2px solid #c9cdd3;margin-bottom:12px;padding:8px 10px}@media (width<=650px){.session-panel{padding:10px 8px}.session-panel .session-heading{align-items:flex-start;gap:8px}.session-panel .session-link-row{grid-template-columns:minmax(0,1fr) auto;gap:6px}.session-panel .session-link-row label{grid-column:1/-1}.session-panel input,.session-panel button{min-height:40px}.session-panel input{font-size:16px}}.automation-view{flex-shrink:0;align-items:stretch;gap:2px;display:inline-flex}.automation-view[hidden]{display:none}.automation-view button{min-height:32px;padding:6px 9px;font-size:10px}.automation-view button[aria-pressed=true]{color:#16191c;background:#d5dbe1;border-color:#e8edf2}.instrument-automation{min-width:0;padding-bottom:14px}.instrument-automation .instrument-lane-title{flex-direction:column;gap:4px;font-size:11px;display:flex}.instrument-automation .instrument-lane-title>span:last-child{color:#a7adb4;font-size:9px}.instrument-automation .matrix-toolbar{margin-top:4px}.instrument-automation .matrix-tools{flex-wrap:wrap}.instrument-automation .matrix-tools button{padding:6px 9px}.instrument-automation .instrument-pattern-controls,.arp-instrument>.instrument-pattern-controls{margin:8px 14px 12px}.arp-instrument .arp-rhythm{margin-top:0}.instrument-automation .instrument-automation-matrix{height:235px}.pad-instrument .pad-composition{grid-template-columns:minmax(0,1.5fr) minmax(230px,1fr);gap:14px;margin:0 14px 16px;display:grid}.pad-instrument .pad-timeline,.pad-instrument .pad-chord-editor{min-width:0}.pad-instrument .pad-timeline-tools{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;display:flex}.pad-instrument .pad-length{gap:4px;margin:0}.pad-instrument .pad-length button,.pad-instrument [data-pad-presets]{min-height:32px;padding:7px 9px;font-size:10px}.pad-instrument [data-pad-presets]{background:#33383e;border:1px solid #727980}.pad-instrument [data-pad-presets][aria-expanded=true]{color:#17191b;background:#d5d8db}.pad-instrument .pad-chords{grid-template-columns:minmax(0,1fr);gap:5px;margin:0;display:grid}.pad-instrument .pad-chords button{border-left-width:3px;grid-template-columns:22px minmax(0,1fr) minmax(58px,auto);align-items:center;gap:10px;min-width:0;min-height:58px;padding:8px 10px;display:grid}.pad-instrument .pad-chords button[aria-pressed=true]{background:#3a4047;border-left-color:#fff;outline:none}.pad-instrument .pad-chords button.current{box-shadow:inset 0 -3px #eff2f5}.pad-instrument .pad-chords strong{overflow-wrap:anywhere;margin:0 0 5px;font-size:15px}.pad-instrument .pad-chord-content{min-width:0}.pad-instrument .pad-chord-content small{font-size:9px;line-height:1.4}.pad-instrument .pad-chords .pad-chord-number{border-right:1px solid #68717a;align-self:stretch;place-items:center;font-size:10px;display:grid}.pad-instrument .pad-chords .pad-chord-duration{text-align:right;color:#c1c7cd;max-width:104px;font-size:9px;line-height:1.5}.pad-instrument .pad-chord-editor{background:#1e2227;border:1px solid #626a73;flex-direction:column;justify-content:center;gap:18px;margin:0;padding:14px;display:flex}.pad-instrument .pad-chord-editor h3{margin:0;font-size:12px;font-weight:600}.pad-instrument .pad-edit-group{gap:7px;display:grid}.pad-instrument .pad-edit-group>span{color:#b1b7be;font-size:10px}.pad-instrument .pad-degrees,.pad-instrument .pad-inversions{gap:5px}.pad-instrument .pad-degrees button,.pad-instrument .pad-inversions button{min-height:32px;padding:7px 9px}.pad-instrument .pad-progression-picker{position:relative}.pad-instrument .pad-progressions{z-index:35;overscroll-behavior:contain;background:#202328;border:1px solid #a5abb1;grid-template-columns:repeat(2,minmax(0,1fr));width:min(440px,100vw - 32px);max-height:300px;margin:0;padding:8px;position:absolute;bottom:calc(100% + 8px);left:0;overflow:auto;box-shadow:4px 4px #0009}.pad-instrument .pad-progressions[hidden]{display:none}.pad-instrument .pad-progression-description{color:#b9c0c7;margin:0 0 10px;font-size:10px;line-height:1.6}.pad-instrument .pad-progressions button{min-width:0;position:relative}.pad-instrument .pad-progression-name{display:block}.pad-instrument .pad-progression-tooltip{text-align:left;padding-top:7px;font-size:9px;font-weight:400;line-height:1.5;display:none}.pad-instrument .pad-progressions button:hover .pad-progression-tooltip,.pad-instrument .pad-progressions button:focus-visible .pad-progression-tooltip{display:block}.pad-instrument .pad-controls,.arp-controls{grid-template-columns:repeat(8,minmax(0,1fr))}@media (width<=650px){.instrument-automation .instrument-automation-matrix{height:260px}.instrument-automation .instrument-pattern-controls,.arp-instrument>.instrument-pattern-controls{margin-left:9px;margin-right:9px}.instrument-automation .matrix-toolbar{gap:10px}.instrument-automation .matrix-tools{gap:4px;width:100%}.instrument-automation .matrix-tools button{flex:1;padding:7px 5px;font-size:9px}.pad-instrument .pad-composition{grid-template-columns:minmax(0,1fr);gap:10px;margin:0 9px 16px}.pad-instrument .pad-timeline-tools{gap:7px}.pad-instrument .pad-length button,.pad-instrument [data-pad-presets]{padding:7px;font-size:9px}.pad-instrument .pad-chords{grid-template-columns:repeat(2,minmax(0,1fr))}.pad-instrument .pad-chords button{grid-template-columns:16px minmax(0,1fr);gap:7px;min-height:104px;padding:7px}.pad-instrument .pad-chords strong{font-size:12px}.pad-instrument .pad-chords .pad-chord-number{grid-row:1/3}.pad-instrument .pad-chord-content small{font-size:8px}.pad-instrument .pad-chords .pad-chord-duration{text-align:left;grid-column:2;max-width:none;font-size:8px}.pad-instrument .pad-chord-editor{gap:12px;padding:12px}.pad-instrument .pad-controls,.arp-controls{grid-template-columns:repeat(4,minmax(0,1fr))}}.track-mixer{border-top:1px solid #666;margin-top:8px}.track-mixer summary{cursor:pointer;padding:9px 2px 2px;font-size:11px}.mixer-channels{overscroll-behavior-x:contain;grid-template-columns:repeat(12,minmax(45px,1fr));gap:9px;padding:10px 2px 4px;display:grid;overflow:auto hidden}.mixer-channel{flex-direction:column;align-items:center;gap:5px;font-size:9px;display:flex}.mixer-fader{touch-action:none;background:#333;border:1px solid #777;width:44px;height:98px;padding:8px 12px}.fader-track{background:#151515;border:1px solid #111;width:4px;height:100%;display:block;position:relative}.fader-fill{height:var(--fader-level,0%);background:#777;position:absolute;bottom:0;left:0;right:0}.fader-thumb{bottom:var(--fader-level,0%);background:linear-gradient(#aaa 45%,#222 45% 55%,#aaa 55%);border:1px solid #555;border-color:#fafafa #555 #555 #fafafa;width:26px;height:12px;position:absolute;left:-12px;transform:translateY(50%)}.mixer-channel>button[data-mixer-mute]{width:44px;min-height:32px;font:inherit;color:#eee;cursor:pointer;background:#333;border:1px solid #777}.mixer-channel>button[aria-pressed=true]{color:#111;background:#ddd}.mixer-channel output{min-height:12px;font-size:9px}@media (width<=650px){.mixer-channels{grid-template-columns:repeat(12,49px);gap:5px}.mixer-fader{height:82px}}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/ibm-plex-mono-latin-400-normal-DMJ8VG8y.woff2)format("woff2"),url(/assets/ibm-plex-mono-latin-400-normal-CvHOgSBP.woff)format("woff")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/ibm-plex-mono-latin-500-normal-DSY6xOcd.woff2)format("woff2"),url(/assets/ibm-plex-mono-latin-500-normal-CB9ihrfo.woff)format("woff")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/ibm-plex-mono-latin-600-normal-BgSNZQsw.woff2)format("woff2"),url(/assets/ibm-plex-mono-latin-600-normal-DWFSQ4vo.woff)format("woff")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/ibm-plex-mono-latin-700-normal-7sUh57Bg.woff2)format("woff2"),url(/assets/ibm-plex-mono-latin-700-normal-CNHXzs6v.woff)format("woff")}:root{font-family:var(--mono);color:#ededed;font-synthesis:none;--mono:"IBM Plex Mono", monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#090909;font-size:13px}*{box-sizing:border-box}body{background:radial-gradient(at 40% 0,#333 0,#0000 70%),#090909;min-height:100vh;margin:0;padding:24px 22px 76px}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;background:0 0;border:0}button:disabled{cursor:default;opacity:.4}a{color:inherit;text-decoration:none}button svg{flex-shrink:0;width:14px;height:14px}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline-offset:3px;outline:2px solid #fff}button:hover{filter:brightness(1.15)}button{touch-action:manipulation}button:active{transform:translateY(1px)}.app-header{z-index:2;background:linear-gradient(#858585 0,#4c4c4c 8%,#202020 45%,#141414 100%);border:2px solid #999;border-bottom-color:#050505;border-radius:5px 5px 0 0;justify-content:space-between;align-items:center;max-width:1040px;height:44px;margin:auto;padding:0 12px;display:flex;position:relative;box-shadow:8px 8px #0008}.brand{flex-shrink:0;align-items:center;gap:8px;display:flex}.brand-wordmark{color:#ededed;width:min(300px,100vw - 108px);display:block}.brand-wordmark svg{width:100%;height:auto;display:block}.header-actions{align-items:center;gap:20px;display:flex}#phone-motion[aria-pressed=true]{color:#fff;background:#1e2227;box-shadow:inset 1px 1px #000}.save-state{font:9px var(--mono);color:#bbb;align-items:center;gap:6px;display:flex}.status-dot{background:#bbb;width:5px;height:5px}.button{justify-content:center;align-items:center;gap:7px;height:27px;padding:0 10px;font-size:10px;font-weight:600;display:flex}.secondary{color:#111;background:linear-gradient(#f4f4f4,#aaa);border:1px solid #555;border-color:#eee #555 #555 #eee;box-shadow:1px 1px #000}.workspace{background:#242424f2;border:2px solid #777;border-top:0;max-width:1040px;margin:auto;padding:12px 12px 0;box-shadow:8px 8px #0008}.panel{background:#161616;border:1px solid #050505;border-color:#999 #050505 #050505 #999;min-width:0;box-shadow:1px 1px #000}.transport{z-index:30;color:#171717;background:linear-gradient(#e7e7e7,#b5b5b5);border-color:#fff #777 #777 #fff;align-items:center;gap:26px;margin-bottom:14px;padding:11px 18px;display:flex;position:sticky;top:7px;box-shadow:1px 1px #000,0 4px #0003}.playback{align-items:center;gap:9px;margin-right:9px;display:flex}.play-button{color:#fff;width:105px;height:43px;font:700 15px var(--mono);text-transform:uppercase;letter-spacing:1px;background:#171717;border:3px solid #000;border-top:1px solid #555;border-left:1px solid #555;justify-content:center;align-items:center;gap:9px;display:flex;box-shadow:2px 2px #777}.play-button svg{fill:currentColor;width:14px}.play-button.playing{color:#111;background:#f5f5f5;border-color:#fff #666 #666 #fff}.icon-button{color:#444;place-items:center;width:25px;height:25px;display:grid}.restart{background:#d7d7d7;border:1px solid #777;border-color:#fff #777 #777 #fff}.position{color:#777;font:12px var(--mono);align-items:center;gap:5px;margin-left:auto;display:flex}.position>span:first-child{color:#111;font-size:24px}.beat-lights{gap:4px;margin-left:10px;display:flex}.beat-lights b{background:#999;width:5px;height:12px}.beat-lights b.active{background:#111}.dial-control{flex-direction:column;align-items:center;gap:5px;min-width:54px;display:flex}.dial-label{font:9px var(--mono);text-transform:uppercase;letter-spacing:1px;color:#aaa}.transport .dial-label{color:#555}.gesture-control{touch-action:none;-webkit-user-select:none;user-select:none;cursor:ns-resize;outline-offset:3px;flex-direction:column;justify-content:center;align-items:center;gap:5px;min-width:52px;min-height:55px;display:flex;position:relative}.gesture-control.dragging{cursor:grabbing}.knob-face{background:linear-gradient(135deg,#494949,#161616 70%);border:1px solid #9c9c9c;border-radius:50%;width:35px;height:35px;display:block;position:relative;box-shadow:2px 2px #000,inset 1px 1px #707070,inset -2px -2px #0a0a0a}.knob-face>span{transform:rotate(var(--knob-angle));border-radius:50%;position:absolute;inset:3px}.knob-face>span:before{content:"";background:#fff;width:2px;height:9px;position:absolute;top:0;left:calc(50% - 1px);box-shadow:0 0 2px #fff6}.gesture-control output{font:11px var(--mono);white-space:nowrap;color:#e6e6e6}.transport .gesture-control output{color:#111;font-weight:600}.transport .gesture-control{min-width:61px}.transport .knob-face{width:32px;height:32px}.gesture-control:focus-visible .knob-face,.gesture-control.dragging .knob-face{border-color:#fff;box-shadow:0 0 0 2px #999,2px 2px #000}.studio-grid{display:block}.sequencers{grid-template-columns:1fr;gap:14px;display:grid}.section-header{color:#fff;background:linear-gradient(#5b5b5b,#2a2a2a);border-bottom:1px solid #050505;justify-content:space-between;align-items:center;gap:12px;height:33px;padding:0 10px;display:flex;box-shadow:inset 0 1px #888}.section-title{color:#fff;align-items:center;gap:8px;min-width:0;display:flex}.section-number{color:#ccc;width:17px;height:17px;font:8px var(--mono);background:#222;border:1px solid #888;place-items:center;display:grid}h1,h2{text-shadow:1px 1px #000;margin:0;font-size:13px;font-weight:600}.small-tag{font:8px var(--mono);color:#bbb;letter-spacing:.7px;border:1px solid #777;padding:2px 4px}.text-button{color:#ccc;white-space:nowrap;align-items:center;gap:5px;padding:4px 3px;font-size:10px;display:flex}.text-button svg{width:12px;height:12px}.preset-bar{align-items:center;gap:10px;padding:12px 14px;display:flex}.preset-options{gap:4px;display:flex}.preset-options button{color:#bbb;background:#383838;border:1px solid #050505;border-color:#626262 #050505 #050505 #626262;padding:6px 11px;font-size:10px}.preset-options button.active{color:#111;background:#c9c9c9;border-color:#fff #777 #777 #fff}.remix-button{min-height:29px;font:600 12px var(--mono);color:#151515;background:#dedede;border:1px solid #777;border-color:#fff #777 #777 #fff;align-items:center;gap:7px;margin-left:auto;padding:0 12px;display:flex;box-shadow:1px 1px #000}.undo-remix{padding:5px 7px}.instrument-tabs{background:#555;border:1px solid #555;gap:1px;margin:0 14px;display:flex}.instrument-tabs button{font:11px var(--mono);color:#aaa;background:#252525;flex:1;padding:8px 10px}.instrument-tabs button[aria-pressed=true]{color:#111;background:#c5c5c5;box-shadow:inset 0 2px #fff}.instrument-controls{background:#242424;border:1px solid #555;border-top:0;justify-content:space-between;align-items:center;gap:20px;margin:0 14px;padding:13px 14px;display:flex}.sound-buttons{flex-wrap:wrap;gap:5px;max-width:50%;display:flex}.sound-buttons button{min-height:30px;font:10px var(--mono);color:#bbb;background:#353535;border:1px solid #111;border-color:#5b5b5b #111 #111 #5b5b5b;padding:5px 10px}.sound-buttons button[aria-pressed=true]{color:#111;background:#bfbfbf;border-color:#ddd #666 #666 #ddd}.instrument-dials{align-items:center;gap:25px;display:flex}.mute-button{width:26px;height:26px;font:10px var(--mono);color:#bbb;background:#383838;border:1px solid #080808;border-color:#686868 #080808 #080808 #686868;place-items:center;padding:0;display:grid}.mute-button[aria-pressed=true]{color:#111;background:#ddd;border-color:#eee}.beat-surface{background:#111;border:1px solid #555;border-color:#080808 #555 #555 #080808;height:296px;margin:10px 14px 0;position:relative}.beat-surface canvas{touch-action:none;-webkit-user-select:none;user-select:none;cursor:crosshair;width:100%;height:100%;display:block}.beat-keyboard{pointer-events:none;grid-template-rows:repeat(5,minmax(0,1fr));grid-template-columns:repeat(16,minmax(0,1fr));gap:0;display:grid;position:absolute;inset:24px 8px 8px 54px}.beat-keyboard .step-pad{pointer-events:none;opacity:0;border:0;min-width:0;padding:0}.beat-keyboard .step-pad:focus-visible{opacity:1;outline-offset:-3px;color:#fff;font:8px var(--mono);background:#3339;outline:2px solid #fff}.section-footer{color:#aaa;font:9px var(--mono);border-top:1px solid #383838;justify-content:space-between;align-items:center;gap:10px;margin:10px 14px 0;padding:9px 0 10px;display:flex}.section-footer>span{align-items:center;gap:6px;display:flex}.legend-pad{background:#aaa;width:6px;height:6px}.bass-actions{align-items:center;gap:12px;display:flex}.bass-actions .mute-button{width:22px;height:22px}.bass-meta{justify-content:space-between;align-items:center;padding:12px 14px;display:flex}.waveform-switch{gap:4px;display:flex}.waveform-switch button{font:10px var(--mono);color:#aaa;background:#353535;border:1px solid #080808;border-color:#555 #080808 #080808 #555;align-items:center;gap:6px;padding:5px 10px;display:flex}.waveform-switch button svg{width:12px;height:12px}.waveform-switch button.active{color:#111;background:#bbb;border-color:#eee #666 #666 #eee}.acid-controls{justify-content:space-around;gap:15px;padding:0 14px 14px;display:flex}.acid-controls .dial-control{flex:1}.visualizer-panel{z-index:1000;pointer-events:none;mix-blend-mode:difference;isolation:auto;opacity:.3;background:0 0;border:0;width:100vw;height:100dvh;margin:0;position:fixed;inset:0;overflow:hidden}.visualizer-panel canvas{width:100%;height:100%;position:absolute;inset:0}.visualizer-toolbar{z-index:40;background:#202020f2;border:1px solid #444;border-color:#aaa #444 #444 #aaa;align-items:center;gap:18px;max-width:calc(100vw - 30px);padding:7px 12px;display:flex;position:fixed;bottom:12px;right:24px;box-shadow:4px 4px #0008}.visualizer-top,.visualizer-bottom{align-items:center;gap:12px;display:flex}.visualizer-label{font:8px var(--mono);letter-spacing:1px;color:#ddd;align-items:center;gap:6px;display:flex}.visualizer-label svg{width:13px;height:13px}.audio-status{font:7px var(--mono);color:#aaa;letter-spacing:.6px}.visualizer-controls{align-items:center;gap:10px;display:flex}.visualizer-controls .dial-control{flex-direction:row;gap:6px;min-width:0}.visualizer-controls .gesture-control{flex-direction:row;gap:7px;min-width:0;min-height:30px}.visualizer-controls .knob-face{width:23px;height:23px}.visualizer-controls .knob-face>span:before{height:5px}.visualizer-controls .dial-label{color:#eee;font-size:8px}.visualizer-controls .gesture-control output{width:26px;font-size:9px}.visualizer-button{color:#ddd;background:#353535;border:1px solid #111;border-color:#777 #111 #111 #777;place-items:center;width:25px;height:25px;display:grid}.visualizer-button svg{width:12px;height:12px}.palette-toggle{justify-content:center;align-items:center;gap:6px;width:auto;padding:0 7px;font-size:9px;display:flex}.palette-current{border:1px solid #999;width:14px;height:14px}.visualizer-palettes{background:#202020;border:1px solid #999;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;width:min(360px,100vw - 20px);padding:8px;display:grid;position:absolute;bottom:calc(100% + 8px);right:0;box-shadow:4px 4px #0008}.visualizer-palettes[hidden]{display:none}.visualizer-palettes button{border:1px solid #555;flex-direction:column;align-items:stretch;gap:7px;min-width:0;padding:5px;font-size:9px;display:flex}.visualizer-palettes button[aria-pressed=true]{background:#414141;border-color:#fff}.palette-swatch{height:26px;display:block}.visualizer-expanded{overflow:hidden}.visualizer-expanded #app>:not(.visualizer-panel):not(.workspace),.visualizer-expanded .workspace>:not(.visualizer-toolbar){visibility:hidden}.visualizer-expanded .workspace{box-shadow:none;background:0 0;border-color:#0000}.visualizer-expanded .visualizer-panel{mix-blend-mode:normal;z-index:1000;pointer-events:auto;cursor:zoom-out;touch-action:manipulation}.visualizer-expanded .visualizer-toolbar{z-index:1001}.app-footer{color:#aaa;font:8px var(--mono);background:#383838;border-top:1px solid #777;justify-content:space-between;align-items:center;gap:15px;margin:12px -12px 0;padding:7px 10px;display:flex}.app-footer>span{align-items:center;gap:7px;display:flex}.app-footer>span:nth-child(2){letter-spacing:1px;font-size:7px}kbd{font:7px var(--mono);color:#ddd;background:#555;border:1px solid #222;border-color:#888 #222 #222 #888;padding:2px 4px}.toast{z-index:120;color:#111;font:11px var(--mono);background:#ddd;border:1px solid #fff;max-width:90vw;padding:12px 20px;position:fixed;bottom:75px;left:50%;transform:translate(-50%);box-shadow:4px 4px #0008}.toast[hidden]{display:none}@media (width<=950px){body{padding:16px 14px 75px}.brand-detail,.brand-divider{display:none}.transport{gap:20px}.position .beat-lights{display:none}.instrument-dials{gap:18px}.instrument-controls{padding:11px}}@media (width<=650px){body{padding:8px 6px 70px}.app-header{height:40px;padding:0 8px;box-shadow:4px 4px #0008}.brand{gap:6px}.brand-icon{width:22px;height:22px}.brand-icon svg{width:16px;height:16px}.save-state{display:none}.header-actions{gap:0}.button{gap:5px;height:25px;padding:0 7px;font-size:9px}.button svg{width:12px}.workspace{padding:8px 8px 0;box-shadow:4px 4px #0008}.transport{grid-template-columns:82px repeat(4,minmax(0,1fr));gap:5px;margin-bottom:10px;padding:9px 7px;display:grid;top:4px}.playback{gap:0;margin:0}.play-button{gap:6px;width:75px;height:44px;font-size:13px}.play-button svg{width:12px}.restart,.position{display:none}.transport .dial-control{gap:4px;min-width:0}.transport .dial-label{letter-spacing:.6px;font-size:7px}.transport .gesture-control{gap:3px;min-width:0;min-height:46px}.transport .gesture-control output{font-size:9px}.transport .knob-face{width:28px;height:28px}.sequencers{gap:11px}.section-header{height:31px;padding:0 8px}.section-title{gap:6px}h1,h2{font-size:11px}.section-number{width:15px;height:15px;font-size:7px}.small-tag{padding:2px 3px;font-size:6px}.text-button{gap:4px;font-size:9px}.preset-bar{flex-wrap:wrap;gap:7px;padding:10px}.preset-options{width:100%}.preset-options button{flex:1;padding:6px 5px;font-size:9px}.remix-button{min-height:28px;margin-left:0;font-size:11px}.undo-remix{font-size:10px}.instrument-tabs{margin:0 10px}.instrument-tabs button{padding:8px 4px;font-size:10px}.instrument-controls{flex-direction:column;gap:9px;margin:0 10px;padding:9px 8px 10px;display:flex}.sound-buttons{flex-wrap:nowrap;gap:4px;width:100%;max-width:none}.sound-buttons button{flex:1;min-height:28px;padding:4px;font-size:9px}.instrument-dials{grid-template-columns:repeat(5,minmax(0,1fr)) 28px;gap:5px;width:100%;display:grid}.instrument-dials .dial-control{gap:3px;min-width:0}.instrument-dials .dial-label{font-size:8px}.instrument-dials .knob-face{width:31px;height:31px}.instrument-dials .gesture-control{gap:3px;min-height:48px}.instrument-dials .gesture-control output{font-size:10px}.instrument-dials .mute-button{width:28px;height:28px}.beat-surface{height:264px;margin:9px 10px 0}.beat-keyboard .step-pad:focus-visible{font-size:7px}.section-footer{margin:8px 10px 0;padding:8px 0;font-size:8px}.section-footer:not(.note-help)>span:last-child:not(:first-child){display:none}.bass-meta{padding:10px}.waveform-switch button{padding:4px 8px;font-size:9px}.acid-controls{gap:5px;padding:0 9px 12px}.acid-controls .dial-control{gap:4px;min-width:0}.acid-controls .dial-label{letter-spacing:.5px;font-size:7px}.acid-controls .gesture-control{gap:3px;min-width:0;min-height:48px}.acid-controls .gesture-control output{font-size:9px}.acid-controls .knob-face{width:29px;height:29px}.visualizer-toolbar{justify-content:space-between;gap:8px;max-width:none;padding:6px 9px;bottom:8px;left:10px;right:10px}.visualizer-top{display:none}.visualizer-bottom,.visualizer-controls{width:100%}.audio-status{display:none}.visualizer-label{letter-spacing:.6px;gap:5px;font-size:7px}.visualizer-label svg{width:11px;height:11px}.visualizer-controls{justify-content:space-between;gap:7px}.visualizer-controls .dial-label{font-size:7px}.visualizer-controls .gesture-control output{width:25px;font-size:8px}.visualizer-controls .dial-control,.visualizer-controls .gesture-control{gap:5px}.visualizer-button{min-width:32px;height:32px}.palette-toggle{width:auto}.app-footer{margin:10px -8px 0;padding:7px 8px;font-size:7px}.app-footer>span:first-child{display:none}.app-footer{justify-content:space-between}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.beat-keyboard{top:27px}.instrument-tabs,.sound-buttons,.preset-options,.remix-button,.undo-remix,.dial-control,.section-title,.text-button,.waveform-switch,.mute-button{z-index:21;position:relative}.transport .dial-label,.transport .gesture-control output{color:#222;text-shadow:none}.beat-keyboard{z-index:21}.beat-keyboard .step-pad.on{opacity:1;color:#0000;background:0 0;position:relative}.beat-keyboard .step-pad.on:after{content:"";pointer-events:none;background:#fff;border:1px solid #111;width:6px;height:6px;position:absolute;top:calc(50% - 3px);left:calc(50% - 3px);box-shadow:0 0 0 1px #fff8}.beat-keyboard .step-pad:focus-visible{color:#fff;background:#222;outline:2px solid #fff}.note-help{z-index:21;color:#bbb;background:#161616;flex-wrap:wrap;gap:6px 16px;position:relative}.scale-panel{z-index:21;background:#1d1f21;margin-bottom:12px;padding:10px 14px;position:relative}.scale-row{align-items:center;gap:12px;display:flex}.scale-row+.scale-row{margin-top:6px}.scale-row>span{width:38px;font:9px var(--mono);color:#b0b5bb;flex-shrink:0}.scale-roots,.scale-modes{flex:1;gap:4px;display:flex}.scale-roots button,.scale-modes button,.matrix-toolbar button{min-height:30px;font:10px var(--mono);background:#272a2e;border:1px solid #555b61;padding:5px 10px}.scale-roots button{flex:1;max-width:52px}.scale-modes button{min-width:78px}.scale-panel button[aria-pressed=true],.matrix-toolbar button[aria-pressed=true]{color:#16181a;background:#d5d8dc;border-color:#f5f6f7}.preset-bar{align-items:center;gap:10px;display:flex}.preset-navigation{flex:1;align-items:stretch;gap:5px;min-width:0;display:flex}.preset-scroll{background:#252525;border:1px solid #555;flex:0 0 24px;font-size:24px}.preset-options{overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin;touch-action:pan-x pinch-zoom;flex:1;gap:5px;min-width:0;display:flex;overflow:auto hidden}.preset-options button{scroll-snap-align:start;text-align:left;white-space:nowrap;flex-direction:column;flex:0 0 118px;align-items:flex-start;gap:4px;min-height:40px;padding:5px 7px;display:flex}.preset-options button strong{font:500 12px var(--mono)}.preset-options button span{opacity:.7;text-overflow:ellipsis;max-width:100%;font-size:9px;overflow:hidden}@media (width<=650px){.preset-navigation{flex-basis:100%;width:100%}.visualizer-controls .dial-control{flex-direction:column;gap:0}.visualizer-controls .gesture-control{gap:4px}}.preset-actions{justify-content:flex-end;gap:8px;margin:0 0 0 auto;display:flex}.matrix-toolbar{z-index:21;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin:0 14px 8px;display:flex;position:relative}.matrix-parameters,.matrix-tools{gap:4px;display:flex}.note-matrix{z-index:auto;border:1px solid #5b6066;height:300px;margin:0 14px;position:relative}.note-matrix canvas{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:crosshair;width:100%;height:100%;display:block}.matrix-access{z-index:21;pointer-events:none;grid-template-columns:repeat(16,minmax(0,1fr));display:grid;position:absolute;inset:24px 8px 28px 34px}.matrix-access>div{opacity:0}.matrix-access>div:focus-visible{opacity:1;outline-offset:-2px;background:#ffffff08;outline:2px solid #fff}.keys-sounds,.sound-buttons{flex-wrap:wrap}@media (width<=650px){.scale-panel{margin-bottom:10px;padding:8px}.scale-row{gap:5px}.scale-row>span{width:29px;font-size:8px}.scale-roots,.scale-modes{gap:2px}.scale-roots button{min-width:0;padding:5px 0;font-size:9px}.scale-modes{flex-wrap:wrap}.scale-modes button{flex:auto;min-width:0;padding:5px 7px;font-size:9px}.preset-options button{min-height:40px;padding:5px 6px}.preset-options button strong{font-size:10px}.preset-options button span{font-size:8px}.matrix-toolbar{gap:6px;margin:0 9px 8px}.matrix-toolbar button{min-height:32px;padding:6px 10px}.matrix-parameters{width:100%}.matrix-parameters button{flex:1}.note-matrix{height:340px;margin:0 9px}.keys-sounds button{min-height:30px}}.bass-sounds{flex-wrap:wrap}.acid-controls{grid-template-columns:repeat(auto-fit,minmax(90px,1fr));display:grid}.matrix-legend{z-index:21;font:9px var(--mono);color:#c3c7cb;gap:14px;margin:8px 14px 0;display:flex;position:relative}.matrix-legend span{background:#17191b;padding:3px 5px}.automation-strip{z-index:21;background:#292d32;border:1px solid #707780;align-items:center;gap:6px;margin:0 14px 8px;padding:6px 8px;display:flex;position:relative}.automation-strip[hidden]{display:none}.automation-strip>span{font:11px var(--mono);flex:1}.automation-strip button{background:#373c43;border:1px solid #626a73;padding:5px 8px;font-size:10px}.gesture-control.automation-selected .knob-face{outline-offset:3px;outline:2px solid #eff2f5}@media (width<=360px){.scale-modes button{padding:5px 3px;font-size:8px}}@media (width<=650px){.acid-controls{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 6px}.bass-sounds button{min-height:30px}.automation-strip{margin:0 9px 8px}.matrix-legend{flex-wrap:wrap;gap:5px;margin:7px 9px 0;font-size:8px}}[hidden]{display:none!important}.position{flex-wrap:wrap;max-width:180px}.bar-position{font:10px var(--mono);text-align:right;width:100%}.arp-settings{flex-wrap:wrap;gap:12px 24px;margin:12px 14px;display:flex}.arp-setting{align-items:center;gap:8px;font-size:10px;display:flex}.arp-setting .waveform-switch,.arp-sounds,.pad-sounds{flex-wrap:wrap}.arp-note-header{justify-content:space-between;align-items:center;margin:14px 14px 6px;font-size:11px;display:flex}.arp-note-options{grid-template-columns:repeat(11,minmax(0,1fr));gap:4px;margin:0 14px;display:grid}.arp-note-options button{background:#24282c;border:1px solid #686e75;min-height:46px;position:relative}.arp-note-options small{opacity:.65;min-height:12px;font-size:8px;display:block}.arp-note-options button[aria-pressed=true],.arp-step-row button[aria-pressed=true]{color:#17191b;background:#d5d8db}.arp-rhythm{margin:14px;font-size:10px}.arp-step-row{grid-template-columns:repeat(16,minmax(0,1fr));gap:3px;margin:6px 0 12px;display:grid}.arp-step-row button{min-width:0;min-height:30px;font:9px var(--mono);background:#25292e;border:1px solid #646b73;padding:3px 0}.arp-note-options button.current,.arp-step-row button.current{outline-offset:-3px;outline:2px solid #fff}.pad-length,.pad-progressions,.pad-chord-editor{flex-wrap:wrap;gap:5px;margin:12px 14px;display:flex}.pad-length button,.pad-progressions button,.pad-degrees button,.pad-inversions button{background:#272c31;border:1px solid #727980;padding:8px 12px;font-size:10px}.pad-length button[aria-pressed=true],.pad-progressions button[aria-pressed=true],.pad-degrees button[aria-pressed=true],.pad-inversions button[aria-pressed=true],.pad-sounds button[aria-pressed=true]{color:#17191b;background:#d5d8db}.pad-progressions{grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.pad-chords{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:14px;display:grid}.pad-chords button{text-align:left;background:#23272c;border:1px solid #70767d;min-height:94px;padding:10px}.pad-chords button[aria-pressed=true]{background:#3b4148;outline:1px solid #fff}.pad-chords button.current{box-shadow:inset 0 -5px #eff2f5}.pad-chords span,.pad-chords strong,.pad-chords small{display:block}.pad-chords span{color:#a8afb7;font-size:9px}.pad-chords strong{margin:7px 0;font-size:21px}.pad-chords small{color:#c4cbd2;font-size:9px}.pad-chord-editor{justify-content:space-between;gap:10px}.pad-degrees,.pad-inversions{flex-wrap:wrap;gap:4px;display:flex}.pad-position{white-space:nowrap;font-size:10px}@media (width<=650px){.arp-settings{gap:10px;margin:12px 9px}.arp-setting{flex-wrap:wrap}.arp-note-options{grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;margin:0 9px}.arp-note-options button{min-height:42px;font-size:10px}.arp-rhythm{margin:12px 9px}.arp-step-row{gap:2px}.arp-step-row button{font-size:7px}.pad-length,.pad-progressions,.pad-chord-editor,.pad-chords{margin:10px 9px}.pad-progressions,.pad-chords{grid-template-columns:repeat(2,minmax(0,1fr))}.pad-chords button{min-height:86px}.pad-degrees button,.pad-inversions button{padding:7px 9px}}.motion-options{background:#26292c;flex-wrap:wrap;align-items:center;gap:12px;max-width:1040px;margin:auto;padding:8px 12px;font-size:10px;display:flex}.motion-options button{border:1px solid #777;padding:6px 12px}.motion-options button[aria-pressed=true]{color:#111;background:#ddd}.app-header{flex-wrap:wrap;gap:8px;height:auto;min-height:44px;padding:8px 12px}.header-actions{flex-wrap:wrap;gap:5px}.share-panel{color:#222;border-top:1px solid #888;align-items:center;gap:8px;width:100%;margin-top:10px;padding:10px 0 0;font-size:10px;display:flex}.share-panel input{color:#222;background:#eee;border:1px solid #666;flex:1;min-width:0;padding:6px}.share-panel button{color:#222;background:#ddd;border:1px solid #888;padding:6px 9px}.playback-recovery-status{color:#222;margin:4px 0 0;font-size:11px}.acid-controls,.instrument-dials{grid-template-columns:repeat(8,minmax(0,1fr));gap:12px 8px;display:grid}.acid-controls .dial-label,.acid-controls .gesture-control output,.instrument-dials .dial-label,.instrument-dials .gesture-control output{color:#c9cdd1}.acid-controls .dial-control,.instrument-dials .dial-control{width:auto;min-width:0}.instrument-controls{display:block}.instrument-dials{width:100%;margin-top:12px}.drum-mode-bar{gap:4px;margin:12px 14px;display:flex}.drum-mode-bar button,.drum-detail .matrix-toolbar button{background:#303438;border:1px solid #747a80;padding:7px 12px}.drum-mode-bar button[aria-pressed=true],.drum-detail .matrix-toolbar button[aria-pressed=true]{color:#111;background:#ddd}.drum-detail{background:#13161970;border:1px solid #656a6f;margin:12px 10px;padding:12px 4px}.drum-detail-header{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.drum-detail .drum-detail-header,.drum-detail .instrument-dials{width:auto;margin:0 10px 14px}.drum-detail-header h3{min-width:55px;margin:0;font-size:12px}.drum-detail-header .sound-buttons{flex:1;max-width:none}.drum-detail-header .mute-button{flex:none;width:28px}.drum-detail .matrix-parameters{align-items:center;font-size:10px}.drum-matrix{height:200px}@media (width<=650px){.app-header{padding:7px 8px}.header-actions{gap:3px}.header-actions .button{min-height:28px}.acid-controls,.instrument-dials,.keys-panel .acid-controls{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 6px}.drum-matrix{height:240px}.drum-detail{margin:8px 5px}.drum-detail .drum-detail-header{gap:8px}.drum-detail-header h3{width:100%}.drum-detail .sound-buttons{flex-wrap:wrap}.drum-detail .matrix-toolbar{gap:5px}.drum-detail .matrix-toolbar button{padding:6px 9px}}.transport{padding:10px 12px;display:block}.performance-row{align-items:center;gap:12px;display:flex}.performance-row .playback{flex-direction:column;gap:5px;margin:0}.performance-row .play-button{flex-direction:column;gap:4px;width:58px;height:48px;font-size:10px}.jam-controls{flex:1;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:480px;margin:auto;display:grid}.jam-controls .knob-face{width:54px;height:54px}.jam-controls .knob-face>span:before{height:13px}.jam-controls .gesture-control{min-width:0;min-height:72px}.jam-controls .dial-label{font-size:10px}.performance-tools{flex-direction:column;align-items:center;gap:8px;display:flex}.performance-tools .icon-button{background:#d6d6d6;border:1px solid #777;width:34px;height:34px}.performance-tools #bar-position{font:8px var(--mono);white-space:nowrap}.studio-tools{border-top:1px solid #888;margin-top:12px;padding-top:12px}.studio-tools[hidden],.visualizer-toolbar[hidden]{display:none}.mix-controls{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:0 4px 14px;display:grid}.studio-tools .scale-panel{color:#eee;background:#262626;margin-bottom:12px}.studio-tools .header-actions{justify-content:flex-end;gap:6px}.studio-tools .save-state{color:#444;margin-right:auto}.instrument-nav{z-index:50;overscroll-behavior-x:contain;width:min(680px,100vw);padding-bottom:env(safe-area-inset-bottom,0px);background:#202020f5;border:1px solid #999;display:flex;position:fixed;bottom:0;left:50%;overflow-x:auto;transform:translate(-50%);box-shadow:4px 4px #0008}.instrument-nav button{min-width:54px;min-height:44px;font:10px var(--mono);border-right:1px solid #555;flex:1}.instrument-nav button:last-child{border-right:0}.instrument-nav button[aria-current=location],.instrument-nav button[aria-expanded=true]{color:#111;background:#ddd}.studio-grid section{scroll-margin-top:calc(var(--transport-height,110px) + 20px)}.visualizer-toolbar{bottom:calc(54px + env(safe-area-inset-bottom,0px))}.visualizer-expanded #app>#visualizer-toolbar{visibility:visible}.visualizer-expanded .visualizer-toolbar{bottom:calc(12px + env(safe-area-inset-bottom,0px))}.visualizer-expanded .instrument-nav{visibility:hidden}.knob-face>.automation-live{transform:rotate(var(--automation-angle,0deg));border:1px solid #aaa8;transition:transform 40ms linear;display:none;inset:-6px}.knob-face>.automation-live:before{background:#fff;border-radius:50%;width:5px;height:5px;top:-2px;left:calc(50% - 2.5px);box-shadow:0 0 0 1px #111}.automation-playing .knob-face>.automation-live{display:block}@media (width<=650px){.transport{padding:9px 7px;top:5px}.performance-row{gap:7px}.performance-row .play-button{width:43px}.jam-controls{gap:5px}.jam-controls .knob-face{width:46px;height:46px}.jam-controls .dial-label{font-size:8px}.jam-controls .gesture-control output{font-size:9px}.performance-tools .icon-button{width:28px;height:28px}.performance-tools #bar-position{font-size:7px}.mix-controls .knob-face{width:32px;height:32px}.instrument-nav button{font-size:9px}.visualizer-toolbar{bottom:calc(54px + env(safe-area-inset-bottom,0px))}body{padding-bottom:124px}}.app-header{justify-content:center}.brand{justify-content:center;width:100%;position:relative}.brand-wordmark{text-align:center}.studio-tools{overscroll-behavior-y:contain;max-height:min(68dvh,560px);overflow-y:auto}.studio-tools .session-panel{border:1px solid #777;margin-top:12px}.app-header{z-index:60;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);display:grid}.app-header .brand{grid-area:1/2}#header-visuals{grid-area:1/3;justify-self:end;min-width:0}#header-visuals .visualizer-toolbar{box-shadow:none;background:0 0;border:0;gap:0;max-width:none;padding:0;position:relative;inset:auto}#header-visuals .visualizer-top{display:none}#header-visuals .visualizer-controls{gap:8px;width:auto}#header-visuals .visualizer-controls .dial-control{flex-direction:column;gap:2px}#header-visuals .visualizer-controls .gesture-control{flex-direction:column;gap:3px;min-height:48px}#header-visuals .visualizer-controls .knob-face{width:30px;height:30px}#header-visuals .visualizer-controls .gesture-control output{width:auto}#header-visuals .visualizer-palettes{z-index:60;top:calc(100% + 8px);bottom:auto}@media (width<=920px){.app-header{grid-template-columns:minmax(0,1fr);gap:10px}.app-header .brand{grid-column:1}#header-visuals{border-top:1px solid #555;grid-area:2/1;justify-self:stretch;padding-top:8px}#header-visuals .visualizer-toolbar,#header-visuals .visualizer-bottom,#header-visuals .visualizer-controls{width:100%}#header-visuals .visualizer-controls{justify-content:space-evenly}#header-visuals .visualizer-palettes{width:100%;right:0}}.performance-row .playback{grid-template-columns:auto auto;display:grid}.performance-row .restart{grid-column:1/-1;justify-self:center}.record-button{width:40px;height:48px;font:inherit;flex-direction:column;gap:6px;font-size:9px}.record-dot{background:currentColor;border-radius:50%;width:13px;height:13px;display:block}.record-button[aria-pressed=true]{color:#fff;background:#922f3f;border-color:#d38c98}@media (width<=380px){.record-button{width:32px}}.instrument-content[hidden]{display:none}.studio-grid .panel>.section-header{cursor:pointer}.instrument-collapse-toggle{border:1px solid #666;flex:0 0 30px;width:30px;height:30px;margin-left:6px;font-size:20px;line-height:1}.instrument-collapsed>.section-header{border-bottom:0}.instrument-collapsed{padding-bottom:0}.opening-wordmark{z-index:90;pointer-events:none;color:#ededed;transform-origin:50%;will-change:transform, opacity;position:fixed}.opening-wordmark svg{width:100%;height:100%;display:block}
