@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@400;500;600&display=swap";:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#e5e5e2;--bg:#080808;--panel:#111210;--panel-raised:#171816;--line:#2b2d29;--line-soft:#20211e;--muted:#83877f;--accent:#d9ff58;--danger:#ff6d58;--mono:"IBM Plex Mono", monospace;background:#080808;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}html,body,#stage-canvas{width:100%;height:100%;margin:0}body{background:var(--bg);overflow:hidden}button,input,select{font:inherit}button{color:inherit}.app-shell{grid-template-rows:52px minmax(0,1fr) 92px;min-width:980px;height:100dvh;display:grid}.topbar{border-bottom:1px solid var(--line);background:#0c0d0b;justify-content:space-between;align-items:center;padding:0 16px;display:flex}.wordmark{letter-spacing:.13em;align-items:center;gap:9px;font-size:12px;font-weight:600;display:flex}.wordmark-mark{border:1px solid var(--accent);width:12px;height:12px;transform:rotate(45deg)}.version{color:var(--muted);font:10px var(--mono)}.file-actions{gap:7px;display:flex}.button{cursor:pointer;background:#171816;border:1px solid #363834;border-radius:3px;min-height:30px;padding:0 11px;font-size:11px;transition:border-color .15s,background .15s,color .15s}.button:hover:not(:disabled){background:#20221e;border-color:#676b62}.button:disabled{opacity:.36;cursor:default}.button.primary{background:var(--accent);border-color:var(--accent);color:#0b0c09;font-weight:600}.button.primary:hover:not(:disabled){background:#e2ff78}.button.danger:hover:not(:disabled){border-color:var(--danger);color:var(--danger)}.output-button{align-items:center;gap:8px;display:inline-flex}.output-button.live{color:#edffc0;border-color:#557022}.output-state{color:#848880;min-width:28px;font:8px var(--mono);text-align:center;letter-spacing:.08em;background:#2a2c28;border-radius:2px;padding:2px 4px}.output-state.connecting{color:#ffdc73;background:#4b401d;animation:.9s infinite alternate blink}.output-state.live{background:var(--accent);color:#10120b;box-shadow:0 0 10px #d9ff584d}.workspace{grid-template-columns:minmax(0,1fr) 326px;min-height:0;display:grid}.viewport{background:#080808;min-width:0;min-height:0;position:relative;overflow:hidden}#stage-canvas{outline:none;display:block}.drop-zone{z-index:4;background:radial-gradient(circle,#151714 0,#090a09 60%);flex-direction:column;justify-content:center;align-items:center;transition:opacity .25s;display:flex;position:absolute;inset:0}.drop-zone.hidden{opacity:0;pointer-events:none}.drop-zone.dragging{background:radial-gradient(circle,#2d3519 0,#090a09 64%)}.drop-zone.dragging .drop-art{transform:scale(1.06)}.drop-art{width:92px;height:92px;margin-bottom:26px;transition:transform .2s;position:relative}.drop-art span{border:1px solid var(--accent);position:absolute;inset:18px;transform:rotate(30deg)}.drop-art span:nth-child(2){opacity:.65;transform:rotate(90deg)}.drop-art span:nth-child(3){opacity:.35;transform:rotate(150deg)}.drop-title{letter-spacing:-.02em;margin:0 0 8px;font-size:20px;font-weight:500}.drop-subtitle{color:var(--muted);font:11px var(--mono);margin:0 0 24px}.drop-guidance{color:#8f9389;font:9px/1.65 var(--mono);text-align:center;border:1px solid #292b27;border-radius:3px;margin:18px 0 0;padding:10px 13px}.drop-guidance strong{color:var(--accent);font-weight:500}.text-button{color:var(--muted);cursor:pointer;background:0 0;border:0;border-bottom:1px solid #52554e;margin-top:13px;padding:3px;font-size:10px}.text-button:hover{color:var(--accent);border-color:var(--accent)}.viewport-hud{z-index:3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#acafa7;height:27px;font:10px var(--mono);background:#0d0e0ccc;border:1px solid #292b27;border-radius:3px;align-items:center;padding:0 9px;display:flex;position:absolute;top:14px}.top-left{left:14px}.top-right{right:14px}.status-dot{background:#646760;border-radius:50%;width:6px;height:6px;margin-right:7px}.status-dot.ready{background:var(--accent);box-shadow:0 0 9px #d9ff588c}.status-dot.error{background:var(--danger)}.status-dot.loading{background:#ffd358;animation:.9s infinite alternate blink}@keyframes blink{to{opacity:.25}}.stats{gap:11px}.stats b{color:#f0f1ed;font-weight:500}.stats span+span{border-left:1px solid var(--line);padding-left:11px}.viewport-tools{z-index:3;gap:7px;display:flex;position:absolute;bottom:14px;left:14px}.tool-button,.color-tool{color:#babdb4;background:#0d0e0cd6;border:1px solid #292b27;border-radius:3px;align-items:center;gap:9px;height:30px;padding:0 9px;font-size:10px;display:inline-flex}.tool-button{cursor:pointer}.tool-button:disabled{opacity:.4;cursor:default}kbd{font:9px var(--mono);border:1px solid #444740;border-radius:2px;padding:1px 4px}.color-tool input{cursor:pointer;background:0 0;border:0;width:16px;height:16px;padding:0}.color-tool input::-webkit-color-swatch{border:1px solid #666;border-radius:50%}.navigation-hint{z-index:3;color:#777b73;font:9px var(--mono);position:absolute;bottom:16px;right:14px}.toast{z-index:8;opacity:0;pointer-events:none;color:#e9eae5;background:#121310f2;border:1px solid #4c4f48;border-radius:3px;max-width:min(540px,80%);padding:9px 12px;font-size:11px;transition:all .2s;position:absolute;top:58px;left:50%;transform:translate(-50%,-15px)}.toast.visible{opacity:1;transform:translate(-50%)}.toast.error{border-color:var(--danger)}.inspector{border-left:1px solid var(--line);background:var(--panel);grid-template-rows:66px minmax(0,1fr) auto;min-width:0;min-height:0;display:grid}.inspector-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:11px 13px;display:flex}.eyebrow,.micro-label{color:var(--muted);font:8px var(--mono);letter-spacing:.14em;margin:0 0 5px}.inspector h1{text-overflow:ellipsis;white-space:nowrap;max-width:220px;margin:0;font-size:13px;font-weight:500;overflow:hidden}#source-size{color:var(--muted);font:9px var(--mono);white-space:nowrap}.panel-scroll{scrollbar-width:thin;scrollbar-color:#42453e transparent;min-height:0;overflow:auto}details{border-bottom:1px solid var(--line-soft)}summary{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:7px;height:39px;padding:0 13px;font-size:11px;font-weight:500;list-style:none;display:flex;position:relative}summary::-webkit-details-marker{display:none}summary:before{content:"+";width:11px;color:var(--muted);font:12px var(--mono)}details[open] summary:before{content:"−"}.summary-note{color:var(--muted);font:8px var(--mono);margin-left:auto;font-weight:400}details>:not(summary){margin-left:13px;margin-right:13px}details>:last-child{margin-bottom:13px}.slider-row{grid-template-columns:85px 1fr 37px;align-items:center;gap:8px;min-height:28px;display:grid}.slider-row label{color:#a9aca4;font-size:9px}.slider-row output{text-align:right;color:#d7d9d2;font:9px var(--mono)}input[type=range]{appearance:none;cursor:ew-resize;background:0 0;width:100%;height:14px;margin:0}input[type=range]::-webkit-slider-runnable-track{background:#3b3e38;height:2px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent);border:1px solid #10110f;border-radius:50%;width:9px;height:9px;margin-top:-3.5px}input[type=range]::-moz-range-track{background:#3b3e38;height:2px}input[type=range]::-moz-range-thumb{background:var(--accent);border:1px solid #10110f;border-radius:50%;width:8px;height:8px}.control-grid{gap:5px;margin-bottom:10px;display:grid}.control-grid.three{grid-template-columns:repeat(3,1fr)}.axis{color:var(--muted);text-align:center;font:8px var(--mono)}.axis.x{color:#f18271}.axis.y{color:#92cc62}.axis.z{color:#6b9be8}input[type=number],select{color:#d9dbd4;width:100%;min-width:0;height:25px;font:9px var(--mono);background:#0d0e0c;border:1px solid #30322e;border-radius:2px;outline:none;padding:0 6px}input[type=number]:focus,select:focus{border-color:#6d7167}.control-grid label{position:relative}.control-grid small{color:#646860;font:8px var(--mono);pointer-events:none;position:absolute;top:7px;right:5px}.micro-label{margin-top:7px!important}.inline-control-row{color:#a9aca4;justify-content:space-between;align-items:center;min-height:27px;font-size:9px;display:flex}.mini-button{color:#aeb1a8;min-height:23px;font:8px var(--mono);cursor:pointer;background:#111210;border:1px solid #343730;border-radius:2px;padding:0 7px}.mini-button:hover{color:var(--accent);border-color:#63675d}.control-note{color:#71756d;font:8px/1.5 var(--mono);margin-top:7px!important}.rotation-readout{color:#c7cabf;font:9px var(--mono);background:#0d0e0c;border:1px solid #292c27;border-radius:2px;margin-top:8px;padding:7px 8px;display:block}.summary-state{color:#7f837b;font:8px var(--mono);letter-spacing:.08em;background:#292b27;border-radius:2px;margin-left:auto;padding:2px 5px}.summary-state.live{background:var(--accent);color:#11130c;box-shadow:0 0 10px #d9ff5833}.summary-state.loading{color:#ffdc73;background:#4b401d;animation:.9s infinite alternate blink}.summary-state.error{color:#ffb3a7;background:#54241d}.audio-actions{grid-template-columns:1fr 1fr;gap:6px;margin-bottom:8px;display:grid}.audio-actions #audio-stop{grid-column:1/-1}.audio-device-label{color:#7c8077;font:8px var(--mono);text-transform:uppercase;letter-spacing:.08em;margin:0 0 5px;display:block}#audio-input{margin-bottom:5px}.audio-source-status{color:#70746c;min-height:24px;font:8px/1.45 var(--mono);margin:0 0 8px}.audio-source-status.live{color:var(--accent)}.audio-source-status.waiting{color:#ffdc73}.audio-source-status.error{color:#ff9f91}.tempo-display{background:#0c0d0b;border:1px solid #30332d;border-radius:3px;grid-template-rows:auto auto;grid-template-columns:13px auto 1fr;align-items:baseline;gap:0 7px;min-height:49px;margin-bottom:8px;padding:7px 9px;display:grid;position:relative}.tempo-display strong{color:#f0f2eb;font:23px/1 var(--mono);font-weight:500}.tempo-display>span:nth-of-type(2){color:var(--muted);font:8px var(--mono);letter-spacing:.1em}.tempo-display small{color:#6f736b;font:8px var(--mono);grid-column:2/4;margin-top:3px}.beat-pulse{background:#3c4038;border-radius:50%;grid-row:1/3;width:8px;height:8px;transition:transform 60ms,background 60ms,box-shadow 60ms}.beat-pulse.active{background:var(--accent);transform:scale(1.45);box-shadow:0 0 10px #d9ff58bf}.audio-meters{gap:4px;margin-bottom:10px;display:grid}.audio-meters div{grid-template-columns:31px 1fr;align-items:center;gap:7px;display:grid}.audio-meters span{color:#767a71;font:7px var(--mono)}.audio-meters i{background:#2e312c;height:3px;overflow:hidden}.audio-meters b{transform-origin:0;background:linear-gradient(90deg, #657c28, var(--accent));will-change:transform;width:100%;height:100%;display:block;transform:scaleX(0)}.bpm-fallback-row{color:#a9aca4;grid-template-columns:1fr 50px auto;align-items:center;gap:6px;min-height:29px;font-size:9px;display:grid}.bpm-fallback-row input{text-align:right}.mapping-title{margin-top:13px!important}.mapping-head,.audio-mapping-row{grid-template-columns:76px 62px minmax(0,1fr);align-items:center;gap:6px;display:grid}.mapping-head{color:#62665e;font:7px var(--mono);text-transform:uppercase;margin-bottom:4px}.audio-mapping-group{color:#8b8f85;font:7px var(--mono);letter-spacing:.1em;text-transform:uppercase;border-top:1px solid #242621;margin:8px 0 4px;padding-top:7px}.audio-mapping-row{min-height:27px}.audio-mapping-row label{color:#a9aca4;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:8px;overflow:hidden}.audio-mapping-row select{height:22px;padding:0 4px;font-size:8px}.mapping-depth{grid-template-columns:1fr 26px;align-items:center;gap:3px;display:grid}.mapping-depth input{min-width:0}.mapping-depth output{color:#bfc2b9;text-align:right;font:8px var(--mono)}.switch{width:26px;height:14px;position:absolute;right:13px}.switch input{opacity:0;position:absolute}.switch span{background:#3b3e38;border-radius:8px;transition:all .15s;position:absolute;inset:0}.switch span:after{content:"";background:#92968c;border-radius:50%;width:10px;height:10px;transition:all .15s;position:absolute;top:2px;left:2px}.switch input:checked+span{background:var(--accent)}.switch input:checked+span:after{background:#151712;left:14px}.direction-row{color:#a9aca4;grid-template-columns:85px repeat(3,28px);align-items:center;gap:5px;margin-top:4px;font-size:9px;display:grid}.direction{height:24px;font:9px var(--mono);cursor:pointer;background:#111210;border:1px solid #333630;border-radius:2px}.direction.active{border-color:var(--accent);color:var(--accent)}.crop-grid{grid-template-columns:18px 1fr 1fr;align-items:center;gap:6px 8px;display:grid}.crop-grid>span{text-align:center;color:var(--muted);font:8px var(--mono)}.crop-grid label{color:#a9aca4;font:9px var(--mono)}.crop-values{color:#71756d;font:8px/1.4 var(--mono);margin-top:6px}.inspector-footer{border-top:1px solid var(--line);background:#0d0e0c;grid-template-columns:1fr 1fr;gap:6px;padding:9px 11px;display:grid}.inspector-footer .button:first-child:last-child{grid-column:1/-1}.timeline{border-top:1px solid var(--line);background:#0d0e0c;grid-template-columns:185px minmax(240px,1fr) auto;align-items:center;gap:18px;min-width:0;padding:10px 16px;display:grid}.transport{align-items:center;gap:8px;display:flex}.play-button{cursor:pointer;background:#151614;border:1px solid #474a44;border-radius:50%;place-items:center;width:34px;height:34px;display:grid}.play-button span{border-top:5px solid #0000;border-bottom:5px solid #0000;border-left:8px solid var(--accent);width:0;height:0;margin-left:2px}.play-button.playing span{border:0;border-left:2px solid var(--accent);border-right:2px solid var(--accent);width:7px;height:9px;margin:0}.play-button:disabled,.transport-button:disabled{opacity:.3;cursor:default}.transport-button{color:#9da098;cursor:pointer;background:0 0;border:0}#timecode{color:#d9dbd4;width:80px;font:10px var(--mono)}.timeline-track-wrap{position:relative}.scrubber{z-index:2;position:relative;height:24px!important}.scrubber::-webkit-slider-runnable-track{background:linear-gradient(90deg,#4d5049,#2b2d29)!important;height:4px!important}.scrubber::-webkit-slider-thumb{border-radius:2px!important;width:12px!important;height:18px!important;margin-top:-7px!important}.keyframe-markers{z-index:4;pointer-events:none;height:16px;position:absolute;inset:4px 6px auto}.keyframe-marker{background:#fff;border:1px solid #111;width:7px;height:7px;position:absolute;top:4px;transform:translate(-50%)rotate(45deg)}.keyframe-marker.wave{background:#d9ff58}.keyframe-marker.noise{background:#72b8ff}.keyframe-marker.explode{background:#ff8d66}.tick-row{color:#62665e;font:8px var(--mono);justify-content:space-between;display:flex}.timeline-options{color:#888c83;justify-content:flex-end;align-items:center;gap:11px;font-size:9px;display:flex}.timeline-options>label{white-space:nowrap;align-items:center;gap:5px;display:flex}.timeline-options select{width:70px}.timeline-options input[type=number]{width:48px}.check-label input{accent-color:var(--accent)}.keyframe-button{color:var(--accent)}[hidden]{display:none!important}.tool-dialog{z-index:30;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.tool-dialog-backdrop{-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#020302c7;position:absolute;inset:0}.tool-dialog-panel{background:#10110f;border:1px solid #3c3f38;border-radius:5px;width:min(720px,100vw - 48px);max-height:calc(100dvh - 48px);position:relative;overflow:auto;box-shadow:0 28px 90px #000000a6}.tool-dialog-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:20px 22px;display:flex}.tool-dialog-head h2{margin:0;font-size:19px;font-weight:500}.icon-button{color:#bfc2b8;cursor:pointer;background:#171816;border:1px solid #363934;border-radius:3px;width:32px;height:32px;font-size:22px;line-height:1}.tool-drop{cursor:pointer;background:#0c0d0b;border:1px dashed #55594f;border-radius:4px;outline:none;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:116px;margin:22px;transition:border-color .15s,background .15s;display:flex}.tool-drop:hover,.tool-drop:focus,.tool-drop.dragging{border-color:var(--accent);background:#14170e}.tool-drop strong{font-size:13px;font-weight:500}.tool-drop span{color:var(--muted);font:9px var(--mono)}.tool-status{color:#aeb1a8;font:10px var(--mono);border:1px solid #292c27;border-radius:3px;align-items:center;gap:9px;margin:0 22px 20px;padding:10px 12px;display:flex}.tool-status-dot{background:#656961;border-radius:50%;flex:none;width:7px;height:7px}.tool-status.loading .tool-status-dot{background:#ffd358;animation:.9s infinite alternate blink}.tool-status.ready .tool-status-dot{background:var(--accent);box-shadow:0 0 9px #d9ff5873}.tool-status.error .tool-status-dot{background:var(--danger)}.tool-result{border:1px solid #30332d;border-radius:4px;margin:0 22px 22px;overflow:hidden}.tool-verdict{border-bottom:1px solid var(--line);background:#151713;justify-content:space-between;align-items:baseline;gap:15px;padding:14px 16px;display:flex}.tool-verdict strong{color:var(--accent);font-size:12px;font-weight:500}.tool-verdict span{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--muted);font:9px var(--mono);overflow:hidden}.tool-stats{grid-template-columns:repeat(4,1fr);margin:0;display:grid}.tool-stats div{border-right:1px solid var(--line-soft);min-width:0;padding:14px 13px}.tool-stats div:last-child{border-right:0}.tool-stats dt{color:#73776f;font:8px var(--mono);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}.tool-stats dd{text-overflow:ellipsis;color:#e1e3dd;font:10px var(--mono);white-space:nowrap;margin:0;overflow:hidden}.tool-advice{border-top:1px solid var(--line-soft);color:#a9aca4;font:10px/1.55 var(--mono);margin:0;padding:13px 16px}.tool-advice.warning{color:#ffd889;background:#18150e}.tool-actions{border-top:1px solid var(--line-soft);gap:7px;padding:13px 16px;display:flex}.tool-error{color:#ffb1a4;font:10px/1.55 var(--mono);background:#1b100e;border:1px solid #6f3a33;border-radius:3px;margin:0 22px 22px;padding:13px 15px}.tool-dialog-foot{border-top:1px solid var(--line);color:#666a62;font:8px/1.5 var(--mono);padding:12px 22px}@media (max-width:1180px){.timeline{grid-template-columns:160px 1fr 340px;gap:10px}.timeline-options{flex-wrap:wrap;gap:6px}.navigation-hint{display:none}}
