:root{--bg: #0c0b0a;--panel: #141210;--line: #2a2622;--txt: #e8e2d8;--dim: #8a8178;--faint: #5a534b;--accent: #e0a96d;--accent-dim: #7d5f3c}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--bg);color:var(--txt);font:13px/1.4 ui-monospace,SF Mono,Menlo,Consolas,monospace;display:flex;justify-content:center;padding:24px}#app{width:100%;max-width:560px;display:flex;flex-direction:column;gap:14px}#drop{border:1px dashed var(--line);border-radius:8px;padding:22px;text-align:center;color:var(--dim);cursor:default;transition:.15s;user-select:none}#drop.thin{padding:9px;font-size:11.5px;color:var(--faint)}#drop.over{border-color:var(--accent);color:var(--accent);background:var(--panel)}#drop b{color:var(--txt);font-weight:500}#list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;overflow:hidden}#list:empty{display:none}.row{display:flex;align-items:center;gap:10px;padding:9px 11px;background:var(--panel);border-bottom:1px solid var(--line);cursor:default}.row:last-child{border-bottom:0}.row.active{background:#1b1813}.row.drag{opacity:.4}.row.dropbefore{box-shadow:inset 0 2px 0 var(--accent)}.row.dropafter{box-shadow:inset 0 -2px 0 var(--accent)}.handle{color:var(--faint);cursor:grab;letter-spacing:1px;line-height:1}.handle:active{cursor:grabbing}.nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.row.active .nm{color:var(--accent)}.dur{color:var(--faint);font-size:11px;font-variant-numeric:tabular-nums}.x{color:var(--faint);cursor:pointer;padding:0 2px}.x:hover{color:var(--txt)}.badge{color:var(--accent-dim);font-size:9.5px;border:1px solid var(--accent-dim);border-radius:3px;padding:0 4px}#bar{display:flex;flex-direction:column;gap:9px;border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:12px}#bar.idle{opacity:.45;pointer-events:none}#bar.idle #fx{pointer-events:auto}#ctrls{display:flex;align-items:center;gap:4px}button.t{background:none;border:0;color:var(--dim);cursor:pointer;font-size:16px;padding:5px 8px;border-radius:5px;line-height:1}button.t:hover{color:var(--txt);background:#211d18}button.t:focus-visible{outline:1px solid var(--accent);outline-offset:1px}button.t.on,button.t.on:hover{color:var(--accent)}#fx{font-size:12px;font-weight:600;letter-spacing:.5px}#ctrls .sp{flex:1}#now{color:var(--dim);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:230px}#now.error{color:#d98b6a}#seek{position:relative;height:14px;display:flex;align-items:center;cursor:pointer}#track{height:3px;width:100%;background:var(--line);border-radius:2px;overflow:hidden}#fill{height:100%;width:0;background:var(--accent);transition:width .08s linear}#time{display:flex;justify-content:space-between;color:var(--faint);font-size:10.5px;font-variant-numeric:tabular-nums}.fx{display:flex;flex-direction:column;gap:12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:12px 14px;margin-top:-6px}.fx.hidden{display:none}.fx-head{display:flex;align-items:center;gap:8px}.fx-title{flex:1;color:var(--txt);font-size:12px;font-weight:500;letter-spacing:.3px}.fx-dry,.fx-close{background:none;border:1px solid transparent;color:var(--dim);cursor:pointer;font:inherit;font-size:11px;padding:3px 8px;border-radius:5px;line-height:1}.fx-dry{border-color:var(--line)}.fx-dry:hover{color:var(--txt);border-color:var(--accent-dim)}.fx-close{font-size:13px;padding:3px 5px}.fx-close:hover{color:var(--txt);background:#211d18}.fx-presets{display:flex;flex-wrap:wrap;gap:6px}.fx-preset{background:#1b1813;border:1px solid var(--line);color:var(--dim);font:inherit;font-size:11px;padding:4px 9px;border-radius:5px;cursor:pointer}.fx-preset:hover{color:var(--accent);border-color:var(--accent-dim)}.fx-rows{display:flex;flex-direction:column;gap:7px}.fx-row{display:grid;grid-template-columns:16px 78px 1fr 62px;align-items:center;gap:10px}.fx-row.off{opacity:.4}.fx-lab{color:var(--dim);cursor:pointer;user-select:none}.fx-row input[type=range]{width:100%;height:3px;accent-color:var(--accent);cursor:pointer}.fx-val{color:var(--faint);font-size:11px;text-align:right;font-variant-numeric:tabular-nums}.fx input[type=checkbox]{accent-color:var(--accent);cursor:pointer;margin:0}.fx-motion{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);padding-top:11px}.fx-mrow{display:flex;align-items:center;gap:8px}.fx-mrow .sp{flex:1}.fx-mrow input[type=number]{width:46px;background:var(--bg);color:var(--txt);border:1px solid var(--line);border-radius:4px;padding:2px 4px;font:inherit;font-size:11px}.fx-mrow .unit{color:var(--faint);font-size:10.5px}.fx.door-on .fx-rows{opacity:.35;pointer-events:none}.fx-io{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:11px}.fx-io button{background:#1b1813;border:1px solid var(--line);color:var(--dim);font:inherit;font-size:11px;padding:4px 10px;border-radius:5px;cursor:pointer}.fx-io button:hover{color:var(--accent);border-color:var(--accent-dim)}.fx-status{margin-left:auto;color:var(--accent-dim);font-size:10.5px;text-align:right}.fx-status.err{color:#d98b6a}.fx-note{color:var(--faint);font-size:10.5px;line-height:1.35}#dropoverlay{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:24px;background:#080706cc;opacity:0;pointer-events:none;transition:opacity .12s ease}#dropoverlay.show{opacity:1}#dropoverlay .inner{border:2px dashed var(--accent);border-radius:12px;padding:40px 64px;color:var(--accent);background:#14121099;letter-spacing:.3px}
