.desktop-only{display:none}
@media(min-width:820px){
 body.desktop-editor{--ink:#fff;--paper:var(--studio-card);--muted:var(--studio-muted);--line:var(--studio-border);--lime:var(--studio-accent);background:var(--studio-bg);color:#fff;color-scheme:dark;font-size:14px}
 .desktop-editor *{box-sizing:border-box}.desktop-editor [hidden]{display:none!important}.desktop-editor .desktop-only{display:block}
 .desktop-editor .topbar{position:static;border-color:var(--studio-border);background:var(--studio-bg);gap:16px}.desktop-editor .brand span{color:var(--studio-muted)}.desktop-editor .brand-mark,.desktop-editor .save-state{display:none}
 .desktop-editor .desktop-header-actions{display:flex;margin-left:auto;align-items:center}.desktop-editor #desktopExport{background:var(--studio-accent);color:#111;font-weight:700;border-color:var(--studio-accent)}
 .desktop-editor button,.desktop-editor input,.desktop-editor textarea,.desktop-editor select{font:inherit;font-size:14px;min-width:0;max-width:100%;border:1px solid var(--studio-border);border-radius:7px;background-color:var(--studio-input);color:#fff;padding:8px 10px}.desktop-editor button{min-height:36px;cursor:pointer}.desktop-editor button:disabled{opacity:.4;cursor:default}.desktop-editor input[type=range]{padding:0;accent-color:var(--studio-accent);border:0}.desktop-editor input[type=checkbox]{accent-color:var(--studio-accent);width:18px;height:18px}.desktop-editor input[type=color]{padding:2px;min-height:36px}.desktop-editor label{font-size:14px;color:var(--studio-muted)}
 .desktop-editor .app-shell{width:100%;max-width:1800px;padding:0 20px 16px;margin:0 auto}.desktop-editor .app-shell>.workspace,.desktop-editor .app-shell>.preview-note{display:none}
 #desktopStudio{min-height:620px;display:grid;grid-template-rows:minmax(0,1fr) 155px;gap:16px}.desktop-workspace{display:grid;grid-template-columns:minmax(280px,32%) minmax(0,1fr);gap:16px;min-height:0}
 #desktopPreview,#desktopEditor,#desktopScenes{min-width:0;background:var(--studio-card);border:1px solid var(--studio-border);border-radius:12px;overflow:hidden}
 .desktop-editor .preview-panel{position:relative!important;inset:auto!important;width:100%!important;max-height:none!important;height:100%;display:flex;flex-direction:column;align-items:stretch;padding:16px!important;border:0;margin:0;background:transparent;box-shadow:none;overflow:hidden}
 .desktop-editor .desktop-preview-tools{position:absolute;z-index:30;top:12px;right:12px;display:flex;gap:5px}
 .desktop-editor .desktop-preview-tools button{width:32px;min-width:32px;height:32px;min-height:32px;padding:0;display:grid;place-items:center;border:1px solid #3a4049;border-radius:7px;background:#1b1f24e8;color:#fff;font-size:17px;line-height:1;backdrop-filter:blur(8px)}
 .desktop-editor .desktop-preview-tools button:hover:not(:disabled){background:#272c33;border-color:#555f6b}
 .desktop-editor .desktop-preview-tools button:disabled{opacity:.35}
 .desktop-editor .preview-panel:fullscreen{width:100vw!important;height:100vh!important;max-height:none!important;padding:20px!important;background:#080a0c!important}
 .desktop-editor .preview-panel:fullscreen .stage-wrap{border-radius:0;flex:1 1 auto}
 .desktop-editor .preview-panel:fullscreen .stage{height:calc(100vh - 135px);max-height:calc(100vh - 135px)}
 .desktop-editor .preview-panel:fullscreen .desktop-preview-tools{top:18px;right:18px}
 .desktop-editor .preview-panel>.panel-heading,.desktop-editor .preview-note,.desktop-editor #miniTimeline,.desktop-editor #prevBtn,.desktop-editor #nextBtn{display:none}
 .desktop-editor .stage-wrap{flex:1;min-height:0;margin:0;padding:0;background:#080a0c;display:flex;justify-content:center;align-items:center;overflow:hidden;border-radius:7px}.desktop-editor .stage{height:100%;width:auto;max-height:100%;max-width:100%;object-fit:contain;aspect-ratio:9/16}
 .desktop-editor .player-controls{margin:8px 0 0;justify-content:flex-start;gap:12px}.desktop-editor #playBtn{width:38px;height:38px;border-radius:50%;background:var(--studio-accent);color:#111}.desktop-editor .timecode{color:#fff;font-size:13px}.desktop-editor .scrubber{height:16px;margin:6px 0}
 .desktop-editor #desktopSceneNav{display:flex;align-items:center;justify-content:space-between;gap:6px;border-top:1px solid var(--studio-border);padding-top:10px}.desktop-editor #desktopSceneCount{white-space:nowrap;font-size:14px}
 #desktopEditor{display:flex;flex-direction:column;padding:20px}.desktop-current{display:flex;justify-content:space-between;align-items:center;gap:16px}.desktop-current span{font-size:12px;letter-spacing:.1em;color:var(--studio-muted)}.desktop-current h1{font-size:24px;line-height:1.3;margin:5px 0 0;letter-spacing:0}.desktop-current p{font-size:13px;color:var(--studio-muted);white-space:nowrap}
 #desktopTabs{display:flex;gap:8px;margin:18px 0 14px}#desktopTabs button{flex:1;}#desktopTabs button[aria-pressed=true]{background:var(--studio-accent);color:#111;border-color:var(--studio-accent);font-weight:700}
 .desktop-story-caption-mode{display:grid;grid-template-columns:auto minmax(180px,260px);align-items:center;gap:7px 12px;margin:0 0 12px;padding:12px 14px;border:1px solid var(--studio-border);border-radius:9px;background:var(--studio-input)}.desktop-story-caption-mode>span{color:#fff;font-weight:800}.desktop-story-caption-mode select{width:100%}.desktop-story-caption-mode small{grid-column:1/-1;color:var(--studio-muted);font-size:11px}
 #desktopBatchCaptions{display:none;width:100%;margin:0 0 12px;min-height:38px;}#desktopEditor[data-mode=caption] #desktopBatchCaptions{display:block}#desktopEditor[data-mode=caption] #desktopBatchCaptions:hover{border-color:#626b76;background:#1c2026}
 #desktopEditorScroll{overflow-y:auto;min-height:0;overscroll-behavior:contain;padding-right:6px;scrollbar-gutter:stable}
 .desktop-editor .timeline-panel{padding:0;margin:0;border:0;background:transparent;box-shadow:none}.desktop-editor .timeline-heading,.desktop-editor .editor-toolbar,.desktop-editor .timeline-panel>.field-help{display:none}.desktop-editor #cueList,.desktop-editor #sceneList{display:block;margin:0}.desktop-editor .cue-row,.desktop-editor .scene-row{display:none!important}.desktop-editor .cue-row.desktop-selected,.desktop-editor .scene-row.desktop-selected{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:16px;border:1px solid var(--studio-border);border-radius:9px;background:var(--studio-input);box-shadow:none;color:#fff;margin:0}
 .desktop-editor .cue-row>div,.desktop-editor .scene-row>div{min-width:0;grid-column:1/-1;grid-row:auto}.desktop-editor .cue-row .editor-start,.desktop-editor .scene-row .motion-control{grid-column:1}.desktop-editor .cue-row .editor-end,.desktop-editor .scene-row .transition-control{grid-column:2}.desktop-editor .cue-row input,.desktop-editor .cue-row select,.desktop-editor .cue-row textarea{background:var(--studio-card);color:#fff;font-size:14px;border-color:var(--studio-border)}
 .desktop-editor .editor-row-heading{display:flex;gap:16px;align-items:center}.desktop-editor .editor-row-heading strong{color:#fff;font-size:16px}.desktop-editor .editor-row-heading span{color:var(--studio-muted);font-size:12px}.desktop-editor .editor-row-heading>button{margin-left:auto}.desktop-editor .editor-color,.desktop-editor .drag-handle{display:none}.desktop-editor .scene-thumb{width:90px;height:90px;object-fit:cover}.desktop-editor .editor-actions,.desktop-editor .selection-color-tools{display:flex;gap:8px;flex-wrap:wrap}
 #desktopEditor[data-mode=image] .editor-text{display:none}
 #desktopEditor:not([data-mode=caption]) #desktopCaption{display:none}
 #desktopEditor[data-mode=caption] .cue-row>div:not(.editor-text),#desktopEditor[data-mode=caption] .scene-row{display:none!important}
 .desktop-editor #captionStylePanel{background:transparent;color:#fff;border:0;padding:16px 0;margin:0}.desktop-editor #captionStylePanel>summary{list-style:none;color:#fff;font-weight:800;}.desktop-editor #captionStylePanel>summary::-webkit-details-marker{display:none}.desktop-editor #captionStylePanel>summary span{display:none}.desktop-editor .style-target>label:first-child{display:none}.desktop-editor .style-target{grid-template-columns:1fr;margin-top:0}.desktop-editor .caption-style-grid{gap:14px 20px}.desktop-editor .caption-style-grid .style-full{grid-column:1/-1}.desktop-editor #captionStylePanel output{color:var(--studio-accent)}.desktop-editor .color-swatch{background:var(--swatch);width:30px;height:30px;min-height:30px;padding:0}.desktop-editor .field-help,.desktop-editor .muted{color:var(--studio-muted);font-size:12px;line-height:1.6}
 #desktopScenes{padding:12px 16px}#desktopScenes>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}#desktopScenes>header button{min-height:28px;padding:4px 10px;font-size:12px}.desktop-strip-wrap{display:flex;gap:10px;min-width:0;align-items:center}#desktopStrip{display:flex;gap:10px;overflow-x:auto;min-width:0;flex:1;scrollbar-width:thin;padding:2px 0 5px;overscroll-behavior-x:contain}
 .desktop-editor #desktopProject{width:min(850px,calc(100vw - 48px));max-width:850px;max-height:88dvh;padding:0;background:var(--studio-bg);color:#fff;border:1px solid var(--studio-border);border-radius:12px}.desktop-editor #desktopProject>header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:var(--studio-card);position:sticky;top:0;z-index:2}.desktop-editor #desktopProject h2{font-size:18px;margin:0}#desktopProjectBody{padding:20px}.desktop-editor #desktopProject .panel{padding:20px;margin:0 0 16px;background:var(--studio-card);border:1px solid var(--studio-border);box-shadow:none}.desktop-editor #desktopProject .hero{margin:0 0 16px;padding:0;min-height:0;display:block}.desktop-editor #desktopProject .hero>div:first-child,.desktop-editor #desktopProject .hero-actions p{display:none}.desktop-editor #desktopProject .hero-actions{display:flex;gap:10px;justify-content:flex-start}.desktop-editor #desktopProject .setup-panel{width:100%}.desktop-editor .text-style-panel{background:var(--studio-input);border-color:var(--studio-border)}.desktop-editor .text-style-panel summary{color:#fff}.desktop-editor .count-pill,.desktop-editor .format-lock{background:var(--studio-input);color:#fff}.desktop-editor .button.primary,.desktop-editor .button.secondary{background:var(--studio-accent);color:#111;border-color:var(--studio-accent)}.desktop-editor .export-panel{flex-wrap:wrap}.desktop-editor dialog{background:var(--studio-card);color:#fff;border-color:var(--studio-border)}
 @media(max-width:1000px){.desktop-editor .topbar{padding:12px 16px}.desktop-editor .brand span{display:none}.desktop-workspace{grid-template-columns:minmax(260px,35%) minmax(0,1fr)}#desktopEditor{padding:14px}.desktop-current{align-items:flex-start;flex-direction:column;gap:0}.desktop-current p{margin:4px 0 0}.desktop-editor .caption-style-grid{grid-template-columns:1fr}.desktop-editor .editor-row-heading{flex-wrap:wrap}.desktop-editor .app-shell{padding:0 12px 12px}}
}
@media(min-width:820px){.desktop-editor .stage-wrap{flex-basis:0}.desktop-editor .editor-row-heading{border-color:var(--studio-border)}}
/* free-edit and video-audio controls */
@media(min-width:820px){
 .desktop-editor .editor-audio{grid-column:1/-1!important}
 .desktop-editor .editor-audio>span{display:block;margin-top:5px;font-size:12px;color:var(--studio-muted)}
 .desktop-editor .editor-audio{padding:12px;border:1px solid var(--studio-border);border-radius:8px;background:var(--studio-card)}
 .desktop-editor .video-audio-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.desktop-editor .video-audio-head label{display:flex;gap:6px;align-items:center}
 .desktop-editor .video-volume{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center}.desktop-editor .video-volume input{width:100%}
}

/* video trim/audio controls */
.desktop-editor .trim-fields,.desktop-editor .video-audio-fades{max-width:520px}.desktop-editor .video-volume-presets{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}

/* desktop scene editing */
@media(min-width:820px){
 #desktopScenes>header .desktop-scene-head-actions{display:flex;gap:8px;align-items:center}
 #desktopSceneEdit[aria-pressed=true]{background:var(--studio-accent);color:#111;border-color:var(--studio-accent);font-weight:700}
 #desktopStrip .desktop-scene-item{position:relative;flex:0 0 80px;height:80px;min-width:80px}
 #desktopStrip .desktop-scene-card{position:relative;width:100%;height:100%;padding:0;overflow:hidden;border:2px solid var(--studio-border);border-radius:7px;background:var(--studio-input)}
 #desktopStrip .desktop-scene-card img{width:100%;height:100%;object-fit:cover}
 #desktopStrip .desktop-scene-card b,#desktopStrip .desktop-scene-card small{position:absolute;background:#080a0cdd;border-radius:3px;padding:1px 4px;font-size:12px;pointer-events:none}
 #desktopStrip .desktop-scene-card b{top:3px;left:3px}#desktopStrip .desktop-scene-card small{right:3px;bottom:3px}
 #desktopStrip .desktop-scene-card[aria-current=true]{border-color:var(--studio-accent);box-shadow:0 0 0 1px var(--studio-accent)}
 #desktopStrip.scene-editing .desktop-scene-item{cursor:grab}
 #desktopStrip.scene-editing .desktop-scene-item:active{cursor:grabbing}
 #desktopStrip .desktop-scene-drag{position:absolute;top:4px;right:4px;z-index:3;border-radius:4px;padding:1px 4px;background:#080a0cdd;color:#fff;font-weight:700;pointer-events:none}
 #desktopStrip .desktop-scene-actions{position:absolute;left:3px;right:3px;bottom:3px;z-index:4;display:grid;grid-template-columns:1fr 1fr 1fr;gap:2px}
 #desktopStrip .desktop-scene-actions button{min-height:22px;height:22px;padding:0 3px;font-size:12px;border-radius:4px;background:#0d1014e8}
 #desktopStrip .desktop-scene-actions button.danger{color:#ff8080;border-color:#6d3434}
 #desktopStrip .desktop-scene-item.dragging{opacity:.45}
 #desktopStrip .desktop-scene-item.drop-target::after{content:'';position:absolute;inset:-3px;border:2px dashed var(--studio-accent);border-radius:9px;pointer-events:none;z-index:5}
}

/* project text controls + scene strip follow */
@media(min-width:820px){
 .desktop-editor #desktopProject .text-style-grid input[type=number]{background:var(--studio-card);color:#fff;-webkit-text-fill-color:#fff;caret-color:#fff}
 .desktop-editor #desktopProject .text-style-grid input[type=range]{width:100%;accent-color:var(--studio-accent);background:transparent;border:0;padding:0}
 .desktop-editor #desktopProject .text-style-grid output{float:right;color:var(--studio-accent);font-size:12px}
}

/* caption-first actions + keyboard workflow */
@media(min-width:820px){
 .desktop-editor .caption-cue-actions,.desktop-editor .scene-cue-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:8px;padding:9px 10px;border:1px solid var(--studio-border);border-radius:9px;background:var(--studio-input)}
 .desktop-editor .caption-cue-actions{margin-top:12px}
 .desktop-editor .caption-cue-actions .cue-action-label,.desktop-editor .scene-cue-actions .cue-action-label{margin-right:auto;color:var(--studio-muted);font-size:11px;font-weight:800;white-space:nowrap}
 .desktop-editor .caption-cue-actions button,.desktop-editor .scene-cue-actions button{min-height:34px}
 .desktop-editor .scene-cue-actions{background:rgba(255,255,255,.018)}
 #desktopEditor[data-mode=caption] .editor-text{display:block!important}
}

/* scene media settings are scene-level; captions stay caption-level. */
.desktop-editor .scene-media-summary{grid-column:1/-1;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:12px 14px;border:1px solid var(--studio-border);border-radius:8px;background:rgba(255,255,255,.025)}
.desktop-editor .scene-media-summary>div{display:flex;flex-direction:column;gap:3px}.desktop-editor .scene-media-summary strong{font-size:15px;color:#fff}.desktop-editor .scene-media-summary span{font-size:11px;color:var(--studio-muted);line-height:1.5}
.desktop-editor .scene-media-duration{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,180px) 1fr;gap:8px 14px;align-items:end}.desktop-editor .scene-media-duration span{font-size:11px;color:var(--studio-muted)}
#desktopEditor[data-mode=image] .cue-row.desktop-selected>div{display:none!important}
#desktopEditor[data-mode=image] .cue-row.desktop-selected>.scene-media-summary{display:flex!important}
#desktopEditor[data-mode=image] .cue-row.desktop-selected>.scene-media-duration,
#desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-media,
#desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-motion,
#desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-transition,
#desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-trim,
#desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-audio{display:block!important}
#desktopEditor[data-mode=image] .cue-row.desktop-selected>.scene-media-duration{display:grid!important}
#desktopEditor[data-mode=image] .caption-row-heading{display:none!important}
#desktopEditor[data-mode=caption] .caption-row-heading{display:none!important}
/* scene edit tools */
.desktop-scene-tools{display:none;margin:0 0 12px;padding:10px 12px;border:1px solid var(--studio-border);border-radius:10px;background:var(--studio-input)}
#desktopEditor[data-mode=image] .desktop-scene-tools{display:block}
.desktop-scene-tools>strong{display:block;margin-bottom:8px;font-size:12px}
.desktop-scene-tools>div{display:flex;gap:8px;flex-wrap:wrap}
.desktop-scene-tools button{min-height:34px;padding:7px 12px;font-size:12px}
.desktop-scene-tools button.danger{color:#ff8d8d;border-color:#6d3434}
.desktop-scene-tools small{display:block;margin-top:7px;color:var(--studio-muted);font-size:10px}

/* workflow polish: compact header, quick timing, progressive disclosure, scene status */
@media(min-width:820px){
 .desktop-editor .topbar{height:58px;min-height:58px;padding:8px 16px;flex-wrap:nowrap;overflow:hidden}
 .desktop-editor .brand{flex:0 0 auto;min-width:0}.desktop-editor .brand strong{font-size:20px;white-space:nowrap}.desktop-editor .brand span{font-size:10px;white-space:nowrap}
 .desktop-editor .project-tools{display:none!important}
 .desktop-editor .desktop-header-actions{gap:7px;flex:0 0 auto;white-space:nowrap}
 .desktop-editor .desktop-header-actions button{white-space:nowrap;min-height:34px;padding:7px 11px}
 .desktop-editor #desktopSettings{width:36px;min-width:36px;padding:0;font-size:16px}
 .desktop-editor #desktopSave{font-weight:700}
 .desktop-editor #desktopExport{padding-inline:14px}
 
 .desktop-editor #captionStylePanel>summary{display:flex;align-items:center;justify-content:space-between;pointer-events:auto;cursor:pointer;padding:10px 0;margin:0;font-size:14px}
 .desktop-editor #captionStylePanel>summary:after{content:'상세 설정 ▾';font-size:11px;font-weight:500;color:var(--studio-muted)}
 .desktop-editor #captionStylePanel[open]>summary:after{content:'상세 설정 ▴'}
 .caption-quick-timing{margin-top:12px;padding:12px;border:1px solid var(--studio-border);border-radius:8px;background:var(--studio-card)}
 .caption-quick-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}.caption-quick-head span{color:var(--studio-muted);font-size:12px}
 .caption-quick-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px}.caption-quick-fields label{display:grid;gap:5px}
 .caption-quick-actions{display:flex;gap:8px;margin-top:9px;flex-wrap:wrap}.caption-quick-actions button{font-size:12px}
 .media-advanced{grid-column:1/-1;border:1px solid var(--studio-border);border-radius:8px;background:var(--studio-card);overflow:hidden}
 .media-advanced>summary{cursor:pointer;padding:11px 12px;font-weight:700}.media-advanced>summary span{font-size:11px;color:var(--studio-muted);font-weight:400;margin-left:6px}.media-advanced-body{display:grid;gap:12px;padding:0 12px 12px}
 .desktop-scene-card{position:relative}.scene-status-badge{position:absolute;z-index:2;display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#0b0e11dd;color:#fff;font-size:10px;font-weight:800;border:1px solid #ffffff33}.scene-status-badge.caption-count{right:4px;top:4px}.scene-status-badge.motion-state{left:4px;bottom:4px;color:var(--studio-accent)}
}
@media(min-width:820px) and (max-width:900px){
 .desktop-editor .topbar{padding-inline:10px}.desktop-editor .desktop-header-actions button{padding-inline:8px}.desktop-editor #desktopExport{padding-inline:10px}
}
@media(min-width:820px){
 #desktopEditor:not([data-mode=image]) .media-advanced{display:none!important}
 #desktopEditor[data-mode=image] .media-advanced{display:block!important}
}
/* compact desktop header */
@media (min-width:820px){
 .desktop-current-actions{display:flex;align-items:center;gap:10px}.desktop-current-actions p{margin:0}.desktop-current-actions #desktopSettings{white-space:nowrap;padding:7px 10px;border:1px solid var(--studio-border);border-radius:8px;background:#20242a;color:#fff;font-size:11px}
 .desktop-header-actions{display:flex;gap:7px;flex-wrap:nowrap}.desktop-header-actions button{white-space:nowrap;min-width:auto!important}
 #desktopExport{background:var(--studio-accent)!important;color:#111!important;font-weight:800}
 .desktop-editor .topbar .project-tools,.desktop-editor .topbar .save-state{display:none!important}
}
/* desktop polish */
@media(min-width:820px){
  /* Keep the app header visually separated from the editor workspace. */
  #desktopStudio{margin-top:12px;height:calc(100dvh - 86px)}
  .desktop-editor .app-shell{padding-top:0}

  /* Project settings lives in the top toolbar only. */
  .desktop-editor #desktopSettingsTop{width:36px;min-width:36px!important;padding:0!important;font-size:16px;display:grid;place-items:center}
  .desktop-current-actions{margin-left:auto}

  /* Caption -> image/video -> precision timing. */
  #desktopTabs button{max-width:none}

  /* Image/video mode: most-used controls first. */
  #desktopEditor[data-mode=image] .cue-row.desktop-selected{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.scene-media-summary{display:none!important}
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-media{display:block!important;}
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-motion{display:block!important;}
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-transition{display:block!important;}
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.media-advanced{display:block!important;}
  

  /* Scene edit stays at the bottom of the image/video tab. */
  #desktopSceneActions{margin-top:12px;margin-bottom:12px}

  /* Size/position is a frequent control, so keep it visible in the image tab. */
  .desktop-media-details{display:none;margin:0 0 12px}
  #desktopEditor[data-mode=image] .desktop-media-details{display:block}
  #desktopMediaDetailsBody{padding:0}
  #desktopMediaDetailsBody #mediaTransform{margin:0;background:var(--studio-input);padding:14px}
    #desktopMediaDetailsBody #mediaTransform p{margin-top:10px;padding:10px 12px;border-radius:8px;background:#15191e;color:var(--studio-muted);line-height:1.55}
}


/* image/video tab follows the actual editing frequency. */
@media(min-width:820px){
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-media,
  #desktopEditor[data-mode=image] .scene-row.desktop-selected>.editor-media{position:relative;padding-top:46px}
  #desktopEditor[data-mode=image] .desktop-inline-replace{position:absolute;right:12px;top:10px;width:auto;min-height:32px;padding:6px 10px;white-space:nowrap}
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-media:before,
  #desktopEditor[data-mode=image] .scene-row.desktop-selected>.editor-media:before{content:'이미지·영상';position:absolute;left:12px;top:17px;color:var(--studio-muted);font-size:12px;font-weight:700}
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-media>label,
  #desktopEditor[data-mode=image] .scene-row.desktop-selected>.editor-media>label{display:none}
  /* Primary controls -> size/position -> scene edit. */
  #desktopEditor[data-mode=image] #desktopEditorBody{order:1}
  #desktopEditor[data-mode=image] #desktopMediaDetails{order:2}
  #desktopEditor[data-mode=image] #desktopSceneActions{order:3}
}


/* stabilization: exact image/video editor order, resilient to late media-transform creation. */
@media(min-width:820px){
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-media{order:1!important;grid-column:1/-1!important}
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-motion{order:2!important;grid-column:1!important}
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.editor-transition{order:3!important;grid-column:2!important}
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.scene-media-duration{order:4!important;grid-column:1/-1!important}
  #desktopEditor[data-mode=image] .cue-row.desktop-selected>.media-advanced{order:5!important;grid-column:1/-1!important}
  #desktopEditor[data-mode=image] #desktopMediaDetailsBody #mediaTransform{display:block!important}
  #desktopEditor[data-mode=image] #desktopSceneActions{display:block!important}
  #desktopEditor[data-mode=image] #desktopMediaDetails{display:block!important}
}

/* Whole-caption editor entry */
@media(min-width:820px){
  #desktopBatchCaptions{margin-left:auto!important;flex:0 0 auto!important;max-width:none!important;background:#20252b!important;color:#fff!important;border-color:#3b434c!important;font-weight:700}
  #desktopBatchCaptions:hover{border-color:var(--studio-accent)!important}
  #desktopEditor:not([data-mode=caption]) #desktopBatchCaptions{display:none!important}
}


/* Quick Start visual emphasis shared with mobile */
.desktop-editor #desktopProject .auto-setup{
  border-color:#6e6524;
  box-shadow:inset 4px 0 0 var(--studio-accent);
}
.desktop-editor #desktopProject .auto-setup-head{
  margin:-20px -20px 12px;
  padding:12px 16px;
  background:linear-gradient(90deg,rgba(245,230,66,.14),rgba(245,230,66,.035));
  border-bottom:1px solid #5b5423;
}
.desktop-editor #desktopProject .auto-setup-head .step-label,
.desktop-editor #desktopProject .auto-setup-head h2{
  color:var(--studio-accent);
}

.desktop-editor #desktopProject .hero-actions{
  
  grid-template-columns:repeat(3,minmax(0,1fr));
  
  
}


/* compact left-aligned project actions */
.desktop-editor #desktopProject .hero-actions{
  display:flex!important;
  justify-content:flex-start!important;
  align-items:center!important;
  gap:10px!important;
  width:auto!important;
}
.desktop-editor #desktopProject .hero-actions .button,
.desktop-editor #desktopProject .hero-actions #clearBtn{
  flex:0 0 auto!important;
  width:auto!important;
  min-width:118px!important;
  padding-left:16px!important;
  padding-right:16px!important;
}

/* desktop title/channel style layout mirrors mobile */
@media(min-width:820px){
  .desktop-editor #desktopProject #titleStylePanel .text-style-grid,
  .desktop-editor #desktopProject #channelStylePanel .text-style-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1.7fr) minmax(130px,.8fr)!important;
    gap:12px 14px!important;
    align-items:end;
  }

  /* Font + size share the first row, with the font selector wider. */
  .desktop-editor #desktopProject #titleStylePanel .text-style-grid>label.style-full:first-child,
  .desktop-editor #desktopProject #channelStylePanel .text-style-grid>label.style-full:first-child{
    grid-column:1!important;
    min-width:0;
  }
  .desktop-editor #desktopProject #titleStylePanel .text-style-grid>label:nth-child(2),
  .desktop-editor #desktopProject #channelStylePanel .text-style-grid>label:nth-child(2){
    grid-column:2!important;
    min-width:0;
  }

  /* Color occupies a clean full-width row, like mobile. */
  .desktop-editor #desktopProject #titleStylePanel .text-style-grid>div:nth-child(3),
  .desktop-editor #desktopProject #channelStylePanel .text-style-grid>div:nth-child(3){
    grid-column:1/-1!important;
    display:grid;
    grid-template-columns:auto 1fr minmax(150px,.72fr);
    align-items:center;
    gap:10px;
  }
  .desktop-editor #desktopProject #titleStylePanel .text-style-grid>div:nth-child(3)>label,
  .desktop-editor #desktopProject #channelStylePanel .text-style-grid>div:nth-child(3)>label{
    margin:0;
    white-space:nowrap;
  }
  .desktop-editor #desktopProject #titleStylePanel .text-style-grid>div:nth-child(3)>.compact-palette,
  .desktop-editor #desktopProject #channelStylePanel .text-style-grid>div:nth-child(3)>.compact-palette{
    margin:0;
    align-items:center;
  }
  .desktop-editor #desktopProject #titleStylePanel .text-style-grid>div:nth-child(3)>input[type=color],
  .desktop-editor #desktopProject #channelStylePanel .text-style-grid>div:nth-child(3)>input[type=color]{
    width:100%;
    min-width:0;
  }

  /* Position controls remain paired, everything else keeps its current behavior. */
  .desktop-editor #desktopProject #titleStylePanel .style-checks,
  .desktop-editor #desktopProject #channelStylePanel .style-checks,
  .desktop-editor #desktopProject #titleStylePanel .title-selection-tools,
  .desktop-editor #desktopProject #titleStylePanel .text-stroke-controls,
  .desktop-editor #desktopProject #channelStylePanel .text-stroke-controls{
    grid-column:1/-1!important;
  }

  .desktop-editor #desktopProject #titleStylePanel,
  .desktop-editor #desktopProject #channelStylePanel{
    background:#20242a!important;
    border-color:#373d45!important;
    border-radius:10px!important;
  }
}

