/* Stable workbench: typography and control polish, without layout replacement. */
body header .brandMark{filter:none}
body{--ui-radius:8px;--ui-control:40px;--ui-gap:8px;--ui-section:24px}
body :is(.btn,.srcbtn,.paramsBtn){line-height:1.35!important;padding:9px 12px;gap:8px;box-shadow:none!important}
body :is(.btn,.srcbtn,.paramsBtn):disabled{opacity:.45}
body :is(.btn,.srcbtn,.paramsBtn):hover:not(:disabled){transform:none!important}
body #styleAccess{flex-wrap:wrap;row-gap:10px}
body #activeStyleName{min-width:0;overflow-wrap:anywhere}
body #styleAccess #btnStyleParams{min-height:40px;padding:8px 12px!important;white-space:nowrap}
body #styleAccess{align-items:flex-start;padding:16px 0!important;gap:12px!important;border-top:1px solid var(--studio-edge);border-bottom:1px solid var(--studio-edge)}
body #styleAccess .currentLook{flex:1 1 140px;min-width:0;display:flex;flex-direction:column;gap:6px}
body #currentLookLabel{font-size:11px;line-height:1.5;color:var(--studio-muted)}
body #activeStyleName{font-size:20px!important;line-height:1.3;color:var(--studio-copy)!important}
body #currentLookDescription{font-size:12px;line-height:1.5;color:var(--studio-muted);text-wrap:pretty}
body #styleAccess #btnStyleParams{background:var(--studio-rail)!important;border-color:var(--studio-edge)!important;color:var(--studio-copy)!important;font-size:12px!important;min-height:44px}
body #styleAccess .pbIcon{display:none}
body #workflowNext{background:var(--studio-rail)!important;border:1px solid var(--studio-edge)!important;color:var(--studio-copy)!important;min-height:44px!important;padding:8px 12px!important;font-weight:500}
body aside :is(.btn,.srcbtn,.paramsBtn){min-height:40px;border-radius:6px!important}
body aside :is(.btn,.srcbtn,.paramsBtn):focus-visible{outline:2px solid var(--ux-action);outline-offset:2px}
body #styleSearch{min-height:44px!important}
body #presets .cath{margin:24px 0 8px!important}
body #drop .sourceArt{display:none}
body #drop .sourceChoice{padding:0;gap:12px;width:100%}
body #drop .dropModeIcon{width:28px;height:28px;flex:0 0 28px;color:var(--ux-action);background:none!important;border:0;box-shadow:none!important;transform:none!important}
body #drop .dropModeIcon svg{width:28px;height:28px;stroke-width:1.75!important;filter:none!important}
body #drop .dropMode:hover .sourceArrow{color:var(--ux-action)}
body #drop .startEditorial p{max-width:42ch;text-wrap:pretty}
body .flow .fbtn{gap:7px!important}
body #styleGroup #presets>.presets{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px!important}
body #presets .preset{position:relative;min-width:0;display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;align-content:center;min-height:72px!important;padding:8px!important;gap:4px 8px!important;border:1px solid var(--studio-edge)!important;border-radius:8px!important;background:var(--studio-rail)!important;overflow:hidden;text-wrap:balance;font-size:13px!important;line-height:1.35}
body #styleGroup #presets .preset{display:grid!important;grid-template-columns:48px minmax(0,1fr);align-items:center!important}
body #presets .preset.active{border-color:var(--ux-action)!important;box-shadow:inset 0 -2px var(--ux-action)!important}
body #presets .preset:hover{border-color:var(--studio-muted)!important;transform:none!important}
body #presets .styleThumbnail{display:block;grid-column:1;grid-row:1/span 2;width:48px;height:48px;object-fit:cover;background:#101112;border-radius:4px}
body #presets .stylePreviewStatus{position:absolute;top:20px;left:8px;width:48px;max-height:28px;overflow:hidden;color:var(--studio-muted);font-size:9px;line-height:1.4;font-weight:400;text-align:center;pointer-events:none}
body #presets [data-preview=ready] .stylePreviewStatus{display:none}
body #presets .preset small{min-height:0;grid-column:2;font-size:11px!important}
@media(max-width:380px){body #presets .preset{grid-template-columns:40px minmax(0,1fr);gap:4px 6px!important}body #presets .styleThumbnail{width:40px;height:40px}}
body{--ui-font:Arial,Helvetica,sans-serif;--sans:Arial,Helvetica,sans-serif;--panel:var(--studio-surface);--panel2:var(--studio-rail);--text:var(--studio-copy);--muted:var(--studio-muted);--line:var(--studio-edge);--line2:var(--studio-edge);font:400 14px/1.5 var(--ui-font)}
body header{min-height:64px;padding:10px 24px;gap:16px;box-shadow:none!important}
body header .brandWordmark{font-family:var(--ui-font)!important;font-weight:500!important;font-style:normal!important;text-transform:none!important;letter-spacing:normal!important;line-height:1.08}
body header .brandLine{border:0!important;padding-right:12px!important;min-width:max-content!important;flex:0 0 auto!important}
body main{grid-template-columns:minmax(0,1fr) 368px}
body .stage{padding:28px!important}
body aside{border-left:1px solid var(--studio-edge)}
body aside>.inspectorBody{padding:20px 20px 32px!important}
body aside .inspectorBody>.group{margin:0 0 24px!important}
body aside .inspectorBody>.group>h2{font:500 22px/1.3 var(--ui-font)!important;text-wrap:balance;padding:0 0 16px!important}
body aside :is(.btn,.srcbtn,.paramsBtn,select,.txt,textarea){font-family:var(--ui-font)!important;font-weight:400!important;font-size:13px;line-height:1.5}
body aside :is(.fld,.ctl){margin-bottom:18px!important}
body aside :is(.fld>span,.ctl>label){font-size:13px!important;font-weight:400!important;color:var(--studio-muted)}
body aside :is(.note,.creativeHelp,.motionLead,.mixLabLead,.brushPlaneNote){font-size:12px!important;line-height:1.6!important;font-weight:400!important;max-width:44ch;text-wrap:pretty}
body aside :is(.inspectorFold,.uxSubsection,.postMotion,.brushAdvanced)>summary{font:500 14px/1.5 var(--ui-font)!important;min-height:44px}
body aside :is(.inspectorFold,.uxSubsection,.postMotion,.brushAdvanced)>summary small{font-size:12px;font-weight:400}
body aside :is(.mixLabKicker,.motionEyebrow){font-weight:500!important}
body aside :is(.motionCard,.nativeSceneCard){background:var(--studio-rail)!important;border:1px solid var(--studio-edge)!important;border-radius:6px!important;font-weight:400!important;min-height:48px}
body aside :is(.motionCard.on,.nativeSceneCard.on){border-color:var(--ux-action)!important;color:var(--ux-action)!important}
body aside .saveImageBlock{grid-template-columns:1fr;gap:12px;margin-bottom:24px}
body aside #btnSave{min-height:44px;width:100%;font-weight:600!important}
body aside .frameRatioGrid{gap:8px}
body aside .ratioBtn{min-height:40px;border-radius:6px!important;background:var(--studio-rail)!important;font-weight:400}
body aside .ratioBtn.on{border-color:var(--ux-action)!important;color:var(--ux-action)!important}
body aside .brushMaterial span{font-weight:400!important;font-size:13px!important}
body aside #brushHelp{font-size:13px;line-height:1.6;color:var(--studio-muted);text-wrap:pretty}
body aside .brushPlane label{min-height:44px;background:var(--studio-rail)!important;border-radius:6px!important;font-size:13px}
body #tlDock{background:var(--studio-surface)!important;border-top:1px solid var(--studio-edge)!important;box-shadow:none!important}
body #tlDock :is(button,select,input){font:400 12px/1.5 var(--ui-font);border-radius:6px!important}
body #tlDock :is(.tlLabel,.tlTrackName){font-weight:400!important}
body #tlDock :is(.tlTime,.tlFrame){font-variant-numeric:tabular-nums}
body :is(#authDialog,#mixCompare){background:var(--studio-surface)!important;border-color:var(--studio-edge)!important;box-shadow:none!important}
body #authDialog :is(h2,h3){font-weight:500!important;text-wrap:balance}
body #authDialog :is(p,.note){font-size:13px;line-height:1.6;color:var(--studio-muted);text-wrap:pretty}
body #authDialog :is(button,input){font-family:var(--ui-font);font-size:14px}
body #authDialog button{min-height:44px}
body.source-empty{height:auto;min-height:100dvh;overflow-y:auto}
body.source-empty main{flex:1 0 auto}
body.source-empty .stage{padding:40px 32px!important;align-items:flex-start;box-sizing:border-box}
body #drop .dropModes .dropMode{grid-column:auto!important;min-height:88px;justify-content:center}
body.source-empty footer{position:static;flex-shrink:0}
body #drop{width:100%;max-width:1000px;margin:auto;text-align:left;border:0!important;background:transparent!important;padding:0!important}
body #drop .startEditorial{margin-bottom:40px}
body #drop .startKicker{font:400 12px/1.5 var(--ui-font);color:var(--studio-muted)}
body #drop .startEditorial h2{font:500 clamp(40px,5.5vw,80px)/1.08 var(--ui-font)!important;letter-spacing:normal!important;margin:20px 0;text-wrap:balance;color:var(--studio-copy)}
body #drop .startEditorial h2 em{font-style:normal;color:var(--ux-action)}
body #drop .startEditorial p{font:400 16px/1.6 var(--ui-font);color:var(--studio-muted)}
body #drop>b{font-size:14px;font-weight:400;display:block;margin-bottom:16px}
body #drop .dropModes{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
body #drop .dropMode{min-height:112px;padding:20px!important;background:var(--studio-rail)!important;border:1px solid var(--studio-edge)!important;border-radius:8px!important;box-shadow:none!important;text-align:left;align-items:flex-start;font-size:14px!important;font-weight:400}
body #drop .dropMode:hover{border-color:var(--ux-action)!important;background:var(--studio-raised)!important;transform:none!important}
body #drop .sourceChoice{font-size:14px!important;font-weight:400}
body #drop .dropHint{font-size:12px!important;line-height:1.6;color:var(--studio-muted);margin-top:20px}
body footer{background:var(--studio-surface)!important;color:var(--studio-muted);font:400 12px/1.5 var(--ui-font);border-color:var(--studio-edge)}
html[data-theme=light] body{--studio-surface:#fafbf6;--studio-rail:#f0f2e9;--studio-raised:#e8eddd;--studio-edge:#c7cebd;--studio-copy:#20271d;--studio-muted:#59634e;--bg:#f4f5ef;--bg2:#fafbf6;--panel:#fafbf6;--panel2:#f0f2e9;--surface:#fafbf6;--field:#fff;--ink:#20271d;--text:#20271d;--dim:#59634e;--dim2:#59634e;--line:#c7cebd;--line2:#a3ad94;--ux-action:#d8f06a;--ux-action-ink:#191d0f;--ux-selected:#415b19;--ux-selected-bg:#e7efcf;background:#f4f5ef!important;color:var(--studio-copy)}
html[data-theme=light] body .stage{background:#f4f5ef!important}
html[data-theme=light] body :is(.btn,.srcbtn,.paramsBtn,summary,select,input,textarea,.note,.creativeHelp){color:var(--studio-copy)}
html[data-theme=light] body :is(.preset.active,.ratioBtn.on,.motionCard.on,.nativeSceneCard.on,#drop .startEditorial h2 em,#drop .dropModeIcon,.flow .fbtn.active .ficon){color:#415b19!important}
html[data-theme=light] body :is(.preset.active,.ratioBtn.on,.motionCard.on,.nativeSceneCard.on,.brushMaterial[aria-pressed=true]){border-color:#657d35!important}
html[data-theme=light] body #presets .styleThumbnail{background:#e5e9dd}
html[data-theme=light] body #styleAccess #btnStyleParams{background:var(--studio-rail)!important;border-color:var(--studio-edge)!important;color:var(--studio-copy)!important}
html[data-theme=light] body :is(#authDialog,#mixCompare,#styleInspector,#siHead,#siBody,.inspectorFold,.uxSubsection){background:var(--studio-surface)!important;color:var(--studio-copy)!important;border-color:var(--studio-edge)!important}
html[data-theme=light] body :is(input:not([type=range]):not([type=color]):not([type=checkbox]),select,textarea){background:#fff!important;color:var(--studio-copy)!important;border-color:var(--studio-edge)!important}
html[data-theme=light] body header .brandMark{filter:brightness(.42)}
@media(min-width:681px) and (max-width:980px){body main{grid-template-columns:minmax(0,1fr) 320px}body .stage{padding:16px!important}body aside>.inspectorBody{padding:16px!important}}
@media(max-width:680px){
 body header{padding:8px 12px!important}
 body.source-empty .stage{padding:32px 20px!important}
 body #drop .startEditorial{margin-bottom:28px}
 body #drop .startEditorial h2{font-size:42px!important}
 body #drop .startEditorial p{font-size:15px}
 body #drop .dropModes{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 body #drop .dropMode{min-height:92px;padding:14px!important}
 body aside>.inspectorBody{padding:16px 16px 28px!important}
 body aside :is(select,.txt,textarea){font-size:16px!important;min-height:44px}
 body aside :is(.btn,.srcbtn,.paramsBtn,.ratioBtn){min-height:44px}
 body aside .inspectorBody>.group>h2{font-size:20px!important}
 body #tlDock :is(button,select){min-height:44px}
}
/* Finishing system: preserve workspace geometry and engine behavior. */
body header{display:flex;align-items:center;flex-wrap:nowrap;gap:12px!important}
body header .brandLine{padding-right:0!important}
body header .brandWordmark{font-size:28px!important}
body header .headerSourceTools{min-width:0;flex:1 1 auto}
body aside>.tabbar{padding:12px!important}
body .flow{gap:4px!important}
body .flow .fbtn{min-height:48px!important;padding:8px 4px!important;border-radius:var(--ui-radius)!important;font-size:12px!important;gap:6px!important}
body .flow .fbtn.active{background:var(--studio-rail)!important}
body .flow .ficon svg{width:18px;height:18px;stroke-width:1.75}
body #workflowGuide{gap:12px;padding:12px 0!important;margin:0!important;border-bottom:1px solid var(--studio-edge)}
body #workflowHint{font-size:12px;line-height:1.5;color:var(--studio-muted);text-wrap:pretty}
body #styleAccess{margin-top:0!important;border-top:0}
body aside :is(.btn,.srcbtn,.paramsBtn,.ratioBtn){border-radius:var(--ui-radius)!important;font-size:13px!important;font-weight:500!important;line-height:1.4!important;box-shadow:none!important}
body aside :is(.btn,.srcbtn,.paramsBtn):hover:not(:disabled){border-color:var(--studio-muted)!important}
body aside :is(.btn,.srcbtn,.paramsBtn):active:not(:disabled){outline:1px solid var(--studio-muted);outline-offset:-2px}
body aside :is(.ctl,.fld){margin-bottom:16px!important}
body aside :is(.ctl>label,.fld>span){font-size:13px!important;line-height:1.5;font-weight:400!important}
body aside :is(select,.txt,textarea){border-radius:6px!important;padding:8px 10px;line-height:1.5}
body aside :is(.inspectorFold,.uxSubsection,.brushAdvanced,.postMotion){border:1px solid var(--studio-edge)!important;border-radius:var(--ui-radius)!important;background:var(--studio-surface)!important;box-shadow:none!important;overflow:hidden}
body aside :is(.inspectorFold,.uxSubsection,.brushAdvanced,.postMotion)>summary{padding:12px!important;min-height:44px;font-size:13px!important;font-weight:500!important;color:var(--studio-copy)}
body #presets .preset{font-weight:500!important}
body #presets .preset small{color:var(--studio-muted);line-height:1.5!important}
body #presets .preset:focus-visible{outline:2px solid var(--ux-action);outline-offset:2px}
body #presets .cath{font-size:12px!important;font-weight:500!important;color:var(--studio-muted)}
body .variationBar{border-radius:var(--ui-radius)!important;box-shadow:none!important}
body #authDialog{border-radius:12px!important;padding:24px;max-width:calc(100vw - 32px)}
body #authDialog :is(.btn,input){border-radius:var(--ui-radius)!important;min-height:44px}
body #drop .startEditorial{margin-bottom:32px}
body #drop .dropMode{min-height:88px!important;border-radius:var(--ui-radius)!important;justify-content:center}
body #drop .startKicker{font-size:12px!important}
body #drop .sourceChoice{font-size:15px!important;font-weight:500!important}
@media(max-width:680px){body{--ui-control:44px}body header .brandWordmark{font-size:24px!important}body .flow .fbtn{min-height:44px!important}body aside :is(.btn,.srcbtn,.paramsBtn){min-height:44px!important}body aside :is(select,.txt,textarea){font-size:16px!important}body #authDialog{padding:20px}}
/* Timeline editor: controls stay in flow; clips fit their track rows. */
body #tlDock.editing{--tl-label:112px;max-height:55dvh;overflow-y:auto!important;overflow-x:hidden!important}
body #tlDockInner{padding:12px 16px}
body #tlTransport{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding-bottom:8px}
body #tlMoreTools{position:static;margin-left:0}
body #tlMoreTools[open]{display:contents}
body #tlMoreTools .tlMorePanel{position:static!important;inset:auto!important;display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0;width:100%;box-sizing:border-box;padding:8px;border:1px solid var(--studio-edge);border-radius:8px;background:var(--studio-rail);box-shadow:none!important;order:10}
body #tlMoreTools:not([open]) .tlMorePanel{display:none}
body #tlMoreTools .tlStepControls{gap:8px}
body #tlMoreTools .tlStepControls>span{display:none}
body #tlMoreTools .tlField{flex:0 1 auto}
body #tlDock.editing #tlEditPanel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 12px;padding:8px 0;border-top:1px solid var(--studio-edge)}
body #tlDock.editing #tlEditPanel>:is(.tlControlRow,.tlToolGroup){min-width:0;width:auto;margin:0!important;border:1px solid var(--studio-edge);border-radius:8px;background:var(--studio-rail)}
body #tlDock.editing #tlEditPanel .tlControlRow{padding:8px!important;gap:8px;flex-wrap:wrap}
body #tlDock.editing #tlEditPanel summary{padding:10px 12px!important;font-size:13px;font-weight:500;min-height:40px;box-sizing:border-box}
body #tlDock.editing #tlEditPanel summary:focus-visible{outline-offset:-3px}
body #tlDock.editing #tlTrimFields{grid-column:1/-1}
body #tlDock.editing .tlTrack{height:44px!important;min-height:44px;margin-bottom:6px;overflow:visible}
body #tlDock.editing .tlTrackName{width:var(--tl-label)!important;min-width:var(--tl-label)!important;gap:8px;padding:0 8px;font-size:12px!important}
body #tlDock.editing .tlTrackName .tName{overflow:visible;white-space:normal;line-height:1.2}
body #tlDock.editing .tlTrackLane{height:44px;min-height:44px}
body #tlDock.editing :is(.tlClip,.tlFxClip){top:6px;height:30px!important;box-sizing:border-box;border-radius:5px;background:var(--studio-raised);color:var(--studio-copy);border:1px solid var(--studio-muted)}
body #tlDock.editing :is(.tlClip,.tlFxClip).active{border-color:var(--ux-action);outline:1px solid var(--ux-action);outline-offset:0}
body #tlDock.editing .clipLabel{font-size:12px;line-height:28px;padding:0 8px;white-space:nowrap}
body #tlDock #tlScrubber{height:16px;min-height:16px;margin:4px 0 8px}
@media(max-width:680px){body #tlDock.editing{--tl-label:88px;max-height:48dvh}body #tlDock.editing #tlEditPanel{grid-template-columns:1fr}body #tlDockInner{padding:8px}body #tlTransport :is(button,select){min-height:44px!important}body #tlDock.editing .tlTrackName{font-size:11px!important}}
/* Simple timeline: transport, clips, one contextual inspector. */
body .stage canvas{box-shadow:none!important}
body .stage .cwrap{box-shadow:none!important;outline:1px solid var(--studio-edge);border-radius:0}
body #tlDock #tlEditPanel[hidden],body #tlDock #tlEditPanel [hidden]{display:none!important}
body #tlDock :is(#tlKeyTools,#tlMoreTools,#tlEditToggle,#tpStart,#tpEnd,#tlDockInfo,#tlFxApplyType,#tlFxTools>summary,.tlAdvancedFx,.tlEditIntro){display:none!important}
body #tlTransport>.tlField{display:none}
body #tlTransport>.tlField:has(#tlZoom){display:block;margin:0}
body #tlTransport>.tlField:has(#tlZoom)>span{display:none}
body #tlTransport #tlZoom{min-height:36px;width:64px;padding:4px;font-size:12px}
body #tlDock.editing #tlEditPanel{display:flex;gap:8px;border:0;padding:0;margin:0 0 8px}
body #tlDock.editing #tlEditPanel>:is(.tlControlRow,.tlToolGroup){flex:1;border:0;background:transparent;padding:0!important}
body #tlDock.editing #tlFxTools{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
body #tlDock.editing #tlFxTools>.tlControlRow{border:0;padding:0!important;margin:0;min-height:36px}
body #tlDock.editing #tlFxTools>.tlControlRow:nth-of-type(2){flex:1;min-width:140px}
body #tlDock.editing #tlFxTools>.tlControlRow:nth-of-type(2) .tlField{display:flex;flex:1;min-width:0;width:100%}
body #tlDock.editing #tlFxAmount{width:100%;min-width:100px;accent-color:var(--ux-action)}
body #tlDock #tlQuickFx{margin-left:auto;font-size:13px;min-width:64px}
body #tlDock #tpCounter{font-variant-numeric:tabular-nums}
body #tlDock.editing #tlTransport{flex-wrap:nowrap;padding:0;margin-bottom:8px}
body #tlDock.editing{max-height:34dvh}
@media(max-width:680px){body #tlDock.editing{max-height:36dvh}body #tlDock.editing #tlFxTools{gap:6px}body #tlDock.editing #tlFxTools>.tlControlRow:nth-of-type(2){min-width:100%;}body #tlDockInner{padding-bottom:max(8px,env(safe-area-inset-bottom))}}