:root{--bg: #08080a;--glass: rgba(16, 16, 19, .74);--glass-2: rgba(26, 26, 30, .86);--line: rgba(255, 255, 255, .08);--line-2: rgba(255, 255, 255, .14);--text: #ecebe8;--dim: #a3a19c;--faint: #6d6b67;--accent: #f2b544;--accent-ink: #1b1305;--rec: #ff4d4d;--r: 12px;--font: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI Variable Text", "Segoe UI", Roboto, sans-serif;--mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:13px/1.35 var(--font);-webkit-font-smoothing:antialiased;overflow:hidden;-webkit-user-select:none;user-select:none}button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}input{font:inherit;color:inherit}.num{font-variant-numeric:tabular-nums}.app{position:fixed;top:0;right:0;bottom:0;left:0}.stage{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#000}.stage canvas{width:100%;height:100%;display:block}.stage.fixed canvas{width:auto;height:auto;max-width:100%;max-height:100%}.ui{transition:opacity .45s ease}.app.idle .ui{opacity:0;pointer-events:none}.app.idle{cursor:none}.app.hidden .ui{opacity:0;pointer-events:none}.glass{background:var(--glass);backdrop-filter:blur(22px) saturate(1.3);-webkit-backdrop-filter:blur(22px) saturate(1.3);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 18px 50px #00000073}.top{position:absolute;top:14px;left:14px;right:14px;display:flex;align-items:center;gap:10px;pointer-events:none}.top>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:9px;padding:7px 12px 7px 10px}.brand b{font-weight:650;letter-spacing:-.01em;font-size:13.5px}.mark{width:18px;height:18px;border-radius:50%;background:conic-gradient(from 210deg,#f2b544,#ff5f6d,#7b5cff,#2ed3c6,#f2b544);box-shadow:0 0 0 2px #0009 inset;position:relative}.mark:after{content:"";position:absolute;top:5px;right:5px;bottom:5px;left:5px;border-radius:50%;background:#0b0b0d}.scenechip{display:flex;align-items:center;gap:10px;padding:7px 12px;border-radius:10px}.scenechip:hover{border-color:var(--line-2)}.scenechip .k{color:var(--faint);font-size:11px}.scenechip .n{font-weight:600}.scenechip .m{color:var(--dim)}.spacer{flex:1}.tools{display:flex;gap:2px;padding:4px}.ib{width:34px;height:32px;display:grid;place-items:center;border-radius:8px;color:var(--dim);position:relative}.ib:hover{background:#ffffff12;color:var(--text)}.ib.on{background:#ffffff1c;color:var(--text)}.ib svg{width:17px;height:17px}.ib .dot{position:absolute;top:6px;right:6px;width:6px;height:6px;border-radius:50%;background:var(--rec)}.sep{width:1px;background:var(--line);margin:6px 3px}.pro-badge{font-size:10px;font-weight:700;letter-spacing:.06em;padding:2px 6px;border-radius:5px;background:var(--accent);color:var(--accent-ink)}.pro-btn{display:flex;align-items:center;gap:7px;padding:0 12px;height:40px;border-radius:10px;font-weight:600}.pro-btn:hover{border-color:var(--line-2)}[data-tip]{position:relative}[data-tip]:hover:after{content:attr(data-tip);position:absolute;top:calc(100% + 8px);right:50%;transform:translate(50%);white-space:nowrap;background:#000;border:1px solid var(--line-2);color:var(--text);padding:4px 8px;border-radius:6px;font-size:11.5px;pointer-events:none;z-index:50}.panel{position:absolute;top:66px;right:14px;bottom:112px;width:318px;display:flex;flex-direction:column;overflow:hidden;transform:translate(0);transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .2s}.panel.closed{transform:translate(calc(100% + 24px));opacity:0;pointer-events:none}.panel-head{display:flex;align-items:center;padding:12px 14px 8px;gap:8px}.panel-head h3{margin:0;font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--dim);text-transform:uppercase;flex:1}.panel-body{overflow-y:auto;padding:0 14px 16px;scrollbar-width:thin;scrollbar-color:#333 transparent}.sec{padding:12px 0 6px;border-top:1px solid var(--line)}.sec:first-child{border-top:0;padding-top:2px}.sec-h{display:flex;align-items:center;justify-content:space-between;color:var(--faint);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}.sec-h button{color:var(--faint);text-transform:none;letter-spacing:0;font-weight:500}.sec-h button:hover{color:var(--text)}.sl{display:grid;grid-template-columns:1fr auto;align-items:center;row-gap:5px;padding:5px 0;cursor:ew-resize;touch-action:none;border-radius:6px}.sl .lab{color:var(--dim);font-size:12.5px;display:flex;align-items:center;gap:6px}.sl .val{color:var(--text);font-size:12px;font-family:var(--mono)}.sl .track{grid-column:1 / -1;height:4px;border-radius:4px;background:#ffffff17;position:relative}.sl .fill{position:absolute;top:0;bottom:0;border-radius:4px;background:var(--text);opacity:.85}.sl .knob{position:absolute;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#fff;box-shadow:0 1px 6px #00000080;transform:scale(.75);transition:transform .12s}.sl:hover .knob,.sl.drag .knob{transform:scale(1)}.sl.big .lab{color:var(--text);font-size:13.5px;font-weight:550}.sl.big .track{height:6px}.sl.big .fill{background:linear-gradient(90deg,#f2b544,#ffd98a);opacity:1}.sl.learn{outline:1px dashed var(--accent);outline-offset:3px}.sl.learning{outline:2px solid var(--accent);outline-offset:3px;animation:pulse 1s infinite}.sl.auto .lab:after{content:"A";font-size:9px;font-weight:700;padding:1px 4px;border-radius:3px;background:#3a7bd5;color:#fff}.midi-tag{font-size:9px;font-family:var(--mono);color:var(--accent)}@keyframes pulse{50%{outline-color:transparent}}.seg{display:flex;flex-wrap:wrap;gap:4px;margin:2px 0 8px}.seg button{padding:5px 9px;border-radius:7px;border:1px solid var(--line);color:var(--dim);font-size:12px}.seg button:hover{color:var(--text);border-color:var(--line-2)}.seg button.on{background:var(--text);color:#111;border-color:var(--text)}.row{display:flex;gap:6px;align-items:center}.btn{height:30px;padding:0 11px;border-radius:8px;border:1px solid var(--line-2);color:var(--text);display:inline-flex;align-items:center;gap:6px;font-size:12.5px;white-space:nowrap}.btn:hover{background:#ffffff12}.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:650}.btn.primary:hover{filter:brightness(1.06);background:var(--accent)}.btn.ghost{border-color:transparent;color:var(--dim)}.btn.ghost:hover{color:var(--text)}.btn.danger{color:#ff8f8f}.btn svg{width:15px;height:15px}.btn:disabled{opacity:.45;cursor:default}.toggle{display:flex;align-items:center;justify-content:space-between;padding:6px 0;color:var(--dim);font-size:12.5px;cursor:pointer}.toggle i{width:28px;height:16px;border-radius:10px;background:#ffffff24;position:relative;transition:background .15s}.toggle i:after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#fff;transition:transform .15s}.toggle.on i{background:var(--accent)}.toggle.on i:after{transform:translate(12px)}.hint{color:var(--faint);font-size:11.5px;line-height:1.45;margin:4px 0 8px}.transport{position:absolute;left:14px;right:14px;bottom:14px;height:84px;display:grid;grid-template-columns:auto auto minmax(160px,1fr) auto;align-items:center;gap:14px;padding:0 14px}.sources{display:flex;gap:4px}.src{height:34px;padding:0 11px;border-radius:9px;display:flex;align-items:center;gap:7px;color:var(--dim);border:1px solid transparent;font-size:12.5px}.src svg{width:15px;height:15px}.src:hover{color:var(--text);background:#ffffff0f}.src.on{color:var(--text);border-color:var(--line-2);background:#ffffff0f}.play{width:46px;height:46px;border-radius:50%;background:var(--text);color:#111;display:grid;place-items:center;flex:none}.play:hover{transform:scale(1.04)}.play svg{width:18px;height:18px}.trackbox{min-width:0;display:flex;flex-direction:column;gap:6px}.trackline{display:flex;align-items:baseline;gap:10px;min-width:0}.trackline .t{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trackline .s{color:var(--faint);font-size:12px;white-space:nowrap}.wave{height:30px;position:relative;cursor:pointer;border-radius:6px;overflow:hidden;background:#ffffff08}.wave canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.meters{display:flex;align-items:center;gap:14px}.bars{display:flex;gap:3px;align-items:flex-end;height:30px}.bars span{width:5px;border-radius:2px;background:var(--text);opacity:.8;min-height:2px}.kick{width:10px;height:10px;border-radius:50%;background:var(--accent)}.bpm{font-family:var(--mono);font-size:12px;color:var(--dim);min-width:62px}.vol{width:84px}.vol input{width:100%;accent-color:var(--text)}.scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000059;display:grid;place-items:center;z-index:20;animation:fade .18s}@keyframes fade{0%{opacity:0}}.sheet{width:min(980px,calc(100vw - 40px));max-height:calc(100vh - 80px);display:flex;flex-direction:column;overflow:hidden;animation:rise .22s cubic-bezier(.2,.8,.2,1)}@keyframes rise{0%{transform:translateY(10px);opacity:0}}.sheet-h{display:flex;align-items:center;gap:12px;padding:16px 18px 12px;border-bottom:1px solid var(--line)}.sheet-h h2{margin:0;font-size:15px;font-weight:650;flex:1}.sheet-h .k{color:var(--faint);font-size:12px}.sheet-b{overflow-y:auto;padding:16px 18px 20px}.grp-t{color:var(--faint);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;margin:4px 0 10px}.scenes{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:12px;margin-bottom:18px}.card{text-align:left;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:#0d0d10;transition:transform .15s,border-color .15s}.card:hover{transform:translateY(-2px);border-color:var(--line-2)}.card.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.card .th{aspect-ratio:16 / 9;background-size:cover;background-position:center;position:relative}.card .th .pro-badge{position:absolute;top:7px;right:7px}.card .meta{padding:8px 10px 10px}.card .meta b{display:block;font-weight:600;font-size:13px}.card .meta span{color:var(--faint);font-size:11.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.pals{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-bottom:18px}.pal{border-radius:10px;border:1px solid var(--line);padding:8px;text-align:left}.pal:hover{border-color:var(--line-2)}.pal.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.pal .sw{display:flex;height:30px;border-radius:6px;overflow:hidden;margin-bottom:7px}.pal .sw i{flex:1}.pal b{font-weight:550;font-size:12.5px}.slots{display:grid;grid-template-columns:repeat(16,1fr);gap:5px}.slot{aspect-ratio:1;border-radius:6px;border:1px solid var(--line);font:10px var(--mono);color:var(--faint);display:grid;place-items:center;position:relative;overflow:hidden}.slot.full{color:var(--text);border-color:var(--line-2)}.slot.full:before{content:"";position:absolute;inset:auto 0 0 0;height:4px;background:var(--c, var(--accent))}.slot.cur{box-shadow:0 0 0 2px var(--accent)}.slot:hover{border-color:var(--text)}.keys{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:4px 28px}.keys div{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--line);color:var(--dim)}kbd{font:11px var(--mono);color:var(--text);background:#ffffff14;border:1px solid var(--line-2);border-bottom-width:2px;border-radius:5px;padding:1px 6px;margin-left:3px}.field{width:100%;height:36px;border-radius:8px;border:1px solid var(--line-2);background:#00000059;padding:0 11px;outline:none}.field:focus{border-color:var(--accent)}textarea.field{height:84px;padding:9px 11px;font:12px var(--mono);resize:none}.small{width:min(460px,calc(100vw - 40px))}.toasts{position:absolute;left:50%;top:66px;transform:translate(-50%);display:flex;flex-direction:column;gap:8px;align-items:center;z-index:30}.toast{padding:10px 14px;display:flex;align-items:center;gap:12px;animation:rise .2s;max-width:min(620px,calc(100vw - 40px))}.toast .chips{display:flex;gap:6px}.drop{position:absolute;top:14px;right:14px;bottom:14px;left:14px;border:2px dashed rgba(255,255,255,.4);border-radius:18px;display:grid;place-items:center;background:#00000073;z-index:40;font-size:18px;font-weight:600;pointer-events:none}.drop small{display:block;text-align:center;color:var(--dim);font-weight:400;font-size:13px;margin-top:6px}.recpill{position:absolute;top:14px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:6px 8px 6px 12px;z-index:25}.recpill .r{width:9px;height:9px;border-radius:50%;background:var(--rec);animation:blink 1s infinite}@keyframes blink{50%{opacity:.3}}.debug{position:absolute;left:14px;top:66px;padding:10px 12px;font:11px/1.6 var(--mono);color:var(--dim);min-width:210px;z-index:15}.debug b{color:var(--text);font-weight:500}.preview-pill{position:absolute;top:66px;left:14px;padding:8px 12px;display:flex;gap:10px;align-items:center;z-index:15}.empty{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}.empty h1{font-size:30px;font-weight:650;letter-spacing:-.02em;margin:0 0 8px;text-shadow:0 2px 30px rgba(0,0,0,.6)}.empty p{color:var(--dim);margin:0 0 18px;font-size:14px;text-shadow:0 1px 12px rgba(0,0,0,.8)}.empty .row{justify-content:center;pointer-events:auto}.cropper{position:relative;display:inline-block;max-width:100%}.cropper img,.cropper canvas{max-width:100%;max-height:52vh;display:block;border-radius:8px}.cropper .box{position:absolute;border:2px solid var(--accent);box-shadow:0 0 0 9999px #0000008c;border-radius:3px}.err{color:#ff9b9b;font-size:12px}@media (max-width: 760px){.transport{grid-template-columns:auto 1fr;height:auto;padding:10px;bottom:10px;left:10px;right:10px}.sources,.meters{display:none}.panel{left:10px;right:10px;width:auto;top:auto;bottom:96px;height:52vh}.top{top:10px;left:10px;right:10px}.brand b,.scenechip .k{display:none}.slots{grid-template-columns:repeat(8,1fr)}}.mac-app .top{left:86px}.mac-app .app:before{content:"";position:fixed;top:0;left:0;right:0;height:12px;-webkit-app-region:drag;z-index:100}