:root{color-scheme:dark;font:12px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#d7dbdf;background:#101214;--line:#303438;--muted:#899197;--accent:#b9ef78;--workspace-height:320px;--workspace-toolbar-height:43px;--dock:var(--workspace-height)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}button,input,select{font:inherit}button,select,input[type=text],input[type=number]{background:#24282c;border:1px solid #363b40;border-radius:5px;color:#dfe3e7;padding:5px 9px;min-width:0}button{cursor:pointer;white-space:nowrap}button:hover{background:#30363a;border-color:#707b81}button:disabled{opacity:.35;cursor:default}button.active,button[aria-pressed=true]{color:var(--accent);border-color:#6c8450;background:#293125}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}select{max-width:100%;cursor:pointer}input[type=checkbox],input[type=range]{accent-color:var(--accent)}input[type=checkbox]{margin:0 5px 0 0}input[type=range]{min-width:50px}label{color:#b0b7bd}button,select{min-height:28px}[hidden]{display:none!important}.spacer{flex:1}.row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.inline{display:flex;gap:4px;align-items:center}.section-label{font-size:9px;font-weight:600;letter-spacing:1.4px;color:#8e989e}
#toolbar{position:fixed;inset:0 0 auto;height:54px;display:flex;align-items:center;gap:12px;padding:0 16px;background:#181b1e;border-bottom:1px solid var(--line);z-index:10}#toolbar .toolbar-group{display:flex;align-items:center;gap:5px;padding-left:12px;border-left:1px solid var(--line)}#toolbar .media-group{flex:1;max-width:330px;min-width:100px}#mediaSelect{width:100%;background:#1d2124}.transport label{display:flex;align-items:center;font-size:10px}.audio-top meter{width:42px;height:14px}#fps{font:10px ui-monospace,monospace;white-space:nowrap;color:var(--muted);margin-left:auto}.mode-switch{display:flex;padding:3px;background:#101214;border-radius:5px;gap:3px}.mode-switch button{font-size:10px;letter-spacing:.8px;min-height:24px;border:0;background:transparent}.mode-switch .active{background:#333d29;color:var(--accent)}#perform{font-size:11px}#enableAudio{font-size:10px}.audio-ready{color:var(--accent)}
#stage{position:fixed;inset:54px 0 calc(var(--dock) + 24px);background:#080a0b;overflow:hidden}#glCanvas,#maskOverlay,#originOverlay{position:absolute;inset:0;width:100%;height:100%;display:block}#maskOverlay{pointer-events:none;touch-action:none}#maskOverlay.editing{pointer-events:auto;cursor:crosshair}#originOverlay{pointer-events:none;overflow:hidden}#originOverlay svg{width:100%;height:100%;position:absolute;inset:0}.origin-radius{stroke:#b9ef7870;stroke-width:1;stroke-dasharray:4 6;fill:none}.origin-handle{pointer-events:auto;position:absolute;transform:translate(-50%,-50%);width:28px;height:28px;border-radius:50%;border:1px solid #d6f1b1;background:#15210cc9;color:#e4ffc8;padding:0;font-size:21px;cursor:move;touch-action:none}.origin-handle[aria-disabled=true]{cursor:default;opacity:.6}#sourceVideo{position:fixed;width:1px;height:1px;left:-10px;opacity:0;pointer-events:none}
#controlPanel{position:fixed;inset:auto 0 24px;height:var(--dock);display:flex;flex-direction:column;background:#191c1f;border-top:1px solid #41474a;z-index:5}#workspaceResize{position:absolute;left:0;right:0;top:-5px;height:9px;cursor:ns-resize;touch-action:none;z-index:5}#workspaceResize:after{content:"";display:block;width:38px;height:3px;border-radius:3px;background:#697277;margin:3px auto}#workspaceResize:hover:after{background:var(--accent)}.workspace-toolbar{height:var(--workspace-toolbar-height);min-height:var(--workspace-toolbar-height);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:7px;padding:0 16px;border-bottom:1px solid var(--line)}
.workspace-actions{display:flex;align-items:center;gap:7px;min-width:0}.workspace-settings{justify-content:flex-end}#clock{justify-self:center;white-space:nowrap;font:11px ui-monospace,SFMono-Regular,monospace;font-variant-numeric:tabular-nums;color:#bac5cc}#toolbar .toolbar-group.media-group{padding-left:0;border-left:0}#creativePreset{width:165px;color:#d9edc8;background:#242c21}#presetModified{font-size:10px;color:#e5bb73}.save-button{color:var(--accent);font-weight:600}#dirty{font-size:10px;color:#dfbd7b}.workspace-content{overflow:auto;min-height:0;flex:1;scrollbar-color:#4b545b #191c1f}.workspace-main{display:flex;align-items:stretch;min-height:140px}#instrument{flex:1;min-width:0;padding:10px 20px 14px}#timelinePanel{padding:6px 16px 0;background:#15181a}.timeline-toolbar{display:flex;align-items:center;gap:8px;height:29px}.timeline-toolbar button{font-size:10px;min-height:23px;padding:3px 8px}.timeline-toolbar .section-label{margin-right:6px}#segmentSelect{font-size:10px;min-height:24px;width:180px}.snap{display:flex;align-items:center;margin-left:auto;font-size:10px}.zoom-label{display:flex;gap:4px;align-items:center;color:#7e888e}.zoom-label input{width:90px;height:3px}#timelineScroll{overflow-x:auto;overflow-y:auto;max-height:120px;scrollbar-width:thin;scrollbar-color:#424c52 #141718}#timeline{position:relative;min-height:43px;cursor:crosshair}#ruler{height:21px;position:relative;border-bottom:1px solid #2a3035;overflow:hidden}#ruler span{position:absolute;font:9px ui-monospace,monospace;color:#78858e;padding-top:3px;white-space:nowrap;border-left:1px solid #394147;padding-left:6px}#tracks{display:flex;flex-direction:column;gap:3px;padding:3px 0;min-height:22px}.track{position:relative;height:23px;min-height:23px}.segment{position:absolute;height:23px;min-height:23px;border:1px solid #5c7741;border-radius:3px;background:#303f28;color:#d6ebc4;font-size:10px;text-align:left;padding:2px 12px;overflow:hidden}.segment.off{border-color:#5e656c;background:repeating-linear-gradient(135deg,#2d3337,#2d3337 5px,#262b2f 5px,#262b2f 10px);color:#adb8bf}.segment.selected{border-color:var(--accent)}.trim{position:absolute;top:0;bottom:0;width:8px;background:#ffffff14;cursor:ew-resize;touch-action:none}.trim.start{left:0;border-right:1px solid #ffffff30}.trim.end{right:0;border-left:1px solid #ffffff30}.empty-track{font-size:10px;color:#65725d;padding-left:10px;background:#26301e70;border:1px solid #39442b;height:20px;border-radius:3px}#playhead{position:absolute;top:0;bottom:0;width:1px;background:#e2efc8;pointer-events:none;z-index:3}#playhead:before{content:"";position:absolute;top:0;left:-4px;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid #e2efc8}#seek{width:100%;margin:0;height:5px;display:block;opacity:.6}
#effectStrip{display:flex;gap:7px;padding:9px 16px;border-bottom:1px solid var(--line);overflow-x:auto;background:#1d2023}.effect-card{--level:0;display:grid;grid-template-columns:23px 1fr auto;align-items:center;min-width:130px;flex:1;position:relative;border:1px solid #363d42;border-radius:5px;background:#202529;opacity:.5;height:41px;padding:3px 6px 5px;gap:2px;overflow:hidden}.effect-card.enabled{opacity:1}.effect-card.selected{border-color:#97bd68;background:#2a3225;opacity:1}.effect-card .power{border:0;background:none;padding:0;min-width:22px;font-size:16px;color:#87918e}.effect-card.enabled .power{color:var(--accent)}.effect-name{border:0;background:transparent;padding:0 4px;text-align:left;font-size:11px;font-weight:500}.effect-name:hover{background:transparent}.source-chip{font-size:8px;letter-spacing:.4px;color:#a9b7c1;padding:2px 4px;border-radius:3px;background:#ffffff08}.source-chip[data-source=bass],[data-source=bass]{color:#daba89}.source-chip[data-source=mid],[data-source=mid]{color:#b6d58b}.source-chip[data-source=onset],[data-source=onset]{color:#c0a9ed}.source-chip[data-source=treble],[data-source=treble]{color:#8fc7d9}.effect-meter{position:absolute;left:0;bottom:0;height:2px;width:calc(var(--level)*100%);background:var(--accent)}.effect-card.live .source-chip{background:#d5f8a927}.effect-heading{display:flex;align-items:center;gap:8px;margin-bottom:10px}.effect-heading strong{font-size:12px;font-weight:600;min-width:98px}.effect-heading select,.effect-heading button{font-size:10px;min-height:25px;padding:3px 8px}.source-selector{width:78px}.knob-row{display:flex;align-items:flex-start;gap:20px;overflow-x:auto;padding:2px 3px 5px}.knob{display:flex;align-items:center;flex-direction:column;min-width:65px;width:65px;position:relative}.dial{width:48px;height:48px;border-radius:50%;position:relative;background:conic-gradient(from 225deg,var(--accent) 0deg var(--sweep),#434b50 var(--sweep) 270deg,transparent 270deg);cursor:ns-resize;touch-action:none;user-select:none}.dial:before{content:"";position:absolute;inset:4px;background:linear-gradient(145deg,#41484d,#22282c);border:2px solid #15191c;border-radius:50%;box-shadow:0 2px 5px #0008}.dial i{position:absolute;inset:9px;transform:rotate(var(--turn));pointer-events:none}.dial i:before{content:"";width:2px;height:9px;background:#e1f2d0;position:absolute;left:calc(50% - 1px);top:0;border-radius:2px}.knob-label{font-size:10px;color:#a6b2b8;margin-top:6px}.knob-value{border:0;background:transparent;min-height:18px;font:10px ui-monospace,monospace;padding:1px 3px;color:#e4eacb}.knob-value:hover{background:#343c30}.knob-input{position:absolute;bottom:0;width:78px;text-align:center;font-size:10px!important;padding:2px!important;z-index:2}.advanced-controls{display:grid;grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:0 18px;padding-top:12px;margin-top:10px;border-top:1px solid var(--line)}.field{display:flex;align-items:center;gap:8px;margin:6px 0;min-height:25px}.field>label{font-size:11px;min-width:80px;flex:1}.field>input:not([type=checkbox]),.field>select{width:100px;flex:1;font-size:11px;padding:3px 7px;min-height:25px}.field input[type=checkbox]{margin-left:auto}.field .boundary{font-size:9px;padding:3px}.advanced-controls .field>label{min-width:65px}.advanced-controls .field>input,.advanced-controls .field>select{width:75px;max-width:110px}
#settingsDrawer{flex:1 1 310px;min-width:0;background:#202428;border-left:1px solid var(--line);padding:8px 12px}.drawer-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.drawer-title strong{font-size:11px;color:var(--accent)}#settingsDrawer section>.row{margin:10px 0}#settingsDrawer label{font-size:11px}#settingsDrawer button{font-size:10px}#settingsDrawer>section>select{width:100%;margin-bottom:8px}#debug{font:10px/1.6 ui-monospace,monospace;color:#9aaeb8;white-space:pre-wrap;background:#161a1d;padding:9px}#bassMeter{width:100%}#curvePanel{margin-top:12px;border:1px solid #3b4449;background:#14181b;border-radius:6px;padding:10px;max-width:980px}.curve-toolbar{display:flex;align-items:center;gap:6px}.curve-toolbar button,.curve-toolbar select{font-size:10px;min-height:23px;padding:3px 8px}.curve-toolbar select{margin-left:auto}.curve-graph{display:block;width:100%;height:205px;overflow:visible;touch-action:none;margin-top:5px}.grid-line{stroke:#2a3338;stroke-width:1;fill:none}.curve-line{stroke:var(--accent);stroke-width:2;fill:none;vector-effect:non-scaling-stroke}.curve-guide{stroke:#63764f;stroke-width:1;stroke-dasharray:3 4;fill:none}.curve-handle{fill:#1d2714;stroke:#c8f398;stroke-width:2;cursor:move;vector-effect:non-scaling-stroke}.curve-handle:hover{fill:var(--accent)}.live-marker{fill:#fff;stroke:#e2f9be;stroke-width:2;pointer-events:none}.curve-graph text{fill:#72828a;font:9px ui-monospace,monospace}
#macroControls{display:none;gap:32px;align-items:center;justify-content:center;padding:10px}.macro-group{display:flex;gap:8px;align-items:center}.macro-group>button{background:transparent;border:0;font-size:18px}.perform-mode{--dock:230px}.perform-mode #timelinePanel,.perform-mode #effectControls,.perform-mode #curvePanel,.perform-mode #workspaceResize,.perform-mode [data-drawer],.perform-mode #maskOverlay,.perform-mode #originOverlay{display:none!important}.perform-mode #macroControls{display:flex}.perform-mode #instrument{padding:5px}.perform-mode .dial{width:56px;height:56px}.workspace-collapsed{--dock:var(--workspace-toolbar-height)}.workspace-collapsed .workspace-content{display:none}.workspace-collapsed #workspaceResize{display:none}
#statusbar{position:fixed;inset:auto 0 0;height:24px;background:#121619;border-top:1px solid #30373b;display:flex;align-items:center;justify-content:space-between;padding:0 16px;gap:30px;font-size:10px;color:#8c9aa1;z-index:6}#status{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#audioStatus{max-width:50%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;color:#9aa891}#fatal{position:fixed;bottom:30px;left:15px;max-width:550px;background:#602e31;padding:16px;color:white;z-index:30}.panel-hidden #toolbar,.panel-hidden #controlPanel,.panel-hidden #statusbar,.panel-hidden #maskOverlay,.panel-hidden #originOverlay,.panel-hidden #fatal{display:none!important}.panel-hidden #stage{inset:0}.performing,.performing #stage{cursor:none}
@media(max-width:1500px){#toolbar{gap:8px;padding:0 12px}.audio-top meter{display:none}#toolbar .toolbar-group{padding-left:8px}#enableAudio{max-width:95px}.effect-card{min-width:123px}.effect-name{font-size:10px}.source-chip{font-size:7px}.knob-row{gap:16px}}
@media(max-width:1100px){#toolbar{flex-wrap:wrap;height:88px;align-content:center;gap:7px}#stage{top:88px}.media-group{max-width:none!important}.workspace-toolbar{padding:0 10px;gap:5px}.workspace-toolbar .section-label{display:none}.workspace-toolbar [data-drawer]{font-size:10px;padding:4px 7px}#creativePreset{width:140px}#instrument{padding:10px 12px}.knob-row{gap:12px}.effect-card{flex:none;min-width:150px}#macroControls{gap:15px}#presetModified{display:none}}
@media(max-width:700px){.audio-top #enableAudio{max-width:none}.transport #loop{display:none}#toolbar .transport{padding-left:0;border:0}#toolbar .transport label{display:none}#toolbar #fps{display:none}#toolbar .audio-top{border:0;padding:0}.workspace-toolbar [data-drawer]{display:none}.timeline-toolbar .snap,.zoom-label{display:none}#segmentSelect{width:130px}#macroControls{gap:4px}.macro-group{gap:0}.macro-group>button{padding:0}.knob{min-width:58px;width:58px}.workspace-toolbar{overflow-x:auto}#statusbar{gap:8px;padding:0 8px}.curve-toolbar{flex-wrap:wrap}.curve-toolbar select{margin-left:0}}

/* Let settings use the space left by the effect controls instead of a fixed sidebar. */
.workspace-main:has(#settingsDrawer:not([hidden])) #instrument{flex:0 1 auto;width:fit-content;max-width:55%}
#maskControls,#audioControls,#segmentControls,#renderControls{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));column-gap:18px;align-items:start}
#settingsDrawer .field{min-width:0;margin:4px 0}#settingsDrawer .field>label{min-width:0;overflow-wrap:anywhere}#settingsDrawer .field>input:not([type=checkbox]),#settingsDrawer .field>select{min-width:0;max-width:120px}
#settingsDrawer #bassMeter{display:block;max-width:320px;margin-top:8px}#debug{overflow-wrap:anywhere}
@media(max-width:1100px){:root{--workspace-toolbar-height:70px}.workspace-toolbar{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:32px 24px;padding-top:4px;padding-bottom:4px;row-gap:2px}#clock{grid-column:1/-1;grid-row:2}.workspace-actions{gap:5px}.workspace-settings{grid-column:2;grid-row:1}}
@media(max-width:900px){.workspace-main{flex-wrap:wrap}.workspace-main:has(#settingsDrawer:not([hidden])) #instrument{width:100%;max-width:none;flex-basis:100%}#settingsDrawer{flex-basis:100%;border-left:0;border-top:1px solid var(--line)}}

.drawer-actions{display:flex;align-items:center;gap:12px;margin-top:8px}#settingsDrawer .drawer-actions #bassMeter{flex:1;width:auto;min-width:60px;max-width:320px;margin:0}

/* Explicit, compact product actions; no unsolicited dialogs. */
#toolbar .media-group{max-width:540px}.download-entry{color:var(--accent);font-size:11px;border-color:#536844}.platform-note{font-size:11px;color:var(--muted);line-height:1.6;max-width:70ch}.app-dialog{width:min(700px,calc(100vw - 32px));padding:24px;border:1px solid #485044;border-radius:12px;background:#1b2021;color:#dfe3e7;box-shadow:0 20px 80px #0008}.app-dialog::backdrop{background:#0009}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.dialog-heading strong{font-size:20px}.dialog-heading button{font-size:20px}.app-dialog p{line-height:1.7}.app-dialog #releaseVersion{color:var(--muted);font-size:12px}#downloadChoices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:20px 0}.download-choice{display:flex;flex-direction:column;gap:10px;border:1px solid var(--line);padding:16px;border-radius:8px}.download-choice small{color:var(--muted)}.download-link{display:block;margin-top:auto;text-align:center;color:var(--accent);border:1px solid #526441;border-radius:5px;padding:8px;text-decoration:none;font-size:12px}.download-link:disabled{color:var(--muted)}
@media(max-width:1300px){#toolbar{height:88px;flex-wrap:wrap;align-content:center;gap:7px}#stage{top:88px}#toolbar .media-group{max-width:none;flex:1}#toolbar .toolbar-group{padding-left:8px}.download-entry{font-size:10px}}
@media(max-width:600px){#downloadChoices{grid-template-columns:1fr}.download-choice{padding:12px}.app-dialog{padding:18px}}
body.privacy-page{height:auto;overflow:auto;padding:32px}body.privacy-page main{max-width:760px;margin:0 auto}body.privacy-page p{line-height:1.8;color:#b8c1c4}body.privacy-page a{color:var(--accent)}
.download-choice details{font-size:10px;color:var(--muted)}.download-choice code{display:block;overflow-wrap:anywhere;margin-top:5px}

/* Keep native-file action labels readable while the media selector shrinks. */
#toolbar .media-group{flex:1 1 320px;min-width:300px}
#mediaSelect{flex:1;min-width:100px;width:0}
#toolbar .media-group>button{flex-shrink:0}
