*{box-sizing:border-box}:root{--bg-app:#0d0d0f;--bg-panel:#16161a;--bg-panel-raised:#1c1c22;--bg-viewer:#0a0a0c;--border-subtle:#2a2a32;--border-strong:#3a3a44;--text:#ececf0;--text-muted:#8b8b96;--text-dim:#5c5c68;--accent:#3d8bfd;--accent-hover:#5a9dff;--danger:#e85d5d;--titlebar-h:36px;--browser-w:260px;--inspector-w:300px;--radius:6px;--radius-sm:4px;--viewport-bg:#141416;--viewport-shadow:inset 0 0 0 1px #ffffff0a, 0 8px 32px #00000073;--insp-btn-hover-bg:#24242c;--insp-btn-hover-border:#4a4a56;--clip-action-hover-bg:#25252e;--clip-action-hover-border:#50505c;--textarea-focus-ring:#3d8bfd33}:root[data-theme=light]{--bg-app:#f5f5f7;--bg-panel:#fff;--bg-panel-raised:#ebebed;--bg-viewer:#fafafa;--border-subtle:#d8d8de;--border-strong:#c4c4cc;--text:#141416;--text-muted:#5c5c68;--text-dim:#8b8b96;--accent:#2563eb;--accent-hover:#1d4ed8;--danger:#b91c1c;--viewport-bg:#e8e8ec;--viewport-shadow:inset 0 0 0 1px #0000000f, 0 8px 24px #00000014;--insp-btn-hover-bg:#e4e4e8;--insp-btn-hover-border:#b0b0b8;--clip-action-hover-bg:#ebebf0;--clip-action-hover-border:#a8a8b2;--textarea-focus-ring:#2563eb38}html,body{background:var(--bg-app);height:100%;max-height:100%;color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:13px;overflow:hidden}#app{justify-content:stretch;align-items:stretch;height:100%;min-height:100%;padding:0;display:flex}.promo-root{background:var(--bg-app);border:none;flex-direction:column;flex:1;min-width:0;height:100%;min-height:0;max-height:100%;display:flex}.promo-titlebar{flex:0 0 var(--titlebar-h);height:var(--titlebar-h);background:var(--bg-panel);border-bottom:1px solid var(--border-subtle);-webkit-user-select:none;user-select:none;align-items:center;gap:12px;padding:0 14px;display:flex}.titlebar-name{letter-spacing:.02em;color:var(--text);font-size:12px;font-weight:600}.titlebar-meta{color:var(--text-muted);font-size:11px}.titlebar-spacer{flex:1;min-width:8px}.titlebar-export-btn{font:inherit;letter-spacing:.04em;color:var(--text);background:var(--bg-panel-raised);border:1px solid var(--border-strong);border-radius:var(--radius-sm);cursor:pointer;flex:none;margin:0;padding:5px 12px;font-size:11px;font-weight:600;transition:background .12s,border-color .12s}.titlebar-export-btn:hover{background:var(--insp-btn-hover-bg);border-color:var(--insp-btn-hover-border)}.titlebar-theme{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-viewer);align-items:center;gap:0;padding:0;display:flex;overflow:hidden}.theme-chip{font:inherit;color:var(--text-muted);border:none;border-right:1px solid var(--border-subtle);cursor:pointer;background:0 0;margin:0;padding:4px 10px;font-size:11px;font-weight:500;transition:background .12s,color .12s}.theme-chip:last-child{border-right:none}.theme-chip:hover{color:var(--text);background:var(--bg-panel-raised)}.theme-chip.theme-chip-active{color:var(--text);background:var(--bg-panel-raised);font-weight:600}.promo-body{flex-direction:column;flex:1 1 0;align-items:stretch;min-height:0;display:flex}.promo-stage{border-bottom:1px solid var(--border-subtle);flex-direction:column;flex:1 1 0;min-height:0;display:flex}.promo-lower{flex-direction:row;flex:1 1 0;align-items:stretch;min-width:0;min-height:0;display:flex}.promo-browser{flex:0 0 var(--browser-w);width:var(--browser-w);background:var(--bg-panel);border-right:1px solid var(--border-subtle);flex-direction:column;min-width:0;min-height:0;display:flex}.promo-timeline-panel{background:var(--bg-viewer);border-right:1px solid var(--border-subtle);flex-direction:column;flex:1 1 0;min-width:0;min-height:0;display:flex}.timeline-panel-head{background:var(--bg-panel-raised);border-bottom:1px solid var(--border-subtle);flex-wrap:wrap;flex:none;justify-content:space-between;align-items:center;gap:8px;padding:8px 10px;display:flex}.timeline-panel-title{letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);font-size:10px;font-weight:600}.timeline-panel-actions{align-items:center;gap:6px;display:flex}.timeline-panel-hint{color:var(--text-dim);border-bottom:1px solid var(--border-subtle);flex:none;margin:0;padding:4px 10px 6px;font-size:10px;line-height:1.45}.timeline-panel-hint code{font-size:9px}.timeline-json-btn{font:inherit;color:var(--text-muted);background:var(--bg-viewer);border:1px solid var(--border-strong);border-radius:var(--radius-sm);cursor:pointer;margin:0;padding:4px 10px;font-size:10px;font-weight:500}.timeline-json-btn:hover{color:var(--text);border-color:var(--insp-btn-hover-border)}.timeline-json-btn.timeline-json-btn-danger:hover{color:var(--danger);border-color:var(--danger)}.timeline-json-dialog{z-index:10001}.timeline-json-dialog-panel{max-width:min(560px,96vw);max-height:min(92dvh,720px)}.timeline-json-dialog-hint{color:var(--text-muted);margin:0;padding:10px 12px 0;font-size:11px;line-height:1.45}.timeline-json-dialog-hint code{font-size:10px}.timeline-json-experiment-row{flex-wrap:wrap;align-items:center;gap:8px 10px;padding:8px 12px 0;display:flex}.timeline-json-experiment-label{color:var(--text-muted);flex:none;font-size:11px;font-weight:500}.timeline-json-element-select{min-width:0;max-width:280px;font:inherit;color:var(--text);background:var(--bg-viewer);border:1px solid var(--border-strong);border-radius:var(--radius-sm);flex:140px;padding:6px 8px;font-size:11px}.timeline-json-dialog-status{min-height:1.25em;color:var(--text);margin:0;padding:6px 12px 0;font-size:11px}.timeline-json-editor-wrap{flex-direction:column;flex:auto;min-height:0;padding:10px 12px;display:flex}.timeline-json-editor{box-sizing:border-box;width:100%;min-height:200px;max-height:min(52dvh,480px);color:var(--text);background:var(--bg-viewer);border:1px solid var(--border-strong);border-radius:var(--radius-sm);resize:vertical;flex:auto;margin:0;padding:10px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:11px;line-height:1.4}.timeline-json-dialog-actions{border-top:1px solid var(--border-subtle);background:var(--bg-panel-raised);flex-wrap:wrap;flex:none;gap:8px;padding:10px 12px 12px;display:flex}.timeline-workspace{flex-direction:column;flex:1 1 0;min-width:0;min-height:120px;display:flex;overflow:hidden}.timeline-table-scroll{flex:1 1 0;min-height:0;overflow:auto}.timeline-table{border-collapse:collapse;width:100%;font-size:11px}.timeline-table thead th{z-index:1;text-align:left;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);background:var(--bg-panel-raised);border-bottom:1px solid var(--border-subtle);padding:6px 8px;font-weight:600;position:sticky;top:0}.timeline-table tbody td{vertical-align:middle;border-bottom:1px solid var(--border-subtle);color:var(--text);padding:6px 8px}.timeline-col-name{word-break:break-word;width:88px;max-width:100px}.timeline-col-kind{word-break:break-word;width:72px;max-width:88px}.timeline-col-param{width:120px;max-width:140px;color:var(--text-muted);font-family:ui-monospace,monospace;font-size:10px}.timeline-col-graph{min-width:0}.timeline-empty{text-align:center;color:var(--text-dim);font-size:11px;line-height:1.45;padding:16px 10px!important}.timeline-mini-svg{color:var(--text-muted);cursor:crosshair;touch-action:none;display:block}.timeline-mini-axis{stroke:var(--border-strong);stroke-width:1px}.timeline-mini-poly{stroke:var(--accent);stroke-width:1.5px}.timeline-mini-playhead{stroke:var(--text);stroke-width:1px;opacity:.9;vector-effect:non-scaling-stroke}.insp-section-tight{padding-top:12px}.insp-section-dialog{border-bottom:none;padding-bottom:16px}.export-dialog{z-index:10000;box-sizing:border-box;visibility:hidden;opacity:0;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;width:100vw;max-width:none;height:100vh;max-height:none;margin:0;padding:20px;transition:opacity .15s,visibility .15s;display:flex;position:fixed;inset:0}.export-dialog.is-open{visibility:visible;opacity:1;pointer-events:auto}.export-dialog-backdrop{z-index:0;cursor:pointer;background:#0000006b;border:none;margin:0;padding:0;position:absolute;inset:0}:root[data-theme=light] .export-dialog-backdrop{background:#00000047}.export-dialog-panel{z-index:1;background:var(--bg-panel);border:1px solid var(--border-strong);border-radius:var(--radius);flex-direction:column;flex:none;width:100%;max-width:420px;min-height:200px;max-height:min(90dvh,640px);display:flex;position:relative;overflow:hidden;box-shadow:0 16px 48px #00000059}.export-dialog-header{border-bottom:1px solid var(--border-subtle);background:var(--bg-panel-raised);flex:none;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;display:flex}.export-dialog-title{color:var(--text);margin:0;font-size:13px;font-weight:600}.export-dialog-close{width:28px;height:28px;font:inherit;color:var(--text-muted);border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:1px solid #0000;flex:none;padding:0;font-size:18px;line-height:1}.export-dialog-close:hover{color:var(--text);border-color:var(--border-subtle)}.export-dialog-body{flex:0 auto;min-height:0;overflow:hidden auto}.browser-head{border-bottom:1px solid var(--border-subtle);flex:none;padding:12px 12px 10px}.browser-title{letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin:0;font-size:11px;font-weight:600}.browser-sub{color:var(--text-dim);margin:6px 0 0;font-size:10px;line-height:1.35}.promo-viewer{background:var(--bg-viewer);flex-direction:column;flex:1 1 0;min-width:0;min-height:0;display:flex}.viewer-dual-wrap{flex-direction:row;flex:1 1 0;align-items:stretch;gap:10px;min-width:0;min-height:0;padding:10px 12px;display:flex}.viewer-viewport-block{background:var(--bg-viewer);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);flex-direction:column;flex:1 1 0;min-width:0;min-height:0;display:flex;overflow:hidden}.viewport-block-head{background:var(--bg-panel-raised);border-bottom:1px solid var(--border-subtle);flex-wrap:wrap;flex:none;align-items:baseline;gap:8px 12px;padding:8px 10px;display:flex}.viewer-block-title{letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);font-size:10px;font-weight:600}.viewport-block-hint{color:var(--text-dim);font-size:10px}.viewport-block-canvas{flex:1 1 0;justify-content:center;align-items:center;min-height:0;padding:8px 10px 10px;display:flex}#viewport-export,#viewport-orbit{aspect-ratio:16/9;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--viewport-bg);width:100%;max-width:100%;max-height:100%;box-shadow:var(--viewport-shadow);position:relative;overflow:hidden}#viewport-orbit{cursor:grab}#viewport-orbit:active{cursor:grabbing}.promo-stage .viewer-dual-wrap{padding:8px 12px 6px}.promo-stage .viewport-block-canvas{justify-content:stretch;align-items:stretch;padding:6px 10px 8px}.promo-stage #viewport-export,.promo-stage #viewport-orbit{width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:unset;flex:1 1 0}.promo-inspector{flex:0 0 var(--inspector-w);width:var(--inspector-w);background:var(--bg-panel);flex-direction:column;min-width:0;min-height:0;display:flex}.inspector-scroll{flex-direction:column;flex:1 1 0;min-height:0;display:flex;overflow:hidden auto}.insp-section{border-bottom:1px solid var(--border-subtle);flex:none;padding:14px 14px 12px}.insp-section-grow{flex-direction:column;flex:1 1 0;min-height:140px;display:flex}.insp-heading{letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);margin:0 0 10px;font-size:11px;font-weight:600}.insp-btn{width:100%;font:inherit;color:var(--text);background:var(--bg-panel-raised);border:1px solid var(--border-strong);border-radius:var(--radius-sm);cursor:pointer;text-align:center;padding:8px 12px;font-size:12px;font-weight:500;transition:background .12s,border-color .12s}.insp-btn:hover:not(:disabled){background:var(--insp-btn-hover-bg);border-color:var(--insp-btn-hover-border)}.insp-btn:disabled{opacity:.45;cursor:not-allowed}.insp-btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.insp-btn-primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.insp-btn-row{gap:8px;display:flex}.insp-btn-flex{flex:1;width:auto;min-width:0;padding-left:8px;padding-right:8px;font-size:11px}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.insp-textarea{resize:vertical;width:100%;min-height:76px;font:inherit;color:var(--text);background:var(--bg-viewer);border:1px solid var(--border-strong);border-radius:var(--radius-sm);margin:0 0 8px;padding:8px 10px;font-size:12px;line-height:1.45}.insp-textarea::placeholder{color:var(--text-dim)}.insp-textarea:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--textarea-focus-ring);outline:none}.insp-label-narrow{color:var(--text-muted);margin-top:8px;font-size:11px;display:block}.insp-input-narrow{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);width:100%;max-width:120px;color:var(--text);margin-top:4px;padding:6px 8px;font-size:12px}.insp-input-narrow:focus{border-color:var(--accent);outline:none}.tts-audio{border-radius:var(--radius-sm);width:100%;margin-top:8px;display:none}.tts-audio.is-visible{display:block}.insp-status{color:var(--text-muted);min-height:1.2em;margin:8px 0 0;font-size:11px;line-height:1.45}.insp-hint{color:var(--text-dim);margin:10px 0 0;font-size:10px;line-height:1.45}.insp-hint-tight,.insp-btn-row-tight{margin-top:8px}.export-audio-line{color:var(--text-muted);min-height:1.2em;margin:8px 0 0;font-size:10px;line-height:1.45}.screen-preview{border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:#000;width:100%;max-height:140px;margin-bottom:8px;display:none}.screen-preview.is-visible{display:block}img.screen-preview.is-visible{object-fit:contain}.clip-list{flex-direction:column;flex:1 1 0;gap:4px;min-height:0;margin:0;padding:8px;list-style:none;display:flex;overflow:hidden auto}.clip-list-empty,.clip-list-error{color:var(--text-muted);padding:8px 4px;font-size:11px}.clip-list-footnote{color:var(--text-dim);border-top:1px solid var(--border-subtle);margin:0;padding:10px 8px 8px;font-size:10px;line-height:1.45;list-style:none}.clip-row{background:var(--bg-panel-raised);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);flex-direction:column;gap:8px;padding:10px 8px;display:flex}.clip-row:last-child{margin-bottom:4px}.clip-row-info{flex-direction:column;gap:2px;min-width:0;display:flex}.clip-kind-tag{letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);font-size:9px;font-weight:600}.clip-name{word-break:break-word;color:var(--text);font-size:12px;font-weight:500}.clip-date{color:var(--text-dim);font-size:10px}.clip-row-actions{flex-wrap:wrap;gap:6px;display:flex}.clip-action-btn{font:inherit;color:var(--text);background:var(--bg-viewer);border:1px solid var(--border-strong);border-radius:var(--radius-sm);cursor:pointer;padding:5px 8px;font-size:10px;font-weight:500;transition:background .1s,border-color .1s}.clip-action-btn:hover{background:var(--clip-action-hover-bg);border-color:var(--clip-action-hover-border)}.clip-action-danger{color:var(--danger);border-color:#e85d5d80}.clip-action-danger:hover{border-color:var(--danger);background:#e85d5d14}@media (width<=900px){:root{--browser-w:200px;--inspector-w:260px}}@media (width<=760px){html,body{max-height:none;overflow:auto}.promo-root{height:auto;min-height:100dvh;max-height:none}#app{height:auto;min-height:100dvh}.promo-body{flex:auto;min-height:0}.promo-stage{flex:0 0 min(52dvh,520px);min-height:min(52dvh,520px)}.promo-stage .viewer-dual-wrap{flex-direction:column;min-height:0}.promo-stage .viewer-viewport-block{flex:1 1 0;min-height:min(22dvh,200px)}.promo-stage #viewport-export,.promo-stage #viewport-orbit{aspect-ratio:16/9;flex:none;max-height:min(28dvh,260px)}.promo-lower{flex-direction:column;flex:auto;min-height:0}.promo-browser{border-right:none;border-bottom:1px solid var(--border-subtle);flex:none;width:100%;max-height:min(34dvh,300px)}.promo-timeline-panel{border-right:none;border-bottom:1px solid var(--border-subtle);flex:none;width:100%;min-height:min(28dvh,240px);max-height:min(36dvh,320px)}.timeline-workspace{min-height:min(20dvh,180px)}.promo-inspector{flex:auto;width:100%;min-height:min(36dvh,320px)}.inspector-scroll{max-height:none}.insp-section-grow{min-height:120px}}.director-scripts-list{flex-direction:column;gap:6px;margin-top:4px;display:flex}.director-scripts-btn{text-align:left;white-space:normal;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px;height:auto;min-height:0;padding:8px 10px;line-height:1.3;display:flex}.director-scripts-btn-title{font-size:.92rem;font-weight:600}.director-scripts-btn-meta{opacity:.65;font-variant-numeric:tabular-nums;font-size:.72rem}.director-scripts-btn.is-active{outline:1px solid var(--text-primary,currentColor);outline-offset:-1px;background:var(--bg-raised,#ffffff0f)}.director-scripts-logline{min-height:1.4em;margin-top:6px}.prod-root,.dev-mode-toggle{display:none}body.is-prod #app{display:none!important}body.is-prod .prod-root{background:var(--bg-app);color:var(--text);z-index:10;flex-direction:column;display:flex;position:fixed;inset:0}body:not(.is-prod) .dev-mode-toggle{z-index:20;letter-spacing:.06em;text-transform:uppercase;background:var(--bg-panel-raised);color:var(--text-muted);border:1px solid var(--border-strong);border-radius:var(--radius-sm);cursor:pointer;opacity:.7;padding:6px 12px;font-size:11px;display:inline-flex;position:fixed;bottom:12px;right:12px}body:not(.is-prod) .dev-mode-toggle:hover{opacity:1;color:var(--text)}.prod-header{text-align:center;border-bottom:1px solid var(--border-subtle);flex:none;padding:18px 20px 10px}.prod-title{letter-spacing:.12em;text-transform:uppercase;color:var(--text);margin:0;font-size:15px;font-weight:600}.prod-main{flex-direction:column;flex:auto;gap:16px;width:100%;max-width:520px;min-height:0;margin:0 auto;padding:20px 20px 16px;display:flex;overflow-y:auto}.prod-field{flex-direction:column;flex:none;gap:6px;display:flex}.prod-field-label{letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);font-size:11px}.prod-text-input{letter-spacing:.08em;width:100%;color:var(--text);background:var(--bg-panel);border:1px solid var(--border-strong);border-radius:var(--radius);outline:none;padding:12px 14px;font-family:inherit;font-size:18px;font-weight:600;transition:border-color .12s,box-shadow .12s}.prod-text-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--textarea-focus-ring)}.prod-field-hint{color:var(--text-dim);font-size:11px}.prod-canvas-wrap{aspect-ratio:16/9;background:var(--viewport-bg);border:1px solid var(--border-subtle);border-radius:var(--radius);width:100%;box-shadow:var(--viewport-shadow);flex:none;position:relative;overflow:hidden}.prod-canvas-wrap>canvas{display:block;width:100%!important;height:100%!important}.prod-download-btn{letter-spacing:.06em;color:#fff;background:var(--accent);border:1px solid var(--accent);border-radius:var(--radius);cursor:pointer;flex:none;padding:14px 16px;font-size:15px;font-weight:600;transition:background-color .12s,opacity .12s}.prod-download-btn:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.prod-download-btn:disabled{opacity:.55;cursor:not-allowed}.prod-status{min-height:1.2em;color:var(--text-muted);text-align:center;flex:none;margin:0;font-size:12px}.prod-footer{border-top:1px solid var(--border-subtle);flex:none;justify-content:center;padding:8px 12px 12px;display:flex}.prod-mode-toggle{letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);cursor:pointer;opacity:.6;background:0 0;padding:4px 10px;font-size:10px}.prod-mode-toggle:hover{opacity:1;color:var(--text-muted)}