@font-face{font-family:Studio;src:url('/fonts/Arimo.ttf') format('truetype');font-weight:100 900;font-display:swap}
@font-face{font-family:Mono;src:url('/fonts/Cousine-Regular.ttf');font-display:swap}
:root{font-family:Studio,Arial,sans-serif;color-scheme:dark;color:#e7ecef;background:#080a0c;letter-spacing:0;font-synthesis:none;--muted:#929da5;--cyan:#a2dfe5;--line:#292d32;--sidebar:320px;--desk-height:134px}
*{box-sizing:border-box}html{height:100%}body{margin:0;height:100dvh;min-height:560px;display:grid;grid-template-columns:minmax(0,1fr) var(--sidebar);grid-template-rows:58px minmax(0,1fr) var(--desk-height);grid-template-areas:'toolbar toolbar' 'preview inspector' 'controls controls';overflow:hidden;background:#080a0c}
button,input,a,select{outline-offset:4px;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:transparent}button:hover{background:#ffffff0a;color:#fff}button:disabled{opacity:.3;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cyan)}button[aria-pressed=true]{color:var(--cyan)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
button svg{width:18px;height:18px;stroke-width:1.65;display:block}.icon{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:4px}
.workspace-header{grid-area:toolbar;display:flex;align-items:center;gap:24px;padding:0 20px;border-bottom:1px solid var(--line);background:#101215;min-width:0;position:relative;z-index:20}
.workspace-brand{display:flex;align-items:center;gap:11px;flex-shrink:0}.workspace-brand img{display:block}.workspace-brand div{display:grid;gap:3px}.workspace-brand strong{font-size:14px;font-weight:600;white-space:nowrap}.workspace-brand span{font-size:10px;color:#8d9ba3}
.scene-picker{position:relative;display:flex;align-items:center;min-width:0;flex:1}
.scene-trigger{width:224px;max-width:100%;height:42px;display:grid;grid-template-columns:20px minmax(0,1fr) 16px;align-items:center;gap:10px;padding:5px 12px;border:1px solid #354149;border-radius:5px;background:#1a2329;text-align:left}
.scene-trigger:hover,.scene-trigger[aria-expanded=true]{background:#222f36;border-color:#688c97}.scene-trigger:disabled{opacity:.6}
.scene-current-copy{display:grid;gap:2px;min-width:0}.scene-current-copy strong{font-size:13px;line-height:16px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scene-current-copy small{font-size:10px;line-height:12px;color:#8fa5b1}
.effect-symbol{display:flex;align-items:center;justify-content:center;color:#9ecbd5}.effect-symbol svg,.scene-chevron{width:16px;height:16px}.scene-chevron{color:#9eafb8;transition:transform .16s ease}.scene-trigger[aria-expanded=true] .scene-chevron{transform:rotate(180deg)}
.scene-menu{position:absolute;left:0;top:calc(100% + 8px);z-index:40;width:420px;max-width:calc(100vw - 24px);max-height:min(560px,calc(100dvh - 80px));overflow-y:auto;overscroll-behavior:contain;padding:8px;border:1px solid #3b4952;border-radius:6px;background:#141b20;box-shadow:0 16px 48px #0009;scrollbar-width:thin;scrollbar-color:#43515b transparent}
.scene-search{position:relative;display:flex;align-items:center;margin:0 0 6px}.scene-search>svg{position:absolute;left:11px;width:15px;height:15px;color:#80959f;pointer-events:none}.scene-search input{width:100%;height:38px;padding:0 38px 0 34px;border:1px solid #34424b;border-radius:4px;background:#0e1519;color:#e1edf0;font:12px Studio,sans-serif}.scene-search input::placeholder{color:#8499a4}.scene-search input::-webkit-search-cancel-button{-webkit-appearance:none}.scene-search .icon{position:absolute;right:5px;width:28px;height:28px;color:#94a9b3}.scene-search .icon svg{width:14px;height:14px}
.effect-group+.effect-group{margin-top:7px;padding-top:7px;border-top:1px solid #ffffff0d}.effect-group-label{padding:6px 9px;font-size:10px;line-height:14px;font-weight:500;color:#8097a3}.effect-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px}
.effect-option{display:grid;grid-template-columns:18px minmax(0,1fr) 14px;align-items:center;gap:9px;min-height:36px;padding:7px 9px;border:1px solid transparent;border-radius:4px;text-align:left;color:#c6d1d8;font-size:12px;line-height:18px}.effect-option:hover{background:#ffffff08}.effect-option.active{background:#263940;border-color:#4a6873;color:#d9f5f8}.effect-option:focus-visible{outline-offset:-2px}.effect-label{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.effect-check{display:flex;align-items:center;justify-content:center;visibility:hidden}.effect-check svg{width:14px;height:14px}.effect-option.active .effect-check{visibility:visible}#scene-empty{margin:20px 12px;font-size:12px;color:#99adb8;text-align:center}
.top-actions{display:flex;align-items:center;gap:2px;flex-shrink:0}.top-actions .icon{color:#a7b2ba}.action-divider{height:18px;width:1px;background:var(--line);margin:0 8px}
#preview-shell{grid-area:preview;position:relative;overflow:hidden;min-width:0;min-height:0;background:#000}
#preview-shell:fullscreen{width:100%;height:100%;background:#000}
.preview-status{position:absolute;inset:0 0 auto;height:28px;display:flex;align-items:center;justify-content:flex-end;padding:0 12px;background:#101215;border-bottom:1px solid var(--line);color:#9eabb5;font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}
#preview-fps{min-width:68px;text-align:right}
#preview-viewport{position:absolute;inset:28px 0 0;overflow:hidden}
.clean .preview-status{display:none}.clean #preview-viewport{inset:0}
#inspector{grid-area:inspector;min-width:0;min-height:0;overflow-y:auto;overscroll-behavior:contain;background:#111417;border-left:1px solid var(--line);scrollbar-width:thin;scrollbar-color:#3e454c transparent}
.panel{padding:22px 20px;min-width:0;border-bottom:1px solid var(--line)}.panel:focus{outline:none}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}.panel-heading h2{margin:0;font-size:14px;font-weight:600;line-height:1.4}.panel-heading>svg{width:16px;height:16px;color:#76858e}.panel-heading h2 span{font:10px Mono,monospace;color:#8d9ba3;margin-left:8px}
.palette{display:block;min-width:0;border:0;padding:0;margin:0 0 24px}.palette legend{font-size:12px;color:#a5b1b9;margin-bottom:12px}#palette-options{display:grid;grid-template-columns:repeat(4,minmax(0,32px));gap:14px 10px;max-width:100%}.swatch{width:100%;max-width:32px;aspect-ratio:1;border-radius:50%;border:4px solid #111417;outline:1px solid #4a5058;background:conic-gradient(var(--palette-colors))}.swatch.active{outline:2px solid #d7e9ed;outline-offset:2px}.swatch.glacier{background:conic-gradient(#88e7ed,#cbdfed,#fa9873,#88e7ed)}.swatch.ember{background:conic-gradient(#ed6748,#ffc378,#f5dcce,#ed6748)}.swatch.silver{background:conic-gradient(#c9d9e1,#78929e,#f5fbff,#c9d9e1)}.palette-caption{display:grid;gap:4px;margin-top:14px;min-height:34px;font-size:11px;line-height:15px;color:#bccbd2;overflow-wrap:anywhere}.palette-caption small{font:10px Mono,monospace;color:#8d9ba3}
.settings-group{display:grid;gap:20px}.setting{display:grid;grid-template-columns:1fr auto;gap:9px;font-size:12px;color:#bdc7ce;min-width:0}.setting output{font:11px Mono,monospace;color:#b6d8de;min-width:34px;text-align:right}.setting input{grid-column:1/-1;width:100%}
input[type=range]{appearance:none;-webkit-appearance:none;background:linear-gradient(to right,#a3c9d0 var(--progress,0%),#ffffff20 var(--progress,0%));height:3px;min-width:0;border-radius:0;cursor:pointer;margin:8px 0;accent-color:#b9e5ed}input[type=range]::-webkit-slider-thumb{appearance:none;width:10px;height:10px;background:#deeff2;border-radius:50%}input[type=range]::-moz-range-thumb{width:10px;height:10px;background:#deeff2;border:0;border-radius:50%}
.toggles{gap:17px;padding:23px 0;border-block:1px solid var(--line);margin:24px 0 16px}.toggle-setting{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:#bdc7ce;cursor:pointer}.toggle-setting input{position:absolute;opacity:0}.toggle-setting span{position:relative;width:30px;height:17px;border-radius:12px;background:#3a424a;flex-shrink:0}.toggle-setting span:before{content:'';position:absolute;width:11px;height:11px;left:3px;top:3px;border-radius:50%;background:#c6d8df}.toggle-setting input:checked+span{background:#417c88}.toggle-setting input:checked+span:before{transform:translateX(13px);background:#efffff}.toggle-setting input:focus-visible+span{outline:2px solid var(--cyan)}
.settings-actions{display:grid;gap:12px}.reset{display:flex;align-items:center;justify-content:center;gap:8px;color:#929fa8;padding:8px;font-size:11px;border-radius:4px}.reset svg{width:14px;height:14px}.primary-action{display:flex;justify-content:center;align-items:center;gap:9px;min-height:40px;border:1px solid #51727a;border-radius:4px;background:#263c43;color:#d7eef2;font-size:13px;font-weight:500}.primary-action:hover{background:#314a52}
.library{padding-bottom:14px}.library .panel-heading{margin-bottom:10px}.file-button{position:relative;cursor:pointer;color:#a7bbc4}.file-button:hover{background:#ffffff0a}.file-button input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}.file-button:focus-within{outline:2px solid var(--cyan)}.file-button svg{width:17px;height:17px}
.tracks{display:grid;gap:3px;max-height:224px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#3e454c transparent}.track{display:grid;grid-template-columns:42px minmax(0,1fr) 40px;gap:9px;align-items:center;text-align:left;padding:7px 8px;min-height:58px;border-radius:4px}.track:focus-visible{outline-offset:-2px}.track-cover{width:42px;height:42px;display:block;object-fit:cover;border-radius:3px;background:#151a20}.track-copy{display:grid;gap:3px;min-width:0}.track-copy strong{font-size:12px;font-weight:500;line-height:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-copy small,.track time{color:#8b9ba5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-copy small{font:10px Studio,Arial,sans-serif;line-height:14px}.track time{font:10px Mono,monospace;line-height:16px;text-align:right;font-variant-numeric:tabular-nums}.track.active{background:#263239;color:#c3edf1}.track.active .track-copy small{color:#a5c4cc}
#controls{grid-area:controls;min-width:0;height:var(--desk-height);display:grid;grid-template-rows:minmax(0,1fr) 26px;background:#101316;border-top:1px solid var(--line)}
.player{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:7px 24px;padding:13px 24px 8px;min-width:0;min-height:0}.now-playing{display:flex;align-items:center;gap:13px;min-width:0}.track-number{font:12px Mono,monospace;color:#79939e;border-left:1px solid #77c5d15c;height:39px;display:flex;align-items:center;padding-left:12px;flex-shrink:0}.track-copy{min-width:0}.eyebrow{display:block;color:#8399a5;font-size:9px;line-height:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-copy h1{margin:3px 0;font-size:18px;font-weight:500;line-height:21px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-subtitle{display:none}.tiny-spectrum{height:30px;display:flex;align-items:center;gap:2px;margin-left:6px;flex-shrink:0}.tiny-spectrum span{height:3px;width:2px;background:#86d5e3}
.transport{display:flex;gap:7px;align-items:center;justify-content:center}.transport .icon svg{width:18px;height:18px}.play{width:42px;height:42px;border-radius:50%;background:#e4f0f3;color:#101c24;display:flex;align-items:center;justify-content:center;margin:0 5px;flex-shrink:0}.play:hover{background:#fff;color:#101c24}.play svg{width:21px;height:21px}
.volume{display:flex;justify-self:end;align-items:center;gap:8px}.volume input{width:112px}.timeline,.fullscreen-timeline{display:flex;align-items:center;gap:12px;font:10px Mono,monospace;color:#91a7b4;min-width:0}.timeline{grid-column:1/-1}.timeline time,.fullscreen-timeline time{width:38px;flex-shrink:0}.timeline time:last-child,.fullscreen-timeline time:last-child{text-align:right}.timeline input,.fullscreen-timeline input{flex:1;min-width:0}
.credit-strip{display:flex;justify-content:space-between;align-items:center;gap:12px;height:26px;min-height:26px;padding:0 24px;border-top:1px solid #ffffff09;overflow:hidden}#map-credit{font-size:10px;color:#72868f;margin:0;line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#map-credit a{color:inherit;text-decoration:underline;text-underline-offset:2px}.scene-caption{display:flex;align-items:center;gap:7px;font-size:10px;color:#879aa5;margin-left:auto;white-space:nowrap;min-width:0}.scene-caption #scene-name{overflow:hidden;text-overflow:ellipsis}.signal-dot{width:5px;height:5px;background:#91dbe9;border-radius:50%;flex-shrink:0}.caption-divider{width:1px;height:10px;background:var(--line);margin:0 3px;flex-shrink:0}.is-playing .signal-dot{animation:breathe 2s ease-in-out infinite}@keyframes breathe{50%{opacity:.35}}
#notice{position:fixed;left:24px;bottom:calc(var(--desk-height) + 16px);max-width:min(520px,calc(100vw - 48px));padding:13px 16px;color:#efd2b9;background:#29201b;border:1px solid #71513b;border-radius:5px;font-size:13px;line-height:1.5;z-index:30;box-shadow:0 8px 28px #0005}
.fullscreen-controls,#fullscreen-hotspot{display:none}#preview-shell:fullscreen .fullscreen-controls,.clean #preview-shell .fullscreen-controls{display:block;position:absolute;left:32px;right:32px;bottom:24px;max-width:1200px;margin:auto;padding:12px 18px 14px;border:1px solid #ffffff25;border-radius:6px;background:#11171de8;backdrop-filter:blur(18px);color:#e7ecef;z-index:10;opacity:0;visibility:hidden;transform:translateY(14px);pointer-events:none;transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
#preview-shell.controls-visible .fullscreen-controls{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;transition-delay:0s}
#preview-shell:fullscreen #fullscreen-hotspot,.clean #preview-shell #fullscreen-hotspot{display:block;position:absolute;left:0;right:0;bottom:0;height:100px;z-index:9}
.fullscreen-main{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:18px;align-items:center;margin-top:10px}.fullscreen-track{min-width:0;display:grid;gap:5px}.fullscreen-track strong{font-size:15px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fullscreen-track span{font-size:11px;color:#8fa5b1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fullscreen-navigation{display:flex;gap:8px;align-items:center;justify-content:flex-end;min-width:0}.fullscreen-navigation select{font:12px Studio,sans-serif;min-width:0;max-width:140px;padding:8px 28px 8px 10px;color:#d2e8ed;background:#1f2b33;border:1px solid #4a5b67;border-radius:4px}.fullscreen-navigation input{width:70px}
body.clean #preview-shell{position:fixed;inset:0;z-index:50;width:100vw;height:100dvh}.clean .workspace-header,.clean #inspector,.clean #controls{visibility:hidden}
.select-field{position:relative;display:block;min-width:0}.select-field select{appearance:none;-webkit-appearance:none;padding-right:40px!important;cursor:pointer}.select-field>svg{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:14px;height:14px;pointer-events:none;color:#a5bec8}.select-field:has(select:disabled)>svg{opacity:.35}
#export-dialog{width:480px;max-width:calc(100vw - 32px);border:1px solid #3c4952;border-radius:8px;background:#11171c;color:#e7eff4;padding:22px}#export-dialog::backdrop{background:#000b}.export-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.export-heading h2{font-size:20px;line-height:28px;font-weight:500;margin:0}#export-fields{border:0;padding:0;margin:22px 0;display:grid;grid-template-columns:1.4fr 1fr;gap:14px}#export-fields label{display:grid;gap:8px;font-size:13px;color:#abc0cc;min-width:0}#export-fields select{width:100%;min-width:0;height:42px;padding:0 40px 0 12px;border:1px solid #435661;border-radius:4px;background:#1a242c;color:#e7eff4;font:14px Studio,sans-serif}#export-progress{appearance:none;width:100%;height:4px;border:0;border-radius:2px;background:#2a343c;accent-color:#98e1ed}#export-progress::-webkit-progress-bar{background:#2a343c;border-radius:2px}#export-progress::-webkit-progress-value{background:#98e1ed;border-radius:2px}#export-progress::-moz-progress-bar{background:#98e1ed;border-radius:2px}#export-status{font-size:13px;line-height:1.5;color:#abc0cc;min-height:40px;overflow-wrap:anywhere}.export-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px}.export-actions button,.export-actions a{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:10px 14px;border-radius:4px;background:#203640;color:#d9f1f6;font:14px Studio,sans-serif;text-decoration:none}.export-actions svg{width:17px;height:17px}.export-renderer{position:fixed;left:-20000px;top:0;width:1920px;height:1080px;border:0;pointer-events:none}
.aspect-options{border:0;border-bottom:1px solid var(--line);padding:0 0 20px;margin:0 0 22px;min-width:0}.aspect-options legend{padding:0;margin-bottom:12px;font-size:12px;color:#d3dde2}.aspect-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.aspect-grid button{height:58px;display:grid;grid-template-rows:20px 14px;align-content:center;justify-items:center;align-items:center;gap:4px;padding:8px 6px;border:1px solid #ffffff18;border-radius:4px;color:#93a4af;font:11px Mono,monospace}.aspect-grid button[aria-pressed=true]{background:#26373c;border-color:#91cbd4;color:#e3f6f8}.aspect-grid button:hover{background:#ffffff09}.aspect-grid .aspect-shape{display:block;height:16px;aspect-ratio:var(--ratio);max-width:37px;border:1px solid currentColor;border-radius:1px}.aspect-label{font-size:11px;line-height:14px}#export-format{font-size:13px;color:#98bcc8;margin:8px 0 0}
@media(max-width:1100px){:root{--sidebar:288px}.workspace-header{gap:14px;padding-inline:14px}.workspace-brand strong{font-size:13px}.scene-picker button{padding-inline:10px}.top-actions{gap:0}.top-actions .icon{width:32px}.action-divider{margin-inline:4px}.tiny-spectrum{display:none}.fullscreen-track span{display:none}.fullscreen-navigation input{width:52px}}
@media(max-width:800px){body{min-height:660px;grid-template-columns:minmax(0,1fr);grid-template-rows:98px minmax(180px,1fr) 210px var(--desk-height);grid-template-areas:'toolbar' 'preview' 'inspector' 'controls'}.workspace-header{display:grid;grid-template-columns:1fr auto;grid-template-rows:48px 44px;gap:0 12px;padding:0 12px}.workspace-brand span{display:block}.workspace-header .scene-picker{grid-column:1/-1;grid-row:2;align-self:start}.top-actions{grid-row:1;grid-column:2}#inspector{border-left:0;border-top:1px solid var(--line)}.panel{padding:18px}.settings{display:grid;grid-template-columns:1fr 1fr;gap:18px}.settings .panel-heading,.settings .settings-actions{grid-column:1/-1;margin:0}.settings .palette{margin:0;align-self:start}.settings-group{gap:12px}.toggles{grid-column:1/-1;display:flex;justify-content:space-between;padding:14px 0;margin:0}.toggle-setting{flex:1}.toggle-setting+ .toggle-setting{margin-left:20px}.settings-actions{grid-template-columns:1fr 1fr}.tracks{max-height:200px}.player{gap:6px 10px;padding:11px 14px 6px;grid-template-columns:minmax(0,1fr) auto}.now-playing{grid-column:1;grid-row:1}.track-copy h1{font-size:15px}.transport{gap:2px;grid-column:2;grid-row:1}.transport .icon{width:30px}.transport .play{width:36px;height:36px;margin-inline:3px}.player .volume{display:none}.timeline{grid-row:2;grid-column:1/-1}.credit-strip{padding-inline:14px;gap:6px}#map-credit{font-size:9px;max-width:60%}.scene-caption{font-size:9px}.scene-caption #scene-name,.caption-divider{display:none}.fullscreen-main{grid-template-columns:minmax(0,1fr) auto;gap:10px}.fullscreen-track{display:none}.fullscreen-main .transport{grid-row:1;grid-column:1;justify-content:flex-start}.fullscreen-navigation{grid-column:2;grid-row:1;gap:2px}.fullscreen-navigation input{display:none}.fullscreen-navigation select{max-width:102px}#preview-shell:fullscreen .fullscreen-controls,.clean #preview-shell .fullscreen-controls{left:12px;right:12px;bottom:12px;padding:9px 10px}.fullscreen-main .transport .icon{width:30px}}
@media(prefers-reduced-motion:reduce){.is-playing .signal-dot{animation:none}.fullscreen-controls{transition:none!important}}
@media(max-width:800px){.settings .aspect-options{grid-column:1/-1;margin:0;padding-bottom:14px}.aspect-grid{grid-template-columns:repeat(7,minmax(0,1fr))}.aspect-grid button{height:48px;font-size:10px}.aspect-grid span{height:13px;max-width:29px}}

/* Independent inspector columns release their space back to the preview. */
body{--library-space:280px;--settings-space:304px;--sidebar:calc(var(--library-space) + var(--settings-space))}
body.library-hidden{--library-space:0px}body.settings-hidden{--settings-space:0px}
#inspector{display:grid;grid-template-columns:var(--library-space) var(--settings-space);overflow:hidden;border-left:0}
#library{grid-column:1;grid-row:1;display:flex;flex-direction:column;overflow:hidden}
#settings{grid-column:2;grid-row:1;overflow-y:auto;overscroll-behavior:contain}
#inspector>.panel{height:100%;min-height:0;padding:20px 16px;border-bottom:0;border-left:1px solid var(--line);scrollbar-width:thin;scrollbar-color:#3e454c transparent}
#library .panel-heading{flex-shrink:0;min-height:28px;margin-bottom:14px}
#library .tracks{flex:1;min-height:0;max-height:none;align-content:start}.library-actions{display:flex;align-items:center;gap:2px}.track-row{display:grid;grid-template-columns:minmax(0,1fr) 30px;align-items:center;border-radius:4px;min-width:0}.track-row.active{background:#263239}.track-row .track{min-width:0;width:100%}.track-row .track-remove{width:28px;height:28px;color:#81919b}.track-remove svg{width:14px;height:14px}.track-row .track-remove:hover{color:#ffc1ba;background:#66353266}.library-empty{font-size:12px;line-height:1.7;color:#8b9ba5;margin:16px 0}
#library{position:relative;transition:background-color 120ms,box-shadow 120ms}#library.is-file-drop{background-color:#132127;box-shadow:inset 0 0 0 1px #8cd5df99}
#inspector>#library{padding-bottom:0}
#settings>.panel-heading{min-height:28px;margin-bottom:14px}.settings-export{width:100%;margin:0 0 22px}
.top-actions .icon[aria-pressed=true]{background:#26363d;color:#bceaf0}
@media(min-width:801px) and (max-width:1200px){body{--library-space:240px;--settings-space:280px}body.library-hidden{--library-space:0px}body.settings-hidden{--settings-space:0px}}
@media(max-width:800px){
  body{--library-space:1fr;--settings-space:1fr;grid-template-rows:98px minmax(180px,1fr) 210px var(--desk-height)}
  body.library-hidden{--library-space:0px}body.settings-hidden{--settings-space:0px}
  body.library-hidden.settings-hidden{grid-template-rows:98px minmax(180px,1fr) 0px var(--desk-height)}
  #inspector{border-top:1px solid var(--line);grid-template-columns:minmax(0,var(--library-space)) minmax(0,var(--settings-space))}
  #inspector>.panel{padding:14px 10px}#settings{display:block}
  .aspect-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.aspect-grid button{font-size:10px;height:45px}
  .settings .aspect-options{margin-bottom:20px}.settings .palette{margin-bottom:20px}.settings-group{gap:20px}
  .toggles{display:grid;margin:20px 0 14px;padding:18px 0}.toggle-setting+.toggle-setting{margin-left:0}.track{padding:7px 4px;gap:5px;grid-template-columns:36px minmax(0,1fr) 34px}.track-cover{width:36px;height:36px}.track-copy strong{font-size:11px}.track-copy small,.track time{font-size:9px}
}

@media(max-width:1100px){.scene-picker .effect-option{padding:7px 9px}.scene-picker .scene-search .icon{padding:0}}
@media(max-width:800px){
  .scene-menu{max-height:calc(100dvh - 112px)}
  .aspect-grid button{height:52px;padding:5px 4px}
  .aspect-grid .aspect-label{height:auto;max-width:none;line-height:14px}
  .aspect-grid .aspect-shape{height:14px;max-width:32px}
}
@media(prefers-reduced-motion:reduce){.scene-chevron{transition:none}}

.palette-caption{min-height:15px}
.swatch:hover{background:conic-gradient(var(--palette-colors))}
.swatch.custom{grid-column:1/-1;display:flex;align-items:center;justify-content:flex-start;gap:9px;width:100%;max-width:none;height:34px;aspect-ratio:auto;border:1px solid #43525b;border-radius:4px;outline:none;background:#172127;font-size:11px;padding:5px 8px}
.swatch.custom:hover{background:#223138}.swatch.custom.active{border-color:#b9e5ed;outline:1px solid #b9e5ed;outline-offset:0}
.custom-palette-swatch{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:conic-gradient(var(--palette-colors));flex-shrink:0}
.swatch.custom svg{width:14px;height:14px;stroke:#10191e;stroke-width:2.3;filter:drop-shadow(0 1px 1px #fff9)}
#custom-palette-editor{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.custom-name{display:grid;gap:7px;font-size:11px;color:#a5b1b9}
.custom-name input,.custom-color input[type=text]{width:100%;min-width:0;border:1px solid #3a4851;border-radius:4px;background:#0d1317;color:#dce8ec;font:12px Studio,sans-serif;height:34px;padding:0 9px}
#custom-colors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}
.custom-color{min-width:0;display:grid;gap:7px;font-size:10px;line-height:14px;color:#9aadb8}
.custom-color input[type=color]{appearance:none;-webkit-appearance:none;display:block;width:100%;height:30px;min-width:0;padding:3px;border:1px solid #43525b;border-radius:4px;background:#172127;cursor:pointer}
.custom-color input[type=color]::-webkit-color-swatch-wrapper{padding:0}.custom-color input[type=color]::-webkit-color-swatch{border:0;border-radius:2px}.custom-color input[type=color]::-moz-color-swatch{border:0;border-radius:2px}
.custom-color input[type=text]{font:10px Mono,monospace;padding:0 5px;height:29px;text-align:center}
.custom-color input[type=text]:invalid{border-color:#be866d}
@media(max-width:800px){#custom-colors{gap:5px}.custom-color input[type=text]{font-size:9px;padding:0 2px}}

#export-result{padding-top:24px;text-align:center}
.export-success-icon{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;color:#9bdad0}
.export-success-icon svg{width:40px;height:40px;stroke-width:1.5}
#export-result-message{font-size:13px;line-height:20px;color:#bacbd2;margin:12px 0}
#export-result-name{display:block;font-size:14px;line-height:21px;font-weight:500;overflow-wrap:anywhere}
#export-result-meta{font:11px Mono,monospace;line-height:18px;color:#91a6b0;margin:10px 0 24px}
#export-countdown{margin:0;padding-top:16px;border-top:1px solid var(--line);font:11px Mono,monospace;color:#91a6b0;font-variant-numeric:tabular-nums}
.export-modes{display:flex;gap:4px;margin:20px 0 16px;padding:3px;background:#090e12;border:1px solid #35424b;border-radius:5px}.export-modes button{flex:1;display:flex;gap:8px;align-items:center;justify-content:center;min-height:36px;border-radius:3px;color:#98aab6;font:13px Studio,sans-serif}.export-modes button[aria-pressed=true]{background:#293b44;color:#e2f3f7}.export-modes svg{width:16px;height:16px}
#export-dialog[data-mode=programme]{width:850px;max-height:calc(100dvh - 32px);overflow-y:auto}#programme-fields{border:0;padding:0;margin:0;min-width:0}.programme-name{display:grid;gap:7px;font-size:12px;color:#abc0cc}.programme-name input{height:38px;width:100%;padding:0 12px;border:1px solid #435661;border-radius:4px;background:#1a242c;color:#e7eff4;font:14px Studio,sans-serif}.programme-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 10px}.programme-selection,.programme-assign{display:flex;gap:8px;align-items:center;min-width:0}.programme-toolbar button{min-height:34px;padding:6px 10px;border:1px solid #3c4c56;border-radius:4px;font-size:12px;white-space:nowrap;color:#c7dce5}.programme-assign .select-field{width:150px}.programme-tracks{max-height:36vh;overflow-y:auto;overscroll-behavior:contain;border-top:1px solid #35424b;border-bottom:1px solid #35424b;scrollbar-color:#425560 #131c22}.programme-row{display:grid;grid-template-columns:minmax(0,1fr) 160px 62px;gap:14px;align-items:center;min-height:64px;padding:8px 0;border-bottom:1px solid #29343c}.programme-row:last-child{border-bottom:0}.programme-choice{display:flex;gap:10px;align-items:center;min-width:0;cursor:pointer}.programme-choice input{width:16px;height:16px;flex:none;accent-color:#8ac7d2}.programme-order{font:11px Mono,monospace;color:#8aa0ad;width:20px;flex:none}.programme-choice img{width:34px;height:34px;object-fit:cover;border-radius:6px;flex:none}.programme-copy{display:grid;gap:3px;min-width:0}.programme-copy strong{font:500 13px/18px Studio,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.programme-copy small{font:11px/16px Studio,sans-serif;color:#8ea5b2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.programme-row select,.programme-assign select{appearance:none;width:100%;height:34px;padding:0 40px 0 10px;border:1px solid #435661;border-radius:4px;background:#1a242c;color:#d6e7ee;font:12px Studio,sans-serif}.programme-moves{display:flex;gap:2px}.programme-moves .icon{width:30px;height:32px;min-width:0}.programme-moves svg{width:14px;height:14px}#programme-summary{display:block;padding:10px 0 0;font:12px Mono,monospace;color:#a6c2ce;font-variant-numeric:tabular-nums}#export-dialog[data-mode=programme] #export-fields{margin:16px 0}
@media(max-width:600px){.programme-row{grid-template-columns:minmax(0,1fr) 64px;gap:8px}.programme-row>.select-field{grid-row:2;grid-column:1}.programme-moves{grid-column:2;grid-row:1 / 3}.programme-toolbar{align-items:stretch;flex-direction:column}.programme-assign .select-field{flex:1;width:auto}.programme-tracks{max-height:32vh}.programme-choice img{width:30px;height:30px}.programme-copy strong{white-space:normal;overflow-wrap:anywhere}.programme-choice{gap:7px}}
.caption-setting{display:grid;gap:9px;margin:20px 0;font-size:12px;color:#d3dde2}
.caption-setting select{width:100%;height:38px;padding:0 12px;border:1px solid #43525b;border-radius:4px;background:#172127;color:#e7ecef;font:12px Studio,sans-serif}
.programme-row{grid-template-columns:minmax(0,1fr) 145px 32px 62px;gap:10px}.programme-settings-button{width:32px;height:32px}.programme-settings-button svg{width:16px;height:16px}.programme-settings-button[aria-expanded=true]{background:#2b414b;color:#b8e5ed}.programme-workspace{min-width:0}.programme-workspace:has(.programme-track-settings:not([hidden])){display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px}#export-dialog[data-mode=programme].has-track-settings{width:1140px}.programme-track-settings{min-width:0;max-height:42vh;overflow-y:auto;padding-left:18px;border-top:1px solid #35424b;border-left:1px solid #35424b;scrollbar-color:#425560 #131c22}.programme-track-heading{position:sticky;top:0;z-index:1;background:#11171c;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0 14px}.programme-track-heading h3{margin:0;font:500 14px/20px Studio,sans-serif;overflow-wrap:anywhere}.programme-track-settings .palette{margin-bottom:20px}.programme-track-settings [data-setting-id=palette-options]{display:grid;grid-template-columns:repeat(4,minmax(0,32px));gap:14px 12px}.programme-track-settings [data-setting-id=custom-palette-editor]{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}.programme-track-settings [data-setting-id=custom-colors]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}.programme-track-settings .settings-group{display:grid;gap:18px}.programme-track-settings .toggles{display:grid;gap:14px;margin:20px 0 14px;padding:18px 0}.programme-track-settings .toggle-setting+.toggle-setting{margin-left:0}.programme-track-settings .caption-setting{margin:18px 0}.track-parameter-actions{display:flex;flex-wrap:wrap;gap:8px;padding:0 0 14px}.track-parameter-actions button{padding:8px 10px;border:1px solid #3c4c56;border-radius:4px;font:12px Studio,sans-serif;color:#bdd5df}
@media(max-width:1000px){.programme-workspace:has(.programme-track-settings:not([hidden])){grid-template-columns:minmax(0,1fr)}.has-track-settings .programme-tracks{max-height:20vh}.programme-track-settings{padding-left:0;border-left:0;max-height:none;overflow:visible}#programme-track-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 24px}#programme-track-controls>.palette{grid-column:1;grid-row:1 / 3}#programme-track-controls>.settings-group:not(.toggles){grid-column:2;grid-row:1}#programme-track-controls>.toggles{grid-column:2;grid-row:2;margin:16px 0}#programme-track-controls>.caption-setting{grid-column:1;grid-row:3}#programme-track-controls>.track-parameter-actions{grid-column:2;grid-row:3;align-content:center}}
@media(max-width:600px){.programme-row{grid-template-columns:minmax(0,1fr) 32px 62px}.programme-row>.select-field{grid-column:1;grid-row:2}.programme-settings-button{grid-column:2;grid-row:1 / 3}.programme-moves{grid-column:3;grid-row:1 / 3}#programme-track-controls{display:block}}
/* Keep the header on one line while its controls still fit. */
@media(min-width:481px) and (max-width:800px){
  body{grid-template-rows:58px minmax(180px,1fr) 210px var(--desk-height)}
  body.library-hidden.settings-hidden{grid-template-rows:58px minmax(180px,1fr) 0px var(--desk-height)}
  .workspace-header{display:flex;gap:12px}
  .workspace-header .scene-picker{align-self:center}
  .workspace-header .top-actions{flex-shrink:0;margin-left:auto}
}
