:root{--bg:#000;--ink:#e8fbff;--dim:#5f7d86;--cyan:#00f0ff;--magenta:#ff2bd6;--yellow:#ffe600;--green:#39ff88;--panel:#00080ed1;--line:#00f0ff73;--font:"Chakra Petch", system-ui, sans-serif;--mono:ui-monospace, "SF Mono", Menlo, monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);font-family:var(--font);margin:0;font-weight:500}#app{height:100%;position:relative;overflow:hidden}.grid-floor{background-image:linear-gradient(var(--magenta) 2px, transparent 2px), linear-gradient(90deg, var(--cyan) 2px, transparent 2px);transform-origin:top;opacity:.35;background-size:80px 80px;position:absolute;inset:45% -50% -10%;transform:perspective(300px)rotateX(62deg);-webkit-mask-image:linear-gradient(#0000,#000 40%);mask-image:linear-gradient(#0000,#000 40%)}.edit{grid-template:"bar bar""notes preview"1fr/minmax(560px,3fr) minmax(220px,.8fr);gap:14px;height:100%;padding:14px;display:grid;position:relative}.bar{border-bottom:2px solid var(--cyan);grid-area:bar;align-items:center;gap:14px;padding-bottom:10px;display:flex}.logo{letter-spacing:.08em;text-shadow:-3px 0 var(--magenta), 3px 0 var(--cyan);margin:0 auto 0 0;font-size:34px;font-style:italic;font-weight:700;position:relative}.chip{letter-spacing:.12em;text-transform:uppercase;border:1px solid;padding:3px 10px;font-size:13px}.chip-mode{color:var(--yellow)}.chip-midi{color:var(--dim)}.panel{background:var(--panel);border:1px solid var(--line);flex-direction:column;min-height:0;display:flex;box-shadow:0 0 0 1px #ff2bd640,0 0 24px #00f0ff1f}.panel-notes{grid-area:notes}.panel-preview{grid-area:preview}.panel-title{letter-spacing:.16em;text-transform:uppercase;color:var(--bg);background:var(--cyan);margin:0;padding:8px 12px;font-size:14px;font-weight:700}.patch-list{margin:0;padding:8px;list-style:none;overflow:auto}.patch{width:100%;color:var(--ink);font:inherit;text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;gap:10px;padding:6px 8px;display:flex}.patch:hover{border-color:var(--line)}.patch[aria-pressed=true]{color:var(--bg);background:var(--magenta)}.patch:focus-visible{outline:2px solid var(--yellow);outline-offset:2px}.patch-number{font-family:var(--mono)}.notes-scroll{z-index:2;flex:1;min-height:0;display:flex;position:relative;overflow:auto}.screen{z-index:2;background:#000;flex:1;place-items:center;min-height:0;padding:10px;display:grid;position:relative}.stage{width:100%}.frame{width:100%;aspect-ratio:var(--aspect,16 / 9);background:#000;position:relative;overflow:hidden}#output{z-index:2000000;width:100%;height:100%;display:block;position:relative}.youtube-layer{pointer-events:none;position:absolute;inset:0}.youtube-player{position:absolute;inset:0;overflow:hidden}.youtube-player iframe{border:0;width:100%;height:100%;position:absolute;inset:0}.youtube-layer.hide-branding .youtube-player iframe{--band:max(15%, 64px);top:calc(-1 * var(--band));height:calc(100% + 2 * var(--band))}.scanlines{z-index:1;pointer-events:none;background:repeating-linear-gradient(#0000 0 2px,#00000059 2px 3px);position:absolute;inset:0}button.chip{color:var(--cyan);font:inherit;cursor:pointer;background:0 0;font-size:13px}button.chip:hover{color:var(--bg);background:var(--cyan)}button.chip:focus-visible{outline:2px solid var(--yellow);outline-offset:2px}.about{background:var(--bg);width:100vw;max-width:none;height:100vh;max-height:none;color:var(--ink);font-family:var(--font);border:0;margin:0;padding:0;overflow:hidden}.about::backdrop{background:#000}.about .grid-floor{opacity:.6;animation:1.6s linear infinite floor}.about-body{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:18px;height:100%;padding:24px;display:flex;position:relative}.about-title{margin:0;font-size:clamp(56px,12vw,140px);animation:4s step-end infinite stutter}.about-tagline{color:var(--yellow);letter-spacing:.16em;text-transform:uppercase;margin:0;font-size:18px}.about-credits{color:var(--dim);margin:0;padding:0;line-height:1.8;list-style:none}@keyframes floor{to{background-position:0 80px}}@keyframes stutter{0%,86%,to{transform:none}88%{transform:translate(-6px,1px)skew(-12deg)}90%{transform:translate(4px,-1px)}92%{transform:translate(-2px)scaleX(1.06)}}@media (prefers-reduced-motion:reduce){.about .grid-floor,.about-title{animation:none}}.chip-midi.connected{color:var(--green)}.form-dialog{border:1px solid var(--cyan);background:var(--panel);width:min(440px,100vw - 32px);color:var(--ink);font-family:var(--font);padding:0;box-shadow:0 0 0 1px #ff2bd666,0 0 40px #00f0ff40}.form-dialog::backdrop{background:#000000b3}.form-dialog form{margin:0}.dialog-fields{gap:10px;padding:16px;display:grid}.dialog-fields label{align-items:center;gap:8px;display:flex}.dialog-fields input[type=checkbox]{accent-color:var(--magenta)}.dialog-fields input[type=number],.dialog-fields input[type=text],.dialog-fields textarea,.dialog-fields select{border:1px solid var(--line);color:var(--ink);font:inherit;background:#000;padding:3px 6px}.dialog-fields .dialog-text{flex-direction:column;align-items:stretch}.dialog-message{margin:0;line-height:1.5}.clip-file{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding-bottom:10px;display:flex}.clip-file-name{text-overflow:ellipsis;white-space:nowrap;font-family:var(--mono);overflow:hidden}.clip-priority input{width:6em}.dialog-actions{justify-content:flex-end;gap:10px;padding:0 16px 16px;display:flex}.dialog-actions .danger{color:var(--magenta);margin-right:auto}.dialog-actions .primary{color:var(--yellow)}.chip-notice{color:var(--green)}.chip-notice.warning{color:var(--yellow)}.chip-notice:empty{display:none}.chip-storage{color:var(--dim)}.chip-storage.warning,.chip-perform{color:var(--yellow)}.menu-toggle.chip-live{color:var(--magenta)}.menu-list{inset:auto;top:anchor(bottom);left:anchor(left);background:var(--panel);border:1px solid var(--cyan);flex-direction:column;min-width:200px;margin:6px 0 0;padding:4px;box-shadow:0 0 24px #00f0ff40}.menu-list:popover-open{display:flex}.menu-item{color:var(--cyan);font:inherit;letter-spacing:.12em;text-align:left;text-transform:uppercase;cursor:pointer;background:0 0;border:0;padding:7px 10px;font-size:13px}.menu-item:hover,.menu-item:focus-visible{color:var(--bg);background:var(--cyan);outline:none}.menu-item[aria-pressed=true]{color:var(--magenta)}.stage:fullscreen{background:#000;place-items:center;display:grid}.stage:fullscreen .frame{width:min(100vw, calc(100vh * var(--aspect,16 / 9)))}.patch-list{flex:1}.patch-actions{border-top:1px solid var(--line);flex-wrap:wrap;gap:6px;padding:8px;display:flex}.patch-actions .chip{padding:2px 8px;font-size:11px}.pad-grid{flex:1;grid-template-rows:auto;grid-template-columns:2.6em repeat(12,minmax(54px,1fr));grid-auto-rows:minmax(52px,1fr);gap:4px;padding:8px;display:grid}.pad-heading,.pad-octave{color:var(--yellow);letter-spacing:.08em;text-align:center;align-self:center;font-size:11px;font-weight:700}.pad-heading{z-index:1;background:#000;padding:2px 0;position:sticky;top:0}.pad-heading.sharp{color:var(--dim)}.pad{border:1px solid var(--line);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;background:#000;min-height:0;position:relative;overflow:hidden}.pad.sharp{background:#05080c;border-color:#00f0ff38}.pad{background-position:50%;background-size:cover}.pad-thumb{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.pad.empty .pad-thumb{display:none}.pad-key,.pad-name{background:#000000b3;padding:1px 5px;font-size:13px;line-height:1.4;position:absolute}.pad-key{color:var(--bg);background:var(--yellow);font-weight:700;top:0;right:0}.pad-key:empty,.pad-name:empty{display:none}.pad-name{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;bottom:3px;left:0;right:0;overflow:hidden}.pad-progress{height:3px;position:absolute;bottom:0;left:0;right:0}.pad-progress-bar{background:var(--magenta);width:0;height:100%;display:block}.pad-edit{border:1px solid var(--cyan);color:var(--cyan);font:inherit;cursor:pointer;opacity:0;background:#000c;padding:0 5px;font-size:10px;position:absolute;bottom:14px;right:2px}.pad.empty .pad-edit{display:none}.pad:hover .pad-edit,.pad-edit:focus-visible{opacity:1}.pad:hover{border-color:var(--cyan)}.pad.in-range{border-color:var(--yellow)}.pad.missing .pad-name{color:var(--magenta)}.pad.drop-target{border-color:var(--yellow);box-shadow:inset 0 0 0 2px var(--yellow)}.pad.playing{border-color:var(--green);box-shadow:inset 0 0 0 2px var(--green), 0 0 12px #39ff8880}.panel-notes{position:relative;overflow:hidden}.patch-toggle{color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;background:0 0;border:0;padding:0}.patch-toggle:hover,.patch-toggle[aria-expanded=true]{color:var(--magenta)}.patch-toggle:focus-visible{outline:2px solid var(--bg);outline-offset:2px}.patch-drawer{z-index:3;background:var(--bg);border-right:1px solid var(--cyan);flex-direction:column;width:220px;transition:transform .14s ease-out;display:flex;position:absolute;top:33px;bottom:0;left:0;transform:translate(-105%);box-shadow:8px 0 24px #000000b3}.patch-drawer.open{transform:none}.patch-drawer .panel-title{background:var(--magenta)}@media (prefers-reduced-motion:reduce){.patch-drawer{transition:none}}.chip-hold{color:var(--bg);background:var(--magenta);border-color:var(--magenta)}.chip-hold[hidden]{display:none}.channel-grid{grid-template-columns:repeat(4,1fr);gap:4px;margin:4px 0;display:grid}.channel[aria-pressed=true]{color:var(--bg);background:var(--cyan)}.panel-notes .panel-title{justify-content:space-between;align-items:center;display:flex}.title-actions{align-items:center;gap:8px;display:flex}.panel-notes .chip-keys{border-color:var(--bg);padding:1px 8px;font-size:11px}.panel-title .assign-button{border-color:var(--bg);color:var(--bg);padding:1px 8px;font-size:11px}.panel-title .assign-button:hover{color:var(--cyan);background:var(--bg)}.note-name{color:var(--yellow);font-family:var(--mono);margin-left:8px}.sketch-area{visibility:hidden;pointer-events:none;position:fixed;top:0;left:0}.sketch-frame{border:0;width:100%;height:100%;position:absolute;inset:0}.dialog-section{border-top:1px solid var(--line);letter-spacing:.16em;text-transform:uppercase;color:var(--yellow);margin:10px 0 0;padding-top:8px;font-size:12px}.report-facts{grid-template-columns:max-content 1fr;gap:4px 16px;margin:8px 0;display:grid}.report-facts dt{color:var(--dim)}.report-facts dd{font-variant-numeric:tabular-nums;margin:0}.report-list{margin:6px 0;padding-left:18px}.report-table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;font-size:12px}.report-table th,.report-table td{text-align:left;border-bottom:1px solid var(--line);padding:3px 6px}