#resonance-panel{--res-panel:#050506;--res-panel-2:#111113;--res-line:#2a2a2d;--res-text:#f6f6f4;--res-muted:#969694;--res-cyan:#5ef2ff;--res-amber:#f6f6f4;--res-red:#5ef2ff;--res-green:#f6f6f4;z-index:9000;border:1px solid var(--res-cyan);background:var(--res-panel);width:min(460px,50vw - 48px);max-height:calc(100vh - 64px);color:var(--res-text);letter-spacing:0;font-family:Monaspace Neon,monospace;position:fixed;top:50%;right:calc(50% + 8px);overflow:auto;transform:translateY(-50%);box-shadow:0 0 20px #5ef2ff26,inset 0 0 10px #5ef2ff0d}#resonance-panel,#resonance-panel *{box-sizing:border-box;border-radius:0}#resonance-panel[hidden]{display:none}.resonance-topbar,.resonance-grid,.resonance-adsr{gap:0;display:grid}.resonance-topbar{border-bottom:1px solid var(--res-line);grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:16px}.resonance-eyebrow{color:var(--res-cyan);letter-spacing:0;text-transform:uppercase;margin:0 0 4px;font-size:.75rem;font-weight:700}.resonance-status{min-height:20px;color:var(--res-muted);text-transform:uppercase;letter-spacing:0;margin:0;font-size:.75rem;font-weight:500}.resonance-status.error{color:var(--res-cyan)}#resonance-panel button,#resonance-panel input{font:inherit;letter-spacing:inherit}#resonance-panel button{border:1px solid var(--res-line);color:var(--res-text);background:var(--res-panel-2);cursor:pointer;text-transform:uppercase;font-size:.75rem;font-weight:700;transition:background-color .1s linear,color .1s linear,box-shadow .1s linear}#resonance-panel button:hover{background:var(--res-text);color:var(--res-panel)}#resonance-panel button:focus-visible,#resonance-panel input:focus-visible{outline:2px solid var(--res-amber);outline-offset:-4px}.resonance-power{background:var(--res-green);border-color:var(--res-green);min-width:96px;height:40px;color:var(--res-panel)}.resonance-power:hover{background:var(--res-green)}.resonance-power.running{background:var(--res-red);border-color:var(--res-red);color:var(--res-panel)}.resonance-close{width:40px;height:40px}#resonance-scope{aspect-ratio:48/13;border-top:1px solid var(--res-line);border-bottom:1px solid var(--res-line);background:var(--res-panel-2);width:100%;min-height:140px;margin:0;display:block}.resonance-grid{border-top:1px solid var(--res-line);grid-template-columns:1fr}.resonance-adsr{border-top:1px solid var(--res-line);grid-template-columns:repeat(4,minmax(0,1fr))}.resonance-control{border-right:1px solid var(--res-line);border-bottom:1px solid var(--res-line);background:var(--res-panel);grid-template-columns:1fr auto;gap:8px 12px;min-width:0;padding:12px;display:grid}.resonance-control:last-child,.resonance-adsr .resonance-control:nth-child(4n){border-right:none}.resonance-control>span{color:var(--res-muted);text-transform:uppercase;letter-spacing:0;font-size:.75rem;font-weight:600}.resonance-control output{color:var(--res-amber);font-variant-numeric:tabular-nums;font-weight:700}.resonance-control input[type=range]{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.resonance-slider{--fill:50%;--position:50%;user-select:none;touch-action:none;grid-column:1/-1;align-items:center;height:20px;margin:8px 0;display:flex;position:relative}.resonance-slider-track{border:1px solid var(--res-line);background:linear-gradient(to right, var(--res-cyan) var(--fill,50%), #000 var(--fill,50%));height:8px;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.resonance-slider-thumb{top:50%;left:var(--position,0%);background:var(--res-text);border:1px solid var(--res-text);cursor:grab;width:12px;height:12px;position:absolute;transform:translate(-50%,-50%)}.resonance-slider-thumb.dragging{cursor:grabbing}.resonance-waveforms,.resonance-patch-grid{grid-column:1/-1;gap:0;display:grid}.resonance-waveforms{grid-template-columns:repeat(5,minmax(0,1fr))}.resonance-patch-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.resonance-waveforms button,.resonance-patch-grid button{white-space:nowrap;text-overflow:ellipsis;border:none;min-height:40px;overflow:hidden}.resonance-waveforms button.active{background:var(--res-text);color:var(--res-panel);border:1px solid var(--res-text)}.resonance-patch-grid button:active{background:var(--res-cyan);color:var(--res-panel)}@media (width<=980px){#resonance-panel{width:auto;left:16px;right:16px}.resonance-topbar,.resonance-adsr{grid-template-columns:1fr}.resonance-power,.resonance-close{width:100%}.resonance-waveforms,.resonance-patch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}#cadence-panel{--cad-panel:#050506;--cad-panel-2:#111113;--cad-line:#2a2a2d;--cad-text:#f6f6f4;--cad-muted:#969694;--cad-magenta:#d97cff;z-index:9000;border:1px solid var(--cad-magenta);background:var(--cad-panel);width:min(460px,50vw - 48px);max-height:calc(100vh - 64px);color:var(--cad-text);letter-spacing:0;font-family:Monaspace Neon,monospace;position:fixed;top:50%;left:calc(50% + 8px);overflow:auto;transform:translateY(-50%);box-shadow:0 0 20px #d97cff26,inset 0 0 10px #d97cff0d}#cadence-panel,#cadence-panel *{box-sizing:border-box;border-radius:0}#cadence-panel[hidden]{display:none}.cadence-topbar{border-bottom:1px solid var(--cad-line);grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:16px;display:grid}.cadence-eyebrow{color:var(--cad-magenta);letter-spacing:0;text-transform:uppercase;margin:0 0 4px;font-size:.75rem;font-weight:700}.cadence-status{min-height:20px;color:var(--cad-muted);text-transform:uppercase;letter-spacing:0;margin:0;font-size:.75rem;font-weight:500}#cadence-panel button{font:inherit;letter-spacing:inherit;border:1px solid var(--cad-line);color:var(--cad-text);background:var(--cad-panel-2);cursor:pointer;text-transform:uppercase;font-size:.75rem;font-weight:700;transition:background-color .1s linear,color .1s linear}#cadence-panel button:hover{background:var(--cad-text);color:var(--cad-panel)}#cadence-panel button:focus-visible{outline:2px solid var(--cad-text);outline-offset:-4px}.cadence-power{min-width:96px;height:40px}.cadence-power.running{background:var(--cad-magenta);border-color:var(--cad-magenta);color:var(--cad-panel)}.cadence-close{width:40px;height:40px}.cadence-controls{border-bottom:1px solid var(--cad-line);grid-template-columns:1fr 1fr;display:grid}.cadence-section{border-right:1px solid var(--cad-line);padding:12px}.cadence-section:last-child{border-right:none}.cadence-section-label{color:var(--cad-muted);text-transform:uppercase;margin-bottom:8px;font-size:.7rem;font-weight:600}.cadence-bpm-display{color:var(--cad-text);font-variant-numeric:tabular-nums;margin-bottom:8px;font-size:1.5rem;font-weight:700}.cadence-bpm-controls{gap:4px;display:flex}.cadence-bpm-controls button{flex:1;height:32px;font-size:.75rem}.cadence-scenes{grid-template-columns:1fr;gap:4px;display:grid}.cadence-scenes button{text-align:left;height:32px;padding:0 12px}.cadence-scenes button.active{background:var(--cad-magenta);border-color:var(--cad-magenta);color:var(--cad-panel)}.cadence-grid-wrap{padding:12px}.cadence-grid-label{color:var(--cad-muted);text-transform:uppercase;margin-bottom:8px;font-size:.7rem;font-weight:600}.cadence-step-grid{grid-template-columns:repeat(16,1fr);gap:2px;display:grid}.cadence-step{aspect-ratio:1;background:var(--cad-panel-2);border:1px solid var(--cad-line);color:var(--cad-muted);font-variant-numeric:tabular-nums;justify-content:center;align-items:center;font-size:.6rem;transition:background-color 60ms linear;display:flex}.cadence-step.active{background:var(--cad-magenta);border-color:var(--cad-magenta);color:var(--cad-panel);font-weight:700}@media (width<=980px){#cadence-panel{width:auto;left:16px;right:16px}.cadence-controls{grid-template-columns:1fr}}