@font-face{font-family:Inter;src:url("assets/fonts/Inter.ttf") format("truetype");font-style:normal;font-weight:100 900;font-display:swap}
:root{color-scheme:dark;font-family:Inter,Arial,sans-serif;font-size:12px;background:#0a0a0a;color:#f5f5f5;--bg:#0a0a0a;--panel:#101010;--border:#262626;--muted:#929292;--accent:#f5f5f5;--timeline-height:224px}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:32px;padding:0 11px;border:1px solid #303030;border-radius:4px;background:#161616;color:#d4d4d4;cursor:pointer;white-space:nowrap;transition:background .12s,border-color .12s,color .12s}button:hover{background:#252525;border-color:#4a4a4a;color:#fff}button:disabled{opacity:.35;cursor:wait}button[aria-pressed=true]{background:#202020;color:#fff;border-color:#777}:focus,:focus-visible{outline:none}a{color:#c9c9c9;text-decoration:none}a:hover{color:#fff}svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}h1,h2,h3,p{margin:0}h1,h2{font-size:12px;font-weight:500;line-height:1.4}.icon-library{position:absolute;width:0;height:0;overflow:hidden}button.icon-button{width:32px;padding:0;border-color:transparent;background:transparent;color:#c3c3c3}button.icon-button:hover{background:#252525;color:#fff}
/* Application frame */
.editor{height:100svh;min-height:670px;display:grid;grid-template-rows:48px minmax(0,1fr) var(--timeline-height) 32px;overflow:hidden}.app-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 20px;background:#0c0c0c;border-bottom:1px solid var(--border)}.app-brand,.app-actions{display:flex;align-items:center;gap:18px}.app-brand strong{font-size:18px;font-weight:600;letter-spacing:-.35px}.bar-divider{width:1px;height:18px;background:#3a3a3a}.workspace-name{font-size:12px;color:#b4b4b4}.app-actions{gap:24px;font-size:11px}.sequence-chip{color:#a5a5a5}.sequence-chip span{padding:0 8px;color:#666}#review-link{display:flex;align-items:center;gap:7px}.export-menu{position:relative}.export-menu>.dropdown-trigger{height:30px;gap:8px;padding:0 11px;border-color:#444;background:#151515;font-size:11px;color:#eee}.chevron{width:12px;height:12px}.workspace{min-height:0;display:grid;grid-template-columns:var(--shots-width,clamp(224px,20.05vw,308px)) minmax(0,1fr) var(--inspector-width,clamp(256px,20.2vw,310px));grid-template-rows:minmax(0,1fr) var(--transport-height,48px);gap:12px;padding:12px 16px 8px}.panel{border:1px solid var(--border);background:var(--panel);border-radius:6px;overflow:hidden}.shots-panel,.inspector{grid-row:1/3;min-height:0}.shots-panel{grid-column:1;display:flex;flex-direction:column}.preview-deck{grid-column:2;grid-row:1;min-height:0;min-width:0;display:grid;grid-template-columns:minmax(0,var(--program-track,1fr)) minmax(0,var(--reference-track,1fr));gap:12px}.inspector{grid-column:3}.panel-heading{height:40px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #222}.panel-heading>span{font-size:10px;color:#a3a3a3}
/* Search and shot navigation */
.shot-search{height:32px;flex:none;display:flex;align-items:center;gap:9px;margin:12px 12px 10px;padding:0 10px;border:1px solid #3a3a3a;border-radius:4px;background:#0d0d0d;color:#b0b0b0}.shot-search input{width:100%;min-width:0;border:0;background:transparent;color:#eee;font-size:11px;outline:0}.shot-search input::placeholder{color:#999}.shot-search>span{font-size:10px;color:#777}.shot-search:focus-within{border-color:#999}.shot-list{overflow:auto;padding:0 6px 8px;scrollbar-width:thin;scrollbar-color:#484848 transparent}.shot-row{display:flex;width:100%;height:44px;padding:5px 8px;gap:10px;text-align:left;border:1px solid transparent;border-radius:4px;background:transparent;margin:2px 0;color:#e3e3e3}.shot-row:hover{background:#1d1d1d;border-color:transparent}.shot-row[aria-current=true]{background:#252525;border-color:#595959;color:#fff}.shot-number{width:20px;flex:none;font-size:10px;color:#b4b4b4;font-variant-numeric:tabular-nums}.shot-thumb{background-repeat:no-repeat;background-size:1200% 100%;background-color:#050505}.shot-row .shot-thumb{width:18px;height:32px;flex:none;border-radius:2px}.shot-copy{min-width:0;flex:1}.shot-title{display:block;overflow:hidden;text-overflow:ellipsis;font-size:12px;font-weight:400;line-height:17px}.shot-duration{display:block;font:9px/13px ui-monospace,SFMono-Regular,Consolas,monospace;color:#999}.shot-out{font:9px ui-monospace,SFMono-Regular,Consolas,monospace;color:#a5a5a5;flex:none;margin-left:4px}.shots-footer{margin-top:auto;display:flex;justify-content:space-between;gap:8px;padding:11px 14px;border-top:1px solid #222;color:#aaa;font-size:10px}.shots-footer span{color:#777;font-size:9px}.empty-state{padding:24px 16px;text-align:center;color:#999;font-size:11px}
/* Full-color media; only editor chrome is monochrome. */
.monitor{display:grid;grid-template-rows:34px minmax(0,1fr) 40px;min-height:0;min-width:0}.monitor-heading{display:flex;align-items:center;gap:7px;padding:0 13px;border-bottom:1px solid var(--border)}.monitor-heading h2{font-size:11px;font-weight:500;white-space:nowrap;letter-spacing:.1px}.monitor-heading h2 span{color:#b4b4b4;font-weight:400}.monitor-dot{width:4px;height:4px;flex:none;border-radius:50%;background:#ddd}.reference-dot{background:#8a8a8a}.monitor-format{margin-left:auto;color:#a5a5a5;font-size:10px}.monitor-body{display:flex;align-items:center;justify-content:center;position:relative;min-width:0;min-height:0;overflow:hidden;background:#000}#stage,#reference-stage{position:relative;aspect-ratio:9/16;flex:none;overflow:hidden;background:#000;transform:translate(var(--preview-pan-x,0px),var(--preview-pan-y,0px)) scale(var(--preview-zoom,1));transform-origin:center}canvas{display:block;width:100%;height:100%;object-fit:contain}#reference-stage .reference-source{position:absolute;width:1px;height:1px;left:0;top:0;opacity:0;pointer-events:none}#loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:12px;border-radius:4px;background:#111e;color:#ddd;font-size:11px;white-space:nowrap}#start{display:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:56px;height:56px;border-radius:50%;border:1px solid #ffffff50;background:#111c;color:#fff}#start svg{width:25px;height:25px}#start:hover{background:#303030e6}.monitor-footer{display:flex;align-items:center;gap:7px;padding:0 13px;border-top:1px solid var(--border);white-space:nowrap}.monitor-timecode{font:11px ui-monospace,SFMono-Regular,Consolas,monospace;color:#f2f2f2;font-variant-numeric:tabular-nums}.monitor-duration{font:10px ui-monospace,SFMono-Regular,Consolas,monospace;color:#999}.preview-dropdown{margin-left:auto}.preview-scale{height:26px;width:58px;padding:0 4px;justify-content:space-between;background:transparent;border-color:transparent;font-size:11px}.monitor-footer .icon-button{width:24px;height:26px}.monitor-footer svg{width:14px;height:14px}body:not(.compare) #reference-monitor{display:none}body:not(.compare) .preview-deck{grid-template-columns:1fr}
/* Read-only shot inspector */
.inspector-content{padding:18px 14px}.inspector-content h3{margin:0 0 17px;font-size:14px;font-weight:500}.shot-detail{display:flex;align-items:flex-start;gap:16px}.inspector-preview{height:228px;width:128.25px;flex:none;border:1px solid #303030;border-radius:3px;background:#000;overflow:hidden}.inspector-preview .shot-thumb{width:100%;height:100%;aspect-ratio:9/16}.inspector dl{margin:0;display:flex;flex-direction:column;gap:16px}.shot-properties{flex:1;min-width:0;padding-top:6px;gap:24px!important}.inspector dl div{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px}.inspector dt{color:#aaa}.inspector dd{margin:0;color:#eee}.inspector .shot-properties div{display:block}.shot-properties dt{margin-bottom:8px}.shot-properties dd{font:10px ui-monospace,SFMono-Regular,Consolas,monospace}.inspector-divider{height:1px;margin:22px -14px 20px;background:#262626}.inspector-content .section-label{margin:0 0 18px;font-size:12px}.sequence-properties dd{font-size:11px}.inspector-note{display:none}
/* Transport: logical groups, balanced gaps, one primary action. */
.transport{grid-column:2;display:flex;align-items:center;justify-content:center;gap:14px;min-width:0}.transport-group{display:flex;align-items:center;gap:7px}.transport button{font-size:11px}.transport .play-button{height:34px;min-width:96px;border-color:#f5f5f5;background:#f5f5f5;color:#080808;font-weight:600}.transport .play-button:hover{background:#dcdcdc;border-color:#dcdcdc}.pause-icon{display:none}#play[data-playing=true] .play-icon{display:none}#play[data-playing=true] .pause-icon{display:block}.sound-icon{display:none}#sound[aria-pressed=true] .mute-icon{display:none}#sound[aria-pressed=true] .sound-icon{display:block}.timecode-input{width:110px;height:32px;padding:6px 9px;border:1px solid #333;border-radius:4px;background:#101010;color:#eee;font:11px ui-monospace,SFMono-Regular,Consolas,monospace;font-variant-numeric:tabular-nums;text-align:center}.timecode-input[aria-invalid=true]{border-color:#f5f5f5;border-style:dashed}.transport #speed{width:60px;padding:0 7px}.transport #compare,.transport #fullscreen{padding:0 10px;height:32px}.transport svg{width:14px;height:14px}
/* Sequence timeline */
.timeline-panel{margin:0 16px;border-radius:6px;min-height:0;display:flex;flex-direction:column}.timeline-toolbar{height:36px;flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 13px;border-bottom:1px solid var(--border)}.timeline-toolbar>div{display:flex;align-items:center;gap:9px}.timeline-toolbar h2{font-size:11px;font-weight:500}.sequence-icon{color:#888;font-size:16px}.timeline-tools{gap:10px!important;color:#b4b4b4;font-size:10px}.timeline-tools .zoom-minus,.timeline-tools .zoom-plus{font-size:13px;color:#888}.timeline-tools button{height:25px;padding:0 8px;border-color:transparent;background:transparent;font-size:10px}.timeline-tools button:hover{background:#292929}.timeline-tools svg{width:13px;height:13px}#timeline-zoom{appearance:none;width:110px;height:3px;margin:0 2px;border:0;border-radius:2px;background:#5a5a5a;cursor:pointer;accent-color:#f5f5f5}#timeline-zoom::-webkit-slider-thumb{appearance:none;width:13px;height:13px;border:0;border-radius:50%;background:#f5f5f5}#timeline-zoom::-moz-range-thumb{width:13px;height:13px;border:0;border-radius:50%;background:#f5f5f5}.timeline-grid{display:grid;grid-template-columns:160px minmax(0,1fr);flex:1;min-height:0}.track-labels{border-right:1px solid var(--border);background:#101010}.ruler-label{height:32px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid var(--border);font-size:8px;letter-spacing:.5px;color:#a1a1a1}.ruler-label span:last-child{font-size:9px;letter-spacing:0;color:#888}.track-label{display:flex;align-items:center;gap:9px;height:var(--type-row-height,34px);padding:0 12px;border-bottom:1px solid #252525;color:#ddd;font-size:10px}.track-label.scene-track-label{height:var(--scene-row-height,58px)}.track-label:last-child{height:var(--audio-row-height,64px);border-bottom:0}.track-label strong{font-weight:400}.track-label>span:last-child{display:none}.track-label svg{width:13px;height:13px;margin-left:auto;color:#999}.track-id{display:grid;place-items:center;width:24px;height:21px;border:1px solid #454545;border-radius:3px;background:#272727;color:#eee;font-size:9px;flex:none}.timeline-scroll{min-width:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#454545 #141414}.timeline-content{position:relative;min-width:100%;height:var(--timeline-content-height,188px);background:#0e0e0e;touch-action:pan-x}.ruler{height:32px;position:relative;border-bottom:1px solid var(--border);background:#111}.ruler-tick{position:absolute;top:0;height:100%;border-left:1px solid #383838;color:#aaa;font:9px ui-monospace,SFMono-Regular,Consolas,monospace;pointer-events:none}.ruler-tick span{position:absolute;top:6px;left:5px}.ruler-tick.minor{top:26px;height:5px;border-color:#2b2b2b}#scrub{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:4}#scrub:focus-visible{opacity:1;accent-color:#eee}.timeline-track{position:relative;overflow:hidden;border-bottom:1px solid #252525}.scene-track{height:var(--scene-row-height,58px)}.typography-track{height:var(--type-row-height,34px)}.audio-track{height:var(--audio-row-height,64px);border-bottom:0}.timeline-clip{position:absolute;top:5px;height:var(--scene-clip-height,48px);display:flex;align-items:center;justify-content:flex-start;gap:7px;padding:4px 6px;border:1px solid #3d3d3d;border-radius:3px;background:#232323;color:#e0e0e0;text-align:left;overflow:hidden;min-width:0}.timeline-clip:hover{background:#303030;border-color:#777}.timeline-clip[aria-current=true]{border-color:#d4d4d4;background:#2d2d2d;box-shadow:inset 0 0 0 1px #ffffff1a}.timeline-clip .shot-thumb{height:var(--scene-thumb-height,37px);width:var(--scene-thumb-width,20.8125px);flex:none;border-radius:2px}.clip-name{overflow:hidden;max-height:36px;white-space:normal;text-wrap:balance;font-size:9px;line-height:12px}.caption-clip{top:5px;height:var(--type-clip-height,24px);padding:0 6px;background:#1e1e1e;border-color:#353535;color:#bbb}.caption-clip .clip-name{display:block;max-width:100%;white-space:nowrap;text-overflow:ellipsis}.audio-clip{position:absolute;inset:5px 1px 6px;border:1px solid #414141;border-radius:3px;background:#252525;overflow:hidden;cursor:ew-resize}.audio-clip>span{position:absolute;left:8px;top:5px;z-index:1;color:#ddd;font-size:9px}.audio-clip svg{position:absolute;left:0;bottom:2px;width:100%;height:var(--waveform-height,34px);fill:none;stroke:#b5b5b5;stroke-width:1;opacity:.85}.playhead{position:absolute;top:0;bottom:0;z-index:5;width:1px;background:#f5f5f5;transform:translateX(-.5px);pointer-events:none}.playhead>span{position:absolute;top:0;left:-5px;width:11px;height:10px;clip-path:polygon(0 0,100% 0,100% 55%,50% 100%,0 55%);background:#f5f5f5}body.timeline-expanded{--timeline-height:330px}
/* Status and custom menus */
.status-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 20px;background:#0a0a0a;color:#aaa;font-size:9px}.status-bar>div:first-child{display:flex;align-items:center;gap:11px}#time{color:#bbb;font:9px ui-monospace,SFMono-Regular,Consolas,monospace;font-variant-numeric:tabular-nums}.status-divider{width:1px;height:12px;background:#3a3a3a}#scene-label{font-size:9px;color:#aaa}.frame-controls{display:flex;align-items:center;gap:6px;font-size:9px}.frame-controls input{appearance:textfield;width:42px;height:22px;padding:0 5px;border:1px solid #3c3c3c;border-radius:3px;background:#111;color:#eee;font:10px ui-monospace,SFMono-Regular,Consolas,monospace}.frame-controls input::-webkit-inner-spin-button{display:none}.keyboard-hint{font-size:9px;white-space:nowrap;color:#aaa}.keyboard-hint span{padding:0 8px;color:#555}kbd{font:inherit;color:#c3c3c3}.editor-select{position:relative;flex:none}.dropdown-trigger{gap:6px}.dropdown-trigger .chevron{width:12px;height:12px;opacity:.75}.dropdown-trigger[aria-expanded=true]{background:#282828;border-color:#777;color:#fff}.dropdown-trigger[aria-expanded=true] .chevron{transform:rotate(180deg);opacity:1}.dropdown-value{flex:1;text-align:left}.dropdown-panel{position:fixed;z-index:100;min-width:144px;max-width:calc(100vw - 16px);padding:4px;border:1px solid #444;border-radius:5px;background:#1d1d1d;box-shadow:0 8px 24px #0007;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#555 transparent}.dropdown-panel [role=option]{display:flex;justify-content:space-between;gap:16px;width:100%;height:32px;padding:0 10px;border:0;border-radius:3px;background:transparent;color:#d5d5d5;font:11px Inter,Arial,sans-serif;text-align:left}.dropdown-panel [role=option]:hover,.dropdown-panel [role=option]:focus-visible{background:#333;color:#fff;outline:none}.dropdown-panel [aria-selected=true]{color:#fff;background:#2b2b2b}.option-check{width:14px;height:14px;color:#fff;visibility:hidden}.dropdown-panel [aria-selected=true] .option-check{visibility:visible}.dropdown-panel.export-options{min-width:224px}.export-options a{display:block;padding:11px;border-radius:3px;color:#eee;font-size:12px}.export-options a:hover,.export-options a:focus-visible{background:#333;outline:none;color:#fff}.export-options small{display:block;margin-top:5px;color:#aaa;font-size:10px;line-height:1.5}.transport #speed .chevron{width:11px;height:11px}
/* Paired/individual preview fullscreen */
.exit-preview{display:none}body.preview-maximized .preview-deck{position:fixed;inset:0;z-index:30;width:100vw;height:100svh;padding:48px 16px 16px;background:#0a0a0a}body.preview-maximized .exit-preview{display:inline-flex;position:absolute;right:16px;top:9px;z-index:32;height:30px;background:#202020;font-size:11px}body.preview-maximized .exit-preview kbd{padding-left:8px;font-size:9px;color:#999}body.preview-maximized .preview-deck[data-focus=program-monitor],body.preview-maximized .preview-deck[data-focus=reference-monitor]{grid-template-columns:1fr}body.preview-maximized .preview-deck[data-focus=program-monitor] #reference-monitor,body.preview-maximized .preview-deck[data-focus=reference-monitor] #program-monitor{display:none}body.preview-maximized .preview-deck[data-focus=reference-monitor] #reference-monitor{display:grid}.preview-deck:fullscreen{height:100vh;width:100vw;background:#0a0a0a}.monitor:fullscreen{position:fixed;inset:0;height:100vh;width:100vw;border-radius:0;grid-template-rows:34px minmax(0,1fr) 40px}
@media(min-width:1750px){.workspace{grid-template-columns:var(--shots-width,308px) minmax(0,1fr) var(--inspector-width,310px)}.shot-row{height:48px}.shot-duration{font-size:10px}.inspector-preview{height:228px}}
@media(max-width:1250px){.workspace{grid-template-columns:var(--shots-width,224px) minmax(0,1fr)}.inspector{display:none}.monitor-format{display:none}.transport{gap:10px}.transport-group{gap:6px}}
@media(max-width:1000px){.workspace{grid-template-columns:var(--shots-width,196px) minmax(0,1fr);padding:12px;gap:10px}.preview-deck{gap:10px}.shot-row{gap:7px;padding:5px 6px}.shot-out,.shots-footer span{display:none}.monitor-heading{padding:0 10px}.monitor-footer{padding:0 8px;gap:5px}.monitor-duration{display:none}.transport{gap:8px}.transport #fullscreen span{display:none}.transport #fullscreen{width:32px;padding:0}.transport .play-button{min-width:80px}.transport-group{gap:4px}.timeline-panel{margin:0 12px}.timeline-grid{grid-template-columns:160px minmax(0,1fr)}}
@media(max-width:700px){:root{--timeline-height:228px}.editor{grid-template-rows:48px minmax(0,1fr) var(--timeline-height) 32px;min-height:620px}.app-bar{padding:0 12px;gap:12px}.app-brand strong{font-size:16px}.workspace-name,.bar-divider,.sequence-chip{display:none}.app-actions{gap:14px;font-size:10px}.export-menu>.dropdown-trigger{height:29px;padding:0 8px;gap:5px;font-size:10px}.export-menu>.dropdown-trigger svg{width:14px;height:14px}.workspace{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) var(--transport-height,82px);padding:8px;gap:10px}.shots-panel{display:none}.preview-deck{grid-column:1;gap:8px}.monitor{grid-template-rows:32px minmax(0,1fr) 36px}.monitor-heading{gap:5px;padding:0 7px}.monitor-heading h2{font-size:8px;letter-spacing:0}.monitor-heading h2 span{font-size:8px}.monitor-dot{width:3px;height:3px}.monitor-footer{padding:0 7px;gap:3px}.monitor-timecode{font-size:9px}.monitor-footer .icon-button{width:22px}.preview-scale{width:47px;font-size:9px;padding:0 2px;gap:3px}.preview-scale .chevron{width:10px;height:10px}.transport{grid-column:1;flex-wrap:wrap;gap:8px 14px;align-content:center}.transport-group{gap:6px}.transport .play-button{height:32px;min-width:80px}.transport button{font-size:10px}.timecode-input{width:106px;height:32px;font-size:10px}.transport .playback-options{width:100%;justify-content:center;gap:8px}.transport #compare{padding:0 9px}.transport #fullscreen{width:32px}.timeline-panel{margin:0 8px}.timeline-toolbar{height:38px;padding:0 9px;gap:8px}.timeline-toolbar h2{font-size:10px}.sequence-icon{display:none}.timeline-tools{gap:6px!important}.timeline-tools label,.timeline-tools .zoom-minus,.timeline-tools .zoom-plus{display:none}#timeline-zoom{width:56px}.timeline-tools button{padding:0 5px}.timeline-grid{grid-template-columns:84px minmax(0,1fr)}.ruler-label{padding:0 7px;font-size:7px}.ruler-label span:last-child{display:none}.track-label{padding:0 7px;gap:5px;font-size:8px}.track-id{width:20px;height:20px;font-size:8px}.track-label>svg{display:none}.track-label strong{font-size:8px}.timeline-content{height:var(--timeline-content-height,188px)}.timeline-clip{padding:3px;gap:4px}.timeline-clip .shot-thumb{width:var(--scene-thumb-width,20px);height:var(--scene-thumb-height,35.56px)}.clip-name{font-size:8px;line-height:11px}.status-bar{padding:0 10px;gap:6px}.status-bar #scene-label,.status-divider,.keyboard-hint{display:none}#time{font-size:8px}.frame-controls{font-size:8px;gap:4px}.frame-controls input{width:36px;font-size:9px}.dropdown-panel [role=option]{height:34px}.dropdown-panel.export-options{min-width:220px}body.timeline-expanded{--timeline-height:310px}body.preview-maximized .preview-deck{padding:48px 8px 8px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Sound belongs to the soundtrack layer, with one accessible toggle. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.audio-layer .layer-sound{flex:none;margin-left:auto;width:26px;height:26px;padding:0;border-color:transparent;background:transparent;color:#888}
.audio-layer .layer-sound:hover{background:#2c2c2c;color:#fff;border-color:#555}
.audio-layer .layer-sound[aria-pressed=true]{background:#252525;border-color:#666;color:#fff}
.audio-layer .layer-sound svg{width:14px;height:14px;margin:0}
@media(max-width:700px){.audio-layer{display:grid;grid-template-columns:20px minmax(0,1fr);grid-template-rows:20px 26px;gap:4px 5px;padding:6px 7px}.audio-layer .track-id{grid-column:1;grid-row:1}.audio-layer strong{grid-column:2;grid-row:1}.audio-layer .layer-sound{grid-column:1/3;grid-row:2;justify-self:center;margin:0;width:28px;height:26px}}

/* Draggable panel dividers. */
.editor,.workspace,.preview-deck{position:relative}
.panel-resizer{position:absolute;z-index:20;touch-action:none;user-select:none}
.panel-resizer.vertical{width:10px;cursor:col-resize}
.panel-resizer.horizontal{height:10px;cursor:row-resize}
.panel-resizer::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:2px;background:#444;transition:background .12s}
.panel-resizer.vertical::after{width:2px;height:30px}
.panel-resizer.horizontal::after{width:40px;height:2px}
.panel-resizer:hover::after,.resizing-panels .panel-resizer::after{background:#bdbdbd}
body.resizing-panels{user-select:none}
body.resizing-panels *{cursor:inherit!important}
.inspector{overflow:auto;scrollbar-width:thin;scrollbar-color:#454545 #101010}
.monitor.narrow .monitor-format,.monitor.narrow .monitor-duration{display:none}
.monitor.narrow .monitor-heading{padding:0 8px}
.monitor.narrow .monitor-footer{padding:0 8px;gap:5px}
.transport.compact{flex-wrap:wrap;align-content:center;gap:8px 14px}
.transport.compact .playback-options{width:100%;justify-content:center}
@media(max-width:700px){.monitor.narrow .monitor-heading,.monitor.narrow .monitor-footer{padding:0 7px}.monitor.narrow .monitor-footer{gap:3px}}

/* Native element editing, contained in the Program monitor. */
.layer-tools{display:flex;align-items:center;gap:4px;margin-left:auto}
.layer-tools button{height:23px;padding:0 6px;font-size:9px;background:transparent;border-color:transparent}
.layer-tools .layer-tool{min-width:23px;padding:0 4px}.layer-tools button[aria-pressed=true]{border-color:#555;background:#242424}
.monitor-heading .monitor-format{display:none}.monitor.narrow .layer-tools .layer-tool:first-child,.monitor.narrow .layer-tools .layer-tool:nth-child(2){display:none}
.monitor.narrow .layer-tools button:last-child,.monitor.narrow .layer-tools button:nth-child(3){font-size:0;width:22px;min-width:22px;padding:0}
.monitor.narrow .layer-tools button:last-child::after{content:'✎';font-size:13px}.monitor.narrow .layer-tools button:nth-child(3)::after{content:'≡';font-size:15px}
.layer-overlay{position:absolute;inset:0;z-index:5;touch-action:none;user-select:none}
body.preview-layer-editing #start{display:none!important}.layer-selection{position:absolute;border:0;box-shadow:inset 0 0 0 calc(1px * var(--preview-ui-scale,1)) #fff,0 0 0 calc(1px * var(--preview-ui-scale,1)) #0007;pointer-events:none}
.layer-selection-label{position:absolute;top:2px;left:2px;max-width:180px;padding:3px 5px;border-radius:2px;background:#111e;color:#fff;font:9px Inter,Arial,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:auto;cursor:move}
.layer-handle{position:absolute;width:9px;height:9px;background:#fff;border:1px solid #151515;box-shadow:0 0 0 1px #fff5;pointer-events:auto;transform:translate(-50%,-50%) scale(var(--preview-ui-scale,1))}

.layer-selection{transform-origin:center}
.layer-rotate-stem{position:absolute;left:50%;bottom:100%;width:calc(1px * var(--preview-ui-scale,1));height:calc(22px * var(--preview-ui-scale,1));background:#fff;box-shadow:0 0 0 calc(1px * var(--preview-ui-scale,1)) #0005;pointer-events:none}
.layer-selection .layer-rotate-handle{position:absolute;left:50%;top:calc(-26px * var(--preview-ui-scale,1));transform:translate(-50%,-50%) scale(var(--preview-ui-scale,1));width:13px!important;min-width:13px!important;height:13px!important;padding:0!important;border:1px solid #111!important;border-radius:50%!important;background:#fff!important;box-shadow:0 0 0 1px #fff8;pointer-events:auto;cursor:grab}
.layer-rotate-handle:active,.moving-layer .layer-rotate-handle{cursor:grabbing}.layer-selection.locked .layer-rotate-handle,.layer-selection.locked .layer-rotate-stem{display:none}
.layer-transform-fields .layer-rotation-field{grid-column:1/-1}
.handle-nw{left:0;top:0;cursor:nwse-resize}.handle-n{left:50%;top:0;cursor:ns-resize}.handle-ne{left:100%;top:0;cursor:nesw-resize}.handle-e{left:100%;top:50%;cursor:ew-resize}.handle-se{left:100%;top:100%;cursor:nwse-resize}.handle-s{left:50%;top:100%;cursor:ns-resize}.handle-sw{left:0;top:100%;cursor:nesw-resize}.handle-w{left:0;top:50%;cursor:ew-resize}
.layer-selection.locked{border:1px dashed #fff;box-shadow:0 0 0 calc(1px * var(--preview-ui-scale,1)) #0007}.layer-selection.locked .layer-handle{display:none}.moving-layer,.moving-layer *{user-select:none!important}.moving-layer .layer-overlay{cursor:move}
.alignment-guide{position:absolute;background:#fff8;pointer-events:none}.alignment-guide.vertical{left:50%;top:0;width:1px;height:100%}.alignment-guide.horizontal{top:50%;left:0;height:1px;width:100%}
.preview-text-edit{position:absolute;z-index:8;transform-origin:center;background:transparent;pointer-events:none}
.preview-text-edit input{position:absolute;left:50%;top:50%;display:block;min-width:0;margin:0;padding:0;border:0!important;border-radius:0;background:transparent!important;box-shadow:none!important;outline:none!important;text-align:center;color:transparent;-webkit-text-fill-color:transparent;caret-color:#fff;font-family:Inter,Arial,sans-serif;line-height:normal;pointer-events:auto;cursor:text;transform-origin:center;appearance:none}
.preview-text-edit input::selection{background:#3970a580;color:transparent}
.layer-panel{padding:0 0 18px;margin:0 0 18px;border-bottom:1px solid #2a2a2a}
.layer-section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.layer-section-heading h3{margin:0;font-size:12px}.layer-section-heading>span{font-size:9px;color:#888}
.layer-hint{font-size:9px;line-height:1.6;color:#999;margin-bottom:10px}
.element-layer-list{max-height:208px;overflow:auto;scrollbar-width:thin;scrollbar-color:#4b4b4b transparent;display:flex;flex-direction:column;gap:2px}
.element-layer-row{display:flex;align-items:center;border:1px solid transparent;border-radius:4px;min-height:29px}.element-layer-row:hover{background:#1e1e1e}.element-layer-row.selected{background:#2a2a2a;border-color:#666}
.element-layer-row button{height:28px;background:transparent;border:0;border-radius:3px}.element-layer-select{flex:1;min-width:0;justify-content:flex-start;padding:0 6px;gap:8px;text-align:left;font-size:10px}.element-layer-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-kind-icon{display:inline-grid;place-items:center;width:18px;flex:none;color:#aaa;font:11px ui-monospace,monospace}.element-layer-visibility{width:26px;flex:none;padding:0;color:#888;font-size:12px}
.element-layer-row .element-layer-visibility[aria-pressed=true]{color:#ccc}.layer-hidden{opacity:.45}.layer-properties{padding:14px 0 0;margin-top:12px;border-top:1px solid #2a2a2a}.selected-layer-title{display:flex;align-items:center;gap:8px;margin-bottom:13px}.selected-layer-title strong{font-size:11px;font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.selected-layer-title>span{font-size:9px;color:#999;margin-left:auto;text-transform:uppercase}
.layer-transform-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px}.layer-transform-fields label{display:flex;align-items:center;gap:8px;font-size:10px;color:#999}.layer-transform-fields input{width:100%;min-width:0;height:28px;padding:0 7px;border:1px solid #3a3a3a;border-radius:3px;background:#0a0a0a;color:#eee;font:10px ui-monospace,monospace;appearance:textfield}.layer-transform-fields input::-webkit-inner-spin-button{display:none}
.layer-text-label{display:block;margin:12px 0;font-size:10px;color:#aaa}.layer-text-label input{display:block;width:100%;margin-top:6px;height:30px;min-width:0;padding:0 8px;border:1px solid #4b4b4b;border-radius:3px;background:#0a0a0a;color:#eee;font:11px Inter,Arial,sans-serif}
.layer-property-actions{display:flex;gap:5px;flex-wrap:wrap;margin-top:12px}.layer-property-actions button{height:25px;padding:0 7px;font-size:9px}.layer-property-note{font-size:9px;color:#999;line-height:1.6;margin-top:10px}.editing-layer .shot-detail{display:none}.inspector-content .inspector-preview{height:144px;width:81px}
.layer-drawer{position:fixed;z-index:55;right:12px;top:54px;width:290px;max-width:calc(100vw - 24px);max-height:calc(100svh - 110px);overflow:auto;padding:12px;background:#121212;border:1px solid #555;border-radius:6px;box-shadow:0 8px 28px #0008}.layer-drawer-heading{display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid #333}.layer-drawer-heading strong{font-size:12px;font-weight:500}.layer-drawer-heading button{height:24px;width:24px;padding:0;font-size:16px}.layer-drawer .layer-panel{margin:0;border:0;padding:0}
/* One native scroll surface moves the labels and media rows together. */
.timeline-grid{display:block;--timeline-label-width:160px}.timeline-scroll{height:100%;overscroll-behavior:contain;overflow-anchor:none}.timeline-content{display:grid;grid-template-columns:var(--timeline-label-width) minmax(0,1fr);touch-action:pan-x pan-y}.timeline-lanes{position:relative;min-width:0}.track-labels{position:sticky;left:0;z-index:10;overflow:visible;align-self:stretch}.element-tracks,.element-track-labels{display:none}
body.layer-timeline-active .element-tracks,body.layer-timeline-active .element-track-labels{display:block}
body.layer-timeline-active .typography-track,body.layer-timeline-active .aggregate-type-label{display:none}
body.layer-timeline-active .timeline-content{height:calc(154px + var(--layer-count,0)*32px);min-height:100%}
body.layer-timeline-active .scene-track,body.layer-timeline-active .scene-track-label{height:58px}
body.layer-timeline-active .scene-track .timeline-clip{height:48px}body.layer-timeline-active .scene-track .shot-thumb{height:37px;width:20.8125px}
body.layer-timeline-active .audio-track,body.layer-timeline-active .audio-layer{height:64px}
body.layer-timeline-active .audio-clip svg{height:34px}
.element-track{height:32px;position:relative;border-bottom:1px solid #252525;background:#101010}.element-track-label{display:flex;align-items:center;justify-content:flex-start;gap:6px;height:32px;width:100%;padding:0 10px;border:0;border-bottom:1px solid #252525;border-radius:0;background:#111;color:#bbb;font-size:9px;overflow:hidden;text-align:left}.element-track-label>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.element-track-label[aria-pressed=true]{background:#292929}
.element-clip{position:absolute;top:4px;height:24px;min-width:0;padding:0 6px;border:1px solid #414141;border-radius:3px;background:#222;color:#bbb;font-size:9px;justify-content:flex-start;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.element-clip[aria-pressed=true]{background:#353535;color:#fff;border-color:#eee}
.layer-track-count{color:#ccc;padding-right:8px;border-right:1px solid #333;white-space:nowrap}.layer-shot-number{flex:none;width:16px;color:#777;font:8px ui-monospace,monospace}.current-layer-shot .layer-shot-number{color:#eee}.element-track-label.layer-shot-start,.element-track.layer-shot-start{border-top:1px solid #414141}.layer-shot-heading{padding:12px 6px 6px;font-size:9px;color:#888}.layer-shot-heading:first-child{padding-top:4px}.layer-shot-heading.current-layer-shot{color:#eee}
body.layer-timeline-active .ruler,body.layer-timeline-active .ruler-label{position:sticky;top:0;z-index:8;background:#111}
body.layer-timeline-active .scene-track,body.layer-timeline-active .scene-track-label{position:sticky;top:32px;z-index:7;background:#101010;box-shadow:0 1px #333}
body.layer-timeline-active .audio-track,body.layer-timeline-active .audio-layer{position:sticky;bottom:0;z-index:6;background:#101010;border-top:1px solid #3a3a3a}
body.layer-timeline-active .playhead{z-index:9}body.layer-timeline-active .playhead>span{position:sticky;top:0;left:auto;margin-left:-5px;display:block}
@media(max-width:700px){.layer-tools{gap:2px}.timeline-toolbar h2{max-width:80px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.timeline-tools{gap:4px!important}.layer-track-count{padding-right:4px;font-size:8px}.element-track-label{padding:0 5px;gap:2px;font-size:8px}.element-track-label .layer-kind-icon{width:14px}.layer-shot-number{width:12px;font-size:7px}.element-clip{font-size:8px;padding:0 4px}}
@media(max-width:700px){.timeline-grid{--timeline-label-width:84px}}
.export-options>button[role=menuitem]{display:block;width:100%;height:auto;padding:11px;border:0;border-radius:3px;background:transparent;color:#eee;text-align:left;font-size:12px;white-space:normal}.export-options>button[role=menuitem]:hover{background:#333}

/* Quiet, borderless surfaces. Invisible borders retain exact track/control sizes. */
.editor :where(button,input,.panel,.app-bar,.panel-heading,.shot-search,.shots-footer,.monitor-heading,.monitor-footer,.inspector-preview,.timeline-toolbar,.track-labels,.ruler-label,.track-label,.track-id,.ruler,.timeline-track,.timeline-clip,.audio-clip,.layer-panel,.element-layer-row,.layer-properties,.element-track,.element-track-label,.element-clip,.layer-track-count),
.dropdown-panel,.preview-text-edit,.layer-drawer,.layer-drawer-heading{border-color:transparent!important}
.editor :is(.timeline-clip,.scene-track,.scene-track-label){box-shadow:none!important}
.bar-divider,.status-divider,.inspector-divider{background:transparent}
.timeline-clip[aria-current=true]{background:#343434;color:#fff}
.element-clip[aria-pressed=true]{background:#3a3a3a;color:#fff}
.element-layer-row.selected{background:#292929}
.editor input[aria-invalid=true]{background:#2b2b2b;color:#fff}

/* The hand tool changes preview framing only. */
.preview-pan-ready,.preview-pan-ready *{cursor:grab!important;touch-action:none;user-select:none!important}.preview-panning,.preview-panning *,.panning-preview,.panning-preview *{cursor:grabbing!important;user-select:none!important}

/* Property keyframes share the native frame clock and timeline scroll surface. */
.layer-transform-fields label{gap:4px}.layer-transform-fields input{flex:1;width:1px}
.layer-transform-fields .keyframe-toggle{flex:none;width:24px;min-width:24px;height:26px;padding:0;background:transparent;color:#888;font-size:15px}
.keyframe-toggle.animated{color:#eee}.keyframe-toggle[aria-pressed=true]{background:#333;color:#fff}
.keyframe-panel{margin-top:14px;padding-top:12px;border-top:1px solid #292929;font-size:10px}
.keyframe-heading{display:flex;align-items:center;gap:5px}.keyframe-heading strong{font-weight:500}.keyframe-time{margin-left:auto;color:#aaa;font:9px ui-monospace,monospace}.keyframe-heading button{width:25px;height:23px;padding:0;font-size:16px}
.keyframe-hint,.keyframe-message{margin:8px 0;color:#999;font-size:9px;line-height:1.6}.keyframe-message:empty{display:none}
.keyframe-list{display:flex;flex-wrap:wrap;gap:4px;max-height:106px;overflow:auto;scrollbar-width:thin}
.keyframe-list .keyframe-row{height:24px;padding:0 6px;background:#1b1b1b;font:9px ui-monospace,monospace}
.keyframe-row[aria-pressed=true],.keyframe-eases button[aria-pressed=true]{background:#eee;color:#111}
.keyframe-details{margin-top:10px;display:flex;flex-wrap:wrap;align-items:center;gap:6px}.keyframe-details[hidden]{display:none}
.keyframe-details label{display:flex;align-items:center;gap:7px;color:#aaa}.keyframe-frame{width:64px;height:26px;padding:0 6px;background:#090909;color:#eee;font:10px ui-monospace,monospace}
.keyframe-details>button{height:26px;padding:0 8px;font-size:9px}.keyframe-eases{display:flex;flex-wrap:wrap;gap:4px;width:100%}.keyframe-eases button{height:25px;padding:0 6px;font-size:9px}
.keyframe-markers{position:absolute;inset:0;pointer-events:none;z-index:2}
.keyframe-markers .keyframe-marker{position:absolute;top:8px;transform:translateX(-50%);height:17px;width:17px;min-width:17px;padding:0;border:0;background:#222;color:#bbb;pointer-events:auto;touch-action:none;font-size:12px;cursor:ew-resize}
.keyframe-marker[aria-pressed=true]{background:#eee;color:#111}.keyframe-marker:disabled{cursor:default;opacity:.5}
.element-clip:has(+.keyframe-markers .keyframe-marker){padding-left:18px}