:root{--bg: #0c0e13;--panel: #151922;--panel-2: #1b2029;--line: #262c38;--text: #e6e9ef;--muted: #868e9e;--dim: #5a6273;--accent: #4d8dff;--green: #37c871;--amber: #f5b544;--red: #f5544d;--violet: #a781ff;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:13px/1.45 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.muted{color:var(--muted)}.dim{color:var(--dim)}.small{font-size:11px}.pad{padding:14px}.grow-right{margin-left:auto}.app{display:flex;flex-direction:column;height:100%}.app-body{flex:1;min-height:0;display:flex}.topbar{display:flex;align-items:center;gap:10px;height:42px;padding:0 16px;flex:none;background:var(--panel);border-bottom:1px solid var(--line)}.topbar-logo{color:var(--accent);font-size:15px}.topbar-title{font-weight:650;letter-spacing:.3px}.topbar-show{color:var(--muted);font-size:12px}.conn{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}.conn-dot{width:9px;height:9px;border-radius:50%;background:var(--red);transition:.2s}.conn-live .conn-dot{background:var(--green);box-shadow:0 0 8px var(--green)}.conn-polling .conn-dot{background:var(--amber);box-shadow:0 0 8px var(--amber)}.conn-connecting .conn-dot{background:var(--dim)}.server-state{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:4px 10px;border-radius:999px;border:1px solid var(--line);white-space:nowrap}.server-state .dot{width:8px;height:8px;border-radius:50%;background:var(--dim)}.server-connected{color:var(--text);border-color:color-mix(in srgb,var(--green) 45%,var(--line))}.server-connected .dot{background:var(--green);box-shadow:0 0 7px var(--green)}.server-down{color:var(--red);border-color:color-mix(in srgb,var(--red) 45%,var(--line))}.server-down .dot{background:var(--red)}.server-connecting .dot{background:var(--amber)}.banner{display:flex;align-items:center;gap:10px;padding:6px 16px;flex:none;font-size:12px;background:#2a1c17;color:var(--amber);border-bottom:1px solid var(--line)}.banner.error{background:#2a1618;color:var(--red)}.banner-close{margin-left:auto;border:none;background:none;color:inherit;cursor:pointer}.pagetabs{display:flex;justify-content:center;gap:4px;height:46px;flex:none;background:var(--panel);border-top:1px solid var(--line)}.pagetab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;width:88px;border:none;background:none;cursor:pointer;color:var(--muted);font:inherit;font-size:10px;position:relative;border-top:2px solid transparent;transition:.15s}.pagetab:hover{color:var(--text)}.pagetab.active{color:var(--accent);border-top-color:var(--accent)}.pagetab-icon{font-size:16px;line-height:1}.frame{display:flex;flex-direction:column;flex:1;min-width:0}.frame-toolbar{height:36px;flex:none;display:flex;align-items:center;gap:8px;padding:0 12px;background:var(--panel);border-bottom:1px solid var(--line)}.frame-body{flex:1;min-height:0;display:flex}.frame-left,.frame-right{width:260px;flex:none;background:var(--panel);overflow:auto;display:flex;flex-direction:column}.frame-left{border-right:1px solid var(--line)}.frame-right{border-left:1px solid var(--line)}.frame-centre{flex:1;min-width:0;display:flex;background:var(--bg);overflow:auto}.frame-bottom{height:210px;flex:none;background:var(--panel);border-top:1px solid var(--line);overflow:auto}.panel{display:flex;flex-direction:column;min-height:0}.panel-head{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);padding:12px 14px 8px;display:flex;align-items:center;gap:6px}.panel-add{margin-left:auto;width:22px;height:22px;border:1px solid var(--line);border-radius:5px;background:var(--panel-2);color:var(--text);cursor:pointer;font-size:14px;line-height:1;display:grid;place-items:center}.panel-add:hover{border-color:var(--accent)}.list{display:flex;flex-direction:column}.list-row{display:flex;align-items:center;gap:8px;padding:7px 14px;border-left:2px solid transparent;cursor:pointer}.list-row:hover{background:var(--panel-2)}.list-row.sel{background:var(--panel-2);box-shadow:inset 2px 0 0 var(--accent)}.list-row.off{opacity:.5}.list-empty{color:var(--dim);padding:20px 14px;text-align:center;font-size:12px}.dot{width:8px;height:8px;border-radius:50%;background:var(--dim);flex:none}.dot.playing{background:var(--green);box-shadow:0 0 6px var(--green)}.dot.paused{background:var(--amber)}.row-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row-fire{opacity:0;border:none;background:none;color:var(--green);cursor:pointer;font-size:11px}.list-row:hover .row-fire{opacity:1}.cue-num{color:var(--accent);min-width:22px}.inspector{display:flex;flex-direction:column;min-height:0;flex:1}.inspector-head{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);padding:12px 14px 8px;border-bottom:1px solid var(--line)}.inspector-body{padding:12px 14px}.inspector-empty{color:var(--dim);padding:24px 14px;text-align:center;font-size:12px}.inspector-sub{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:var(--dim);margin:14px 0 6px}.field-row{display:flex;justify-content:space-between;gap:10px;padding:5px 0;font-size:12px;align-items:center}.field-label{color:var(--muted)}.field-value{color:var(--text);text-align:right;word-break:break-word}.inspector-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}input,select,textarea,button{font:inherit}input,select,textarea{font-size:12px;padding:6px 8px;border-radius:6px;background:var(--panel-2);border:1px solid var(--line);color:var(--text);min-width:0}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent)}input[type=range]{padding:0;background:none;border:none}.num{width:74px;text-align:right;font-family:ui-monospace,Menlo,monospace}.addform{display:flex;flex-direction:column;gap:6px;padding:10px 14px;border-bottom:1px solid var(--line)}.row-inline{display:flex;align-items:center;gap:6px}.btn,.btn-primary,.btn-danger{font-size:12px;padding:6px 12px;border-radius:6px;cursor:pointer;border:1px solid var(--line);background:var(--panel-2);color:var(--text);transition:.15s}.btn:hover{border-color:var(--accent)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#05122e;font-weight:600}.btn-primary:hover{filter:brightness(1.1)}.btn-danger:hover{border-color:var(--red);color:var(--red)}.btn:disabled,.btn-primary:disabled{opacity:.4;cursor:not-allowed}.btn.tiny{padding:3px 8px;font-size:11px}.transport{display:flex;align-items:center;gap:6px}.tbtn{min-width:30px;height:26px;padding:0 8px;border:1px solid var(--line);border-radius:6px;background:var(--panel-2);color:var(--text);cursor:pointer;font-size:12px;display:grid;place-items:center;transition:.15s}.tbtn:hover:not(:disabled){border-color:var(--accent)}.tbtn:disabled{opacity:.35;cursor:not-allowed}.tbtn.on{background:var(--green);border-color:var(--green);color:#05130a}.transport-time{margin-left:10px;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}.canvas-wrap{flex:1;display:flex;flex-direction:column;padding:20px;gap:10px;min-width:0}.canvas{position:relative;align-self:center;width:100%;max-width:1100px;background:repeating-linear-gradient(0deg,transparent,transparent 9%,rgba(255,255,255,.03) 9%,rgba(255,255,255,.03) 10%),repeating-linear-gradient(90deg,transparent,transparent 9%,rgba(255,255,255,.03) 9%,rgba(255,255,255,.03) 10%),#05060a;border:1px solid var(--line);border-radius:6px;overflow:hidden}.canvas-empty{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:var(--dim)}.viewport{position:absolute;border:1.5px solid var(--muted);border-radius:4px;background:#4d8dff14;cursor:grab;touch-action:none;display:flex;flex-direction:column;overflow:hidden}.viewport:active{cursor:grabbing}.viewport.sel{border-color:var(--accent);background:#4d8dff29;box-shadow:0 0 0 1px var(--accent);z-index:2}.viewport.live{border-color:var(--green)}.viewport.disabled{opacity:.4;border-style:dashed}.viewport-label{display:flex;align-items:center;gap:6px;padding:4px 7px;font-size:12px;background:#00000059;pointer-events:none}.viewport-resize{position:absolute;right:0;bottom:0;width:16px;height:16px;cursor:nwse-resize;background:linear-gradient(135deg,transparent 50%,var(--accent) 50%);touch-action:none}.canvas-hint{text-align:center;font-size:11px}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;padding:14px;align-content:start;width:100%}.media-tile{border:1px solid var(--line);border-radius:8px;background:var(--panel);overflow:hidden;cursor:pointer;transition:.12s;text-align:left;padding:0;color:var(--text)}.media-tile:hover{border-color:var(--accent)}.media-tile.sel{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.media-thumb{aspect-ratio:16 / 9;background:#05060a;display:grid;place-items:center;color:var(--dim);font-size:22px;overflow:hidden}.media-thumb img{width:100%;height:100%;object-fit:cover;display:block}.media-meta{padding:6px 8px;display:flex;flex-direction:column;gap:2px}.media-name{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.media-sub{font-size:10px;color:var(--dim);display:flex;gap:6px}.kind{font-size:9px;text-transform:uppercase;letter-spacing:.5px;padding:0 5px;border-radius:4px;border:1px solid var(--line)}.kind.movie{color:var(--accent)}.kind.still{color:var(--violet)}.kind.audio{color:var(--green)}.channels{display:flex;gap:12px;padding:14px;align-items:flex-start;flex-wrap:wrap;width:100%}.channel-card{min-width:300px;flex:1;max-width:460px;background:var(--panel);border:1px solid var(--line);border-radius:8px;overflow:hidden}.channel-head{display:flex;align-items:center;gap:8px;padding:9px 12px;border-bottom:1px solid var(--line);background:var(--panel-2)}.channel-index{font-weight:700;color:var(--accent)}.layer-row{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--line)}.layer-row:last-child{border-bottom:none}.layer-index{font-family:ui-monospace,Menlo,monospace;font-size:11px;color:var(--muted);min-width:26px}.layer-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.layer-clip{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.progress{height:3px;background:var(--panel-2);border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:var(--green);transition:width .2s linear}.layer-time{font-family:ui-monospace,Menlo,monospace;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}.grid-pads{display:grid;gap:8px;padding:14px;width:100%;align-content:start}.gpad{aspect-ratio:5 / 3;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);display:flex;flex-direction:column;justify-content:space-between;padding:8px 10px;cursor:pointer;transition:.12s;color:var(--text);text-align:left}.gpad:hover{border-color:var(--accent)}.gpad.empty{color:var(--dim);border-style:dashed}.gpad.firing{border-color:var(--green);background:#123a24;box-shadow:0 0 0 1px var(--green)}.gpad-key{font-family:ui-monospace,Menlo,monospace;font-size:10px;color:var(--muted)}.gpad-name{font-weight:600;font-size:12px}.log{display:flex;flex-direction:column-reverse;padding:6px 0;font-size:11px}.log-row{display:flex;gap:10px;padding:3px 14px;font-family:ui-monospace,Menlo,monospace;border-left:2px solid transparent}.log-row.bad{border-left-color:var(--red);color:var(--red)}.log-code{color:var(--muted);min-width:30px}.log-cmd{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.log-status{color:var(--dim)}.cmdline{display:flex;gap:6px;padding:8px 14px;border-bottom:1px solid var(--line)}.cmdline input{flex:1;font-family:ui-monospace,Menlo,monospace}.gdd-form{display:flex;flex-direction:column;gap:8px}.gdd-field{display:flex;flex-direction:column;gap:3px}.gdd-label{font-size:11px;color:var(--muted)}.gdd-desc{font-size:10px;color:var(--dim)}textarea{width:100%;min-height:90px;font-family:ui-monospace,Menlo,monospace;resize:vertical}.stack{display:flex;flex-direction:column;gap:10px}.toolbar-title{font-weight:620}.spacer{flex:1}.warn{color:var(--amber)}.chip{font-size:10px;padding:2px 7px;border-radius:999px;border:1px solid var(--line);background:var(--panel);white-space:nowrap;color:var(--muted)}