:root{--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-pill:50px;--text-xs:14px;--text-sm:16px;--text-md:18px;--text-lg:22px;--text-xl:28px;--text-2xl:36px;--font-sketch:"Caveat", "Comic Sans MS", cursive;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--node-min-width:180px;--node-header-height:40px;--port-size:16px;--port-spacing:28px;--transition-fast:.15s ease;--transition-normal:.25s ease;--transition-slow:.4s ease;--shadow-node:2px 3px 0 #0000001a;--shadow-menu:3px 4px 0 #00000026;--shadow-sketch:2px 2px 0 var(--sketch-black);--border-sketch-width:2px;--overlay-scrim:#00000073;--z-node:10;--z-panel:100;--z-popover:1000;--z-modal:2000;--z-toast:3000;--z-top:10000}.context-menu{background:var(--bg-node);border:1px solid var(--border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-menu);z-index:1000;will-change:opacity, transform;min-width:180px;animation:.1s menuFadeIn;position:fixed}@keyframes menuFadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.context-menu-category{position:relative}.context-menu-category-header{padding:var(--space-sm) var(--space-md);color:var(--text-primary);cursor:pointer;transition:background var(--transition-fast);justify-content:space-between;align-items:center;font-weight:500;display:flex}.context-menu-category-header:hover{background:var(--bg-tertiary)}.context-menu-category-icon{margin-right:var(--space-sm)}.context-menu-category-arrow{color:var(--text-muted);font-size:var(--text-sm)}.context-menu-submenu{background:var(--bg-node);border:1px solid var(--border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-menu);z-index:1001;opacity:0;visibility:hidden;min-width:160px;transition:opacity .15s,transform .15s,visibility .15s;position:absolute;top:0;left:100%;transform:translate(-10px)}.context-menu-category:hover>.context-menu-submenu{opacity:1;visibility:visible;transform:translate(0)}.context-menu-item{padding:var(--space-sm) var(--space-md);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);align-items:center;display:flex}.context-menu-item:hover{background:var(--accent-primary);color:#fff}.context-menu-separator{background:var(--border-subtle);height:1px;margin:var(--space-xs) 0}.context-menu-header{padding:var(--space-sm) var(--space-md);color:var(--text-muted);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border-subtle)}.oj-btn{padding:var(--space-xs) var(--space-sm);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-md);font-family:var(--font-sketch);font-size:var(--text-sm);background:var(--bg-node);color:var(--text-primary);cursor:pointer;transition:background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast);justify-content:center;align-items:center;font-weight:500;display:flex}.oj-btn:hover{background:var(--bg-tertiary);transform:translateY(-1px)}.oj-btn:active{transform:translateY(1px)}.oj-btn--primary{background:var(--accent-primary);color:var(--text-on-accent)}.oj-btn--primary:hover{background:var(--accent-secondary)}.oj-btn--secondary{background:var(--bg-tertiary);color:var(--text-secondary)}.oj-btn--secondary:hover{background:var(--bg-canvas-alt);color:var(--text-primary)}.oj-btn--success{background:var(--accent-success);color:var(--text-on-accent)}.oj-btn--danger{background:var(--accent-danger);color:var(--text-on-accent)}.oj-btn.is-active{background:var(--accent-success);color:var(--text-on-accent)}.oj-btn--ghost{color:var(--text-primary);background:0 0;border-color:#0000}.oj-btn--ghost:hover{background:var(--bg-tertiary);transform:none}.oj-btn--ghost:active{transform:none}.oj-btn--link{color:var(--accent-primary);background:0 0;border-color:#0000;padding-left:0;padding-right:0}.oj-btn--link:hover{background:0 0;text-decoration:underline;transform:none}.oj-btn--link:active{transform:none}.oj-btn--icon-only{padding:var(--space-xs);aspect-ratio:1;min-width:0}.oj-input{width:100%;padding:var(--space-xs) var(--space-sm);background:var(--bg-canvas);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-sm);color:var(--text-primary);font-size:var(--text-sm);font-family:var(--font-mono)}.oj-input:focus{border-color:var(--accent-primary);outline:none}.oj-field{gap:var(--space-xs);margin-bottom:var(--space-sm);flex-direction:column;display:flex}.oj-field--row{align-items:center;gap:var(--space-sm);flex-direction:row}.oj-field__label{font-family:var(--font-sketch);font-size:var(--text-sm);color:var(--text-muted)}.oj-select{padding:var(--space-xs) var(--space-sm);background:var(--bg-canvas);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-sm);color:var(--text-primary);font-family:var(--font-sketch);font-size:var(--text-sm);cursor:pointer;flex:1}.oj-select:focus{border-color:var(--accent-primary);outline:none}.oj-port{width:var(--port-size);height:var(--port-size);border:var(--border-sketch-width) solid var(--sketch-black);background:var(--bg-canvas);cursor:crosshair;transition:transform var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);border-radius:50%;display:inline-block}.oj-port:hover{background:var(--bg-tertiary);transform:scale(1.25)}.oj-port--audio-input{background:var(--audio-input)}.oj-port--audio-output{background:var(--audio-output)}.oj-port--control-input{background:var(--control-input)}.oj-port--control-output{background:var(--control-output)}.oj-port--audio-input.is-connected,.oj-port--audio-output.is-connected{background:var(--audio-connected);box-shadow:0 0 8px var(--audio-connected)}.oj-port--control-input.is-connected,.oj-port--control-output.is-connected{background:var(--control-connected);box-shadow:0 0 8px var(--control-connected)}.oj-port--universal{background:linear-gradient(135deg,#ff6b6b,#ffe66d,#4ecb71,#4db8ff,#9b59b6) 0 0/200% 200%;animation:3s infinite oj-port-rainbow}.oj-port--universal.is-connected{animation:none}@keyframes oj-port-rainbow{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}@media (prefers-reduced-motion:reduce){.oj-port--universal{animation:none}}.oj-port.is-placeholder{opacity:.4;cursor:copy;border-style:dashed}.oj-port.is-active{background:var(--accent-success);box-shadow:0 0 10px var(--accent-success);animation:.3s ease-in-out oj-port-active-pulse}@keyframes oj-port-active-pulse{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@media (prefers-reduced-motion:reduce){.oj-port.is-active{animation:none}}.oj-node{min-width:var(--node-min-width);background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-lg);box-shadow:var(--shadow-node);user-select:none;transition:box-shadow var(--transition-fast), border-color var(--transition-fast)}.oj-node.is-selected{border-color:var(--accent-primary);box-shadow:var(--shadow-node), 0 0 0 3px color-mix(in srgb, var(--accent-primary) 25%, transparent)}.oj-node.is-dragging{opacity:.95;cursor:grabbing;box-shadow:var(--shadow-menu)}.oj-node.is-agent-pending{border-color:var(--audio-connected);box-shadow:var(--shadow-node), 0 0 0 3px color-mix(in srgb, var(--audio-connected) 45%, transparent);animation:1.2s ease-in-out infinite oj-agent-pending}@keyframes oj-agent-pending{0%,to{box-shadow:var(--shadow-node), 0 0 0 2px color-mix(in srgb, var(--audio-connected) 28%, transparent)}50%{box-shadow:var(--shadow-node), 0 0 0 4px color-mix(in srgb, var(--audio-connected) 55%, transparent)}}@media (prefers-reduced-motion:reduce){.oj-node.is-agent-pending{animation:none}}.oj-node__header{padding:var(--space-sm) var(--space-md);background:var(--bg-node-header);border-bottom:1px solid var(--border-subtle);border-radius:var(--radius-lg) var(--radius-lg) 0 0;cursor:grab;justify-content:space-between;align-items:center;display:flex}.oj-node__header:active{cursor:grabbing}.oj-node__title{font-family:var(--font-sketch);font-weight:600;font-size:var(--text-lg);color:var(--text-primary)}.oj-node__type{font-family:var(--font-sketch);font-size:var(--text-sm);color:var(--text-muted)}.oj-node__content{padding:var(--space-md)}.oj-node__ports{padding:var(--space-sm) 0;justify-content:space-between;display:flex}.oj-node__ports-left,.oj-node__ports-right{gap:var(--space-sm);flex-direction:column;display:flex}.oj-node__ports-left{padding-left:var(--space-sm);align-items:flex-start}.oj-node__ports-right{padding-right:var(--space-sm);align-items:flex-end}.oj-surface{background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);color:var(--text-primary)}.oj-surface--elevation-rest{box-shadow:var(--shadow-node)}.oj-surface--elevation-menu{box-shadow:var(--shadow-menu)}.oj-surface--elevation-lifted{box-shadow:4px 5px 0 var(--sketch-black)}.oj-surface--radius-md{border-radius:var(--radius-md)}.oj-surface--radius-lg{border-radius:var(--radius-lg)}.oj-surface--radius-xl{border-radius:var(--radius-xl)}.oj-callout{gap:var(--space-sm);padding:var(--space-md);background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);border-left-width:var(--space-xs);border-left-color:var(--callout-accent);border-radius:var(--radius-md);display:flex}.oj-callout--info{--callout-accent:var(--audio-connection)}.oj-callout--success{--callout-accent:var(--accent-success)}.oj-callout--warning{--callout-accent:var(--accent-warning)}.oj-callout--danger{--callout-accent:var(--accent-danger)}.oj-callout--tip{--callout-accent:var(--accent-secondary)}.oj-callout__icon{width:var(--text-lg);height:var(--text-lg);color:var(--callout-accent);flex-shrink:0;justify-content:center;align-items:center;display:flex}.oj-callout__icon svg{width:100%;height:100%}.oj-callout__body{flex:1;min-width:0}.oj-callout__title{margin-bottom:var(--space-xs);font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-primary);font-weight:600;line-height:1.2}.oj-callout__content{font-family:var(--font-sans);font-size:var(--text-sm);color:var(--text-secondary);line-height:1.5}.oj-chip{align-items:center;gap:var(--space-xs);max-width:100%;padding:var(--space-xs) var(--space-sm);border:var(--border-sketch-width) solid var(--border-subtle);border-radius:var(--radius-pill);font-family:var(--font-sketch);font-size:var(--text-sm);background:var(--bg-tertiary);color:var(--text-secondary);transition:background var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);line-height:1;display:inline-flex}.oj-chip--success{border-color:var(--accent-success);color:var(--accent-success)}.oj-chip--warning{border-color:var(--accent-warning);color:var(--accent-warning)}.oj-chip--danger{border-color:var(--accent-danger);color:var(--accent-danger)}.oj-chip.is-pressed{background:var(--bg-secondary);border-color:var(--border-strong);color:var(--text-primary)}.oj-chip__glyph{opacity:.85;align-items:center;display:inline-flex}.oj-chip__label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.oj-chip__count{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted)}.oj-kbd{padding:var(--space-xs) var(--space-sm);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:var(--text-xs);background:var(--bg-tertiary);color:var(--text-secondary);white-space:nowrap;justify-content:center;align-items:center;line-height:1;display:inline-flex}.oj-kbd--custom{border-color:var(--accent-secondary);color:var(--accent-secondary)}.oj-status-dot{width:var(--space-sm);height:var(--space-sm);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-pill);background:var(--text-muted);flex-shrink:0;display:inline-block}.oj-status-dot--ok{background:var(--accent-success)}.oj-status-dot--warn{background:var(--accent-warning)}.oj-status-dot--bad{background:var(--accent-danger)}.oj-status-dot--idle{background:var(--text-muted)}.oj-status-dot--info{background:var(--audio-connection)}.oj-spinner{box-sizing:border-box;border:var(--border-sketch-width) solid var(--border-subtle);border-top-color:var(--accent-primary);border-radius:var(--radius-pill);animation:oj-spinner-rotate var(--transition-slow) linear infinite;display:inline-block}@keyframes oj-spinner-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.oj-spinner{animation:none}}.oj-progress{background:var(--bg-tertiary);border:1px solid var(--sketch-light);border-radius:var(--radius-sm);width:100%;height:6px;overflow:hidden}.oj-progress__fill{background:var(--accent-primary);height:100%;transition:width var(--transition-fast) linear}.oj-progress--success .oj-progress__fill{background:var(--accent-success)}.oj-progress--warning .oj-progress__fill{background:var(--accent-warning)}.oj-progress--danger .oj-progress__fill{background:var(--accent-danger)}.oj-textarea{width:100%;padding:var(--space-xs) var(--space-sm);background:var(--bg-canvas);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-sm);color:var(--text-primary);font-size:var(--text-sm);font-family:var(--font-sans);resize:vertical}.oj-textarea:focus{border-color:var(--accent-primary);outline:none}.oj-slider{appearance:none;width:100%;height:var(--space-md);cursor:pointer;transition:opacity var(--transition-fast);background:0 0;margin:0}.oj-slider::-webkit-slider-runnable-track{height:var(--space-xs);border-radius:var(--radius-pill);background:var(--bg-tertiary);border:var(--border-sketch-width) solid var(--sketch-light)}.oj-slider::-moz-range-track{height:var(--space-xs);border-radius:var(--radius-pill);background:var(--bg-tertiary);border:var(--border-sketch-width) solid var(--sketch-light)}.oj-slider::-moz-range-progress{height:var(--space-xs);border-radius:var(--radius-pill);background:var(--sketch-light)}.oj-slider::-webkit-slider-thumb{appearance:none;width:var(--space-md);height:var(--space-md);margin-top:calc((var(--space-md) - var(--space-xs)) / -2);border-radius:var(--radius-pill);background:var(--accent-primary);border:var(--border-sketch-width) solid var(--sketch-black);box-shadow:var(--shadow-sketch);cursor:grab;transition:background var(--transition-fast), transform var(--transition-fast)}.oj-slider::-moz-range-thumb{width:var(--space-md);height:var(--space-md);border-radius:var(--radius-pill);background:var(--accent-primary);border:var(--border-sketch-width) solid var(--sketch-black);box-shadow:var(--shadow-sketch);cursor:grab;transition:background var(--transition-fast), transform var(--transition-fast)}.oj-slider:hover::-webkit-slider-thumb{background:var(--accent-secondary);transform:translateY(-1px)}.oj-slider:hover::-moz-range-thumb{background:var(--accent-secondary);transform:translateY(-1px)}.oj-slider:active::-webkit-slider-thumb{cursor:grabbing;transform:translateY(1px)}.oj-slider:active::-moz-range-thumb{cursor:grabbing;transform:translateY(1px)}.oj-slider:disabled{opacity:.5;cursor:not-allowed}.oj-slider:disabled::-webkit-slider-thumb{cursor:not-allowed}.oj-slider:disabled::-moz-range-thumb{cursor:not-allowed}.oj-toggle{align-items:flex-start;gap:var(--space-sm);cursor:pointer;font-family:var(--font-sketch);display:flex}.oj-toggle__input{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.oj-toggle__track{width:var(--space-xl);height:var(--space-md);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-pill);background:var(--bg-tertiary);transition:background var(--transition-fast);flex:none;position:relative}.oj-toggle__knob{width:calc(var(--space-md) - var(--space-xs) - 2px);height:calc(var(--space-md) - var(--space-xs) - 2px);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-pill);background:var(--bg-node);transition:transform var(--transition-fast), background var(--transition-fast);position:absolute;top:1px;left:1px}.oj-toggle.is-checked .oj-toggle__track{background:var(--accent-success)}.oj-toggle.is-checked .oj-toggle__knob{transform:translateX(calc(var(--space-xl) - var(--space-md) - 2px));background:var(--text-on-accent)}.oj-toggle:active .oj-toggle__knob{transform:translateY(1px)}.oj-toggle.is-checked:active .oj-toggle__knob{transform:translateX(calc(var(--space-xl) - var(--space-md) - 2px)) translateY(1px)}.oj-toggle__text{gap:var(--space-xs);flex-direction:column;display:flex}.oj-toggle__label{font-size:var(--text-md);color:var(--text-primary);line-height:1.2}.oj-toggle__desc{font-size:var(--text-sm);color:var(--text-muted);max-width:60ch;line-height:1.5}.oj-toggle.is-disabled{cursor:not-allowed;opacity:.5}.oj-seg{border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-pill);background:var(--bg-node);align-self:flex-start;display:inline-flex;overflow:hidden}.oj-seg__btn{appearance:none;color:var(--text-secondary);font-family:var(--font-sketch);font-size:var(--text-sm);padding:var(--space-xs) var(--space-lg);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);background:0 0;border:none;font-weight:500}.oj-seg__btn+.oj-seg__btn{border-left:var(--border-sketch-width) solid var(--border-subtle)}.oj-seg__btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.oj-seg__btn:disabled{cursor:not-allowed;color:var(--text-muted)}.oj-seg__btn:disabled:hover{color:var(--text-muted);background:0 0}.oj-seg__btn.is-active{background:var(--accent-primary);color:var(--text-on-accent)}.oj-seg.is-disabled{opacity:.55;cursor:not-allowed}.oj-seg--vertical{background:0 0;border:none;border-radius:0;flex-direction:column;align-self:stretch;display:flex;overflow:visible}.oj-seg--vertical .oj-seg__btn{text-align:left;width:100%;padding:var(--space-sm) var(--space-lg);font-size:var(--text-md);color:var(--text-muted);transition:color var(--transition-fast), background var(--transition-fast)}.oj-seg--vertical .oj-seg__btn+.oj-seg__btn{border-left:none}.oj-seg--vertical .oj-seg__btn:hover{color:var(--text-primary);background:var(--bg-tertiary)}.oj-seg--vertical .oj-seg__btn.is-active{color:var(--text-primary);background:var(--bg-tertiary);box-shadow:inset calc(-1 * var(--border-sketch-width)) 0 0 0 var(--sketch-black)}.oj-list{gap:var(--space-xs);flex-direction:column;min-height:0;display:flex;overflow-y:auto}.oj-list-row{align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-sm);border:var(--border-sketch-width) solid transparent;border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-sketch);font-size:var(--text-md);cursor:pointer;user-select:none;transition:background var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);background:0 0;display:flex}.oj-list-row:hover{background:var(--bg-tertiary)}.oj-list-row.is-selected{border-color:var(--accent-primary);background:color-mix(in srgb, var(--accent-primary) 12%, transparent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent-primary) 25%, transparent)}.oj-list-row.is-selected:hover{background:color-mix(in srgb, var(--accent-primary) 18%, transparent)}.oj-list-row.is-current{box-shadow:inset 3px 0 0 var(--accent-primary)}.oj-list-row.is-selected.is-current{box-shadow:inset 3px 0 0 var(--accent-primary), 0 0 0 3px color-mix(in srgb, var(--accent-primary) 25%, transparent)}.oj-list-row.is-disabled{opacity:.5;cursor:default;pointer-events:none}.oj-list-row__body{flex:1;min-width:0}.oj-list-row__actions{align-items:center;gap:var(--space-xs);flex-shrink:0;display:flex}.oj-marquee{border:1px dashed var(--accent-primary);background:color-mix(in srgb, var(--accent-primary) 10%, transparent);pointer-events:none;position:absolute}.oj-offscreen-pointer{align-items:center;gap:var(--space-sm);padding:var(--space-lg);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-lg);background:var(--bg-node);color:var(--text-primary);cursor:pointer;box-shadow:var(--shadow-menu);transition:background var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);flex-direction:column;display:flex}.oj-offscreen-pointer:hover{background:var(--bg-tertiary);border-color:var(--accent-primary);transform:translateY(-2px)}.oj-offscreen-pointer:active{transform:translateY(1px)}.oj-offscreen-pointer__arrow{font-family:var(--font-sketch);font-size:var(--text-2xl);transform:rotate(var(--oj-pointer-rotation,0deg));line-height:1}.oj-offscreen-pointer__label{font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-secondary)}.oj-swatch{gap:var(--space-xs);padding:var(--space-xs);border:var(--border-sketch-width) solid var(--border-strong);border-radius:var(--radius-lg);background:var(--bg-node);cursor:pointer;transition:border-color var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast);flex-direction:column;display:flex}.oj-swatch:hover{border-color:var(--accent-primary);transform:translateY(-1px)}.oj-swatch:active{transform:translateY(1px)}.oj-swatch.is-selected{border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--accent-primary)}.oj-swatch__preview{height:var(--space-xl);border-radius:var(--radius-sm);border:var(--border-sketch-width) solid var(--border-subtle);justify-content:center;align-items:center;display:flex}.oj-swatch__chip{width:var(--space-lg);height:var(--space-md);border-radius:var(--radius-sm);border:var(--border-sketch-width) solid var(--border-subtle)}.oj-swatch__name{font-family:var(--font-sketch);font-size:var(--text-sm);color:var(--text-primary);text-align:center;font-weight:500}.oj-code{padding:var(--space-sm);border:var(--border-sketch-width) solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-primary);font-family:var(--font-mono);font-size:var(--text-xs);white-space:pre-wrap;word-break:break-word;user-select:text;margin:0;line-height:1.45;overflow:auto}.oj-code.is-unselectable{user-select:none}.oj-icon{vertical-align:middle;color:inherit;flex:none;display:inline-block}.oj-icon-btn{line-height:0}.oj-modal__scrim{z-index:var(--z-modal);padding:var(--space-lg);background:var(--overlay-scrim);justify-content:center;display:flex;position:fixed;inset:0}.oj-modal__scrim--align-top{align-items:flex-start}.oj-modal__scrim--align-center{align-items:center}.oj-modal__scrim--align-bottom{align-items:flex-end}.oj-modal{width:100%;max-height:calc(100vh - 2 * var(--space-lg));outline:none;overflow:auto}.oj-modal--size-sm{max-width:22.5rem}.oj-modal--size-md{max-width:32.5rem}.oj-modal--size-lg{max-width:47.5rem}.oj-modal--size-auto{width:auto;max-width:calc(100vw - 2 * var(--space-lg))}.oj-panel-header{gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--border-subtle);flex-direction:column;display:flex}.oj-panel-header__row{justify-content:space-between;align-items:center;gap:var(--space-md);display:flex}.oj-panel-header__left{align-items:center;gap:var(--space-sm);min-width:0;display:flex}.oj-panel-header__back{gap:var(--space-xs);flex-shrink:0}.oj-panel-header__back-chevron{transform:rotate(180deg)}.oj-panel-header__heading{gap:var(--space-xs);flex-direction:column;min-width:0;display:flex}.oj-panel-header__title-row{align-items:center;gap:var(--space-sm);min-width:0;display:flex}.oj-panel-header__title{font-family:var(--font-sketch);font-size:var(--text-lg);color:var(--text-primary);text-overflow:ellipsis;white-space:nowrap;font-weight:600;line-height:1.2;overflow:hidden}.oj-panel-header__badge{flex-shrink:0;align-items:center;display:inline-flex}.oj-panel-header__subtitle{font-family:var(--font-sans);font-size:var(--text-sm);color:var(--text-secondary);line-height:1.4}.oj-panel-header__right{align-items:center;gap:var(--space-sm);flex-shrink:0;display:flex}.oj-panel-header__actions{align-items:center;gap:var(--space-xs);display:flex}.oj-panel-header__extra{flex-direction:column;display:flex}.oj-menu{min-width:var(--node-min-width);padding:var(--space-xs) 0;flex-direction:column;display:flex}.oj-menu-item{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);font-family:var(--font-sketch);font-size:var(--text-sm);color:var(--text-primary);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);outline:none;display:flex}.oj-menu-item:hover,.oj-menu-item:focus-visible{background:var(--accent-primary);color:var(--text-on-accent)}.oj-menu-item:hover .oj-menu-item__shortcut,.oj-menu-item:focus-visible .oj-menu-item__shortcut{border-color:var(--text-on-accent);color:var(--text-on-accent);background:0 0}.oj-menu-item:hover .oj-menu-item__chevron,.oj-menu-item:focus-visible .oj-menu-item__chevron,.oj-menu-item:hover .oj-menu-item__icon,.oj-menu-item:focus-visible .oj-menu-item__icon{color:var(--text-on-accent)}.oj-menu-item[aria-disabled=true]{opacity:.5;cursor:not-allowed}.oj-menu-item[aria-disabled=true]:hover{color:var(--text-primary);background:0 0}.oj-menu-item__icon{color:var(--text-muted);align-items:center;display:inline-flex}.oj-menu-item__label{white-space:nowrap;flex:1}.oj-menu-item__shortcut{margin-left:var(--space-md)}.oj-menu-item__chevron{margin-left:var(--space-xs);color:var(--text-muted);align-items:center;display:inline-flex}.oj-menu-item--has-submenu{position:relative}.oj-menu-item__submenu{top:calc(var(--space-xs) * -1);margin-left:var(--space-xs);z-index:var(--z-popover);display:none;position:absolute;left:100%}.oj-menu-item--has-submenu:hover>.oj-menu-item__submenu,.oj-menu-item--has-submenu:focus-within>.oj-menu-item__submenu{display:block}.oj-menu-category{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-md);font-family:var(--font-sans);font-size:var(--text-xs);letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);font-weight:600;display:flex}.oj-menu-category__icon{align-items:center;display:inline-flex}.oj-menu-category__label{white-space:nowrap}.oj-menu-separator{height:1px;margin:var(--space-xs) 0;background:var(--border-subtle)}.oj-port-row{align-items:center;gap:var(--space-xs);display:flex}.oj-port-row--input{text-align:left;flex-direction:row;justify-content:flex-start}.oj-port-row--output{text-align:right;flex-direction:row-reverse;justify-content:flex-start}.oj-port-row__label{font-family:var(--font-sketch);font-size:var(--text-sm);color:var(--text-secondary);line-height:1.2}.oj-port-row__label--hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.oj-port-row.is-connected .oj-port-row__label{color:var(--text-primary)}.oj-port-row.is-placeholder .oj-port-row__label{color:var(--text-muted)}.oj-port-row.is-disabled{opacity:.4;cursor:not-allowed}.oj-port-row.is-disabled .oj-port-row__label{color:var(--text-muted);font-style:italic}.oj-node-frame{z-index:var(--z-node);cursor:grab;position:absolute;top:0;left:0}.oj-node-frame.is-dragging{cursor:grabbing}.oj-editable-label{min-width:0;display:inline-flex}.oj-editable-label--center{text-align:center;justify-content:center}.oj-editable-label__text{max-width:100%;padding:var(--space-xs) var(--space-sm);border:var(--border-sketch-width) solid transparent;border-radius:var(--radius-sm);font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-primary);cursor:text;text-overflow:ellipsis;white-space:nowrap;transition:background var(--transition-fast), border-color var(--transition-fast);display:inline-block;overflow:hidden}.oj-editable-label__text:hover{background:var(--bg-tertiary)}.oj-editable-label__text:focus-visible{border-color:var(--accent-primary);outline:none}.oj-editable-label--center .oj-editable-label__text{text-align:center}.oj-editable-label__text.is-placeholder{color:var(--text-muted);font-style:italic}.oj-editable-label__input{font-family:var(--font-sketch);font-size:var(--text-md)}.oj-editable-label--center .oj-editable-label__input{text-align:center}.oj-value-scrubber{align-items:baseline;gap:var(--space-xs);font-family:var(--font-sketch);display:inline-flex}.oj-value-scrubber__label{color:var(--text-secondary);font-size:var(--text-sm)}.oj-value-scrubber__value{padding:var(--space-xs) var(--space-sm);border:var(--border-sketch-width) solid transparent;border-radius:var(--radius-sm);background:var(--bg-canvas);color:var(--text-primary);font-family:var(--font-mono);font-size:var(--text-sm);white-space:nowrap;user-select:none;line-height:1.4}.oj-value-scrubber--editable .oj-value-scrubber__value{cursor:ew-resize;transition:background var(--transition-fast), border-color var(--transition-fast)}.oj-value-scrubber--editable .oj-value-scrubber__value:hover{background:var(--bg-tertiary);border-color:var(--border-subtle)}.oj-value-scrubber--editable .oj-value-scrubber__value:focus-visible{border-color:var(--accent-primary);outline:none}.oj-value-scrubber__input{width:7ch;padding:var(--space-xs) var(--space-sm);font-size:var(--text-sm);line-height:1.4}.oj-value-scrubber.is-disabled{opacity:.5}.oj-value-scrubber.is-disabled .oj-value-scrubber__value{cursor:not-allowed}.oj-cable{--oj-cable-signal:0;fill:none;stroke:var(--control-connection);stroke-linecap:round;pointer-events:stroke;cursor:pointer;stroke-width:calc(3px + var(--oj-cable-signal) * 3px);opacity:calc(.7 + var(--oj-cable-signal) * .3);filter:drop-shadow(0 0 calc(var(--oj-cable-signal) * 6px) currentColor);transition:stroke-width 30ms ease-out, opacity 30ms ease-out, filter 30ms ease-out, stroke var(--transition-fast)}.oj-cable--audio{stroke:var(--audio-connection)}.oj-cable--control{stroke:var(--control-connection)}.oj-cable--universal{stroke:var(--universal-connection)}.oj-cable:hover{stroke-width:calc(5px + var(--oj-cable-signal) * 2px)}.oj-cable.is-selected{stroke-width:calc(5px + var(--oj-cable-signal) * 2px);filter:drop-shadow(0 0 8px)drop-shadow(0 0 16px);animation:1s ease-in-out infinite alternate oj-cable-selected-glow}.oj-cable--audio.is-selected{stroke:var(--audio-connected)}.oj-cable--control.is-selected{stroke:var(--control-connected)}.oj-cable--universal.is-selected{stroke:var(--universal-connection)}@keyframes oj-cable-selected-glow{0%{filter:drop-shadow(0 0 6px)drop-shadow(0 0 12px)}to{filter:drop-shadow(0 0 10px)drop-shadow(0 0 20px)}}.oj-cable.is-bundled{stroke-width:calc(5px + var(--oj-cable-signal) * 5px);filter:drop-shadow(0 0 calc(3px + var(--oj-cable-signal) * 10px) currentColor)}.oj-cable.is-bundled:hover{stroke-width:calc(7px + var(--oj-cable-signal) * 4px)}.oj-cable.is-bundled.is-selected{stroke-width:calc(7px + var(--oj-cable-signal) * 4px);filter:drop-shadow(0 0 10px)drop-shadow(0 0 18px)}.oj-cable.is-temp{stroke-dasharray:6 4;opacity:.6;pointer-events:none;cursor:default;will-change:stroke-dashoffset;animation:.5s linear infinite oj-cable-dash}@keyframes oj-cable-dash{to{stroke-dashoffset:-10px}}@media (prefers-reduced-motion:reduce){.oj-cable.is-selected,.oj-cable.is-temp{animation:none}}.oj-waveform{width:100%;display:block}.oj-waveform__svg{width:100%;height:100%;display:block;overflow:visible}.oj-waveform__trace{fill:none;stroke:var(--audio-output);stroke-width:1.5px;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke;transition:stroke var(--transition-fast)}.oj-waveform.is-recording .oj-waveform__trace{stroke:var(--accent-danger)}.oj-waveform__playhead{stroke:var(--accent-primary);stroke-width:1px;vector-effect:non-scaling-stroke}.oj-waveform__center{stroke:var(--border-subtle);stroke-width:1px;vector-effect:non-scaling-stroke}.oj-waveform-view{background:var(--bg-node);border:var(--border-sketch-width) solid var(--border-sketch);border-radius:var(--radius-md);box-shadow:var(--shadow-sketch);cursor:grab;user-select:none;transition:border-color var(--transition-fast), box-shadow var(--transition-fast), opacity var(--transition-fast);flex-direction:column;display:flex;overflow:hidden}.oj-waveform-view:active{cursor:grabbing}.oj-waveform-view__preview{background:var(--bg-canvas);padding:var(--space-xs);position:relative}.oj-waveform-view__trace{display:block}.oj-waveform-view__duration{top:var(--space-xs);right:var(--space-xs);padding:0 var(--space-xs);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);background:var(--bg-node);border-radius:var(--radius-sm);line-height:1.4;position:absolute}.oj-waveform-view__crop{bottom:var(--space-xs);left:var(--space-xs);font-size:var(--text-xs);color:var(--accent-warning);line-height:1;position:absolute}.oj-waveform-view__name{padding:var(--space-xs) var(--space-sm);border-top:1px solid var(--border-subtle);font-family:var(--font-sketch);font-size:var(--text-sm);color:var(--text-secondary);text-align:center;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.oj-waveform-view.is-selected{border-color:var(--audio-connected);box-shadow:0 0 0 2px var(--audio-connected)}.oj-waveform-view.is-selected .oj-waveform-view__name{color:var(--audio-connected)}.oj-waveform-view.is-drop-target{border-color:var(--accent-success);box-shadow:0 0 0 2px var(--accent-success)}.oj-waveform-view.is-dragging{opacity:.6;cursor:grabbing}.oj-device-select{display:inline-flex;position:relative}.oj-device-select__trigger{gap:var(--space-xs);justify-content:space-between;width:100%}.oj-device-select__label{text-overflow:ellipsis;white-space:nowrap;text-align:left;flex:1;min-width:0;overflow:hidden}.oj-device-select__caret{color:var(--text-muted);flex:none}.oj-device-select__trigger-bolt{color:var(--accent-primary);flex:none}.oj-device-select__list{top:calc(100% + var(--space-xs));min-width:100%;padding:var(--space-xs);flex-direction:column;gap:1px;display:flex;position:absolute;left:0;right:0}.oj-device-select__option{justify-content:space-between;gap:var(--space-sm);border-radius:var(--radius-sm);width:100%}.oj-device-select__option-bolt{flex:none}.oj-key-tile{padding:var(--space-xs);border:var(--border-sketch-width) solid var(--sketch-black);background:var(--bg-node);color:var(--text-primary);font-family:var(--font-sketch);font-size:var(--text-sm);cursor:pointer;box-shadow:var(--shadow-sketch);transition:background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast), color var(--transition-fast);justify-content:center;align-items:flex-end;line-height:1.2;display:flex;position:relative}.oj-key-tile:hover{box-shadow:3px 4px 0 var(--sketch-black);transform:translateY(-1px)}.oj-key-tile:active,.oj-key-tile.is-active{box-shadow:1px 1px 0 var(--sketch-black);transform:translateY(1px)}.oj-key-tile.is-active{background:var(--accent-primary);color:var(--text-on-accent)}.oj-key-tile__port{top:var(--space-xs);right:var(--space-xs);position:absolute}.oj-key-tile__label{pointer-events:none}.oj-key-tile--white{width:calc(var(--space-lg) + var(--space-xs));height:calc(var(--space-xl) * 4);border-radius:0 0 var(--radius-sm) var(--radius-sm);background:var(--bg-node)}.oj-key-tile--black{width:var(--space-lg);height:calc(var(--space-xl) * 2 + var(--space-md));border-radius:0 0 var(--radius-sm) var(--radius-sm);background:var(--sketch-black);color:var(--text-on-accent)}.oj-key-tile--black .oj-key-tile__label{color:var(--text-on-accent)}.oj-key-tile--key{width:calc(var(--space-xl) + var(--space-sm));height:calc(var(--space-xl) + var(--space-sm));border-radius:var(--radius-sm);align-items:center}.oj-key-tile--pad{width:calc(var(--space-xl) * 2);height:calc(var(--space-xl) * 2);border-radius:var(--radius-lg);background:var(--bg-tertiary);align-items:center}.oj-banner{align-items:center;gap:var(--space-md);width:100%;padding:var(--space-md);border-left-width:var(--space-xs);border-left-color:var(--banner-accent);display:flex}.oj-banner--warning{--banner-accent:var(--accent-warning)}.oj-banner--danger{--banner-accent:var(--accent-danger)}.oj-banner--info{--banner-accent:var(--audio-connection)}.oj-banner__icon{width:var(--text-xl);height:var(--text-xl);color:var(--banner-accent);flex-shrink:0;justify-content:center;align-items:center;display:flex}.oj-banner__icon svg{width:100%;height:100%}.oj-banner__body{flex:1;min-width:0}.oj-banner__title{font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-primary);font-weight:600;line-height:1.2}.oj-banner__message{margin-top:var(--space-xs);font-family:var(--font-sans);font-size:var(--text-sm);color:var(--text-secondary);line-height:1.5}.oj-banner__actions{gap:var(--space-sm);flex-shrink:0;display:flex}.schematic-node{background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-lg);color:var(--text-primary);user-select:none;z-index:1;min-width:140px;transition:box-shadow var(--transition-fast);position:absolute;overflow:visible}.schematic-node.selected{z-index:10;box-shadow:0 0 0 2px var(--accent-primary), var(--shadow-sketch)}.schematic-node.dragging{z-index:100;cursor:grabbing;box-shadow:0 0 0 2px var(--accent-primary), 6px 6px 0 var(--sketch-black)}.schematic-node.clip-drop-target{box-shadow:0 0 0 3px var(--accent-success), 0 0 20px color-mix(in srgb, var(--accent-success) 40%, transparent)}.schematic-header{border-bottom:var(--border-sketch-width) solid var(--sketch-black);padding:var(--space-sm) var(--space-md);font-family:var(--font-sketch);font-weight:600;font-size:var(--text-lg);background:var(--bg-node-header);border-radius:var(--radius-lg) var(--radius-lg) 0 0;cursor:grab;justify-content:space-between;align-items:center;display:flex}.schematic-header:active{cursor:grabbing}.speaker-node{min-width:100px}.speaker-warning{font-size:16px}.speaker-body{padding:var(--space-sm) var(--space-md);flex-direction:column;align-items:center;display:flex;position:relative}.speaker-node.hover-connecting{box-shadow:0 0 0 2px var(--accent-primary), 0 0 12px color-mix(in srgb, var(--accent-primary) 30%, transparent)}.speaker-symbol-container{margin-bottom:var(--space-xs)}.speaker-mute-btn{border-radius:var(--radius-md);cursor:pointer;width:48px;height:48px;transition:all var(--transition-fast);color:var(--text-primary);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.speaker-mute-btn:hover{background:var(--bg-tertiary);transform:scale(1.05)}.speaker-mute-btn.live{color:var(--accent-success)}.speaker-mute-btn.muted{color:var(--accent-danger);opacity:.7}.speaker-volume-row{gap:var(--space-xs);width:100%;margin-bottom:var(--space-xs);flex-direction:column;display:flex}.speaker-volume-slider{cursor:pointer;width:100%;accent-color:var(--accent-primary)}.speaker-volume-slider:disabled{cursor:not-allowed;opacity:.5}.speaker-output-meter{border-radius:var(--radius-pill);background:var(--bg-tertiary);width:100%;height:6px;overflow:hidden}.speaker-output-meter-fill{background:var(--accent-success);border-radius:var(--radius-pill);height:100%;transition:width 60ms linear}.device-selector-container{width:100%;position:relative}.device-select-trigger{border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-pill);background:var(--bg-canvas);width:100%;padding:var(--space-xs) var(--space-sm);font-family:var(--font-sketch);font-size:var(--text-xs);text-align:center;cursor:pointer;white-space:nowrap;text-overflow:ellipsis;transition:all var(--transition-fast);overflow:hidden}.device-select-trigger:hover{background:var(--bg-tertiary)}.schematic-dropdown{top:calc(100% + var(--space-xs));background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-md);z-index:100;width:100%;max-height:200px;box-shadow:var(--shadow-menu);position:absolute;left:0;overflow-y:auto}.device-item{padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--border-subtle);font-family:var(--font-sketch);font-size:var(--text-sm);cursor:pointer;transition:background var(--transition-fast)}.device-item:last-child{border-bottom:none}.device-item:hover{background:var(--bg-tertiary)}.device-item.selected{background:var(--accent-primary);color:var(--text-on-accent)}.device-item.low-latency{align-items:center;gap:var(--space-xs);display:flex}.low-latency-icon{font-size:var(--text-sm);color:var(--accent-warning);flex-shrink:0}.device-item.low-latency .device-label,.device-select-trigger.low-latency .device-label{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.device-select-trigger.low-latency{align-items:center;gap:var(--space-xs);display:flex}.device-select-trigger .low-latency-icon{color:var(--accent-warning)}.keyboard-node{min-width:160px}.keyboard-node.active{border-width:4px;border-color:var(--accent-success);box-shadow:0 0 0 2px var(--bg-canvas), 0 0 12px color-mix(in srgb, var(--accent-success) 40%, transparent), var(--shadow-sketch)}.keyboard-node .schematic-header{padding:var(--space-sm) var(--space-md)}.keyboard-octave{font-family:var(--font-mono);font-size:var(--text-md);background:var(--bg-tertiary);border:1px solid var(--sketch-light);border-radius:var(--radius-sm);padding:2px var(--space-sm);user-select:none;pointer-events:none;font-weight:600}.keyboard-schematic-body{padding:var(--space-md);align-items:stretch;gap:var(--space-sm);flex-direction:column;display:flex}.keyboard-schematic-body .port-row{width:100%}.keyboard-schematic-body .port-row.output{flex-direction:row;justify-content:space-between}.keyboard-schematic-body .port-label{text-align:left}.instrument-node{min-width:180px}.instrument-node.hover-connecting{box-shadow:0 0 0 2px var(--accent-primary), 0 0 12px color-mix(in srgb, var(--accent-primary) 30%, transparent)}.instrument-node .schematic-header{cursor:grab}.instrument-node .schematic-header:active{cursor:grabbing}.instrument-schematic-body{padding:0}.instrument-schematic-body.simple{padding:var(--space-sm) var(--space-md);justify-content:space-between;align-items:center;gap:var(--space-md);display:flex}.instrument-rows-simple{gap:var(--space-xs);flex-direction:column;flex:1;display:flex}.instrument-row-simple{align-items:center;gap:var(--space-sm);padding:var(--space-xs) 0;display:flex}.instrument-row-simple.with-divider{border-top:1px solid var(--border-subtle);padding-top:var(--space-xs);margin-top:2px}.instrument-row-simple.empty-state{justify-content:flex-start;min-height:32px}.row-value{font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-primary);font-weight:600}.row-value.note-value{min-width:16px}.row-value.octave-value{min-width:12px}.row-value.offset-value{text-align:right;min-width:28px;font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-secondary)}.instrument-output-port{border:var(--border-sketch-width) solid var(--sketch-black);background:var(--audio-output);cursor:crosshair;width:16px;height:16px;transition:all var(--transition-fast);border-radius:50%;flex-shrink:0}.instrument-output-port:hover{filter:brightness(1.2);transform:scale(1.2)}.instrument-output-port.connected{background:var(--audio-connected);box-shadow:0 0 6px var(--audio-connected)}.pedal-row{margin-top:var(--space-xs);padding-top:var(--space-xs);border-top:1px dashed var(--border-subtle)}.pedal-label{font-size:var(--text-xs);color:var(--text-muted);font-family:var(--font-sketch)}.bundle-input-port{border:2px solid var(--sketch-black);background:var(--control-input);cursor:crosshair;width:12px;height:12px;transition:all var(--transition-fast);border-radius:50%;flex-shrink:0}.bundle-input-port:hover{filter:brightness(1.2);transform:scale(1.2)}.bundle-input-port.connected{background:var(--control-connected);box-shadow:0 0 4px var(--control-connected)}.bundle-input-port.empty{background:0 0;border-style:dashed}.bundle-input-port.empty:hover{background:var(--control-input);border-style:solid}.empty-row{opacity:.6}.instrument-row-simple.pedal-row{border-top:1px dashed var(--border-subtle);margin-top:var(--space-xs);padding-top:var(--space-xs)}.instrument-row-simple .pedal-label{font-size:var(--text-sm);color:var(--text-muted);margin-left:var(--space-sm);font-style:italic}.bundle-input-port.pedal{background:#f0f0f0;border-color:#888}.bundle-input-port.pedal.connected{background:#888;box-shadow:0 0 4px #888}@keyframes ghost-fade-in{0%{opacity:0;transform:translate(-4px)}to{opacity:.6;transform:translate(0)}}.instrument-selector-dropdown{background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-lg);min-width:250px;min-height:150px;box-shadow:var(--shadow-menu);z-index:2000;flex-direction:column;position:absolute;overflow:hidden}.instrument-search{width:100%;padding:var(--space-sm) var(--space-md);border:none;border-bottom:1px solid var(--border-subtle);font-family:var(--font-sketch);font-size:var(--text-md);background:var(--bg-canvas);color:var(--text-primary);box-sizing:border-box;flex-shrink:0}.instrument-search:focus{background:var(--bg-node);outline:none}.instrument-grid-container{padding:var(--space-sm);flex:1;overflow-y:auto}.instrument-grid-grouped{gap:var(--space-sm);flex-direction:column;display:flex}.instrument-group{flex-direction:column;display:flex}.instrument-group-separator{background:var(--border-subtle);height:1px;margin:var(--space-sm) 0}.instrument-group-label{font-family:var(--font-sketch);font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--space-xs);padding-left:var(--space-xs);font-weight:600}.instrument-group-items{gap:var(--space-sm);grid-template-columns:repeat(auto-fill,minmax(90px,1fr));display:grid}.category-nav-hint{font-family:var(--font-sketch);font-size:var(--text-xs);color:var(--text-muted);text-align:center;padding:var(--space-xs) var(--space-sm);border-top:1px solid var(--border-subtle);flex-shrink:0}.instrument-card{padding:var(--space-sm);border:1px solid var(--border-subtle);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);background:var(--bg-canvas);flex-direction:column;align-items:center;display:flex}.instrument-card:hover{background:var(--bg-tertiary);border-color:var(--sketch-light);transform:translateY(-2px)}.instrument-card.selected{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}.instrument-icon{width:48px;height:48px;margin-bottom:var(--space-xs);justify-content:center;align-items:center;display:flex}.instrument-icon svg{width:100%;height:100%}.instrument-name{font-family:var(--font-sketch);font-size:var(--text-sm);text-align:center;white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-weight:500;overflow:hidden}.no-results{text-align:center;color:var(--text-secondary);font-family:var(--font-sketch);padding:var(--space-lg)}.instrument-name-clickable{cursor:pointer;width:fit-content;display:inline-block}.instrument-name-clickable:hover{text-decoration:underline}.editable-value{cursor:ns-resize;border-radius:var(--radius-sm);transition:background var(--transition-fast);user-select:none;padding:2px 4px}.looper-node{min-width:220px;max-width:260px}.looper-main-row{padding:var(--space-sm) var(--space-lg);justify-content:center;align-items:center;gap:var(--space-sm);display:flex;position:relative}.looper-duration-container{flex:1;justify-content:center;align-items:center;gap:2px;height:24px;display:flex}.looper-duration{font-family:var(--font-mono);font-size:var(--text-md);color:var(--text-primary);cursor:pointer;border-radius:var(--radius-sm);transition:background var(--transition-fast);user-select:none;text-align:center;min-width:24px;padding:0 6px;font-weight:600;line-height:24px}.looper-duration:hover{background:var(--bg-tertiary)}.looper-duration.disabled{opacity:.6;cursor:not-allowed}.looper-duration-input{font-family:var(--font-mono);font-size:var(--text-md);color:var(--text-primary);background:var(--bg-tertiary);border:1px solid var(--sketch-black);border-radius:var(--radius-sm);text-align:center;outline:none;width:36px;padding:2px 4px;font-weight:600}.looper-duration-input:focus{border-color:var(--accent-primary)}.looper-duration-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.looper-duration-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.looper-duration-input[type=number]{-moz-appearance:textfield}.looper-duration-unit{font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-muted)}.looper-active-waveform{background:var(--bg-tertiary);height:24px;margin:0 var(--space-md);border-radius:4px;overflow:hidden}.looper-active-waveform svg{width:100%;height:100%}.looper-waveform-path{stroke:var(--accent-primary)}.looper-waveform-path.recording{stroke:var(--accent-danger)}.looper-playhead{stroke:var(--accent-danger);stroke-width:2px}.looper-loops{gap:var(--space-xs);padding:var(--space-sm) var(--space-md);flex-direction:column-reverse;max-height:96px;display:flex;overflow:hidden auto}.looper-loops::-webkit-scrollbar{width:4px}.looper-loops::-webkit-scrollbar-track{background:var(--bg-tertiary);border-radius:2px}.looper-loops::-webkit-scrollbar-thumb{background:var(--border-subtle);border-radius:2px}.looper-loops::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.looper-loop-item{background:var(--bg-canvas);border:1px solid var(--border-subtle);height:24px;min-height:24px;transition:border-color var(--transition-fast), box-shadow var(--transition-fast);border-radius:4px;flex-shrink:0;position:relative;overflow:hidden}.looper-loop-item:hover{border-color:var(--audio-connected);box-shadow:0 0 6px color-mix(in srgb, var(--audio-connected) 30%, transparent)}.looper-loop-item:active{cursor:grabbing}.looper-loop-item svg{width:100%;height:100%}.looper-loop-item.muted{opacity:.4}.looper-loop-item.muted .looper-waveform-path{stroke:var(--text-muted)}.looper-loop-controls{opacity:0;gap:4px;transition:opacity .15s;display:flex;position:absolute;top:2px;right:4px}.looper-loop-item:hover .looper-loop-controls{opacity:1}.looper-loop-btn{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-node);cursor:pointer;width:20px;height:20px;color:var(--text-primary);justify-content:center;align-items:center;padding:0;display:flex}.looper-loop-btn:hover{background:var(--bg-tertiary)}.looper-loop-btn.muted{color:var(--accent-danger)}.looper-loop-btn.delete:hover{background:var(--accent-danger);color:#fff;border-color:var(--accent-danger)}.looper-loop-btn.export:hover{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}.looper-loop-btn.export.exported{color:var(--accent-success)}.looper-loop-btn.export.exported:hover{background:var(--accent-success);color:#fff;border-color:var(--accent-success)}.looper-record-container{padding:var(--space-sm);justify-content:center;display:flex}.looper-record-btn{border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-md);background:var(--accent-danger);cursor:pointer;width:100%;max-width:200px;height:28px;transition:all var(--transition-fast);margin:0 var(--space-md);position:relative}.looper-record-btn:after{content:"";background:#fff;border-radius:50%;width:12px;height:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.looper-record-btn:hover:not(:disabled){background:color-mix(in srgb, var(--accent-danger) 80%, white);box-shadow:0 2px 8px color-mix(in srgb, var(--accent-danger) 40%, transparent)}.looper-record-btn:disabled{opacity:.5;cursor:not-allowed}.looper-record-btn.recording:after{border-radius:2px;width:10px;height:10px}.looper-record-btn.recording{animation:1s ease-in-out infinite looper-record-pulse}.looper-record-btn.armed{animation:.5s ease-in-out infinite looper-armed-blink}@keyframes looper-record-pulse{0%,to{box-shadow:0 0 0 0 color-mix(in srgb, var(--accent-danger) 40%, transparent)}50%{box-shadow:0 0 0 8px color-mix(in srgb, var(--accent-danger) 0%, transparent)}}@keyframes looper-armed-blink{0%,to{opacity:1}50%{opacity:.5}}.looper-status{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.05em;border-radius:var(--radius-sm);margin-left:auto;padding:1px 6px;font-weight:700;line-height:1.4}.looper-status.recording{background:color-mix(in srgb, var(--accent-danger) 18%, transparent);color:var(--accent-danger);animation:1s ease-in-out infinite looper-record-pulse}.looper-status.playing{background:color-mix(in srgb, var(--accent-primary) 18%, transparent);color:var(--accent-primary)}.looper-rename-input{box-sizing:border-box;width:100%;height:100%;font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-primary);background:var(--bg-tertiary);border:1px solid var(--accent-primary);border-radius:4px;outline:none;padding:0 6px;position:absolute;inset:0}.looper-balance-row{align-items:center;gap:var(--space-xs);padding:2px var(--space-md) var(--space-xs);display:flex}.looper-balance-label{font-family:var(--font-sketch);font-size:var(--text-xs);color:var(--text-muted);flex-shrink:0}.looper-balance-slider{height:4px;accent-color:var(--accent-primary);cursor:pointer;flex:1;min-width:0}.looper-balance-value{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-primary);text-align:right;flex-shrink:0;width:22px}.looper-undo-btn{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-node);width:20px;height:20px;color:var(--text-primary);cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex}.looper-undo-btn:hover{background:var(--bg-tertiary);border-color:var(--accent-primary)}.microphone-node{min-width:140px}.mic-latency-badge{color:#000;border:1px solid var(--sketch-black);background:#ffc107e6;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;display:flex}.mic-content{padding:var(--space-sm) var(--space-md);gap:var(--space-sm);flex-direction:column;display:flex}.mic-controls-row{align-items:center;gap:var(--space-sm);display:flex}.mic-device-selector{position:relative}.mic-device-selector .device-dropdown{white-space:nowrap;left:0;right:auto}.mic-source-btn{border-radius:var(--radius-sm);border:2px solid var(--sketch-black);background:var(--bg-canvas);width:36px;height:36px;color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;display:flex}.mic-source-btn:hover{background:var(--bg-tertiary)}.mic-mute-btn{border-radius:var(--radius-sm);border:2px solid var(--sketch-black);cursor:pointer;width:36px;height:36px;transition:all var(--transition-fast);justify-content:center;align-items:center;display:flex;position:relative}.mic-mute-btn:disabled{opacity:.5;cursor:not-allowed}.mic-mute-btn.live{background:var(--accent-success);color:#fff}.mic-mute-btn.live:hover:not(:disabled){background:#3cb371}.mic-mute-btn.muted{background:var(--accent-danger);color:#fff}.mic-mute-btn.muted:hover:not(:disabled){background:#c94444}.mic-mute-btn.muted:after{content:"";background:#fff;border-radius:1px;width:70%;height:2px;position:absolute;transform:rotate(-45deg)}.mic-waveform-line{width:100%;height:20px}.mic-waveform-path{stroke:var(--accent-primary)}.bundle-port-row{width:100%;padding:var(--space-xs) 0;justify-content:space-between;align-items:center;gap:var(--space-sm);display:flex}.port-label{align-items:center;gap:var(--space-xs);font-size:var(--text-sm);color:var(--text-secondary);font-family:var(--font-sketch);display:flex}.canvas-io-node{min-width:180px;padding:var(--space-md);align-items:center;gap:var(--space-sm);flex-direction:column;display:flex}.canvas-io-node .io-indicator{justify-content:center;align-items:center;display:flex}.canvas-io-node .io-name-field{text-align:center;cursor:pointer;width:100%}.canvas-io-node .name-input{width:100%;padding:var(--space-xs) var(--space-sm);border:2px solid var(--accent-primary);border-radius:var(--radius-sm);background:var(--bg-canvas);color:var(--text-primary);font-family:var(--font-sketch);font-size:var(--text-md);text-align:center;outline:none}.canvas-io-node .name-text{padding:var(--space-xs);font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-primary);border-radius:var(--radius-sm);transition:all var(--transition-fast);border:2px solid #0000;display:block}.canvas-io-node .name-text:hover{background:var(--bg-tertiary);border-color:var(--border-subtle)}.canvas-io-node .io-type-label{font-size:var(--text-xs);font-family:var(--font-mono);color:var(--text-muted);text-transform:uppercase;font-weight:600}@keyframes flash-red{0%,to{box-shadow:0 0 0 2px var(--accent-primary)}50%{box-shadow:0 0 0 4px var(--accent-danger), 0 0 20px var(--accent-danger)}}.canvas-io-node.deletion-attempted{animation:.4s ease-in-out flash-red}.keyboard-visual-node{min-width:600px;max-width:700px}.keyboard-visual-header{text-align:center}.keyboard-visual-body{padding:var(--space-md) var(--space-lg);gap:var(--space-sm);flex-direction:column;display:flex}.keyboard-visual-node .keyboard-row{gap:4px;display:flex}.keyboard-visual-node .keyboard-row.row-1{margin-left:0}.keyboard-visual-node .keyboard-row.row-2{margin-left:25px}.keyboard-visual-node .keyboard-row.row-3{margin-left:50px}.keyboard-visual-node .keyboard-row.row-space{margin-left:80px;margin-top:var(--space-sm)}.keyboard-visual-key{background:var(--bg-canvas);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-md);width:50px;height:50px;transition:all var(--transition-fast);user-select:none;cursor:crosshair;justify-content:center;align-items:center;display:flex;position:relative}.keyboard-visual-key:hover{background:var(--bg-tertiary);transform:translateY(-2px);box-shadow:0 2px 4px #0000001a}.keyboard-visual-key.active{background:var(--accent-primary);color:var(--text-on-accent);border-color:var(--accent-primary);transform:translateY(0);box-shadow:inset 0 2px 4px #0003}.keyboard-visual-key.spacebar{width:300px}.port-row{padding:var(--space-xs) var(--space-sm);justify-content:space-between;align-items:center;gap:var(--space-sm);display:flex}.port-row.input{flex-direction:row}.port-row.output{flex-direction:row-reverse}.output-panel-node{background:var(--bg-node);border:2px solid var(--sketch-black);border-radius:var(--radius-sm);width:140px;box-shadow:var(--shadow-md);cursor:default;transition:box-shadow var(--transition-fast);position:absolute}.output-panel-node:hover{box-shadow:var(--shadow-lg)}.output-panel-node.selected{border-color:var(--accent-primary);box-shadow:0 0 0 2px var(--accent-primary)}.output-panel-node.dragging{opacity:.9;cursor:grabbing}.output-panel-header{padding:var(--space-xs) var(--space-sm);background:var(--bg-tertiary);border-bottom:2px solid var(--sketch-black);cursor:grab}.output-panel-header:active{cursor:grabbing}.output-panel-header .schematic-title{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:1px;font-weight:600}.output-panel-body{padding:var(--space-sm) var(--space-xs);gap:var(--space-sm);flex-direction:column;min-height:40px;display:flex}.output-panel-empty{font-size:var(--text-xs);color:var(--text-muted);text-align:center;padding:var(--space-xs);font-style:italic}.output-panel-port-row{align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-xs);border-radius:var(--radius-xs);transition:background var(--transition-fast);display:flex}.output-panel-port-row:hover{background:var(--sketch-grid)}.output-panel-label{width:0;min-height:1.2em;line-height:1.2;font-size:var(--text-sm);color:var(--text-primary);cursor:text;border-radius:var(--radius-xs);transition:background var(--transition-fast);text-overflow:ellipsis;white-space:nowrap;flex:1;padding:2px 4px;font-family:inherit;overflow:hidden}.output-panel-label:hover{background:#0000000d}.output-panel-label-input{width:0;font-size:var(--text-sm);color:var(--text-primary);border-radius:var(--radius-xs);caret-color:var(--accent-primary);background:#0000000d;border:none;outline:none;flex:1;padding:2px 4px;font-family:inherit}.output-panel-label-input::selection{background:var(--accent-primary-alpha)}.output-panel-label:focus{outline:2px solid var(--accent-primary);outline-offset:1px}.input-panel-node{background:var(--bg-node);border:2px solid var(--sketch-black);border-radius:var(--radius-sm);width:140px;box-shadow:var(--shadow-md);cursor:default;transition:box-shadow var(--transition-fast);position:absolute}.input-panel-node:hover{box-shadow:var(--shadow-lg)}.input-panel-node.selected{border-color:var(--accent-primary);box-shadow:0 0 0 2px var(--accent-primary)}.input-panel-node.dragging{opacity:.9;cursor:grabbing}.input-panel-header{padding:var(--space-xs) var(--space-sm);background:var(--bg-tertiary);border-bottom:2px solid var(--sketch-black);cursor:grab}.input-panel-header:active{cursor:grabbing}.input-panel-header .schematic-title{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:1px;font-weight:600}.input-panel-body{padding:var(--space-sm) var(--space-xs);gap:var(--space-sm);flex-direction:column;min-height:40px;display:flex}.input-panel-empty{font-size:var(--text-xs);color:var(--text-muted);text-align:center;padding:var(--space-xs);font-style:italic}.input-panel-port-row{justify-content:space-between;align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-xs);border-radius:var(--radius-xs);transition:background var(--transition-fast);display:flex}.input-panel-port-row:hover{background:#0000000d}.input-panel-label{width:0;min-height:1.2em;line-height:1.2;font-size:var(--text-sm);color:var(--text-primary);cursor:text;border-radius:var(--radius-xs);transition:background var(--transition-fast);text-align:left;text-overflow:ellipsis;white-space:nowrap;flex:1;padding:2px 4px;font-family:inherit;overflow:hidden}.input-panel-label:hover{background:#0000000d}.input-panel-label-input{width:0;font-size:var(--text-sm);color:var(--text-primary);border-radius:var(--radius-xs);caret-color:var(--accent-primary);text-align:left;background:#0000000d;border:none;outline:none;flex:1;padding:2px 4px;font-family:inherit}.input-panel-label-input::selection{background:var(--accent-primary-alpha)}.input-panel-label:focus{outline:2px solid var(--accent-primary);outline-offset:1px}.input-panel-port-row.empty-slot,.output-panel-port-row.empty-slot{opacity:.6;border-top:1px dashed var(--border-color,#0000001a);margin-top:var(--space-xs);padding-top:var(--space-xs)}.input-panel-port-row.empty-slot:hover,.output-panel-port-row.empty-slot:hover{opacity:1}.empty-slot-label{color:var(--text-muted,#888);font-style:italic;font-size:var(--text-xs,11px)}.container-node{min-width:140px;min-height:80px}.container-header{padding:var(--space-sm) var(--space-md);background:var(--bg-node-header);border-bottom:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-lg) var(--radius-lg) 0 0;cursor:grab;justify-content:space-between;align-items:center;display:flex}.container-header:active{cursor:grabbing}.container-name{font-family:var(--font-sketch);font-size:var(--text-lg);color:var(--text-primary);cursor:text;transition:background var(--transition-fast);border-radius:var(--radius-sm);padding:2px 4px;font-weight:600}.container-name:hover{background:var(--bg-tertiary)}.container-name-input{font-family:var(--font-sketch);font-size:var(--text-lg);color:var(--text-primary);background:var(--bg-canvas);border:2px solid var(--accent-primary);border-radius:var(--radius-sm);outline:none;width:100%;padding:2px 6px;font-weight:600}.container-body{padding:var(--space-md);gap:var(--space-sm);flex-direction:column;min-height:40px;display:flex}.container-ports-hint{font-size:var(--text-xs);color:var(--text-muted);text-align:center;font-style:italic}.math-node{min-width:100px}.math-header{padding:var(--space-xs) var(--space-sm);background:var(--bg-node-header);border-bottom:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-lg) var(--radius-lg) 0 0;cursor:grab;align-items:center;gap:var(--space-sm);display:flex}.math-header:active{cursor:grabbing}.math-symbol{font-family:var(--font-mono);font-size:var(--text-xl);color:var(--accent-primary);font-weight:700}.math-name{font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-primary)}.math-body{padding:var(--space-sm);justify-content:space-between;align-items:stretch;gap:var(--space-md);flex-direction:row;display:flex}.math-inputs{justify-content:space-around;gap:var(--space-sm);flex-direction:column;display:flex}.math-outputs{flex-direction:column;justify-content:flex-start;display:flex}.math-port-row{align-items:center;gap:var(--space-xs);display:flex}.math-port-row.output{justify-content:flex-end}.subtract-indicator{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--accent-danger);margin-left:var(--space-xs)}.library-node{min-width:260px;max-width:320px}.library-sample-out-port{border:var(--border-sketch-width) solid var(--sketch-black);background:var(--audio-output);cursor:crosshair;width:14px;height:14px;transition:transform var(--transition-fast), box-shadow var(--transition-fast);z-index:10;border-radius:50%;position:absolute;top:50%;right:-7px;transform:translateY(-50%)}.library-sample-out-port:hover,.library-sample-out-port:focus-visible{transform:translateY(-50%)scale(1.2)}.library-sample-out-port:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.library-sample-out-port.connected{background:var(--audio-connected);box-shadow:0 0 6px var(--audio-connected)}.library-node .schematic-header{justify-content:space-between;align-items:center;display:flex}.library-count{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);background:var(--bg-tertiary);border-radius:var(--radius-pill);padding:2px 6px}.library-empty{align-items:center;gap:var(--space-sm);padding:var(--space-md);flex-direction:column;display:flex}.library-link-btn{align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-md);background:var(--accent-primary);color:#fff;font-family:var(--font-sketch);font-size:var(--text-md);cursor:pointer;transition:all var(--transition-fast);font-weight:600;display:flex}.library-link-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 8px #0003}.library-link-btn:disabled{opacity:.7;cursor:not-allowed}.library-hint{font-size:var(--text-xs);color:var(--text-muted);text-align:center;margin:0}.library-scanning{gap:var(--space-xs);padding:var(--space-sm);flex-direction:column;display:flex}.scan-progress{background:var(--bg-tertiary);border-radius:var(--radius-pill);height:6px;overflow:hidden}.scan-progress-bar{background:var(--accent-primary);border-radius:var(--radius-pill);height:100%;transition:width .3s}.scan-status{font-size:var(--text-xs);color:var(--text-muted);text-align:center}.library-search{width:100%}.library-search input{width:100%;padding:var(--space-xs) var(--space-sm);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-canvas);color:var(--text-primary);font-family:var(--font-sketch);font-size:var(--text-sm)}.library-search input:focus{border-color:var(--accent-primary);outline:none}.library-search input::placeholder{color:var(--text-muted)}.library-node.library-two-panel{flex-direction:column;min-width:400px;max-width:none;min-height:300px;display:flex;overflow:hidden}.library-two-panel .library-panels{flex:1;min-height:0;display:flex;overflow:hidden}.library-left-panel{border-right:1px solid var(--border-subtle);background:var(--bg-canvas);flex-direction:column;width:160px;min-width:140px;display:flex;overflow:hidden}.library-right-panel{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.tags-section-header{padding:var(--space-xs) var(--space-sm);font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border-subtle);flex-shrink:0;justify-content:space-between;align-items:center;font-weight:600;display:flex}.add-tag-btn{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-canvas);width:18px;height:18px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;padding:0;font-size:14px;font-weight:600;line-height:1;display:flex}.add-tag-btn:hover{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}.library-tags-section{flex-direction:column;display:flex;overflow:hidden}.library-tags-section.pinned{flex-shrink:0}.library-tags-section.other{flex:1;min-height:0}.library-tags-section.other .tags-section-header{justify-content:space-between;align-items:center;display:flex}.library-tags-section.pinned.drag-over{background:var(--accent-primary-alpha);outline:2px dashed var(--accent-primary);outline-offset:-2px}.tags-list{padding:var(--space-xs);scrollbar-width:thin;scrollbar-color:var(--border-subtle) transparent;flex-direction:column;flex:1;gap:2px;display:flex;overflow-y:auto}.tags-list::-webkit-scrollbar{width:4px}.tags-list::-webkit-scrollbar-track{background:0 0}.tags-list::-webkit-scrollbar-thumb{background:var(--border-subtle);border-radius:2px}.tag-input-row{padding:2px}.tag-input-row input{width:100%;padding:var(--space-xs);border:1px solid var(--accent-primary);border-radius:var(--radius-sm);background:var(--bg-canvas);color:var(--text-primary);font-family:var(--font-sketch);font-size:var(--text-sm)}.tag-input-row input:focus{outline:none}.library-tag{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast);display:flex;position:relative}.library-tag:hover{background:var(--bg-tertiary)}.library-tag.active{background:color-mix(in srgb, var(--tag-color,#888) 20%, var(--bg-canvas));font-weight:600}.library-tag.drag-over{background:color-mix(in srgb, var(--accent-primary) 20%, var(--bg-canvas));box-shadow:inset 0 0 0 2px var(--accent-primary)}.library-tag.dragging{opacity:.5;cursor:grabbing}.library-tag{cursor:grab}.library-tag:active{cursor:grabbing}.library-tag.drop-before:before{content:"";background:var(--accent-primary);border-radius:2px;height:3px;position:absolute;top:-2px;left:0;right:0}.library-tag.drop-after:after{content:"";background:var(--accent-primary);border-radius:2px;height:3px;position:absolute;bottom:-2px;left:0;right:0}.tag-indicator{border-radius:50%;flex-shrink:0;width:8px;height:8px}.tag-name{font-size:var(--text-sm);white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.tag-unpin-btn{width:14px;height:14px;color:var(--text-muted);cursor:pointer;opacity:0;transition:opacity var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;padding:0;font-size:12px;display:flex}.library-tag:hover .tag-unpin-btn{opacity:.6}.tag-unpin-btn:hover{color:var(--accent-danger);opacity:1!important}.tag-delete-btn{width:14px;height:14px;color:var(--text-muted);cursor:pointer;opacity:0;transition:opacity var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;padding:0;font-size:12px;display:flex}.library-tag:hover .tag-delete-btn{opacity:.6}.tag-delete-btn:hover{color:var(--accent-danger);opacity:1!important}.no-tags-hint{font-size:var(--text-xs);color:var(--text-muted);padding:var(--space-sm);text-align:center;font-style:italic}.library-two-panel .library-search{padding:var(--space-sm);border-bottom:1px solid var(--border-subtle);gap:var(--space-xs);flex-shrink:0;display:flex}.library-two-panel .library-search input{flex:1}.clear-filter-btn{padding:2px var(--space-sm);border:1px solid var(--border-subtle);border-radius:var(--radius-pill);background:color-mix(in srgb, var(--accent-primary) 15%, var(--bg-canvas));color:var(--text-primary);font-size:var(--text-xs);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;align-items:center;gap:2px;display:flex}.clear-filter-btn:hover{background:var(--accent-danger);color:#fff;border-color:var(--accent-danger)}.library-files-container{flex-direction:column;flex:1;min-height:0;display:flex;position:relative;overflow:hidden}.library-files{padding:var(--space-xs);scrollbar-width:thin;scrollbar-color:var(--border-subtle) transparent;background:0 0;flex-direction:column;flex:1;gap:1px;min-height:100%;display:flex;overflow-y:auto}.library-selection-box{background:color-mix(in srgb, var(--accent-primary) 20%, transparent);border:1px solid var(--accent-primary);pointer-events:none;z-index:10;opacity:.5;position:absolute}.library-files::-webkit-scrollbar{width:6px}.library-files::-webkit-scrollbar-track{background:0 0}.library-files::-webkit-scrollbar-thumb{background:var(--border-subtle);border-radius:3px}.library-file-row{align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast);display:flex}.library-file-row:hover{background:var(--bg-tertiary)}.library-file-row.selected{background:var(--accent-primary);color:#fff}.library-file-row:focus-visible{outline:2px solid var(--accent-primary);outline-offset:-2px}.library-file-row.multi-selected{background:color-mix(in srgb, var(--accent-primary) 20%, transparent);outline:1px solid var(--accent-primary);outline-offset:-1px}.library-file-row.multi-selected.selected{background:var(--accent-primary)}.library-file-row.missing{opacity:.6}.library-file-row.missing .file-name{text-decoration:line-through}.file-preview-btn{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-canvas);width:20px;min-width:20px;height:20px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;padding:0;font-size:10px;display:flex}.file-preview-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.file-preview-btn.playing{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}.library-file-row.selected .file-preview-btn{color:#fff;background:#ffffff1a;border-color:#ffffff4d}.file-name{font-size:var(--text-sm);white-space:nowrap;text-overflow:ellipsis;cursor:text;flex:1;min-width:0;overflow:hidden}.file-name-input{font-size:var(--text-sm);border:1px solid var(--accent-primary);background:var(--bg-primary);min-width:0;color:var(--text-primary);border-radius:4px;outline:none;flex:1;padding:2px 6px}.file-name-input:focus{box-shadow:0 0 0 2px color-mix(in srgb, var(--accent-primary) 30%, transparent)}.library-file-row.editing{background:var(--bg-secondary)}.file-tags{flex-shrink:0;align-items:center;gap:4px;display:flex}.file-tag-badge{border-radius:var(--radius-pill);background-color:var(--tag-bg,#888);color:var(--tag-text,#000);white-space:nowrap;cursor:pointer;transition:filter var(--transition-fast), transform var(--transition-fast), padding var(--transition-fast);align-items:center;gap:2px;max-width:100px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}.file-tag-badge:hover{filter:brightness(1.1);padding-right:4px;transform:scale(1.05)}.tag-remove-btn{width:14px;height:14px;color:inherit;cursor:pointer;transition:background var(--transition-fast);background:#0003;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;margin-left:2px;padding:0;font-size:12px;font-weight:700;line-height:1;display:none}.file-tag-badge:hover .tag-remove-btn{display:inline-flex}.tag-remove-btn:hover{background:#0006}.tag-remove-btn:focus-visible,.file-tag-badge:focus-visible{outline:2px solid var(--accent-primary);outline-offset:1px}.library-file-row.selected .file-tag-badge{filter:brightness(1.2)saturate(1.2)}.file-tag-more{color:var(--text-secondary);background:var(--bg-tertiary);border-radius:var(--radius-pill);padding:2px 6px;font-size:11px;font-weight:600}.library-file-row.selected .file-tag-more{color:#fffc;background:#fff3}.file-trash-btn{border-radius:var(--radius-sm);width:20px;min-width:20px;height:20px;color:var(--text-muted);cursor:pointer;opacity:0;transition:all var(--transition-fast);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-size:14px;font-weight:700;display:flex}.library-file-row:hover .file-trash-btn:not(:disabled){opacity:1}.file-trash-btn:hover:not(:disabled){background:var(--accent-danger);color:#fff}.file-trash-btn.restore:hover:not(:disabled){background:var(--accent-success);color:#fff}.file-trash-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:1px;opacity:1}.file-trash-btn:disabled{opacity:.3;cursor:not-allowed}.library-file-row.trashed{opacity:.5}.library-file-row.trashed .file-name{color:var(--text-muted);text-decoration:line-through}.library-file-row.trashed .file-trash-btn{opacity:1;color:var(--accent-success)}.library-file-row.virtual{border-left:2px solid var(--accent-primary);padding-left:calc(var(--space-sm) - 2px)}.virtual-indicator{color:var(--accent-primary);opacity:.8;flex-shrink:0;justify-content:center;align-items:center;display:flex}.library-file-row.selected .virtual-indicator{color:#ffffffe6}.file-delete-btn{border-radius:var(--radius-sm);width:20px;min-width:20px;height:20px;color:var(--text-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-size:14px;display:flex}.file-delete-btn:hover:not(:disabled){background:var(--accent-danger);color:#fff}.file-delete-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:1px}.file-delete-btn:disabled{opacity:.3;cursor:not-allowed}.empty-trash-btn{padding:var(--space-xs) var(--space-sm);font-size:var(--text-xs);background:var(--accent-danger);color:#fff;border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast), opacity var(--transition-fast);border:none;margin-left:auto}.empty-trash-btn:hover:not(:disabled){filter:brightness(.85)}.empty-trash-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.empty-trash-btn:disabled{opacity:.5;cursor:not-allowed}.library-results-count{font-size:var(--text-xs);color:var(--text-muted);padding:var(--space-xs) var(--space-sm);border-bottom:1px solid var(--border-subtle)}.file-preview-btn.loading{opacity:.5;cursor:wait}.file-preview-btn:disabled{opacity:.4;cursor:not-allowed}.library-no-files{text-align:center;font-size:var(--text-sm);color:var(--text-muted);padding:var(--space-lg);font-style:italic}.library-two-panel .library-empty,.library-two-panel .library-scanning{padding:var(--space-lg);flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex}.sampler-node{min-width:160px;max-width:200px;position:relative}.sampler-node .schematic-header{padding:var(--space-xs) var(--space-sm);justify-content:center;align-items:center;display:flex}.sampler-node .schematic-title{text-align:center}.sampler-side-port{border:var(--border-sketch-width) solid var(--sketch-black);cursor:crosshair;width:14px;height:14px;transition:transform var(--transition-fast), box-shadow var(--transition-fast);z-index:10;border-radius:50%;position:absolute}.sampler-side-port:hover{transform:scale(1.2)}.sampler-side-port:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;transform:scale(1.2)}.sampler-side-port.input{background:var(--control-input);top:22px;left:-7px}.sampler-side-port.input:hover{transform:scale(1.2)}.sampler-side-port.input.connected{background:var(--control-connected);box-shadow:0 0 6px var(--control-connected)}.sampler-side-port.output{background:var(--audio-output);top:22px;right:-7px}.sampler-side-port.output:hover{transform:scale(1.2)}.sampler-side-port.output.connected{background:var(--audio-connected);box-shadow:0 0 6px var(--audio-connected)}.sampler-sample-area{margin:var(--space-xs) var(--space-sm);background:var(--bg-canvas);border-radius:var(--radius-sm);border:1px dashed var(--border-subtle);min-height:40px;transition:border-color var(--transition-fast), box-shadow var(--transition-fast);flex-direction:column;justify-content:center;align-items:stretch;display:flex;position:relative;overflow:hidden}.sampler-sample-area:hover{border-color:var(--audio-connected)}.sampler-sample-area.drag-over{border-color:var(--accent-primary);background:color-mix(in srgb, var(--accent-primary) 10%, transparent);box-shadow:0 0 8px color-mix(in srgb, var(--accent-primary) 30%, transparent);border-style:solid}.sampler-sample-area.has-sample{border-style:solid;border-color:var(--border-subtle)}.sampler-sample-area.has-sample:hover{border-color:var(--audio-connected);box-shadow:0 0 6px color-mix(in srgb, var(--audio-connected) 30%, transparent)}.sampler-sample-area.load-error{border-style:dashed;border-color:var(--status-warning,#e0a458);background:color-mix(in srgb, var(--status-warning,#e0a458) 8%, transparent)}.sampler-sample-area.load-error .sampler-waveform-path{opacity:.4}.sampler-load-error-badge{width:12px;height:12px;color:var(--bg-primary,#1a1a1a);background:var(--status-warning,#e0a458);border-radius:50%;flex:none;justify-content:center;align-items:center;margin-right:4px;font-size:9px;font-weight:700;line-height:1;display:inline-flex}.instrument-voice-error-badge,.node-plugin-error-badge{width:14px;height:14px;color:var(--bg-primary,#1a1a1a);background:var(--status-warning,#e0a458);cursor:help;border-radius:50%;flex:none;justify-content:center;align-items:center;margin-left:6px;font-size:10px;font-weight:700;line-height:1;display:inline-flex}.sampler-drop-text{font-family:var(--font-sketch);color:var(--text-muted);text-align:center;padding:var(--space-sm);font-size:11px}.sampler-waveform-container{height:22px;padding:2px 4px;position:relative}.sampler-waveform-container svg{width:100%;height:100%}.sampler-waveform-path{stroke:var(--accent-primary);stroke-width:1.5px}.sampler-center-line{stroke:var(--border-subtle);stroke-width:.5px;stroke-dasharray:2 2;opacity:.5}.sampler-duration-badge{font-family:var(--font-mono);color:var(--text-muted);background:color-mix(in srgb, var(--bg-node) 80%, transparent);border-radius:2px;padding:1px 3px;font-size:9px;position:absolute;top:2px;left:4px}.sampler-info-bar{align-items:center;gap:var(--space-xs);padding:2px var(--space-xs);background:var(--bg-tertiary);border-top:1px solid var(--border-subtle);display:flex}.sampler-sample-name{font-family:var(--font-mono);color:var(--text-primary);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:10px;overflow:hidden}.sampler-root-note{font-family:var(--font-mono);color:var(--accent-primary);background:color-mix(in srgb, var(--accent-primary) 15%, transparent);border-radius:var(--radius-xs);cursor:ns-resize;user-select:none;transition:background var(--transition-fast);padding:1px 4px;font-size:10px;font-weight:600}.sampler-root-note:hover{background:color-mix(in srgb, var(--accent-primary) 25%, transparent)}.sampler-clear-btn{border:1px solid var(--border-subtle);border-radius:var(--radius-xs);background:var(--bg-node);cursor:pointer;width:14px;height:14px;color:var(--text-muted);opacity:0;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:all .15s;display:flex}.sampler-sample-area:hover .sampler-clear-btn{opacity:1}.sampler-clear-btn:hover{background:var(--accent-danger);color:#fff;border-color:var(--accent-danger)}.sampler-controls{padding:var(--space-xs) var(--space-sm);flex-direction:column;gap:2px;display:flex}.sampler-controls-row{justify-content:space-between;align-items:center;gap:var(--space-sm);display:flex}.sampler-control{font-family:var(--font-mono);color:var(--text-primary);cursor:ns-resize;user-select:none;border-radius:var(--radius-xs);transition:background var(--transition-fast);white-space:nowrap;padding:2px 4px;font-size:10px}.sampler-control:hover{background:var(--bg-tertiary)}.instrument-visual-node.compact{background:#fdfbf7;border:2px solid #2a2a2a;border-radius:8px;flex-direction:column;min-width:200px;font-family:Caveat,cursive;display:flex;position:absolute;box-shadow:2px 2px #0000001a}.instrument-visual-node.compact.selected{border-color:#4a90d9;box-shadow:0 0 0 2px #4a90d94d,2px 2px #0000001a}.instrument-visual-node.compact.dragging{opacity:.8;cursor:grabbing}.instrument-visual-header.compact{cursor:grab;background:#f5f0e6;border-bottom:2px solid #2a2a2a;border-radius:6px 6px 0 0;padding:4px 12px}.instrument-visual-header.compact .instrument-visual-title{color:#2a2a2a;font-size:16px;font-weight:700}.instrument-rows-compact{flex-direction:column;gap:8px;padding:8px;display:flex}.no-rows-message.compact{color:#888;text-align:center;padding:12px;font-size:14px;font-style:italic}.row-compact{background:#fdfbf7;border:1px solid #ddd;border-radius:6px;padding:6px 8px}.row-header-compact{border-bottom:1px dashed #ccc;flex-wrap:wrap;gap:12px;margin-bottom:6px;padding-bottom:6px;display:flex}.editable-value{cursor:pointer;user-select:none;border-radius:4px;align-items:baseline;gap:4px;padding:2px 6px;transition:background-color .15s;display:inline-flex}.editable-value:hover{background:#4a90d91a}.editable-display{color:#2a2a2a;font-family:Caveat,cursive;font-size:18px;font-weight:700}.editable-label{color:#666;text-transform:lowercase;font-family:Inter,-apple-system,sans-serif;font-size:11px}.editable-input{text-align:center;border:1px solid #4a90d9;border-radius:3px;outline:none;width:36px;padding:1px 3px;font-family:Caveat,cursive;font-size:14px}.editable-input:focus{box-shadow:0 0 0 2px #4a90d933}.row-keys-compact{gap:2px;padding:4px 0;display:flex;overflow-x:auto}.key-column{flex-direction:column;align-items:center;gap:2px;min-width:24px;display:flex}.key-port{cursor:pointer;background:#e0e0e0;border:2px solid #888;border-radius:50%;width:10px;height:10px;transition:all .1s}.key-port:hover{background:#ccc;transform:scale(1.2)}.key-port.connected{background:#888;box-shadow:0 0 3px #888}.key-port.pedal{background:#f0f0f0;border-color:#666}.key-port.pedal:hover{background:#e0e0e0}.key-offset{color:#555;white-space:nowrap;font-family:Inter,-apple-system,sans-serif;font-size:11px}.pedal-row-compact{border-top:1px dashed #ccc;gap:8px;padding-top:6px;display:flex}.pedal-item{background:#f5f5f5;border:1px solid #888;border-radius:4px;align-items:center;gap:6px;padding:4px 10px;display:flex}.pedal-label{color:#555;font-family:Inter,-apple-system,sans-serif;font-size:13px}.output-port-area{flex-direction:column;gap:8px;display:flex;position:absolute;top:39px;right:2px}.visual-port{cursor:pointer;background:#fdfbf7;border:2px solid #2a2a2a;border-radius:50%;width:12px;height:12px;transition:all .15s}.visual-port:hover{transform:scale(1.2)}.visual-port.output.audio{border-color:#4a90d9;width:14px;height:14px}.visual-port.output.audio.connected{background:#4a90d9}.bundle-port-group{flex-direction:column;width:100%;display:flex}.bundle-port-row{align-items:center;gap:6px;min-height:28px;padding:4px 8px;display:flex}.bundle-port-group.left .bundle-port-row{flex-direction:row}.bundle-port-group.right .bundle-port-row{flex-direction:row-reverse}.bundle-expand-button{cursor:pointer;color:var(--text-secondary,#888);background:0 0;border:none;border-radius:3px;padding:2px 4px;font-size:10px;line-height:1;transition:background-color .15s,color .15s}.bundle-expand-button:hover{background-color:var(--hover-bg,#ffffff1a);color:var(--text-primary,#fff)}.bundle-triangle{transition:transform .15s;display:inline-block}.bundle-label{color:var(--text-primary,#fff);white-space:nowrap;text-overflow:ellipsis;cursor:default;user-select:none;max-width:140px;font-size:12px;overflow:hidden}.bundle-count{color:var(--text-secondary,#888);margin-left:4px;font-size:11px}.bundle-channels{flex-direction:column;max-height:300px;margin-top:2px;padding-left:8px;display:flex;overflow-y:auto}.bundle-channels::-webkit-scrollbar{width:6px}.bundle-channels::-webkit-scrollbar-track{background:0 0}.bundle-channels::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb,#fff3);border-radius:3px}.bundle-channels::-webkit-scrollbar-thumb:hover{background-color:var(--scrollbar-thumb-hover,#ffffff4d)}.bundle-channel-row{align-items:center;gap:4px;min-height:20px;padding:2px 4px;font-size:11px;display:flex}.bundle-channel-row.left{flex-direction:row}.bundle-channel-row.right{flex-direction:row-reverse}.bundle-channel-indent{width:8px}.bundle-channel-connector{color:var(--text-tertiary,#555);text-align:center;width:12px;font-family:monospace;font-size:12px}.bundle-channel-label{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;flex:1;max-width:120px;overflow:hidden}.bundle-channel-marker{border:1px solid var(--sketch-black);background-color:var(--bg-canvas);border-radius:50%;flex-shrink:0;width:6px;height:6px}.bundle-channel-marker.control-port{background-color:var(--control-output)}.bundle-channel-marker.audio-port{background-color:var(--audio-output)}.bundle-port-group.expanded .bundle-channels{animation:.15s ease-out slideDown}@keyframes slideDown{0%{opacity:0;max-height:0}to{opacity:1;max-height:300px}}.bundle-port-row.bundle-header{border-bottom:1px solid var(--border-color,#ffffff1a);margin-bottom:4px;padding-bottom:6px}.bundle-port-group+.empty-slot-indicator{border-top:1px dashed var(--border-color,#ffffff1a);margin-top:8px;padding-top:8px}.resize-handles{pointer-events:none}.resize-handle{pointer-events:auto;opacity:.4;transition:opacity var(--transition-fast,.15s ease);z-index:10;position:absolute}.resize-handle:hover,.resize-handle.active{opacity:1}.resize-handles.resizing .resize-handle{opacity:.6}.resize-handles.resizing .resize-handle.active{opacity:1}.resize-handle.corner{width:16px;height:16px}.resize-handle.corner:before{content:"";width:8px;height:8px;position:absolute}.resize-handle-se{cursor:nwse-resize;bottom:0;right:0}.resize-handle-se:before{border-right:2px solid var(--text-muted,#666);border-bottom:2px solid var(--text-muted,#666);bottom:3px;right:3px}.resize-handle-nw{cursor:nwse-resize;top:0;left:0}.resize-handle-nw:before{border-left:2px solid var(--text-muted,#666);border-top:2px solid var(--text-muted,#666);top:3px;left:3px}.resize-handle-ne{cursor:nesw-resize;top:0;right:0}.resize-handle-ne:before{border-right:2px solid var(--text-muted,#666);border-top:2px solid var(--text-muted,#666);top:3px;right:3px}.resize-handle-sw{cursor:nesw-resize;bottom:0;left:0}.resize-handle-sw:before{border-left:2px solid var(--text-muted,#666);border-bottom:2px solid var(--text-muted,#666);bottom:3px;left:3px}.resize-handle.edge{background:0 0}.resize-handle.edge:before{content:"";background:var(--text-muted,#666);opacity:0;transition:opacity var(--transition-fast,.15s ease);position:absolute}.resize-handle.edge:hover:before,.resize-handle.edge.active:before{opacity:.5}.resize-handle-n{cursor:ns-resize;height:6px;top:0;left:16px;right:16px}.resize-handle-n:before{border-radius:1px;height:2px;top:2px;left:20%;right:20%}.resize-handle-s{cursor:ns-resize;height:6px;bottom:0;left:16px;right:16px}.resize-handle-s:before{border-radius:1px;height:2px;bottom:2px;left:20%;right:20%}.resize-handle-e{cursor:ew-resize;width:6px;top:16px;bottom:16px;right:0}.resize-handle-e:before{border-radius:1px;width:2px;top:20%;bottom:20%;right:2px}.resize-handle-w{cursor:ew-resize;width:6px;top:16px;bottom:16px;left:0}.resize-handle-w:before{border-radius:1px;width:2px;top:20%;bottom:20%;left:2px}.panel-separator{background:var(--border-subtle,#e5e5e5);transition:background var(--transition-fast,.15s ease);flex-shrink:0;position:relative}.panel-separator:before{content:"";background:var(--text-muted,#666);opacity:.6;transition:opacity var(--transition-fast,.15s ease);border-radius:1px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.panel-separator:hover,.panel-separator.dragging{background:var(--accent-primary,#3b82f6)}.panel-separator:hover:before,.panel-separator.dragging:before{opacity:1}.panel-separator-horizontal{cursor:row-resize;width:100%;height:6px}.panel-separator-horizontal:before{width:20px;height:2px}.panel-separator-vertical{cursor:col-resize;width:6px;height:100%}.panel-separator-vertical:before{width:2px;height:20px}.midi-node{min-width:160px}.midi-connect-btn{background:var(--bg-tertiary);width:100%;color:var(--text-primary);border:var(--border-sketch-width,2px) solid var(--sketch-black);border-radius:var(--radius-md,6px);font-family:var(--font-sketch);font-size:var(--text-sm,12px);cursor:pointer;margin-bottom:var(--space-sm);padding:8px 20px;font-weight:600;transition:all .15s}.midi-connect-btn:hover{background:var(--bg-hover);transform:scale(1.02)}.midi-connect-btn:active{transform:scale(.98)}.midi-node.midi-unsupported{opacity:.7}.midi-unsupported-message{color:var(--sketch-gray,#666);text-align:center;flex-direction:column;align-items:center;gap:4px;padding:16px;font-size:11px;display:flex}.midi-rename-input{background:var(--bg-secondary);width:100%;color:var(--text-primary);border:1px solid var(--sketch-black);border-radius:var(--radius-sm,4px);font-family:var(--font-sketch);font-size:var(--text-sm,12px);text-align:center;outline:none;padding:2px 6px;font-weight:600}.midi-rename-input:focus{border-color:var(--color-primary,#4a9eff);box-shadow:0 0 0 1px var(--color-primary,#4a9eff)}.minilab3-visual{user-select:none;background:0 0;justify-content:center;align-items:center;width:650px;height:400px;display:flex;position:relative}.minilab3-body{background:linear-gradient(#6baf9e 0%,#5a9e8d 50%,#4a8e7d 100%);border-radius:12px;flex-direction:column;width:100%;height:100%;padding:10px 15px;display:flex;position:relative;box-shadow:0 4px 12px #0000004d,inset 0 1px #fff3}.minilab3-controls{align-items:flex-start;gap:10px;height:110px;margin-bottom:8px;display:flex;position:relative}.minilab3-left-section{flex-direction:column;flex-shrink:0;gap:6px;width:70px;height:165px;display:flex;position:absolute;top:0;left:0}.minilab3-buttons{grid-template-columns:1fr 1fr;gap:3px;display:grid}.minilab3-button{color:#888;text-transform:uppercase;cursor:pointer;text-align:center;background:#2a2a2a;border:1px solid #444;border-radius:3px;padding:5px 3px;font-size:7px;font-weight:600;transition:all .1s}.minilab3-button:hover{color:#aaa;background:#3a3a3a}.minilab3-button.minilab3-shift{color:#fff;background:#333}.minilab3-touch-strips{flex-direction:row;flex:1;gap:4px;display:flex}.minilab3-touch-strip{background:#1a1a1a;border:1px solid #333;border-radius:4px;flex:1;position:relative;overflow:visible}.minilab3-strip-indicator{background:linear-gradient(#7fb8a8 0%,#5a9e8d 100%);border-radius:2px;height:8px;transition:bottom 16ms linear;position:absolute;bottom:2px;left:2px;right:2px;box-shadow:0 0 6px #7fb8a880}.minilab3-display-section{flex-direction:column;flex-shrink:0;align-items:center;gap:8px;width:70px;margin-left:80px;padding-top:5px;display:flex}.minilab3-oled{background:#000;border:2px solid #1a1a1a;border-radius:4px;justify-content:center;align-items:center;width:55px;height:35px;display:flex;box-shadow:inset 0 0 10px #000c}.minilab3-oled-text{color:#4fc3f7;text-transform:uppercase;letter-spacing:1px;font-size:8px;font-weight:600}.minilab3-main-encoder{cursor:pointer;background:linear-gradient(145deg,#f5f5f5 0%,#e0e0e0 50%,#bdbdbd 100%);border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;display:flex;box-shadow:0 3px 6px #0000004d,inset 0 1px #fffc}.minilab3-encoder-cap{background:linear-gradient(145deg,#fafafa 0%,#e8e8e8 100%);border-radius:50%;width:34px;height:34px;position:relative;box-shadow:inset 0 1px 2px #0000001a}.minilab3-encoder-indicator{background:#333;border-radius:1px;width:3px;height:8px;position:absolute;top:5px;left:50%;transform:translate(-50%)}.minilab3-knobs-section{flex:1;grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(4,1fr);gap:12px;max-width:260px;padding:5px;display:grid}.minilab3-knob{flex-direction:column;align-items:center;gap:3px;display:flex}.minilab3-knob-cap{cursor:pointer;background:linear-gradient(145deg,#2a2a2a 0%,#1a1a1a 100%);border-radius:50%;width:28px;height:28px;transition:transform 16ms linear;position:relative;box-shadow:0 3px 6px #0006,inset 0 1px #ffffff1a}.minilab3-knob-indicator{background:#fff;border-radius:1px;width:3px;height:6px;position:absolute;top:4px;left:50%;transform:translate(-50%)}.minilab3-knob-label{color:#0009;font-size:7px;font-weight:600}.minilab3-faders-section{flex:1;justify-content:space-between;align-items:flex-start;padding:5px 15px 5px 50px;display:flex}.minilab3-fader{flex-direction:column;align-items:center;gap:3px;display:flex}.minilab3-fader-track{background:#1a1a1a;border:1px solid #333;border-radius:4px;width:8px;height:85px;position:relative}.minilab3-fader-thumb{cursor:pointer;background:linear-gradient(90deg,#2a2a2a 0%,#3a3a3a 50%,#2a2a2a 100%);border-radius:3px;width:22px;height:20px;transition:bottom 16ms linear;position:absolute;left:-7px;box-shadow:0 2px 4px #0006}.minilab3-fader-label{color:#0009;font-size:7px;font-weight:600}.minilab3-middle-row{justify-content:flex-end;margin-bottom:6px;padding:0 5px 0 95px;display:flex}.minilab3-pads-section{flex:1;justify-content:space-between;padding:5px 0;display:flex}.minilab3-pad{cursor:pointer;background:#1a1a1a;border:2px solid #3b82f680;border-radius:5px;width:45px;height:45px;transition:transform 16ms linear,box-shadow 16ms linear,border-color 16ms linear;position:relative;box-shadow:0 2px 4px #0006,inset 0 1px #ffffff0d}.minilab3-pad:before{content:"";background:var(--pad-color,#3b82f6);opacity:var(--pad-brightness,.3);border-radius:3px;transition:opacity 16ms linear;position:absolute;inset:2px}.minilab3-pad.active{box-shadow:0 1px 2px #0006, 0 0 calc(5px + var(--pad-brightness,.3) * 20px) var(--pad-color,#3b82f6);border-color:var(--pad-color,#3b82f6);transform:scale(.95)}.minilab3-pad.active:before{opacity:var(--pad-brightness,.5)}.minilab3-branding-row{justify-content:space-between;align-items:center;margin-bottom:4px;padding:0 10px;display:flex}.minilab3-logo{color:#000000b3;letter-spacing:.5px;font-size:14px;font-weight:700}.minilab3-logo-lab{font-weight:300}.minilab3-midi-indicators{align-items:center;gap:3px;display:flex}.minilab3-midi-label{color:#00000080;margin-right:4px;font-size:7px}.minilab3-midi-ch{background:#0003;border-radius:1px;width:5px;height:5px}.minilab3-midi-ch.active{background:#4fc3f7;box-shadow:0 0 4px #4fc3f780}.minilab3-arturia{color:#000000b3;letter-spacing:2px;text-transform:uppercase;font-size:12px;font-weight:600}.minilab3-keyboard-section{flex:1;justify-content:center;align-items:flex-end;padding:0 5px 8px;display:flex}.minilab3-keyboard{width:100%;height:165px;position:relative}.minilab3-key{cursor:pointer;transition:background 16ms linear,box-shadow 16ms linear,opacity 16ms linear;position:absolute;top:0}.minilab3-white-key{z-index:1;box-sizing:border-box;background:linear-gradient(#fafafa 0%,#f5f5f5 80%,#e8e8e8 100%);border:1px solid #ccc;border-radius:0 0 5px 5px;height:160px;box-shadow:0 3px 4px #0003,inset 0 -3px 6px #0000000d}.minilab3-white-key:hover{background:linear-gradient(#fff 0%,#fafafa 80%,#f0f0f0 100%)}.minilab3-white-key.active{background:linear-gradient(#e0e0e0 0%,#d5d5d5 80%,#c8c8c8 100%);box-shadow:0 1px 2px #0003,inset 0 2px 6px #0000001a}.minilab3-black-key{z-index:2;box-sizing:border-box;background:linear-gradient(#2a2a2a 0%,#1a1a1a 80%,#0a0a0a 100%);border-radius:0 0 4px 4px;height:100px;box-shadow:0 4px 6px #00000080,inset 0 -2px 4px #ffffff0d}.minilab3-black-key:hover{background:linear-gradient(#3a3a3a 0%,#2a2a2a 80%,#1a1a1a 100%)}.minilab3-black-key.active{background:linear-gradient(#1a1a1a 0%,#0a0a0a 80%,#000 100%);box-shadow:0 1px 3px #00000080,inset 0 2px 4px #0000004d}.minilab3-control-port,.minilab3-key-port{cursor:crosshair;z-index:10;background:#1a1a1a;border:2px solid #666;border-radius:50%;width:8px;height:8px;transition:all .15s;position:absolute}.minilab3-control-port:hover,.minilab3-key-port:hover{border-color:var(--accent-primary,#3b82f6);box-shadow:0 0 8px var(--accent-primary,#3b82f6);transform:scale(1.3)}.minilab3-control-port.connected,.minilab3-key-port.connected{background:var(--accent-primary,#3b82f6);border-color:var(--accent-primary,#3b82f6);box-shadow:0 0 6px var(--accent-primary,#3b82f6)}.minilab3-white-key .minilab3-key-port{bottom:8px;left:50%;transform:translate(-50%)}.minilab3-black-key .minilab3-key-port{border-width:2px;width:6px;height:6px;bottom:6px;left:50%;transform:translate(-50%);box-shadow:0 0 3px #fffc;background:#fff!important;border-color:#fff!important}.minilab3-black-key .minilab3-key-port:hover{box-shadow:0 0 8px var(--accent-primary,#3b82f6);border-color:var(--accent-primary,#3b82f6)!important;background:#fff!important}.minilab3-black-key .minilab3-key-port.connected{box-shadow:0 0 6px var(--accent-primary,#3b82f6);background:var(--accent-primary,#3b82f6)!important;border-color:#fff!important}.minilab3-pad .minilab3-control-port{bottom:4px;right:4px}.minilab3-knob{position:relative}.minilab3-knob .minilab3-control-port{position:absolute;bottom:-4px;left:50%;transform:translate(-50%)}.minilab3-fader{position:relative}.minilab3-fader .minilab3-control-port{position:absolute;bottom:-6px;left:50%;transform:translate(-50%)}.minilab3-touch-strip{position:relative}.minilab3-touch-strip .strip-port{bottom:-12px;left:50%;transform:translate(-50%)}.minilab3-pad:hover,.minilab3-knob:hover,.minilab3-fader:hover,.minilab3-touch-strip:hover,.minilab3-white-key:hover,.minilab3-black-key:hover{cursor:crosshair}.minilab3-pad:hover .minilab3-control-port,.minilab3-knob:hover .minilab3-control-port,.minilab3-fader:hover .minilab3-control-port,.minilab3-touch-strip:hover .minilab3-control-port,.minilab3-white-key:hover .minilab3-key-port,.minilab3-black-key:hover .minilab3-key-port{border-color:var(--accent-primary,#3b82f6);box-shadow:0 0 8px var(--accent-primary,#3b82f6);transform:translate(-50%)scale(1.3)}.midi-visual-node{background:var(--sketch-paper,#fafafa);border:3px solid var(--sketch-black,#1a1a1a);border-radius:8px;min-width:400px;position:absolute}.midi-visual-node.selected{border-color:var(--accent-primary,#3b82f6);box-shadow:0 0 12px #3b82f666}.midi-visual-body{flex-direction:column;gap:16px;padding:12px;display:flex}.midi-visual-section{flex-direction:column;gap:8px;display:flex}.midi-visual-section-label{text-transform:uppercase;letter-spacing:.5px;color:var(--sketch-gray,#666);font-size:11px;font-weight:600}.midi-visual-keyboard{border:2px solid var(--sketch-black,#1a1a1a);border-radius:4px;height:60px;display:flex;overflow:hidden}.midi-key{cursor:pointer;border-right:1px solid var(--sketch-gray,#ccc);flex:1;min-width:12px;transition:background .1s}.midi-key:last-child{border-right:none}.midi-key.white{background:#fff}.midi-key.white:hover{background:var(--sketch-paper,#f0f0f0)}.midi-key.white.connected{background:var(--accent-success-light,#dcfce7)}.midi-key.black{background:var(--sketch-black,#1a1a1a);z-index:1;border-radius:0 0 3px 3px;flex:.6;height:65%;margin-left:-4px;margin-right:-4px}.midi-key.black:hover{background:#333}.midi-key.black.connected{background:var(--accent-primary,#3b82f6)}.midi-visual-pad-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.midi-pad{aspect-ratio:1;background:var(--sketch-black,#1a1a1a);color:var(--sketch-paper,#fafafa);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;min-height:40px;font-size:10px;font-weight:500;transition:all .15s;display:flex}.midi-pad:hover{background:#333;transform:scale(.95)}.midi-pad.connected{background:var(--accent-primary,#3b82f6)}.midi-visual-knob-row{flex-wrap:wrap;gap:12px;display:flex}.midi-knob{cursor:pointer;flex-direction:column;align-items:center;gap:4px;display:flex}.midi-knob-dial{background:var(--sketch-black,#1a1a1a);border:3px solid var(--sketch-gray,#666);border-radius:50%;width:32px;height:32px;transition:border-color .15s;position:relative}.midi-knob-dial:after{content:"";background:#fff;border-radius:2px;width:3px;height:10px;position:absolute;top:3px;left:50%;transform:translate(-50%)}.midi-knob:hover .midi-knob-dial{border-color:var(--sketch-black,#1a1a1a)}.midi-knob.connected .midi-knob-dial{border-color:var(--accent-primary,#3b82f6)}.midi-knob-label{color:var(--sketch-gray,#666);font-size:10px}.midi-visual-fader-row{align-items:flex-end;gap:16px;display:flex}.midi-fader{cursor:pointer;flex-direction:column;align-items:center;gap:4px;display:flex}.midi-fader-track{background:var(--sketch-gray,#ddd);border:2px solid var(--sketch-black,#1a1a1a);border-radius:6px;width:12px;height:60px;position:relative}.midi-fader-thumb{background:var(--sketch-black,#1a1a1a);border-radius:3px;width:16px;height:12px;position:absolute;top:50%;left:-4px;transform:translateY(-50%)}.midi-fader.connected .midi-fader-track{border-color:var(--accent-primary,#3b82f6)}.midi-fader-label{color:var(--sketch-gray,#666);font-size:10px}.midi-visual-strip-row{gap:12px;display:flex}.midi-strip{cursor:pointer;flex-direction:column;flex:1;align-items:center;gap:4px;display:flex}.midi-strip-track{background:var(--sketch-gray,#ddd);border:2px solid var(--sketch-black,#1a1a1a);border-radius:4px;width:100%;height:24px;position:relative}.midi-strip-center{background:var(--sketch-black,#1a1a1a);width:2px;height:100%;position:absolute;left:50%;transform:translate(-50%)}.midi-strip.connected .midi-strip-track{border-color:var(--accent-primary,#3b82f6)}.midi-strip-label{color:var(--sketch-gray,#666);font-size:10px}.midi-visual-ports{border-top:1px solid var(--sketch-gray,#ccc);flex-direction:column;gap:4px;margin-top:8px;padding-top:8px;display:flex}.midi-visual-node.minilab3-wrapper{background:0 0;border:none;flex-direction:row;align-items:stretch;width:auto;min-width:auto;padding:0;display:flex}.midi-visual-node.minilab3-wrapper.selected{box-shadow:none}.midi-visual-node.minilab3-wrapper .minilab3-ports{background:var(--sketch-paper,#fafafa);border:2px solid var(--sketch-black,#1a1a1a);border-top:none;border-radius:6px;margin:0;padding:8px;position:absolute;top:50%;right:-120px;transform:translateY(-50%)}.midi-visual-node.minilab3-wrapper .minilab3-ports .port-row{align-items:center;gap:8px;padding:2px 0;display:flex}.midi-visual-node.minilab3-wrapper .minilab3-ports .port-label{color:var(--sketch-gray,#666);white-space:nowrap;font-size:10px}.minilab3-node{flex-direction:column;display:flex;position:absolute}.minilab3-node.selected .minilab3-visual .minilab3-body{box-shadow:0 0 20px #3b82f680}.minilab3-header{padding:var(--space-sm,8px) var(--space-md,16px);background:var(--bg-node-header);border:var(--border-sketch-width,2px) solid var(--sketch-black);border-radius:var(--radius-lg,8px) var(--radius-lg,8px) 0 0;z-index:5;cursor:grab;border-bottom:none;justify-content:space-between;align-items:center;margin-bottom:-2px;display:flex}.minilab3-header:active{cursor:grabbing}.minilab3-header .schematic-title{color:var(--text-primary);font-family:var(--font-sketch);font-weight:600;font-size:var(--text-lg,14px)}.minilab3-connect-overlay{background:var(--bg-overlay,#fafafae6);z-index:10;backdrop-filter:blur(2px);border-radius:0 0 12px 12px;justify-content:center;align-items:center;display:flex;position:absolute;inset:40px 0 0}.minilab3-connect-btn{background:var(--bg-tertiary);color:var(--text-primary);border:var(--border-sketch-width,2px) solid var(--sketch-black);border-radius:var(--radius-md,8px);font-family:var(--font-sketch);font-size:var(--text-md,14px);cursor:pointer;padding:12px 24px;font-weight:600;transition:all .2s}.minilab3-connect-btn:hover{background:var(--bg-hover);transform:scale(1.05)}.minilab3-connect-btn:active{transform:scale(.98)}.midi-status-dot{border-radius:50%;width:8px;height:8px;transition:all .2s}.midi-status-dot.connected{background:var(--accent-success,#22c55e);box-shadow:0 0 6px var(--accent-success,#22c55e)}.midi-status-dot.disconnected{background:var(--sketch-gray,#666)}.midi-unsupported-message{background:var(--sketch-paper,#fafafa);border:2px solid var(--sketch-gray,#ccc);color:var(--sketch-gray,#666);border-radius:8px;flex-direction:column;align-items:center;gap:4px;padding:20px;font-size:12px;display:flex}.midi-browser-hint{color:var(--sketch-gray,#999);font-size:10px}.minilab3-node .schematic-connect-btn{background:var(--bg-secondary,#f0f0f0);color:var(--text-primary);border:2px solid var(--sketch-black);border-radius:var(--radius-md,6px);padding:var(--space-sm,8px) var(--space-md,16px);font-family:var(--font-sketch);font-size:var(--text-sm,12px);cursor:pointer;margin-bottom:var(--space-sm,8px);font-weight:600;transition:all .15s}.minilab3-node .schematic-connect-btn:hover{background:var(--bg-hover,#e0e0e0);transform:scale(1.02)}.minilab3-node .schematic-connect-btn:active{transform:scale(.98)}.sampler-visual-node{background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-lg);min-width:160px;max-width:240px;color:var(--text-primary);font-family:var(--font-sketch);flex-direction:column;display:flex;position:relative;overflow:visible}.sampler-visual-node.selected{border-color:var(--accent-primary);box-shadow:0 0 0 2px color-mix(in srgb, var(--accent-primary) 30%, transparent)}.sampler-visual-node.dragging{opacity:.8}.sampler-visual-header{padding:var(--space-sm) var(--space-md);background:var(--bg-tertiary);border-bottom:1px solid var(--border-subtle);cursor:grab;justify-content:center;align-items:center;display:flex}.sampler-visual-header:active{cursor:grabbing}.sampler-visual-title{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.5px;color:var(--text-primary);font-weight:600}.sampler-visual-rows{padding:var(--space-sm);flex-direction:column;min-height:60px;display:flex}.sampler-row-empty{padding:var(--space-lg) var(--space-md);justify-content:center;align-items:center;display:flex}.sampler-empty-text{font-size:var(--text-sm);color:var(--text-muted);text-align:center;font-style:italic}.sampler-row-visual{gap:var(--space-sm);padding:var(--space-sm);flex-direction:column;display:flex}.sampler-row-visual.with-divider{border-top:1px solid var(--border-subtle);padding-top:var(--space-md)}.sampler-row-header{justify-content:space-between;align-items:center;gap:var(--space-xs);flex-wrap:wrap;display:flex}.sampler-row-label{font-size:var(--text-xs);color:var(--text-primary);white-space:nowrap;font-weight:600}.sampler-row-controls{align-items:center;gap:var(--space-xs);display:flex}.sampler-row-value{font-size:10px;font-family:var(--font-mono);color:var(--text-primary);background:var(--bg-tertiary);border:1px solid var(--border-subtle);border-radius:var(--radius-xs);cursor:ns-resize;user-select:none;transition:background var(--transition-fast), border-color var(--transition-fast);white-space:nowrap;padding:1px 4px}.sampler-row-value:hover{background:var(--bg-node);border-color:var(--accent-primary)}.sampler-placeholder-row{align-items:center;gap:var(--space-sm);padding:var(--space-xs);border-top:1px dashed var(--border-subtle);display:flex}.sampler-placeholder-row.first-row{border-top:none}.sampler-placeholder-port{background:var(--bg-tertiary);border:1px dashed var(--control-input);cursor:crosshair;width:12px;height:12px;transition:background var(--transition-fast), border var(--transition-fast), transform var(--transition-fast);border-radius:50%}.sampler-placeholder-port:hover{background:var(--control-input);border-style:solid;transform:scale(1.2)}.sampler-placeholder-port:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;background:var(--control-input);border-style:solid}.sampler-placeholder-text{color:var(--text-muted);font-size:10px;font-style:italic}.sampler-row-keys{padding:var(--space-xs) 0;flex-wrap:wrap;gap:6px;display:flex}.sampler-key-port{background:var(--control-input);border:1px solid var(--sketch-black);cursor:crosshair;width:12px;height:12px;transition:transform var(--transition-fast), filter var(--transition-fast);border-radius:50%}.sampler-key-port:hover{filter:brightness(1.2);transform:scale(1.3)}.sampler-key-port:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;transform:scale(1.3)}.sampler-key-port.connected{background:var(--control-connected);box-shadow:0 0 4px var(--control-connected)}.song-node{user-select:none;background:#fdfbf7;border:2px solid #2a2a2a;border-radius:8px;flex-direction:column;min-width:200px;font-family:Caveat,cursive;display:flex;position:absolute;box-shadow:3px 3px #0000001f}.song-node.selected{border-color:#4a90d9;box-shadow:0 0 0 2px #4a90d94d,3px 3px #0000001f}.song-node.dragging{opacity:.85;cursor:grabbing}.song-node.playing{border-color:#c98a3c;box-shadow:0 0 0 2px #c98a3c40,3px 3px #0000001f}.song-node-header{cursor:grab;background:#f1e9d6;border-bottom:2px solid #2a2a2a;border-radius:6px 6px 0 0;align-items:center;gap:8px;padding:6px 12px;display:flex}.song-node-disc{color:#c98a3c;font-size:14px;line-height:1}.song-node.playing .song-node-disc{color:#b5731f}.song-node-title{color:#2a2a2a;white-space:nowrap;text-overflow:ellipsis;font-size:18px;font-weight:700;overflow:hidden}.song-node-body{flex-direction:column;gap:4px;padding:8px 12px 10px;display:flex}.song-node-summary{color:#4a4336;font-size:15px}.song-node-hint{color:#9a8f78;font-size:13px;font-style:italic}.port-label{font-family:var(--font-sketch);font-size:var(--text-sm);color:var(--text-secondary)}.node-controls{gap:var(--space-xs);padding:var(--space-sm);border-top:1px solid var(--border-subtle);display:flex}.node-label{font-family:var(--font-sketch);font-size:var(--text-sm);color:var(--text-muted);margin-bottom:var(--space-xs)}.node-row{align-items:center;gap:var(--space-sm);margin-bottom:var(--space-sm);display:flex}.node-select{padding:var(--space-xs) var(--space-sm);background:var(--bg-canvas);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-sm);color:var(--text-primary);font-family:var(--font-sketch);font-size:var(--text-sm);cursor:pointer;flex:1}.node-select:focus{border-color:var(--accent-primary);outline:none}.loop-list{max-height:150px;margin-top:var(--space-sm);overflow-y:auto}.loop-item{padding:var(--space-xs) var(--space-sm);background:var(--bg-canvas);border:1px solid var(--sketch-light);border-radius:var(--radius-sm);margin-bottom:var(--space-xs);font-family:var(--font-sketch);font-size:var(--text-sm);justify-content:space-between;align-items:center;display:flex}.loop-item.muted{opacity:.5}.loop-actions{gap:var(--space-xs);display:flex}.loop-list::-webkit-scrollbar{width:6px}.loop-list::-webkit-scrollbar-track{background:var(--bg-tertiary);border-radius:3px}.loop-list::-webkit-scrollbar-thumb{background:var(--sketch-light);border-radius:3px}.loop-list::-webkit-scrollbar-thumb:hover{background:var(--sketch-gray)}.audio-clip{background:var(--bg-node);border:1.5px solid var(--border-sketch);border-radius:var(--radius-sm);cursor:grab;user-select:none;transition:transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast);flex-direction:column;display:flex;position:relative;overflow:visible}.audio-clip:hover{border-color:var(--audio-connected);box-shadow:0 2px 8px #00000026}.audio-clip:active{cursor:grabbing}.audio-clip.selected{border-color:var(--audio-connected);box-shadow:0 0 0 2px var(--audio-connected), 0 2px 12px color-mix(in srgb, var(--audio-connected) 30%, transparent)}.audio-clip.dragging{opacity:.85;box-shadow:0 8px 24px #00000040, 0 0 0 2px var(--audio-connected);cursor:grabbing;z-index:1000;transform:scale(1.02)}.audio-clip.drop-target{border-color:var(--accent-success);box-shadow:0 0 0 2px var(--accent-success), 0 0 16px color-mix(in srgb, var(--accent-success) 40%, transparent)}.audio-clip.on-canvas{pointer-events:auto}.audio-clip-waveform{background:var(--bg-canvas);border-radius:var(--radius-sm) var(--radius-sm) 0 0;flex:1;min-height:0;position:relative;overflow:hidden}.audio-clip-waveform svg{width:100%;height:100%;display:block}.audio-clip-waveform-path{stroke:var(--audio-connected);filter:drop-shadow(0 0 2px var(--audio-connected))}.audio-clip-center-line{stroke:var(--border-subtle);stroke-width:.5px;opacity:.3}.audio-clip-duration{font-family:var(--font-mono);color:var(--text-muted);background:color-mix(in srgb, var(--bg-node) 80%, transparent);border-radius:3px;padding:1px 4px;font-size:10px;line-height:1;position:absolute;top:2px;right:4px}.audio-clip-crop-indicator{color:var(--accent-warning);opacity:.7;width:12px;height:12px;position:absolute;bottom:2px;left:4px}.audio-clip-crop-indicator svg{width:100%;height:100%}.audio-clip-name{font-family:var(--font-sketch);font-size:var(--text-xs);color:var(--text-secondary);text-align:center;white-space:nowrap;text-overflow:ellipsis;border-top:1px solid var(--border-subtle);background:var(--bg-node);border-radius:0 0 var(--radius-sm) var(--radius-sm);padding:2px 6px 4px;overflow:hidden}.audio-clip-drag-handle{width:16px;height:16px;color:var(--text-muted);opacity:0;pointer-events:none;transition:opacity var(--transition-fast);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.audio-clip:hover .audio-clip-drag-handle{opacity:.4}.audio-clip.dragging .audio-clip-drag-handle{opacity:0}.audio-clip-drag-handle svg{width:100%;height:100%}@keyframes clip-appear{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.audio-clip.on-canvas{animation:.2s ease-out clip-appear}.audio-clip:hover .audio-clip-name{color:var(--text-primary)}.audio-clip.selected .audio-clip-name{color:var(--audio-connected)}.clip-drag-layer{pointer-events:none;z-index:10000;width:100vw;height:100vh;position:fixed;top:0;left:0}.clip-drop-zone{border:2px dashed var(--border-subtle);border-radius:var(--radius-md);transition:border-color var(--transition-fast), background-color var(--transition-fast);background:0 0;justify-content:center;align-items:center;display:flex;position:fixed}.clip-drop-zone.valid{border-color:var(--accent-success)}.clip-drop-zone.invalid{border-color:var(--accent-danger);opacity:.3}.clip-drop-zone.hovered.valid{background:color-mix(in srgb, var(--accent-success) 15%, transparent);box-shadow:0 0 20px color-mix(in srgb, var(--accent-success) 30%, transparent);border-style:solid}.clip-drop-zone-label{font-family:var(--font-sketch);font-size:var(--text-sm);color:var(--accent-success);text-shadow:0 1px 2px #00000080;background:color-mix(in srgb, var(--bg-node) 90%, transparent);border-radius:var(--radius-sm);padding:4px 12px}.clip-drag-preview{pointer-events:none;z-index:10001;filter:drop-shadow(0 4px 12px #0000004d);position:fixed}.clip-drag-hint{pointer-events:none;z-index:10002;font-family:var(--font-sketch);font-size:var(--text-xs);color:var(--text-on-accent);background:var(--accent-success);border-radius:var(--radius-sm);white-space:nowrap;padding:4px 8px;position:fixed;box-shadow:0 2px 8px #0003}.presence-overlay{pointer-events:none;z-index:50;position:absolute;inset:0}.presence-cursor{pointer-events:none;will-change:left, top;position:absolute;transform:translate(-2px,-2px)}.presence-cursor-label{color:#fff;white-space:nowrap;border-radius:4px;padding:2px 6px;font-size:11px;font-weight:600;line-height:1;position:absolute;top:12px;left:14px;box-shadow:0 1px 3px #0006}.presence-selection{pointer-events:none;opacity:.85;border:2px dashed;border-radius:8px;position:absolute}.node-canvas{background:var(--bg-primary);width:100%;height:100%;position:relative;overflow:hidden}.node-canvas-grid{background-image:radial-gradient(circle, var(--border-subtle) 1px, transparent 1px);pointer-events:none;background-size:20px 20px;position:absolute;inset:0}.node-canvas-content{transform-origin:0 0;width:10000px;height:10000px;position:absolute}.connections-layer{pointer-events:none;z-index:1;position:absolute;inset:0;overflow:visible}.node-canvas.is-connecting .connections-layer{z-index:100}.connections-layer svg{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.nodes-layer{z-index:10;position:absolute;inset:0}.clips-layer{z-index:15;pointer-events:none;position:absolute;inset:0}.clips-layer>*{pointer-events:auto}.selection-box{border:2px dashed var(--accent-primary);background:color-mix(in srgb, var(--accent-primary) 10%, transparent);pointer-events:none;z-index:50;position:absolute}.node-canvas.ghost-mode .nodes-layer{z-index:1}.node-canvas.ghost-mode .connections-layer{z-index:100}.node-canvas.ghost-mode .node,.node-canvas.ghost-mode .schematic-node{pointer-events:none;opacity:.1!important}.node-canvas.ghost-mode .oj-port{opacity:1;pointer-events:auto;will-change:box-shadow;animation:1.5s ease-in-out infinite portGlow}.node-canvas.ghost-mode .oj-cable{pointer-events:stroke;stroke-width:4px;filter:drop-shadow(0 0 4px);opacity:1!important}.node-canvas.ghost-mode .oj-cable--audio{filter:drop-shadow(0 0 6px var(--audio-connection))}.node-canvas.ghost-mode .oj-cable--control{filter:drop-shadow(0 0 6px var(--control-connection))}@keyframes portGlow{0%,to{box-shadow:0 0 8px 2px var(--audio-connection)}50%{box-shadow:0 0 16px 4px var(--audio-connection)}}.back-to-action{align-items:center;gap:var(--space-sm);padding:var(--space-lg);background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);z-index:100;box-shadow:var(--shadow-menu);flex-direction:column;animation:.3s ease-out back-to-action-fade-in;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.back-to-action:hover{box-shadow:var(--shadow-menu), 0 0 20px color-mix(in srgb, var(--accent-primary) 20%, transparent);transform:translate(-50%,-50%)scale(1.05)}.back-to-action-arrow{transform:rotate(var(--arrow-rotation));transition:transform var(--transition-fast);font-size:48px;line-height:1}.back-to-action-label{font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-secondary)}@keyframes back-to-action-fade-in{0%{opacity:0;transform:translate(-50%,-50%)scale(.9)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}.dropdown-menu{flex-shrink:0;display:inline-flex;position:relative}.dropdown-trigger{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;background:0 0;border:none;flex-shrink:0;font-weight:500;display:flex}.dropdown-trigger:hover,.dropdown-trigger:active{background:var(--bg-tertiary)}.dropdown-trigger:disabled{opacity:.5;cursor:not-allowed}.dropdown-trigger-open{background:var(--bg-tertiary)}.dropdown-chevron{font-size:var(--text-xs);color:var(--text-muted);transition:transform var(--transition-fast)}.dropdown-trigger-open .dropdown-chevron{transform:rotate(180deg)}.dropdown-content{margin-top:var(--space-xs);background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-md);min-width:180px;box-shadow:var(--shadow-menu);z-index:1000;will-change:opacity, transform;animation:.1s dropdownFadeIn;position:absolute;top:100%;left:0;overflow:hidden}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{padding:var(--space-sm) var(--space-md);font-family:var(--font-sketch);font-size:var(--text-sm);color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);outline:none;justify-content:space-between;align-items:center;display:flex}.dropdown-item:hover,.dropdown-item-focused{background:var(--accent-primary);color:#fff}.dropdown-item:hover .dropdown-item-shortcut,.dropdown-item-focused .dropdown-item-shortcut{color:#fffc}.dropdown-item-disabled{opacity:.5;cursor:not-allowed}.dropdown-item-disabled:hover,.dropdown-item-disabled.dropdown-item-focused{color:var(--text-primary);background:0 0}.dropdown-item-label{flex:1}.dropdown-item-shortcut{margin-left:var(--space-lg);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);opacity:0;transition:opacity var(--transition-fast)}.dropdown-item:hover .dropdown-item-shortcut,.dropdown-item-focused .dropdown-item-shortcut{opacity:1}.dropdown-separator{background:var(--border-subtle);height:1px;margin:var(--space-xs) 0}.dropdown-item-has-submenu{position:relative}.dropdown-submenu-chevron{margin-left:var(--space-sm);font-size:var(--text-xs);color:var(--text-muted)}.dropdown-item:hover .dropdown-submenu-chevron,.dropdown-item-focused .dropdown-submenu-chevron{color:#fffc}.dropdown-submenu{background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-md);min-width:180px;box-shadow:var(--shadow-menu);z-index:1001;margin-left:2px;animation:.1s dropdownFadeIn;position:absolute;top:0;left:100%;overflow:hidden}.dropdown-submenu .dropdown-item{padding:var(--space-sm) var(--space-md)}.engine-health-dot{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);font-family:var(--font-sketch);font-size:var(--text-sm);color:var(--text-primary,var(--sketch-black));background:var(--surface-paper,var(--bg-node,#fff));border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-pill,999px);box-shadow:2px 2px 0 var(--sketch-black);cursor:pointer;transition:transform 80ms,box-shadow 80ms;display:inline-flex}.engine-health-dot:hover{box-shadow:3px 3px 0 var(--sketch-black);transform:translateY(-1px)}.engine-health-dot:active{box-shadow:1px 1px 0 var(--sketch-black);transform:translateY(1px)}.engine-health-dot:focus-visible{outline:2px solid var(--accent,var(--sketch-black));outline-offset:2px}.engine-health-dot__glyph{font-size:var(--text-xs);line-height:1}.engine-health-dot__label{white-space:nowrap}@media (prefers-reduced-motion:reduce){.engine-health-dot,.engine-health-dot:hover,.engine-health-dot:active{transition:none;transform:none}}@media (width<=768px){.engine-health-dot__label{display:none}}.toolbar-wrapper{top:var(--space-md);align-items:center;gap:var(--space-sm);z-index:100;max-width:calc(100vw - var(--space-lg) * 2);display:flex;position:fixed;left:50%;transform:translate(-50%)}.toolbar{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);background:var(--bg-node);border-radius:var(--radius-lg);box-shadow:var(--shadow-menu);white-space:nowrap;border:none;flex-wrap:nowrap;flex-shrink:0;display:flex}.toolbar-menus{flex-shrink:0;align-items:center;gap:0;display:flex}.toolbar-btn-icon{min-width:32px;padding:var(--space-xs);font-size:var(--text-lg)}.toolbar-separator{background:var(--sketch-light);width:1px;height:24px;margin:0 var(--space-xs);flex-shrink:0}.file-input-hidden{display:none}.toolbar.toolbar-focused{border-width:3px;border-color:var(--accent-primary);box-shadow:0 0 0 2px var(--bg-canvas), 0 0 12px color-mix(in srgb, var(--accent-primary) 40%, transparent), var(--shadow-menu)}.help-panel{bottom:var(--space-md);right:var(--space-md);padding:var(--space-md);background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-lg);box-shadow:var(--shadow-menu);max-width:300px;font-family:var(--font-sketch);font-size:var(--text-sm);z-index:50;pointer-events:auto;position:fixed}.help-panel h3{margin-bottom:var(--space-sm);font-size:var(--text-lg);color:var(--text-primary)}.help-panel ul{color:var(--text-secondary);list-style:none}.help-panel li{margin-bottom:var(--space-xs)}.help-panel kbd{padding:2px var(--space-sm);background:var(--bg-tertiary);border:1px solid var(--sketch-light);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:var(--text-xs);display:inline-block}.help-mode-indicator{align-items:center;gap:var(--space-sm);padding:var(--space-sm);margin-bottom:var(--space-sm);background:var(--bg-tertiary);border-radius:var(--radius-md);border:1px solid var(--border-subtle);display:flex}.help-mode-label{color:var(--text-secondary);font-weight:600}.help-mode-value{align-items:center;gap:var(--space-xs);display:flex}.help-mode-value kbd{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}.help-mode-value.mode-config kbd{background:var(--accent-primary)}.help-mode-value.mode-keyboard kbd{background:var(--accent-success);border-color:var(--accent-success)}.help-panel.help-panel-warning{border-color:var(--accent-warning);box-shadow:0 0 0 2px var(--bg-canvas), 0 0 8px color-mix(in srgb, var(--accent-warning) 30%, transparent), var(--shadow-menu)}.help-mode-warning{align-items:flex-start;gap:var(--space-sm);padding:var(--space-sm);margin-bottom:var(--space-sm);background:color-mix(in srgb, var(--accent-warning) 15%, transparent);border:1px solid var(--accent-warning);border-radius:var(--radius-md);font-size:var(--text-xs);color:var(--text-primary);display:flex}.help-mode-warning .warning-icon{flex-shrink:0}.help-btn-minimized.warning{border-color:var(--accent-warning);background:color-mix(in srgb, var(--accent-warning) 15%, transparent)}.toolbar-status{align-items:center;gap:var(--space-xs);min-width:0;padding:var(--space-xs) var(--space-sm);font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-secondary);background:var(--bg-tertiary);border-radius:var(--radius-sm);margin-left:var(--space-xs);flex-shrink:1;display:flex}.toolbar-status-icon{font-size:var(--text-md);flex-shrink:0}.toolbar-status-text{text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:150px;overflow:hidden}.toolbar-unsaved{color:var(--accent-warning);font-weight:700}.toolbar-status-offline{background:color-mix(in srgb, var(--accent-warning) 20%, var(--bg-tertiary));color:var(--accent-warning)}.toolbar-status-offline .toolbar-status-icon{animation:2s ease-in-out infinite pulse-offline}@keyframes pulse-offline{0%,to{opacity:1}50%{opacity:.5}}@media (width<=600px){.toolbar-status-text{display:none}.toolbar-status{padding:var(--space-xs)}}@media (width<=800px){.toolbar-wrapper{flex-wrap:wrap;justify-content:center}}@media (width<=480px){.toolbar-separator{display:none}.toolbar{padding:var(--space-xs);gap:2px}}.breadcrumbs{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);font-family:var(--font-sketch);font-size:var(--text-md);white-space:nowrap;background:0 0;flex-shrink:0;display:flex}.breadcrumb-segment{align-items:center;gap:var(--space-xs);display:flex}.breadcrumb-separator{color:var(--text-tertiary);user-select:none;font-weight:400}.breadcrumb-item{color:var(--text-secondary);transition:color var(--transition-fast)}.breadcrumb-current{color:var(--text-primary);font-weight:500}@media (width<=480px){.breadcrumb-item{text-overflow:ellipsis;max-width:80px;overflow:hidden}}.devlog-panel{width:min(960px, calc(100vw - var(--space-lg)));flex-direction:column;height:min(60vh,640px);display:flex;overflow:hidden}.devlog-badge{align-items:center;gap:var(--space-sm);display:inline-flex}.devlog-count{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted)}.devlog-facets{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-bottom:var(--border-sketch-width) solid var(--sketch-black);flex-wrap:wrap;display:flex}.devlog-chips{gap:var(--space-xs);flex-wrap:wrap;display:flex}.devlog-chip{cursor:pointer;user-select:none}.devlog-search{flex:1;min-width:140px}.devlog-corr-banner{align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-md);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-primary);background:color-mix(in srgb, var(--accent-primary) 12%, transparent);border-bottom:var(--border-sketch-width) solid var(--sketch-black);display:flex}.devlog-list{font-family:var(--font-mono);font-size:var(--text-xs);flex:1;position:relative;overflow:hidden auto}.devlog-empty{color:var(--text-muted);padding:var(--space-lg);justify-content:center;align-items:center;display:flex}.devlog-rows{width:100%;position:relative}.devlog-row{align-items:center;gap:var(--space-sm);height:28px;padding:0 var(--space-md);box-sizing:border-box;white-space:nowrap;border-bottom:1px solid color-mix(in srgb, var(--sketch-black) 8%, transparent);display:flex;position:absolute;left:0;right:0}.devlog-row[data-clickable=true]{cursor:pointer}.devlog-row[data-clickable=true]:hover{background:color-mix(in srgb, var(--accent-primary) 8%, transparent)}.devlog-row[data-level=Warn]{background:color-mix(in srgb, var(--accent-warning) 7%, transparent)}.devlog-row[data-level=Error]{background:color-mix(in srgb, var(--accent-danger) 9%, transparent)}.devlog-cell-ts{color:var(--text-muted);flex:none}.devlog-cell-level{flex:0 0 52px;font-weight:700}.devlog-cell-level[data-level=Trace],.devlog-cell-level[data-level=Debug]{color:var(--text-muted)}.devlog-cell-level[data-level=Info]{color:var(--accent-primary)}.devlog-cell-level[data-level=Warn]{color:var(--accent-warning)}.devlog-cell-level[data-level=Error]{color:var(--accent-danger)}.devlog-cell-scope{color:var(--text-secondary);text-overflow:ellipsis;flex:none;max-width:140px;overflow:hidden}.devlog-cell-msg{text-overflow:ellipsis;flex:auto;overflow:hidden}.devlog-cell-fields{margin-left:var(--space-sm);color:var(--text-muted)}.devlog-cell-corr{color:var(--accent-primary);flex:none;font-weight:700}.issue-body{gap:var(--space-md);padding:var(--space-md);flex-direction:column;display:flex}.issue-preview-note{font-family:var(--font-sketch);font-size:var(--text-xs);color:var(--text-secondary);line-height:1.4}.issue-footer{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-top:var(--border-sketch-width) solid var(--sketch-black);display:flex}.issue-footer__spacer{flex:1}.ah-rows{padding:var(--space-sm) var(--space-md);gap:var(--space-xs);flex-direction:column;display:flex}.ah-row{align-items:center;gap:var(--space-sm);padding:var(--space-xs) 0;display:flex}.ah-label{font-family:var(--font-sketch);font-size:var(--text-sm)}.ah-value{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-secondary,var(--text-muted));text-align:right;margin-left:auto}.ah-footer{gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-top:var(--border-sketch-width) solid var(--sketch-black);display:flex}.ah-footer__btn{flex:1}.collab-control{z-index:1000;font-family:inherit;position:fixed;top:16px;right:16px}.collab-toggle{border:1px solid var(--border-color,#333);background:var(--panel-bg,#1e1e1e);color:var(--text-color,#eee);cursor:pointer;border-radius:8px;align-items:center;gap:8px;padding:8px 12px;font-size:13px;font-weight:600;display:inline-flex;box-shadow:0 2px 8px #0000004d}.collab-toggle:hover{border-color:var(--accent-color,#4a9eff)}.collab-toggle-dot{background:#666;border-radius:50%;width:8px;height:8px}.collab-toggle.connected .collab-toggle-dot{background:#22c55e;box-shadow:0 0 6px #22c55e}.collab-peer-count{background:var(--accent-color,#4a9eff);color:#fff;text-align:center;border-radius:10px;min-width:18px;padding:0 6px;font-size:11px}.collab-panel{border:1px solid var(--border-color,#333);background:var(--panel-bg,#1e1e1e);width:280px;color:var(--text-color,#eee);border-radius:10px;flex-direction:column;gap:10px;margin-top:8px;padding:16px;display:flex;box-shadow:0 8px 24px #0006}.collab-panel-title{margin:0;font-size:14px;font-weight:700}.collab-field{color:var(--text-muted,#aaa);flex-direction:column;gap:4px;font-size:12px;display:flex}.collab-field input,.collab-field select,.collab-field textarea,.collab-code-input{border:1px solid var(--border-color,#333);background:var(--input-bg,#2a2a2a);color:var(--text-color,#eee);border-radius:6px;padding:7px 9px;font-family:inherit;font-size:13px}.collab-field textarea{resize:vertical;word-break:break-all;font-family:monospace;font-size:11px}.collab-divider{text-align:center;color:var(--text-muted,#888);align-items:center;font-size:11px;display:flex}.collab-divider:before,.collab-divider:after{content:"";border-bottom:1px solid var(--border-color,#333);flex:1}.collab-divider span{padding:0 8px}.collab-join-row{gap:8px;display:flex}.collab-code-input{text-transform:uppercase;letter-spacing:1px;flex:1}.collab-error{color:#ef4444;margin:0;font-size:12px}.collab-session-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.collab-transport{color:var(--text-muted,#888);margin:-4px 0 0;font-size:11px}.collab-peer-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.collab-peer{align-items:center;gap:8px;font-size:13px;display:flex}.collab-peer-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px}.collab-peer-empty{color:var(--text-muted,#888);font-size:12px;font-style:italic}.collab-signaling{border-top:1px solid var(--border-color,#333);border-bottom:1px solid var(--border-color,#333);flex-direction:column;gap:8px;padding:8px 0;display:flex}.midi-device-card{align-items:center;gap:var(--space-sm,12px);padding:var(--space-lg,20px) var(--space-md,16px);background:var(--bg-node);border:var(--border-sketch-width,2px) solid var(--border-sketch);border-radius:var(--radius-md,8px);cursor:pointer;transition:all var(--transition-fast,.15s);text-align:center;flex-direction:column;display:flex}.midi-device-card:hover{background:var(--bg-tertiary);transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.midi-device-card:active{box-shadow:none;transform:translateY(0)}.midi-device-card.connected{border-color:var(--accent-success);background:var(--bg-node);box-shadow:0 0 0 1px var(--accent-success) inset}.midi-device-card.connected:hover{background:var(--bg-tertiary)}.midi-device-card-icon{background:var(--bg-tertiary);border-radius:var(--radius-md,12px);border:1px solid var(--border-subtle);justify-content:center;align-items:center;width:64px;height:64px;display:flex}.midi-device-emoji{font-size:32px}.midi-device-card-info{flex-direction:column;gap:4px;display:flex}.midi-device-card-name{font-family:var(--font-sketch);font-size:var(--text-sm,14px);color:var(--text-primary);font-weight:600;line-height:1.3}.midi-device-card-manufacturer{font-size:var(--text-xs,12px);color:var(--text-muted)}.midi-device-card-status{font-size:var(--text-xs,11px);color:var(--accent-success);align-items:center;gap:6px;font-weight:500;display:flex}.midi-device-status-dot{background:var(--accent-success);border-radius:50%;width:8px;height:8px;animation:2s ease-in-out infinite statusPulse}@keyframes statusPulse{0%,to{opacity:1;box-shadow:0 0 0 0 var(--accent-success)}50%{opacity:.7;box-shadow:0 0 0 4px #0000}}.midi-browser-section{padding:var(--space-md) var(--space-lg);overflow-y:auto}.midi-browser-section h3{margin:0 0 var(--space-md);font-family:var(--font-sketch);font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);font-weight:600}.midi-device-grid{gap:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));display:grid}.midi-browser-empty{text-align:center;padding:var(--space-xl);color:var(--text-muted);font-style:italic}.midi-browser-footer{padding:var(--space-sm) var(--space-lg);border-top:1px solid var(--border-subtle);text-align:center;font-size:var(--text-xs);color:var(--text-muted)}.midi-connection-toast{background:var(--bg-secondary);border:var(--border-sketch-width,2px) solid var(--border-sketch);border-radius:var(--radius-lg,12px);min-width:320px;max-width:420px;padding:0;position:relative;overflow:hidden;box-shadow:0 8px 32px #00000040}.midi-connection-toast-progress{background:var(--accent-primary);border-radius:0 0 0 var(--radius-lg,12px);height:3px;transition:width 1s linear;position:absolute;bottom:0;left:0}.midi-connection-toast-header{padding:var(--space-sm,8px) var(--space-md,12px);background:var(--bg-node-header);border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;display:flex}.midi-connection-toast-header-left{flex:1}.midi-connection-toast-dismiss{width:24px;height:24px;color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm,4px);transition:all var(--transition-fast,.15s);background:0 0;border:none;justify-content:center;align-items:center;padding:0;font-size:18px;line-height:1;display:flex}.midi-connection-toast-dismiss:hover{background:var(--bg-tertiary);color:var(--text-primary)}.midi-connection-toast-content{gap:var(--space-md,12px);padding:var(--space-md,12px) var(--space-md,12px) var(--space-sm,8px);display:flex}.midi-connection-toast-icon{border-radius:var(--radius-md,8px);border:1px solid var(--border-subtle);flex-shrink:0;justify-content:center;align-items:center;width:52px;height:52px;font-size:28px;line-height:1;display:flex}.midi-connection-toast-icon.recognized{background:linear-gradient(145deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);border-color:var(--accent-primary);box-shadow:0 0 12px rgba(var(--accent-primary-rgb,74, 158, 255), .2)}.midi-connection-toast-icon.generic{background:var(--bg-tertiary)}.midi-connection-toast-text{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.midi-connection-toast-title{font-family:var(--font-sketch);font-size:var(--text-md,14px);color:var(--text-primary);font-weight:600}.midi-connection-toast-device{font-size:var(--text-sm,13px);color:var(--text-secondary);word-break:break-word;line-height:1.3}.midi-connection-toast-assign{font-size:var(--text-xs,11px);color:var(--text-muted);align-items:center;gap:4px;display:flex}.midi-connection-toast-assign-name{color:var(--accent-primary);font-weight:600}.midi-connection-toast-actions{gap:var(--space-sm,8px);padding:var(--space-sm,8px) var(--space-md,12px) calc(var(--space-md,12px) + 3px);display:flex}.midi-connection-toast-btn{padding:var(--space-sm,8px) var(--space-md,12px);font-family:var(--font-sketch);font-size:var(--text-sm,13px);border-radius:var(--radius-md,6px);cursor:pointer;transition:all var(--transition-fast,.15s);border:var(--border-sketch-width,2px) solid transparent;font-weight:600}@media (width<=480px){.midi-connection-toast{min-width:auto;max-width:none}.midi-connection-toast-actions{flex-direction:column}.midi-connection-toast-btn{width:100%}}.latency-warning-banner{bottom:var(--space-lg);z-index:var(--z-top);width:calc(100% - var(--space-xl));max-width:600px;animation:oj-latency-slide-up var(--transition-normal) ease-out;position:fixed;left:50%;transform:translate(-50%)}@keyframes oj-latency-slide-up{0%{opacity:0;transform:translateX(-50%) translateY(var(--space-md))}to{opacity:1;transform:translate(-50%)translateY(0)}}@media (prefers-reduced-motion:reduce){.latency-warning-banner{animation:none}}@media (width<=600px){.latency-warning-banner{bottom:var(--space-sm);width:calc(100% - var(--space-md))}}@font-face{font-family:Caveat;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/caveat-regular.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Caveat;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/caveat-bold.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/inter-regular.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Inter;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/inter-medium.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/inter-semibold.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/inter-bold.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/jetbrains-mono-regular.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/jetbrains-mono-medium.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{font-family:var(--font-sketch);font-size:var(--text-md);color:var(--text-primary);background:var(--bg-canvas);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}#root{background-color:var(--bg-canvas);background-image:radial-gradient(circle,#0000000f 1px,#0000 1px);background-size:24px 24px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-tertiary);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb{background:var(--sketch-light);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--sketch-gray)}button{font-family:var(--font-sketch);font-size:inherit;cursor:pointer;color:inherit;background:0 0;border:none}input,select,textarea{font-family:var(--font-sans);font-size:inherit;color:inherit;background:var(--bg-canvas);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-sm);padding:var(--space-xs) var(--space-sm)}input:focus,select:focus,textarea:focus{border-color:var(--accent-primary);outline:none}.oj-welcome{z-index:10000;padding:var(--space-xl) var(--space-lg);background:color-mix(in srgb, var(--bg-canvas) 97%, transparent);justify-content:center;align-items:flex-start;display:flex;position:fixed;inset:0;overflow-y:auto}.oj-welcome-card{box-sizing:border-box;gap:var(--space-md);width:min(480px,100%);padding:var(--space-xl);background:var(--bg-node);border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-xl);box-shadow:var(--shadow-sketch);animation:oj-welcome-in var(--transition-normal) ease-out;flex-direction:column;margin:auto;display:flex}@keyframes oj-welcome-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.oj-welcome-title{font-family:var(--font-sketch);font-size:var(--text-2xl);color:var(--text-primary);margin:0;line-height:1.15}.oj-welcome-intro{margin:0 0 var(--space-sm);font-family:var(--font-sans);font-size:var(--text-sm);color:var(--text-secondary)}.oj-welcome-option{align-items:center;gap:var(--space-md);box-sizing:border-box;width:100%;padding:var(--space-md) var(--space-lg);text-align:left;border:var(--border-sketch-width) solid var(--sketch-black);border-radius:var(--radius-lg);box-shadow:var(--shadow-sketch);transition:transform var(--transition-fast), box-shadow var(--transition-fast);cursor:pointer;text-decoration:none;display:flex}.oj-welcome-option:hover{box-shadow:4px 4px 0 var(--sketch-black);transform:translateY(-2px)}.oj-welcome-option:active{box-shadow:1px 1px 0 var(--sketch-black);transform:translateY(1px)}.oj-welcome-option--primary{background:var(--accent-primary);color:var(--text-on-accent)}.oj-welcome-option--secondary{background:var(--bg-node-header);color:var(--text-primary)}.oj-welcome-option-main{gap:var(--space-xs);flex-direction:column;flex:auto;min-width:0;display:flex}.oj-welcome-option-label{font-family:var(--font-sketch);font-size:var(--text-lg);line-height:1.1}.oj-welcome-option-sub{font-family:var(--font-sans);font-size:var(--text-xs);line-height:1.3}.oj-welcome-option--primary .oj-welcome-option-sub{color:var(--text-on-accent)}.oj-welcome-option--secondary .oj-welcome-option-sub{color:var(--text-primary)}.oj-welcome-option-glyph{font-size:var(--text-xl);flex:none;line-height:1}.oj-welcome-footer{justify-content:center;align-items:center;gap:var(--space-sm);margin-top:var(--space-sm);padding-top:var(--space-md);border-top:1px solid var(--border-subtle);flex-wrap:wrap;display:flex}.oj-welcome-link{font-family:var(--font-sans);font-size:var(--text-xs);color:var(--text-primary);cursor:pointer;background:0 0;border:none;padding:0;line-height:1.3}.oj-welcome-link:hover{text-decoration:underline}.oj-welcome-footer-sep{color:var(--text-muted);user-select:none}@media (prefers-reduced-motion:reduce){.oj-welcome-card{animation:none}.oj-welcome-option{transition:none}.oj-welcome-option:hover{transform:none}}::selection{background:var(--accent-primary);color:#fff}:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}[data-sonner-toaster]{--normal-bg:var(--bg-secondary);--normal-border:var(--border-sketch);--normal-text:var(--text-primary);font-family:var(--font-sketch)}[data-sonner-toast][data-type=custom]{box-shadow:none;background:0 0;border:none;padding:0}.app-error-overlay{z-index:2000;padding:var(--space-lg,24px);background:color-mix(in srgb, var(--sketch-black,#1a1a1a) 40%, transparent);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.app-error-card{background:var(--bg-node,#fdfcf7);border:var(--border-sketch-width,2px) solid var(--sketch-black,#1a1a1a);border-radius:var(--radius-lg,14px);width:min(420px,100vw - 48px);box-shadow:var(--shadow-menu,0 8px 28px #00000040);color:var(--text-primary,#1a1a1a);padding:var(--space-lg,24px);text-align:center}.app-error-title{font-family:var(--font-sketch,sans-serif);margin:0 0 var(--space-sm,8px)}.app-error-msg{font-family:var(--font-mono,monospace);font-size:var(--text-sm,13px);color:var(--accent-danger,#e53935);word-break:break-word;margin:0 0 var(--space-sm,8px)}.app-error-note{font-size:var(--text-xs,12px);color:var(--text-muted,#777);margin:0 0 var(--space-md,16px)}.app-error-actions{gap:var(--space-sm,8px);justify-content:center;display:flex}.app-error-btn{font-family:var(--font-sketch,sans-serif);padding:var(--space-xs,6px) var(--space-md,16px);border:var(--border-sketch-width,2px) solid var(--sketch-black,#1a1a1a);border-radius:var(--radius-sm,8px);background:var(--bg-node,#fdfcf7);color:var(--text-primary,#1a1a1a);cursor:pointer}.app-error-btn.primary{background:var(--accent,var(--sketch-black,#1a1a1a));color:var(--text-on-accent,#fff)}.app-error-btn:hover{filter:brightness(1.06)}