/* compact project action controls */
@media(min-width:820px){
  .desktop-editor #desktopProject #scriptFileBtn{
    display:inline-flex!important;
    width:auto!important;
    min-width:0!important;
    justify-self:start;
  }
  .desktop-editor #desktopProject .bgm-buttons{
    display:flex!important;
    justify-content:flex-start!important;
    align-items:center;
    gap:8px!important;
  }
  .desktop-editor #desktopProject .bgm-buttons #bgmBtn{
    width:auto!important;
    min-width:118px!important;
    padding-left:14px!important;
    padding-right:14px!important;
  }
  .desktop-editor #desktopProject .bgm-buttons #bgmRemove{
    width:auto!important;
    min-width:78px!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }
  .desktop-editor #desktopProject #applyTemplateBtn,
  .desktop-editor #desktopProject #randomMotionBtn{
    display:inline-flex!important;
    width:auto!important;
    min-width:0!important;
    margin-right:8px!important;
    padding-left:14px!important;
    padding-right:14px!important;
  }
  .desktop-editor #desktopProject #fitCutsBtn{
    display:inline-flex!important;
    width:auto!important;
    min-width:0!important;
    padding-left:14px!important;
    padding-right:14px!important;
  }
  .desktop-editor #desktopProject #titleSelectionApply{
    display:none!important;
  }
  .desktop-editor #desktopProject #titleSelectionReset{
    width:auto!important;
    min-width:58px!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }
  .desktop-editor #desktopProject .export-actions #exportBtn{
    background:var(--studio-accent)!important;
    border-color:var(--studio-accent)!important;
    color:#111!important;
    font-weight:850!important;
    min-height:42px!important;
  }
}
