@font-face{font-family:ITC Avant Garde;src:url(/fonts/ITCAvantGardeStd-Demi.otf) format("opentype");font-weight:400 600;font-display:swap}@font-face{font-family:ITC Avant Garde;src:url(/fonts/ITCAvantGardeStd-Bold.otf) format("opentype");font-weight:700 900;font-display:swap}:root{--bg: #16161A;--panel: #16161A;--panel-2: #00000040;--control: #292c2e10;--control-2: #292c2e80;--control-hover: #3B3F41;--control-active: #3d4247;--line: #ffffff10;--fg: #F0F0F4;--fg-dim: #a7a69c;--fg-faint: #6f6f77;--green: #1baa3f;--red: #dd2f2f;--blue: #1b63aa;--purple: #521baa;--yellow: #e8b200;--orange: #de7233;--accent: var(--green);--accent-armed: var(--red);--control-h: 28px;--radius: 8px;--radius-pill: 999px;--mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;--sans: "ITC Avant Garde", system-ui, -apple-system, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:13px;-webkit-font-smoothing:antialiased}*{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}::-webkit-scrollbar{width:11px;height:11px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff29;border-radius:999px;border:3px solid transparent;background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background:#ffffff52}::-webkit-scrollbar-corner{background:transparent}button,select,input[type=text],input[type=number]{font:inherit;height:var(--control-h);color:var(--fg);background:var(--control);border:none;border-radius:var(--radius-pill);padding:2px 10px 0;line-height:1;vertical-align:middle}select,input[type=number],input[type=text]{background:var(--control-2)}button{display:inline-flex;align-items:center;gap:5px;cursor:pointer;white-space:nowrap;transition:background .12s,color .12s}button:hover{background:var(--control-hover)}button:disabled{opacity:.4;cursor:not-allowed}button.active{background:var(--accent);color:var(--bg)}button.active:hover{background:var(--accent);filter:brightness(1.06)}button.rec.active{background:var(--red);color:var(--bg)}button.rec.active:hover{background:var(--red)}select{-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%23a7a69c' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8 9.5 4.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px;padding-left:14px}input[type=text],input[type=number]{padding:2px 10px 0}input[type=range]{height:auto;accent-color:var(--green)}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.mini-btn{padding:2px 9px 0;font-size:12px}.icon{display:inline-block;width:15px;height:15px;flex:none;background-color:currentColor;-webkit-mask:var(--i) center / 15px 15px no-repeat;mask:var(--i) center / 15px 15px no-repeat;position:relative;top:-1px}.icon-play{--i: url(/icons/play.svg)}.icon-stop{--i: url(/icons/stop.svg)}.icon-record{--i: url(/icons/record.svg)}.icon-loop{--i: url(/icons/loop.svg)}.icon-click{--i: url(/icons/click.svg)}.icon-plus{--i: url(/icons/plus.svg)}.icon-minus{--i: url(/icons/minus.svg)}.icon-undo{--i: url(/icons/undo.svg)}.icon-redo{--i: url(/icons/redo.svg)}.bpm-input{width:58px;text-align:center}.app{display:flex;flex-direction:column;height:100%}.topbar{display:flex;align-items:center;gap:14px;padding:8px 12px;background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap}.topbar .brand{font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--fg)}.topbar .spacer{flex:1}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--fg-faint)}.status-dot.ok{background:var(--green)}.field{display:flex;align-items:center;gap:6px}.field label{color:var(--fg-dim);padding-top:3px}.body{display:flex;flex:1;min-height:0}.rail{width:268px;flex:none;border-right:1px solid var(--line);background:var(--panel);overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable}.rail-head{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;color:var(--fg-dim);border-bottom:1px solid var(--line);text-transform:uppercase;font-size:11px;letter-spacing:.06em}.channel{display:flex;flex-direction:column;gap:6px;padding:8px 10px;border-bottom:1px solid var(--line)}.channel.armed{background:var(--panel-2);box-shadow:inset 2px 0 0 var(--accent-armed)}.channel.dimmed{opacity:.4}.channel-row{display:flex;align-items:center;gap:6px}.channel-row input[type=range],.channel-name{flex:1;min-width:0}.channel-name input{width:100%}.channel .chip{white-space:nowrap}.pb-row{gap:5px}.pb-label{color:var(--fg-dim);font-size:11px}.pb-input{width:46px;height:22px;padding:1px 6px 0;text-align:center;font-size:12px}.chip{font-size:11px;color:var(--fg-dim);font-family:var(--mono)}.main{flex:1;display:flex;flex-direction:column;min-width:0}.panel{padding:12px;border-bottom:1px solid var(--line)}.panel h2{margin:0 0 8px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-dim);font-weight:600}.timeline{flex:1;min-height:120px;overflow:auto;background:var(--bg);border-bottom:1px solid var(--line)}.timeline canvas{display:block;cursor:text}.log{height:132px;overflow-y:auto;font-family:var(--mono);font-size:12px;padding:8px 12px;color:var(--fg-dim)}.log .line{padding:1px 0;white-space:pre}.log .line.in{color:var(--fg)}.main{position:relative}.editor-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;flex-direction:column;background:var(--bg)}.editor-toolbar{display:flex;align-items:center;gap:12px;padding:8px 12px;background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap}.editor-scroll{flex:1;overflow:auto;background:var(--bg)}.editor-scroll canvas{display:block}.editor-hint{padding:5px 12px;font-size:11px;color:var(--fg-faint);border-top:1px solid var(--line);background:var(--panel)}.qpanel{display:flex;align-items:center;gap:8px}.qlabel{color:var(--fg-dim);text-transform:uppercase;font-size:11px;letter-spacing:.05em}.qfield{display:flex;align-items:center;gap:5px;color:var(--fg-dim)}.qfield input[type=range]{width:80px}.recovery{display:flex;align-items:center;gap:10px;padding:7px 12px;background:var(--panel-2);border-bottom:1px solid var(--line);font-size:12px;color:var(--fg-dim)}.hint{color:var(--fg-faint);font-size:12px;padding-top:2px}.warn{margin:24px auto;max-width:520px;padding:16px 18px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);line-height:1.5}