:root{color-scheme:dark;font-family:var(--font-sans);background:var(--surface-page);color:var(--ink-1);--sm-bg: var(--surface-page);--sm-sunken: var(--surface-sunken);--sm-panel: var(--surface-page);--sm-panel-2: var(--surface-sunken);--sm-text: var(--ink-1);--sm-text-bright: var(--white);--sm-muted: var(--ink-2);--sm-dim: var(--ink-3);--sm-accent: var(--accent-primary);--sm-mark: var(--accent-tool);--sm-on-mark: var(--ink-on-accent-tool);--sm-ok: var(--accent-positive);--sm-warn: var(--accent-highlight);--sm-error: var(--accent-negative)}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-height:100vh}button,input,textarea,select{font:inherit}.app-shell{min-height:100vh;padding:32px}.hero{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:24px}.hero h1{margin:0 0 4px;font:var(--type-app-title);letter-spacing:var(--tracking-title)}.hero p,.panel-header p,.stage-card p{color:var(--sm-muted);margin:0;max-width:62ch}.stack-card-title{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:var(--border-thick) solid var(--line-1);background:var(--sm-panel);border-radius:var(--radius-0);color:var(--sm-text)}.panel,.stage-card,.stack-card{border:var(--border-thick) solid var(--line-1);background:var(--sm-panel)}.workspace{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,.9fr);align-items:start;gap:20px}.app-shell.landing{display:grid;align-content:center;justify-items:center}.app-shell.landing .hero,.app-shell.landing .workspace{width:min(100%,720px)}.app-shell.landing .hero{justify-content:center;text-align:center}.app-shell.landing .hero p{margin-inline:auto;font-size:var(--text-body-lg)}.app-shell.landing .workspace{grid-template-columns:minmax(0,1fr)}.stage-column{display:grid;align-content:start;gap:20px;min-width:0;position:sticky;top:20px;max-height:calc(100vh - 40px);overflow:auto}.stage-column.with-timing .stage-frame{--stage-max-height: min(46vh, 600px)}.panel{border-radius:var(--radius-0);padding:20px}.panel-header{display:flex;justify-content:space-between;gap:16px;align-items:start;margin-bottom:18px}.panel-header h2{margin:0 0 6px;font-size:1.2rem}.panel-actions{display:flex;flex-wrap:wrap;justify-content:end;gap:8px}.stage{position:relative;min-height:560px;border-radius:var(--radius-0);overflow:hidden;display:grid;place-items:center;background:var(--sm-panel)}.stage-glow{display:none}.stage-card{position:relative;z-index:1;width:min(520px,calc(100% - 40px));border-radius:var(--radius-0);padding:32px;text-align:center;display:grid;gap:16px;place-items:center}.stage-card h2{margin:0;font-size:var(--text-display-3)}.stage-card p,.stage-card .primary-button{font-size:var(--text-body-lg)}.primary-button,.secondary-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:var(--radius-0);padding:12px 18px;cursor:pointer;transition:transform .18s ease,background .18s ease,box-shadow .18s ease}.primary-button{background:var(--sm-accent);color:var(--ink-on-accent);font-weight:700;box-shadow:var(--shadow-none)}.secondary-button{margin-top:auto;background:var(--sm-panel);color:var(--sm-text);border:var(--border-thick) solid var(--line-1)}.choose-button{display:flex;width:fit-content;margin-inline:auto}.primary-button:hover{background:var(--sm-bg);color:var(--sm-accent);outline:var(--border-thick) solid var(--sm-accent);outline-offset:calc(var(--border-thick) * -1)}.secondary-button:hover{background:var(--sm-accent);color:var(--sm-bg)}.stack-card{border-radius:var(--radius-0);padding:18px;margin-bottom:14px}.stack-card ul,.stack-card ol{margin:12px 0 0;padding-left:18px;color:var(--sm-text)}.stack-card li+li{margin-top:8px}.transcription-card{display:grid;gap:13px}.transcription-card label{display:grid;gap:6px;color:var(--sm-text);font-size:.86rem}.transcription-card select{width:100%;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);padding:9px 10px;color:var(--sm-text);background:var(--sm-panel)}.progress-block{display:grid;gap:7px;color:var(--sm-text);font-size:.84rem}.progress-block div{display:flex;justify-content:space-between}progress{width:100%;height:8px}.transcription-error{margin:0;color:var(--sm-error);font-size:.86rem}.transcribe-button,.cancel-button{width:100%}.transcript-card p{margin:12px 0 0;color:var(--sm-text);line-height:1.55}.transcript-segment{display:flex;flex-wrap:wrap;gap:3px}.transcript-word{border:0;border-radius:var(--radius-0);padding:2px 3px;color:inherit;background:transparent;cursor:pointer;line-height:inherit}.transcript-word:hover{background:var(--sm-text);color:var(--sm-bg)}.transcript-word.active{color:var(--sm-on-mark);background:var(--sm-mark)}@media(max-width:980px){.app-shell{padding:20px}.hero,.workspace{grid-template-columns:1fr;display:grid}.stage-column{position:static;max-height:none;overflow:visible}.stage-column.with-timing .stage-frame{--stage-max-height: min(58vh, 620px)}.hero{align-items:start}.hero-meta{min-width:0}}@media(max-width:640px){.app-shell{padding:14px}.panel,.stage-card,.project-card{border-radius:var(--radius-0)}.stage-card{padding:32px 20px}.stage{min-height:460px}}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.video-stage{display:grid;gap:12px;padding:14px;border-radius:var(--radius-0);background:var(--sm-bg)}.stage-frame{--stage-max-height: min(58vh, 620px);position:relative;width:min(100%,calc(var(--stage-max-height) * var(--stage-aspect, .5625)));height:auto;aspect-ratio:var(--stage-aspect, .5625);margin:0 auto;overflow:hidden;border-radius:var(--radius-0);background:var(--sm-sunken);touch-action:none}.stage-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.stage-source{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;pointer-events:none}.stage-hit{position:absolute;top:0;left:0;transform-origin:0 0;border-radius:var(--radius-0);cursor:grab}.stage-hit:hover{outline:var(--border-thick) dashed var(--grey-600);outline-offset:6px}.stage-hit:active{cursor:grabbing}.stage-guide{position:absolute;background:var(--sm-accent);opacity:0;pointer-events:none;transition:opacity .1s linear}.stage-guide-x{top:0;bottom:0;left:50%;width:1px}.stage-guide-y{right:0;left:0;top:50%;height:1px}.stage-editor{position:absolute;z-index:2;min-height:44px;padding:8px 10px;border:var(--border-thick) solid var(--sm-accent);border-radius:var(--radius-0);color:var(--sm-text);background:var(--sm-bg);resize:none}.transport{display:flex;align-items:center;gap:8px;padding:8px 10px;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);background:var(--sm-panel)}.scrub{position:relative;flex:1 1 auto;min-width:80px;display:grid;align-items:center}.scrub input[type=range]{width:100%;accent-color:var(--sm-mark)}.scrub-ticks{position:absolute;right:8px;bottom:2px;left:8px;height:5px;pointer-events:none}.scrub-ticks span{position:absolute;width:1px;height:100%;background:var(--grey-600)}.transport-time{color:var(--sm-muted);font-size:.8rem;font-variant-numeric:tabular-nums;white-space:nowrap}.icon-button.primary{color:var(--sm-panel);background:var(--sm-accent);border-color:transparent}.icon-button.active{border-color:var(--sm-accent);background:var(--sm-panel-2)}.icon-button.small{width:26px;height:26px}.icon-button:disabled{cursor:default}.transcript-list{max-height:340px;overflow-y:auto;margin-top:10px}.transcript-block{display:grid;gap:4px;padding:6px 4px;border-radius:var(--radius-0)}.transcript-block:hover{background:var(--sm-panel-2)}.transcript-editor{width:100%;min-height:62px;padding:8px;border:var(--border-thick) solid var(--sm-accent);border-radius:var(--radius-0);color:var(--sm-text);background:var(--sm-panel);resize:vertical}.panel-timing{display:grid;gap:12px}.timing-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.timing-nav{display:flex;align-items:center;gap:6px}.timing-count{min-width:54px;color:var(--sm-dim);font-size:.76rem;font-variant-numeric:tabular-nums;text-align:center}.timing-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;margin:0;color:var(--sm-text);font-size:.92rem;line-height:1.5}.segment-timeline{display:grid;gap:5px}.timeline-track{position:relative;height:54px;border:var(--border-thin) solid var(--line-1);border-radius:var(--radius-0);background:var(--sm-sunken);cursor:pointer;touch-action:none;overflow:hidden}.timeline-bar{position:absolute;top:6px;bottom:6px;min-width:24px;display:flex;align-items:center;border:var(--border-thin) solid var(--line-1);border-radius:var(--radius-0);background:var(--sm-panel);overflow:hidden}.timeline-bar.active{background:var(--sm-mark)}.timeline-bar.dragging{background:var(--sm-mark);outline:var(--border-thick) solid var(--sm-accent)}.timeline-label{flex:1;min-width:0;padding:0 3px;color:var(--sm-text);font-size:.82rem;line-height:1;text-align:center;white-space:nowrap;overflow:hidden;pointer-events:none;-webkit-user-select:none;user-select:none}.timeline-handle{flex:0 0 auto;width:9px;align-self:stretch;border-radius:var(--radius-0);background:var(--grey-600);cursor:col-resize;touch-action:none}.timeline-handle:hover,.timeline-handle:focus-visible{background:var(--sm-accent);outline:none}.timeline-playhead{position:absolute;top:0;bottom:0;width:1px;background:var(--sm-text);pointer-events:none;z-index:1}.timeline-readout{color:var(--sm-dim);font-size:.74rem;font-variant-numeric:tabular-nums;text-align:right}.segment-tools{display:flex;gap:4px;opacity:0;transition:opacity .12s ease}.transcript-block:hover .segment-tools,.transcript-block:focus-within .segment-tools{opacity:1}.transcript-word.selected{outline:var(--border-thick) solid var(--sm-mark)}.video-card{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px}.video-meta{display:grid;flex:1 1 180px;gap:3px;min-width:0}.video-meta strong,.video-meta span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.video-meta span{color:var(--sm-muted);font-size:.84rem}.text-button{display:inline-flex;flex:0 0 auto;align-items:center;gap:7px;padding:7px 12px;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);color:var(--sm-text);background:var(--sm-panel);cursor:pointer;font-size:.82rem;white-space:nowrap}.text-button:hover{border-color:var(--grey-600);background:var(--sm-panel-2)}.icon-button{display:inline-grid;flex:0 0 auto;width:34px;height:34px;place-items:center;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);color:var(--sm-text);background:var(--sm-panel);cursor:pointer}.import-status,.import-error{display:flex;align-items:center;gap:8px;margin:12px 0 0;color:var(--sm-text)}.import-error{color:var(--sm-error)}.spin{animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}button:disabled{cursor:wait;opacity:.62}.mode-card{display:grid;gap:12px}.mode-buttons,.line-toggle{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.mode-button,.line-toggle button{border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);padding:8px 6px;color:var(--sm-text);background:var(--sm-panel);cursor:pointer;font-size:.76rem}.mode-button.selected,.line-toggle button.selected{border-color:var(--sm-accent);background:var(--sm-panel-2);font-weight:var(--weight-semibold)}.line-toggle{grid-template-columns:repeat(2,minmax(0,1fr))}.style-card,.animate-card{display:grid;gap:12px}.style-card label,.animate-card label{display:grid;gap:5px;color:var(--sm-text);font-size:.84rem}.style-card select{width:100%;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);padding:8px 10px;color:var(--sm-text);background:var(--sm-panel)}.style-card input[type=range],.animate-card input[type=range]{width:100%;accent-color:var(--sm-mark)}.value{color:var(--sm-dim);font-size:.78rem}.control-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:end}.toggle-label{display:flex!important;align-items:center;gap:8px}.stacked-toggles{display:grid;gap:6px}.toggle-label input{width:15px;height:15px;accent-color:var(--sm-mark)}.colour-label input[type=color]{width:100%;height:32px;padding:2px;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);background:var(--sm-panel)}.position-presets,.animation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.preset-card{display:grid;gap:12px}.preset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.preset-button{display:grid;gap:5px;padding:9px 8px 7px;border:var(--border-thin) solid var(--line-1);border-radius:var(--radius-0);background:var(--surface-inverse);cursor:pointer;text-align:left}.preset-button.selected{border-color:var(--sm-accent)}.preset-swatch{display:block;height:26px;overflow:hidden;line-height:26px;white-space:nowrap}.preset-label{display:flex;align-items:center;gap:5px;color:var(--ink-on-brand-2);font-size:.72rem}.preset-button.selected .preset-label{color:var(--ink-inverse)}.animation-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.font-picker{display:grid;gap:8px}.font-search{display:flex!important;align-items:center;gap:7px;padding:7px 10px;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);background:var(--sm-panel)}.font-search input{flex:1;min-width:0;border:0;color:var(--sm-text);background:transparent;outline:none}.font-categories{display:flex;flex-wrap:wrap;gap:5px}.chip{padding:4px 9px;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);color:var(--sm-text);background:transparent;cursor:pointer;font-size:.74rem;text-transform:capitalize}.chip.selected{border-color:var(--sm-accent);background:var(--sm-panel-2);font-weight:var(--weight-semibold)}.font-list{max-height:210px;overflow-y:auto;display:grid;gap:2px;padding-right:4px}.font-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 9px;border:1px solid transparent;border-radius:var(--radius-0);color:var(--sm-text);background:transparent;cursor:pointer;font-size:1rem;text-align:left}.font-row:hover{background:var(--sm-panel-2)}.font-row.selected{border-color:var(--sm-mark);background:var(--sm-panel-2)}.hint{display:flex;align-items:center;gap:6px;margin:0;color:var(--sm-muted);font-size:.78rem;line-height:1.45}.hint code{padding:1px 4px;border-radius:var(--radius-0);background:var(--sm-panel-2);font-size:.74rem}.tier-note{margin:12px 0 0;color:var(--sm-muted);font-size:.86rem;line-height:1.5}.export-card{display:grid;gap:13px}.export-card label{display:grid;gap:6px;color:var(--sm-text);font-size:.86rem}.export-card select{width:100%;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);padding:9px 10px;color:var(--sm-text);background:var(--sm-panel)}.export-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.export-summary{margin:0;color:var(--sm-muted);font-size:.84rem}.export-blocked{display:flex;align-items:start;gap:8px;margin:0;color:var(--sm-warn);font-size:.84rem;line-height:1.45}.export-blocked svg{flex:0 0 auto;margin-top:2px}.page-content{max-width:68ch;margin:0 auto;padding:var(--space-8) var(--space-5) var(--space-9);line-height:var(--leading-body);color:var(--sm-muted)}.page-content h2{margin:var(--space-8) 0 var(--space-3);padding-top:var(--space-4);border-top:var(--border-heavy) solid var(--sm-accent);color:var(--sm-text);font-family:var(--font-display);font-size:var(--text-title-1);font-weight:var(--weight-semibold);line-height:var(--leading-tight)}.page-content h2:first-child{margin-top:0}.page-content h3{margin:var(--space-6) 0 var(--space-2);color:var(--sm-text);font-family:var(--font-display);font-size:var(--text-title-3);font-weight:var(--weight-semibold)}.page-content p{margin:0 0 var(--space-4)}.page-content strong{color:var(--sm-text);font-weight:var(--weight-semibold)}.page-content ol{margin:0 0 var(--space-4);padding-left:var(--space-5);display:grid;gap:var(--space-3)}.page-content li{padding-left:var(--space-1)}.sidecar-block{display:grid;gap:7px;margin-top:4px;padding-top:12px;border-top:var(--border-thin) solid var(--line-1)}.sidecar-head{margin:0;color:var(--sm-muted);font-size:.78rem}.sidecar-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.sidecar-row button{justify-content:center}.sidecar-hint{margin:0;color:var(--sm-dim);font-size:.72rem}.export-result{display:grid;gap:8px;justify-items:center;padding-top:4px}.export-result a{width:100%;text-decoration:none}.export-result span{color:var(--sm-muted);font-size:.82rem}.donate-root{position:relative;flex:0 0 auto;justify-self:start}.app-shell.landing .hero{flex-direction:column;align-items:center}.app-shell.landing .donate-root{justify-self:center}.donate-trigger{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);color:var(--sm-text);background:var(--sm-panel);cursor:pointer;font-size:.84rem;white-space:nowrap}.donate-trigger:hover{border-color:var(--grey-600);background:var(--sm-panel-2)}.donate-pop{position:absolute;right:0;top:calc(100% + 10px);z-index:40;width:278px;padding:16px;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);background:var(--sm-panel);text-align:left}.donate-pop h3{margin:0 0 4px;font-size:.95rem}.donate-sub{margin:0 0 13px;color:var(--sm-muted);font-size:.78rem;line-height:1.45}.amount-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:10px}.amount-grid button{border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);padding:9px 6px;color:var(--sm-text);background:var(--sm-panel);cursor:pointer;font-size:.82rem}.amount-grid button.selected{border-color:var(--sm-accent);background:var(--sm-panel-2);font-weight:var(--weight-semibold)}.donate-row{display:flex;align-items:center;gap:8px;margin-bottom:12px}.donate-amount{display:flex;flex:1;min-width:0;align-items:center;gap:6px;padding:0 10px;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);background:var(--sm-panel);color:var(--sm-muted)}.donate-amount input{width:100%;min-width:0;padding:9px 0;border:0;background:none;color:var(--sm-text);outline:none}.donate-row select{flex:0 0 auto;width:92px;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);padding:9px 8px;color:var(--sm-text);background:var(--sm-panel)}.donate-submit{width:100%;padding:11px 16px;font-size:.9rem}.donate-error{margin:10px 0 0;color:var(--sm-error);font-size:.78rem;line-height:1.45}.donation-toast{position:fixed;left:50%;bottom:24px;z-index:60;transform:translate(-50%);padding:11px 20px;border:var(--border-thick) solid var(--line-1);border-radius:var(--radius-0);color:var(--sm-text);background:var(--sm-panel);font-size:.84rem}@media(max-width:640px){.donate-pop{right:auto;left:0;width:min(278px,calc(100vw - 40px))}}