@font-face{font-family:FilmText;src:url('film-font.ttf') format('truetype');font-display:swap}
/* A compact timeline uses the full workspace width. Source media stays untouched. */
.film-card-cover{width:100%;height:100%;object-fit:cover;display:block}.film-card-visual:has(.film-card-cover)>.icon{position:absolute;opacity:0}.film-card-visual .film-card-index{z-index:1;background:#0b1513c9;border:1px solid #bd9a5d40;border-radius:4px;padding:4px 7px;color:#ecd3a0}.film-card-cover[hidden]{display:none}
#film-assemble .film-assembly-grid{grid-template-columns:minmax(0,1.65fr) minmax(280px,.75fr);align-items:start;gap:18px}#film-assemble .film-cut-column{gap:14px}.film-legacy-cuts{border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--panel)}.film-legacy-cuts>summary,.ft-legacy-settings>summary{padding:13px 18px;font-size:12px;font-weight:600;cursor:pointer;color:var(--gold-light);list-style:none;display:flex;justify-content:space-between;gap:12px}.film-legacy-cuts>summary::after,.ft-legacy-settings>summary::after,.ft-properties>summary::after{content:'+';font:500 15px/1 sans-serif;color:var(--gold)}.film-legacy-cuts[open]>summary::after,.ft-legacy-settings[open]>summary::after,.ft-properties[open]>summary::after{content:'−'}.film-legacy-cuts>summary::-webkit-details-marker,.ft-legacy-settings>summary::-webkit-details-marker,.ft-properties>summary::-webkit-details-marker{display:none}.film-legacy-cuts .film-cut-panel{border:0;border-radius:0;margin:0}.ft-legacy-settings{border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--panel)}.ft-legacy-settings>.panel{border:0;border-radius:0;margin:0}.film-finishing-column{gap:14px}.film-render-panel{padding:20px}.film-render-panel h2{font-size:26px}.film-render-panel p{font-size:11px}.film-sequence-note{max-width:70ch}.film-screen{min-height:260px;max-height:550px}.film-screen>video{z-index:0}
.film-timeline{margin-top:22px;border:1px solid #485540;border-radius:12px;background:#142019;overflow:hidden;min-width:0;box-shadow:0 12px 40px #00000014}.ft-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px 16px}.ft-heading h2{font:430 27px/1.2 Fraunces,Georgia,serif;margin:3px 0 0}.ft-heading p{margin:7px 0 0;color:var(--muted);font-size:11px;line-height:1.65}.ft-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 18px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:#1c2a20;flex-wrap:wrap}.ft-toolbar-left,.ft-toolbar-right{display:flex;align-items:center;gap:7px}.ft-toolbar .button,.ft-heading .button,.ft-inspector-actions .button{min-height:28px;height:28px;padding:4px 11px;font-size:10px;line-height:1.3;white-space:nowrap}.ft-heading .button{min-width:105px}.ft-clock{font-size:12px;letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--gold-light);margin-right:7px;white-space:nowrap}.ft-clock span{color:var(--subtle);margin:0 4px}.ft-zoom-label{font-size:10px;display:flex;align-items:center;gap:8px;color:var(--muted)}.ft-zoom-label input[type=range]{width:90px;min-height:20px;margin:0}.ft-scroll{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;min-width:0;scrollbar-color:#657050 #112017;scrollbar-width:thin}.ft-content{position:relative;min-width:100%;padding-right:20px;isolation:isolate}.ft-ruler-row{height:37px;display:flex;background:#111c16;border-bottom:1px solid #34452e;position:relative}.ft-ruler-label{width:var(--ft-label);flex:none;position:sticky;left:0;z-index:5;background:#111c16;padding:12px 14px;font-size:9px;letter-spacing:.08em;color:var(--subtle);text-transform:uppercase;border-right:1px solid #34452e}.ft-ruler{width:var(--ft-track);height:37px;position:relative;cursor:crosshair;touch-action:none;outline-offset:-2px}.ft-ruler>span{position:absolute;top:11px;font-size:9px;font-variant-numeric:tabular-nums;color:#a8b49b;padding-left:3px;pointer-events:none}.ft-ruler>span::after{content:'';position:absolute;left:0;top:20px;width:1px;height:6px;background:#63704e}.ft-row{height:62px;display:flex;position:relative;border-bottom:1px solid #2c3d30;background:#15231a}.ft-row:nth-child(even){background:#142018}.ft-row:last-child{border:0}.ft-row.is-selected{background:#233027}.ft-row.is-hidden .ft-layer-clip{opacity:.4}.ft-row-label{width:var(--ft-label);flex:none;display:flex;align-items:center;gap:8px;padding:9px 10px 9px 13px;background:#1c2a20;position:sticky;left:0;z-index:4;border-right:1px solid #45513a;flex-wrap:wrap;overflow:hidden}.ft-kind{display:grid;place-items:center;flex:none;width:20px;height:20px;font-size:10px;font-weight:650;border-radius:5px;background:#334333;color:#e0c88c}.ft-row-name{border:0;background:transparent;color:var(--paper);font-size:10px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding:0;text-align:left;min-width:0;flex:1}.ft-row-toggles{display:flex;gap:5px;margin-left:28px;margin-top:-5px}.ft-row-toggles button{color:#aebca6;border:0;background:transparent;padding:2px 0;font-size:8px;line-height:1.2;min-height:16px}.ft-row-toggles button+button{padding-left:5px;border-left:1px solid #45513a}.ft-row-toggles button[aria-pressed=true]{color:#e3ba87}.ft-track{width:var(--ft-track);position:relative;flex:none;background-image:linear-gradient(to right,#6d775d18 1px,transparent 1px);background-size:40px 100%}.ft-base-row{height:77px;border-top:1px solid #586346}.ft-base-row .ft-row-label strong{font-size:10px;display:block}.ft-base-row .ft-row-label small{font-size:8px;color:var(--muted);display:block;margin-top:6px}.ft-layer-clip,.ft-base-clip{position:absolute;top:9px;height:44px;border:1px solid #8d8d57;border-radius:5px;background:#465034;min-width:4px;cursor:grab;color:#f0ead9;touch-action:none;user-select:none;overflow:hidden;box-shadow:0 2px 4px #0002}.ft-base-clip{top:10px;height:56px;border-color:#77826a;background:#354935}.ft-base-clip>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.48;pointer-events:none}.ft-base-clip:has(img)::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0c1609a6,#0c160930);pointer-events:none}.ft-layer-clip .ft-clip-copy,.ft-base-clip .ft-clip-copy{position:relative;z-index:1;pointer-events:none;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:6px;padding:7px 10px 5px;min-width:0}.ft-clip-copy b{font-size:9px;opacity:.85}.ft-clip-copy>span{font-size:10px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.ft-clip-copy small{grid-column:2;font-size:8px;margin-top:5px;opacity:.8;white-space:nowrap}.ft-base-clip .ft-clip-copy{padding-top:12px}.ft-row[data-kind=text] .ft-layer-clip{background:#5e4d2c;border-color:#b69c5e}.ft-row[data-kind=image] .ft-layer-clip{background:#4d4756;border-color:#948696}.ft-row[data-kind=music] .ft-layer-clip{background:#28504a;border-color:#67958a}.ft-row[data-kind=voice] .ft-layer-clip{background:#34465e;border-color:#7890aa}.ft-row.is-selected .ft-layer-clip,.ft-base-clip.is-selected{outline:2px solid var(--gold-light);outline-offset:-2px}.ft-layer-clip.is-dragging,.ft-base-clip.is-dragging{cursor:grabbing;z-index:6;box-shadow:0 4px 15px #0008;filter:brightness(1.15)}.ft-edge{position:absolute;top:0;bottom:0;width:9px;min-width:0;border:0;padding:0;background:#07130c3b;color:#f4dfab;cursor:ew-resize;z-index:3;touch-action:none;display:grid;place-items:center;border-radius:0}.ft-edge-start{left:0;border-right:1px solid #d8cc8e44}.ft-edge-end{right:0;border-left:1px solid #d8cc8e44}.ft-edge>span{display:block;width:2px;height:15px;border-radius:1px;background:currentColor;opacity:.8}.ft-edge:hover,.ft-edge:focus-visible{background:#bca361a1;color:white;width:13px}.ft-layer-clip:focus-visible,.ft-base-clip:focus-visible,.ft-ruler:focus-visible,.ft-edge:focus-visible{outline:2px solid #f4d58e;outline-offset:1px}.ft-playhead{position:absolute;top:29px;bottom:0;width:1px;background:#f3d38d;z-index:3;pointer-events:none;box-shadow:0 0 0 1px #1119}.ft-playhead::before{content:'';position:absolute;top:-5px;left:-4px;width:9px;height:9px;background:#f3d38d;border-radius:2px 2px 4px 4px}.ft-empty-track{font-size:10px;color:var(--muted);margin:27px 15px}.ft-empty-layers{padding:13px 20px;font-size:11px;line-height:1.5;color:#aebda4;background:#17251b;border-bottom:1px solid #34452e}.ft-help{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:10px;color:var(--muted);padding:11px 18px;border-top:1px solid var(--border);line-height:1.65}.ft-help p{margin:0}.ft-status{padding:0 18px 12px;margin:0;font-size:10px;color:var(--gold-light);line-height:1.5}.ft-status:empty{display:none}.ft-inspector{border-top:1px solid var(--border);padding:20px 22px;background:#1c2920}.ft-inspector-empty{max-width:720px}.ft-inspector-empty h3,.ft-inspector-heading h3{font:430 23px/1.2 Fraunces,Georgia,serif;margin:5px 0 8px;overflow-wrap:anywhere}.ft-inspector-empty p{font-size:11px;line-height:1.7;color:var(--muted);margin:5px 0}.ft-inspector-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:15px}.ft-inspector-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:12px 16px;align-items:start}.ft-inspector-grid label{font-size:10px;line-height:1.4;min-width:0}.ft-inspector-grid input:not([type=range]):not([type=checkbox]),.ft-inspector-grid select,.ft-inspector-grid textarea{min-height:34px;height:34px;font-size:11px;padding:7px 9px;margin-top:7px;max-width:100%;width:100%}.ft-inspector-grid select{padding-right:24px}.ft-inspector-grid textarea{height:66px;min-height:66px;resize:vertical}.ft-inspector-grid input[type=color]{padding:4px;cursor:pointer}.ft-inspector-grid input[type=range]{margin-top:9px}.ft-source-field,.ft-text-field{grid-column:span 2}.ft-value{float:right;color:var(--gold-light);font-variant-numeric:tabular-nums}.ft-properties{border-top:1px solid var(--border);margin-top:17px;padding-top:13px}.ft-properties>summary{font-size:10px;color:var(--gold-light);font-weight:600;cursor:pointer;list-style:none;display:flex;justify-content:space-between;margin-bottom:13px}.ft-properties .field-help{font-size:10px;margin:12px 0 0}.ft-position-grid{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}.ft-check{display:flex;align-items:center;gap:9px;font-size:10px;color:var(--muted);margin:13px 0 0}.ft-check input[type=checkbox]{width:15px;height:15px;min-height:0;padding:0;margin:0;accent-color:var(--gold)}.ft-inspector-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:18px;max-width:620px}.ft-inspector>.field-help{font-size:9px;margin:10px 0 0}.ft-inspector .inline-error{margin:12px 0 0}.ft-add-dialog{width:650px}.ft-add-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.ft-add-options button{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:17px 15px;min-height:106px;border:1px solid #556447;background:#19271c;border-radius:8px;text-align:left;color:var(--paper);font-size:12px}.ft-add-options button:hover{background:#2a3826;border-color:var(--gold)}.ft-add-options strong{font-size:12px;color:var(--gold-light)}.ft-add-options small{font-size:10px;line-height:1.5;color:var(--muted)}.ft-add-options .ft-kind{margin-bottom:2px}
#film-layer-stage{position:absolute;z-index:2;pointer-events:none;overflow:hidden;contain:layout paint;isolation:isolate}.ft-preview-layer{position:absolute;pointer-events:none;box-sizing:border-box}.ft-preview-layer[hidden],#film-layer-stage[hidden]{display:none!important}#film-layer-stage video.ft-preview-video,#film-layer-stage img.ft-preview-image{position:absolute;object-fit:contain;max-height:none;max-width:none;min-height:0;min-width:0}.ft-preview-text{font-family:Arial,Helvetica,sans-serif;font-weight:400;line-height:1.2;text-align:center;display:flex;align-items:center;justify-content:center;white-space:pre-wrap;overflow-wrap:anywhere;overflow:hidden;padding:2.5%;text-shadow:0 1px 3px #0007}.ft-preview-text.has-background{background:#050e0cbc;border-radius:4px}.ft-preview-music,.ft-preview-voice{display:none}
@media(max-width:1150px){#film-assemble .film-assembly-grid{grid-template-columns:minmax(0,1.4fr) minmax(260px,.8fr)}.ft-heading{padding:17px}.ft-inspector{padding:17px}}
@media(max-width:850px){#film-assemble .film-assembly-grid{grid-template-columns:1fr}.film-finishing-column{grid-template-columns:1fr 1fr;align-items:start}.ft-legacy-settings{min-width:0}.film-render-panel{min-width:0}.ft-heading p{max-width:420px}.ft-inspector-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ft-position-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.ft-source-field,.ft-text-field{grid-column:span 2}}
@media(max-width:600px){.film-screen{min-height:230px}.film-finishing-column{grid-template-columns:1fr}.ft-heading{padding:15px;gap:12px}.ft-heading h2{font-size:23px}.ft-heading p{font-size:10px}.ft-heading .button{min-width:80px}.ft-toolbar{padding:10px 12px;gap:10px}.ft-toolbar-right{margin-left:auto}.ft-toolbar .button{padding:4px 8px;font-size:9px}.ft-zoom-label{font-size:9px;gap:5px}.ft-zoom-label input[type=range]{width:65px}.ft-clock{font-size:11px;margin-right:3px}.ft-row-label{padding:8px;gap:5px}.ft-row-name{font-size:9px}.ft-kind{width:17px;height:17px;font-size:9px}.ft-row-toggles{margin-left:22px}.ft-row-toggles button{font-size:7px}.ft-base-row .ft-row-label strong{font-size:9px}.ft-base-row .ft-row-label small{font-size:7px}.ft-inspector{padding:15px}.ft-inspector-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ft-source-field,.ft-text-field{grid-column:span 2}.ft-position-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ft-inspector-actions{grid-template-columns:repeat(2,1fr)}.ft-add-options{grid-template-columns:repeat(2,minmax(0,1fr))}.ft-add-options button{padding:13px;min-height:100px}.ft-help{padding:10px 13px;font-size:9px}.ft-help p:last-child{display:none}.ft-ruler-label{padding:12px 9px;font-size:8px}.ft-empty-layers{padding:11px 13px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.film-timeline *{scroll-behavior:auto}}

#film-layer-stage canvas.ft-preview-text{display:block;padding:0;background:none;text-shadow:none;border-radius:0}
/* Keep picture and first timeline rows together on ordinary laptop screens. */
#film-assemble .film-screen{height:clamp(230px,34vh,390px);min-height:230px;max-height:390px;aspect-ratio:auto}
#film-assemble .film-screen-panel>.panel-heading{padding:15px 20px}
#film-assemble .film-screen-footer{padding:12px 18px;gap:8px}
#film-assemble .film-screen-footer .film-sequence-note{font-size:10px;line-height:1.6;margin:0}
@media(max-width:600px){.ft-row-toggles{margin-top:-8px;gap:4px}.ft-row-toggles button{font-size:9px;min-height:24px;padding:3px 0}.ft-row-toggles button+button{padding-left:4px}.ft-edge{width:12px}.ft-edge>span{height:20px}.ft-edge:focus-visible,.ft-edge:hover{width:14px}#film-assemble .film-screen{height:280px}.ft-row-name{font-size:10px}}

.ft-base-clip.is-drop-target{outline:2px dashed #f4d58e;outline-offset:2px;filter:brightness(1.16)}

#film-assemble #film-screen:fullscreen{width:100vw;height:100vh;min-height:0;max-height:none;aspect-ratio:auto;background:#000}#film-screen:fullscreen [data-film-screen-player]{max-height:none}

/* Give the layer name its own line; visibility and sound controls sit beneath it. */
.ft-row:not(.ft-base-row)>.ft-row-label{display:grid;grid-template-columns:20px minmax(0,1fr);grid-template-rows:20px 18px;align-content:center;column-gap:8px;row-gap:3px}.ft-row:not(.ft-base-row) .ft-row-name{width:100%}.ft-row:not(.ft-base-row) .ft-row-toggles{grid-column:2;grid-row:2;margin:0;align-items:center;min-width:0;white-space:nowrap}
@media(max-width:600px){.ft-row:not(.ft-base-row)>.ft-row-label{grid-template-columns:17px minmax(0,1fr);grid-template-rows:18px 24px;column-gap:5px;row-gap:0}.ft-row:not(.ft-base-row) .ft-row-toggles{gap:4px}}

/* Keep the picture beside the edit, so lower tracks remain usable while watching. */
.films-workspace:has(#film-assemble:not([hidden])) .film-editor-heading{margin-bottom:12px;gap:18px}.films-workspace:has(#film-assemble:not([hidden])) .film-editor-heading h1{font-size:30px;margin:4px 0}.films-workspace:has(#film-assemble:not([hidden])) .film-editor-heading .eyebrow{margin:0}.films-workspace:has(#film-assemble:not([hidden])) .film-editor-heading .muted{margin-top:5px;font-size:11px}.films-workspace:has(#film-assemble:not([hidden])) .film-tabs{margin-bottom:16px}.films-workspace:has(#film-assemble:not([hidden])) .film-tabs>button{padding:9px 18px;min-height:36px}
@media(min-width:1180px){
  #film-assemble:not([hidden]){display:grid;grid-template-columns:minmax(0,1.9fr) minmax(300px,1fr);gap:20px 18px;align-items:start}
  #film-assemble>.film-timeline{grid-column:1;grid-row:1;margin-top:0}
  #film-assemble>.film-assembly-grid{grid-column:2;grid-row:1;display:grid;grid-template-columns:minmax(0,1fr);gap:10px;position:sticky;top:88px;min-width:0}
  #film-assemble>.film-assembly-grid:has(details[open]){position:static}
  #film-assemble .film-cut-column,#film-assemble .film-finishing-column{grid-template-columns:minmax(0,1fr);gap:10px}
  #film-assemble>.film-exports-section{grid-column:1/-1;grid-row:2;margin-top:8px}
  #film-assemble .film-screen{height:230px;min-height:230px;max-height:230px}
  #film-assemble .film-screen-panel>.panel-heading{padding:12px 14px;gap:8px;flex-wrap:wrap}
  #film-assemble .film-screen-panel>.panel-heading h2{font-size:21px}
  #film-assemble .film-screen-panel>.panel-heading .film-caption{font-size:8px}
  #film-assemble .film-screen-footer{padding:10px 12px;gap:7px}
  #film-assemble .film-screen-footer .film-sequence-note{font-size:9px;line-height:1.5}
  #film-assemble .film-screen-footer>span{font-size:9px}
  #film-assemble .film-legacy-cuts>summary,#film-assemble .ft-legacy-settings>summary{padding:11px 14px;font-size:11px}
  #film-assemble .film-render-panel{grid-column:auto;padding:14px}
  #film-assemble .film-render-panel h2{font-size:23px;margin:5px 0}
  #film-assemble .film-render-panel p{font-size:10px;line-height:1.5;margin:6px 0}
  #film-assemble .film-render-panel .film-caption{font-size:8px}
  #film-assemble .film-render-panel>.button{margin:6px 0}
  #film-assemble .film-render-panel .film-render-note{font-size:9px}
  #film-assemble .ft-heading{padding:15px 16px 13px;gap:12px}
  #film-assemble .ft-heading h2{font-size:25px}
  #film-assemble .ft-heading p{font-size:10px}
  #film-assemble .ft-toolbar{padding:10px 12px;gap:9px}
  #film-assemble .ft-inspector{padding:17px 16px}
  #film-assemble .ft-inspector-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  #film-assemble .ft-position-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}