:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#07060d;--panel:#100e1cb8;--panel-solid:#100e1c;--line:#ffffff14;--line-strong:#ffffff29;--text:#ecebf5;--muted:#9a97b3;--accent:#21e6ff;--accent-2:#ff4fa3;--accent-3:#b33cff;--warn:#ffb14a;--radius:14px;--font:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--mono:ui-monospace, "Cascadia Code", "SF Mono", Menlo, Consolas, monospace;accent-color:var(--accent);scrollbar-color:#ffffff47 transparent}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:13px/1.45 var(--font);-webkit-font-smoothing:antialiased;overflow:hidden}::selection{background:#21e6ff59}kbd{font:11px var(--mono);border:1px solid var(--line-strong);color:var(--text);border-bottom-width:2px;border-radius:5px;padding:1px 5px}.app{position:fixed;inset:0}.stage{position:absolute;inset:0}.stage canvas{touch-action:none;cursor:grab;width:100%;height:100%;display:block}.stage canvas:active{cursor:grabbing}.hud{font:11px var(--mono);color:var(--muted);pointer-events:none;text-align:right;white-space:pre;position:absolute;bottom:14px;right:16px}.hint{max-width:calc(100% - 32px);color:var(--muted);text-align:center;pointer-events:none;text-wrap:balance;margin:0;font-size:12px;position:absolute;bottom:14px;left:50%;translate:-50%}.drop-veil{border:2px dashed var(--accent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:20;pointer-events:none;background:#07060db3;border-radius:24px;place-items:center;font-size:20px;font-weight:600;display:grid;position:absolute;inset:16px}.drop-veil[hidden]{display:none}.panel{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(18px)saturate(140%);backdrop-filter:blur(18px)saturate(140%);z-index:10;border-radius:20px;flex-direction:column;width:344px;transition:translate .35s cubic-bezier(.2,.8,.2,1),opacity .25s;display:flex;position:absolute;top:16px;bottom:16px;left:16px;box-shadow:0 20px 60px #00000073,inset 0 1px #ffffff0d}.panel.collapsed{opacity:0;pointer-events:none;translate:calc(-100% - 24px)}.brand{border-bottom:1px solid var(--line);align-items:center;gap:12px;padding:16px 16px 12px;display:flex}.brand h1{letter-spacing:.01em;margin:0;font-size:15px;font-weight:650}.brand p{color:var(--muted);margin:0;font-size:11.5px}.logo{background:radial-gradient(circle at 30% 30%, #ffffff80, transparent 40%), conic-gradient(from 210deg, var(--accent), var(--accent-3), var(--accent-2), var(--accent));border-radius:10px;flex:none;width:34px;height:34px;box-shadow:0 0 22px #b33cff8c}.panel-toggle{margin-left:auto}.panel-body{overscroll-behavior:contain;align-content:start;gap:12px;padding:12px;display:grid;overflow-y:auto}.card{border:1px solid var(--line);border-radius:var(--radius);background:#ffffff06;padding:12px}.card[hidden]{display:none}.card h2{letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;font-size:11px;font-weight:600}.drop{border:1.5px dashed var(--line-strong);cursor:pointer;border-radius:12px;align-items:center;gap:12px;padding:14px 16px;transition:border-color .2s,background .2s;display:flex;position:relative}.drop:hover,.drop:focus-within{border-color:var(--accent);background:#21e6ff0d}.drop input{opacity:0;cursor:pointer;position:absolute;inset:0}.drop svg{width:24px;height:24px;stroke:var(--accent);fill:none;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;flex:none}.drop span{color:var(--muted)}.drop strong{color:var(--text);font-weight:600}.samples{color:var(--muted);flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px;font-size:11.5px;display:flex}.samples>span{margin-right:2px}.chip,.btn,.icon-btn{font:inherit;color:var(--text);border:1px solid var(--line-strong);cursor:pointer;background:#ffffff0d;transition:background .15s,border-color .15s,translate .15s,box-shadow .15s}.chip{border-radius:999px;padding:3px 10px;font-size:11.5px}.chip:hover,.btn:hover,.icon-btn:hover{background:#ffffff1a;border-color:#ffffff47}.chip:focus-visible,.btn:focus-visible,.icon-btn:focus-visible,input:focus-visible,select:focus-visible,.macro-pad:focus-visible,.swatch-pill:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.icon-btn{border-radius:9px;place-items:center;width:30px;height:30px;padding:0;display:grid}.icon-btn svg{stroke:currentColor;fill:none;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:16px;height:16px}.show-panel{z-index:10;background:var(--panel);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:absolute;top:16px;left:16px}.show-panel[hidden]{display:none}.vj-card{background:radial-gradient(120% 100% at 100% 0,#b33cff14,#0000 60%),radial-gradient(120% 100% at 0 100%,#21e6ff0f,#0000 60%),#ffffff06;border-color:#ffffff1f}.pulse-btn{color:#dffbff;background:linear-gradient(135deg,#21e6ff26,#b33cff26);border-color:#21e6ff73;font-weight:600}.pulse-btn:hover{border-color:var(--accent);box-shadow:0 0 16px #21e6ff59}.pulse-btn:active{translate:0 1px}.macro-grid{grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px;display:grid}.macro-pad{color:var(--text);font:inherit;text-align:left;cursor:pointer;background:#00000047;border:1px solid #ffffff1a;border-radius:10px;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 9px;transition:border-color .18s,background .18s,box-shadow .18s,translate .12s;display:flex}.macro-pad:hover{background:#ffffff0f;border-color:#ffffff40;translate:0 -1px}.macro-pad.active{border-color:var(--accent);background:linear-gradient(145deg,#21e6ff24,#b33cff1a);box-shadow:0 0 18px #21e6ff38,inset 0 0 0 1px #21e6ff33}.macro-head{justify-content:space-between;align-items:center;width:100%;margin-bottom:2px;display:flex}.macro-head kbd{opacity:.7;padding:0 4px;font-size:9.5px}.macro-dot{border-radius:999px;width:8px;height:8px}.macro-dot.uv{background:#b33cff;box-shadow:0 0 8px #b33cff}.macro-dot.sh{background:#10d88b;box-shadow:0 0 8px #10d88b}.macro-dot.mk{background:#21e6ff;box-shadow:0 0 8px #21e6ff}.macro-dot.hb{background:#ffb14a;box-shadow:0 0 8px #ffb14a}.macro-dot.gw{background:#7a5cff;box-shadow:0 0 8px #7a5cff}.macro-dot.dr{background:#ff4fa3;box-shadow:0 0 8px #ff4fa3}.macro-pad strong{letter-spacing:.01em;font-size:11.5px;font-weight:620}.macro-pad small{color:var(--muted);font-size:10px}.swatch-strip{grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:10px;display:grid}.swatch-pill{border:1px solid var(--line);color:var(--muted);font:550 10px var(--font);cursor:pointer;background:#00000040;border-radius:8px;flex-direction:column;align-items:center;gap:4px;padding:5px 6px;transition:border-color .15s,color .15s,background .15s;display:flex}.swatch-pill:hover,.swatch-pill.active{color:var(--text);background:#ffffff12;border-color:#ffffff47}.sw-bar{border-radius:999px;width:100%;height:5px}.sw-uv{background:linear-gradient(90deg,#21e6ff,#b33cff,#ff4fa3,#ffb14a)}.sw-sh{background:linear-gradient(90deg,#0fd884,#00d4ff,#ff2a55,#ffd13b)}.sw-cos{background:linear-gradient(90deg,#21e6ff,#7a5cff,#ff4fa3,#21e6ff)}.sw-rb{background:linear-gradient(90deg,#f35,#fa0,#2d6,#0cf,#a4f)}.audio-dock{border-top:1px solid var(--line);padding-top:8px}.audio-head{color:var(--muted);justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;font-size:11px;display:flex}.seg-sm{width:196px}.seg-sm span{padding:3px 4px!important;font-size:10.5px!important}.spectrum{border:1px solid var(--line);background:#00000059;border-radius:10px;grid-template-columns:repeat(5,1fr);gap:6px;padding:6px 8px;display:grid}.spec-col{flex-direction:column;align-items:center;gap:4px;display:flex}.spec-track{background:#ffffff0d;border-radius:5px;align-items:flex-end;width:100%;height:28px;display:flex;overflow:hidden}.spec-fill{background:linear-gradient(180deg, var(--accent), var(--accent-3));border-radius:4px;width:100%;height:6%;transition:height 50ms linear;box-shadow:0 0 8px #21e6ff73}.spec-fill.spec-beat{background:linear-gradient(180deg, #ffb14a, var(--accent-2));box-shadow:0 0 10px #ff4fa38c}.spec-col span{font:600 9px var(--mono);color:var(--muted);letter-spacing:.05em}.stats{grid-template-columns:auto 1fr;gap:4px 12px;margin:0;font-size:12px;display:grid}.stats dt{color:var(--muted)}.stats dd{font-family:var(--mono);text-align:right;overflow-wrap:anywhere;margin:0;font-size:11.5px}.warnings{gap:6px;margin:10px 0 0;padding:0;list-style:none;display:grid}.warnings:empty{display:none}.warnings li{color:#ffd9a6;background:#ffb14a14;border:1px solid #ffb14a4d;border-radius:10px;padding:8px 10px;font-size:12px}.grid2{grid-template-columns:1fr 1fr;gap:8px;display:grid}.span2{grid-column:span 2}.field{gap:4px;min-width:0;display:grid}.field>span{color:var(--muted);font-size:11px}.field input,.field select{width:100%;font:12.5px var(--font);color:var(--text);border:1px solid var(--line-strong);background:#0000004d;border-radius:9px;padding:7px 9px}.field input:not([type=range]):user-invalid{border-color:var(--accent-2)}.field select option{background:var(--panel-solid)}.check{color:var(--muted);cursor:pointer;align-items:center;gap:8px;font-size:12px;display:flex}.export-summary{font:11.5px var(--mono);color:var(--muted);min-height:1.4em;margin:10px 0}.actions{flex-wrap:wrap;gap:8px;display:flex}.btn{border-radius:10px;align-items:center;gap:6px;padding:8px 12px;font-weight:550;display:inline-flex}.btn svg{stroke:currentColor;fill:none;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:15px;height:15px}.btn.primary{color:#05040a;background:linear-gradient(135deg, var(--accent), #8ff3ff);border-color:#0000;box-shadow:0 6px 24px #21e6ff4d}.btn.primary:hover{background:linear-gradient(135deg,#5cefff,#c3f9ff);translate:0 -1px}.btn:disabled{opacity:.4;cursor:not-allowed}.toast{background:var(--panel-solid);border:1px solid var(--line-strong);opacity:0;pointer-events:none;z-index:30;border-radius:999px;max-width:calc(100% - 32px);padding:9px 16px;transition:opacity .25s,translate .25s;position:absolute;top:18px;left:50%;translate:-50% -20px;box-shadow:0 10px 30px #0006}.toast.show{opacity:1;translate:-50%}.toast.error{border-color:var(--accent-2);color:#ffc2dd}.lil-gui.root{--background-color:#100e1cc7;--widget-color:#ffffff12;--hover-color:#ffffff1f;--focus-color:#ffffff29;--number-color:var(--accent);--string-color:#c6b8ff;--title-background-color:#ffffff0a;--font-family:var(--font);--font-size:11.5px;--widget-border-radius:6px;--width:300px;border:1px solid var(--line);-webkit-backdrop-filter:blur(18px)saturate(140%);backdrop-filter:blur(18px)saturate(140%);z-index:10;border-radius:16px;max-height:calc(100% - 64px);position:fixed;top:16px;right:16px;overflow:hidden auto;box-shadow:0 20px 60px #00000073}.ui-hidden .panel,.ui-hidden .lil-gui.root,.ui-hidden .hint,.ui-hidden .show-panel{display:none!important}@media (max-width:760px){.panel{border-radius:18px;width:auto;max-height:46dvh;inset:auto 8px 8px}.panel.collapsed{translate:0 calc(100% + 16px)}.panel-toggle svg{rotate:-90deg}.lil-gui.root{--width:auto;max-height:36dvh;top:8px;left:8px;right:8px}.hint{display:none}.hud{text-align:left;inset:8px auto auto 16px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important}}.card-head{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.card-head h2{margin:0}.link-btn{font:inherit;color:var(--accent);cursor:pointer;background:0 0;border:0;border-radius:6px;padding:2px 4px;font-size:12px}.link-btn:disabled{color:var(--muted);opacity:.5;cursor:default}.link-btn:focus-visible{outline:2px solid var(--accent)}.toolbar{flex-wrap:wrap;gap:6px;margin-bottom:10px;display:flex}.btn.sm{border-radius:8px;padding:5px 9px;font-size:12px}.seg{border:1px solid var(--line);background:#0000004d;border-radius:10px;grid-template-columns:repeat(3,1fr);gap:3px;padding:3px;display:grid}.seg label{position:relative}.seg input{opacity:0;cursor:pointer;position:absolute;inset:0}.seg span{text-align:center;color:var(--muted);border-radius:7px;padding:5px 4px;font-size:11.5px;transition:background .15s,color .15s;display:block}.seg label:has(:checked) span{color:var(--text);background:#ffffff1a;box-shadow:inset 0 0 0 1px #ffffff1f}.seg label:has(:focus-visible) span{outline:2px solid var(--accent)}.hint-inline{color:var(--muted);margin:8px 0;font-size:11.5px}.sources{color:var(--muted);justify-content:space-between;align-items:center;gap:8px;margin:8px 0;font-size:12px;display:flex}.sources select{font:12px var(--font);color:var(--text);border:1px solid var(--line-strong);background:#0000004d;border-radius:8px;padding:5px 8px}.group-list{overscroll-behavior:contain;gap:4px;max-height:340px;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.group-row{cursor:pointer;border:1px solid #0000;border-radius:10px;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:5px 6px;display:grid}.group-row:hover{background:#ffffff0a}.group-row.active{background:#ffffff0f;border-color:#ffffff2e}.group-row input[type=color]{cursor:pointer;background:0 0;border:0;border-radius:6px;width:22px;height:22px;padding:0}.group-row input[type=color]::-webkit-color-swatch-wrapper{padding:0}.group-row input[type=color]::-webkit-color-swatch{border:1px solid #ffffff40;border-radius:6px}.group-row .gname{min-width:0;font:12.5px var(--font);color:var(--text);background:0 0;border:1px solid #0000;border-radius:6px;padding:3px 5px}.group-row .gname:hover,.group-row .gname:focus{border-color:var(--line-strong);background:#00000040}.group-row .meta{align-items:center;gap:3px;display:flex}.group-row .count{font:10.5px var(--mono);color:var(--muted);text-align:right;min-width:26px;margin-right:2px}.fx-toggle{font:600 10px var(--mono);border:1px solid var(--line-strong);width:20px;height:20px;color:var(--muted);cursor:pointer;background:0 0;border-radius:5px;padding:0}.fx-toggle[aria-pressed=true]{color:var(--text);background:#21e6ff29;border-color:#21e6ff8c}.fx-toggle.solo[aria-pressed=true]{background:#ffb14a2e;border-color:#ffb14a99}.fx-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.ref{color:var(--muted);justify-content:space-between;align-items:center;gap:8px;margin-top:10px;font-size:11.5px;display:flex}.file-btn{position:relative;overflow:hidden}.file-btn input{opacity:0;cursor:pointer;position:absolute;inset:0}.lasso{pointer-events:none;z-index:5;width:100%;height:100%;position:absolute;inset:0}.lasso path{fill:#21e6ff14;stroke:var(--accent);stroke-width:1.5px;stroke-dasharray:6 4}.stage.lasso-on canvas{cursor:crosshair}