:root{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;color:#292e29;background:#f7f6f2;font-synthesis:none;--muted:#686e66;--border:#eaeaea;--green:#354b35;--mono:"SFMono-Regular",Consolas,monospace}*{box-sizing:border-box}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.42}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #779575;outline-offset:4px}button{transition:background .15s,opacity .15s,transform .15s}button:not(:disabled):active{transform:scale(.985)}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.shell{max-width:1216px;padding:0 48px;margin:auto}.masthead{display:flex;align-items:center;justify-content:space-between;height:102px;border-bottom:1px solid #dddfd7}.brand{display:flex;align-items:center;gap:10px;font-size:27px;letter-spacing:-1.2px;font-weight:720}.brand-dot{color:#809575;margin-left:-8px}.local-badge{font:10px var(--mono);letter-spacing:1.3px;display:flex;align-items:center;gap:8px}.local-badge>span{width:6px;height:6px;border-radius:50%;background:#5f8158}.intro{display:flex;align-items:end;justify-content:space-between;padding:53px 0 42px;gap:28px}.eyebrow,.meta{font:10px var(--mono);letter-spacing:1px;color:var(--muted)}.eyebrow{margin:0 0 14px;color:#627358;font-weight:600}h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(34px,4.5vw,51px);letter-spacing:-2.3px;font-weight:400;line-height:1.12;margin:0 0 14px}.intro-copy{font-size:15px;color:var(--muted);margin:0}.intro-note{font-size:11px;line-height:1.8;text-align:right;color:var(--muted);margin:0 0 3px}.intro-note span{margin:0 8px;color:#a4aaa0}.workspace{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 20px}h2{font-size:14px;font-weight:650;letter-spacing:-.1px;margin:0;display:flex;align-items:center;gap:10px}.step{font:10px var(--mono);color:#8b9285;margin-right:2px}.drop-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;width:100%;min-height:213px;border:1px dashed #b9c0b1;background:#eef0e8;border-radius:6px;color:#354331;padding:24px 16px}.drop-zone:not(:disabled):hover,.drop-zone.drag-over{background:#e6ecdf;border-color:#6c8660}.drop-zone strong{font-size:14px;font-weight:600}.drop-zone>span:not(.add-mark){font-size:12px;color:#68735f}.drop-zone small{font-size:9px;margin-top:13px;color:#747d6c;letter-spacing:.3px}.add-mark{font-size:30px;font-weight:300;line-height:1;margin:0 0 5px}.drop-zone.compact{min-height:100px;padding:14px;gap:5px}.drop-zone.compact .add-mark,.drop-zone.compact small{display:none}.clip-list{list-style:none;padding:0;margin:13px 0 0}.clip-row{display:grid;grid-template-columns:18px 72px minmax(0,1fr) auto;gap:10px;align-items:center;background:#fff;border:1px solid var(--border);border-radius:5px;padding:11px;margin-bottom:8px;transition:border-color .15s,opacity .15s}.clip-row.selected{border-color:#8b9c7d}.clip-row.dragging{opacity:.45}.clip-row.drop-target{border-color:#556e44;background:#eef2e7}.clip-index{font:10px var(--mono);color:#8a9284;cursor:grab}.thumbnail-button{display:block;border:0;padding:0;background:#282e26;border-radius:3px;width:72px;height:46px;overflow:hidden}.thumbnail-button img{width:100%;height:100%;object-fit:contain;display:block}.clip-info{min-width:0}.clip-title{max-width:100%;display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-size:12px;font-weight:600;line-height:1.5;border:0;padding:0;background:none;text-align:left}.clip-details{font:9px var(--mono);color:#798070;display:block;margin-top:5px;white-space:normal;overflow-wrap:anywhere;line-height:1.5}.clip-controls{display:flex;gap:1px}.icon-button{width:25px;height:29px;border:0;background:transparent;border-radius:3px;color:#767f6e;font-size:15px}.icon-button:hover{background:#f0f2ec;color:#273625}.remove-button{margin-left:2px;font-size:19px;color:#888e82}.list-footer{display:flex;gap:15px;align-items:center;justify-content:space-between;margin-top:14px}.list-footer p{font-size:10px;color:#7b8275;margin:0;line-height:1.5}.text-button{background:none;border:0;padding:3px 0;color:#44593a;font-size:11px;white-space:nowrap}.text-button:not(:disabled):hover{text-decoration:underline}.preview-stage{position:relative;min-width:0;width:100%;aspect-ratio:16/9;background:#252c25;border-radius:6px;overflow:hidden;display:flex;align-items:center;justify-content:center}.preview-empty{text-align:center;color:#d7ded1;padding:12px}.preview-empty svg{height:65px}.preview-empty p{font-family:Georgia,serif;font-size:20px;font-weight:400;margin:13px 0 7px;letter-spacing:-.3px}.preview-empty span{font-size:10px;color:#9aa891}.preview-stage video{position:absolute;inset:0;display:block;min-width:0;max-width:100%;height:100%;width:100%;object-fit:contain}.preview-caption{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:14px;min-height:20px}.preview-caption>span{font-size:11px;color:#687460;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.preview-caption button{font-size:10px}.preview-caption button>span{font-size:9px;margin-right:5px}.small-note{font-size:10px;line-height:1.6;color:#7b8275;margin:10px 0 0}.sequence-total{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #dddfd7;margin-top:25px;padding-top:19px;font-size:12px}.sequence-total small{font-size:9px;color:#919787;margin-left:5px}.sequence-total strong{font:23px var(--mono);letter-spacing:-1px;font-weight:400}.finish-panel{background:#fff;border:1px solid var(--border);border-radius:7px;padding:25px 28px;margin-top:36px}.finish-panel>.section-heading{margin-bottom:24px}.export-settings{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:60px}.options{display:flex;flex-direction:column;gap:22px;padding-top:5px}.option{display:flex;align-items:flex-start;gap:11px;cursor:pointer}.option input{accent-color:#41563a;width:16px;height:16px;flex-shrink:0;margin:0}.option strong{font-size:12px;font-weight:600;display:block;line-height:17px}.option small{display:block;font-size:10px;color:#7b8275;line-height:1.6;margin-top:4px;max-width:330px}.filename-label{font:9px var(--mono);letter-spacing:.6px;color:#7b8275;display:block;margin:0 0 9px}.filename-field{display:flex;border:1px solid #dce0d6;border-radius:4px;align-items:center;margin-bottom:12px;overflow:hidden;height:37px}.filename-field input{min-width:0;width:100%;border:0;background:transparent;padding:10px 12px;outline-offset:-3px;font-size:12px;color:#3c4536}.filename-field>span{font:10px var(--mono);color:#8b9184;padding-right:13px}.primary-button{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#263925;color:#fff;border:0;border-radius:4px;padding:13px 17px;font-size:12px;font-weight:550;min-height:42px}.primary-button:hover:not(:disabled){background:#3a5034}.primary-button>span{font-size:16px}.export-action>.primary-button{width:100%}.export-action .small-note{font-size:9px}.message{border:1px solid #ddcfa5;background:#faf3e3;padding:12px 15px;border-radius:5px;color:#77633a;font-size:12px;line-height:1.5;margin-bottom:24px;display:flex;justify-content:space-between;gap:15px}.message.error{color:#873f35;border-color:#e4cbc4;background:#fbefeb}.message button{border:0;background:none;font-size:18px;color:inherit;padding:0 3px}.import-status{font-size:11px;padding:12px;color:#576a4d;background:#eef2e9;border-radius:4px;margin-top:10px}.job-panel{border-top:1px solid var(--border);margin-top:24px;padding-top:20px}.job-top,.job-bottom{display:flex;justify-content:space-between;align-items:center;gap:15px}.job-top strong{font-size:12px;font-weight:600}.job-bottom{font-size:10px;color:#77826d}.job-panel progress{appearance:none;width:100%;height:5px;display:block;border:0;border-radius:2px;overflow:hidden;margin:15px 0 10px;background:#e9eee3}.job-panel progress::-webkit-progress-bar{background:#e9eee3}.job-panel progress::-webkit-progress-value{background:#6b8159}.job-panel progress::-moz-progress-bar{background:#6b8159}.result-panel{border-top:1px solid var(--border);margin-top:24px;padding-top:20px;display:flex;justify-content:space-between;gap:25px;align-items:center}.result-panel>div{display:flex;align-items:center;gap:12px}.result-check{background:#edf3e9;color:#547140;border-radius:50%;width:31px;height:31px;text-align:center;line-height:31px}.result-panel strong{font-size:13px}.result-panel p{font-size:10px;color:#7b8275;margin:6px 0 0}.result-panel .primary-button{min-width:145px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}footer{display:flex;justify-content:space-between;gap:20px;padding:26px 0 35px;color:#818878;font-size:10px}footer p{display:flex;gap:7px;align-items:center;margin:0}footer>span{font:8px var(--mono);letter-spacing:1px;line-height:14px}.intro,.workspace,.finish-panel{animation:arrive .5s both}.workspace{animation-delay:.06s}.finish-panel{animation-delay:.12s}@keyframes arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(min-width:1500px){.shell{max-width:1270px}.intro{padding-top:68px;padding-bottom:50px}.workspace{gap:48px}}@media(max-width:860px){.shell{padding:0 24px}.masthead{height:80px}.intro{padding:35px 0 30px}.intro-note{display:none}.workspace{grid-template-columns:minmax(0,1fr);gap:30px}.drop-zone{min-height:170px}.preview-stage{max-height:380px}.finish-panel{padding:22px;margin-top:28px}.export-settings{gap:28px;grid-template-columns:1fr}.options{gap:18px}.option small{max-width:none}footer{flex-direction:column;gap:12px}.intro h1{letter-spacing:-1.6px}.sequence-total{margin-top:16px;padding-top:16px}}@media(max-width:420px){.shell{padding:0 16px}.local-badge{font-size:8px;letter-spacing:.5px}.brand{font-size:24px}.clip-row{grid-template-columns:14px 58px minmax(0,1fr) auto;gap:6px;padding:9px}.thumbnail-button{width:58px;height:42px}.clip-controls{gap:0}.icon-button{width:23px}.clip-details{font-size:8px}.result-panel{align-items:stretch;flex-direction:column;gap:18px}.preview-caption button{font-size:9px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.auto-ratio{padding-bottom:16px;border-bottom:1px solid var(--border)}.auto-ratio .filename-label{margin-bottom:7px}.auto-ratio strong{font-size:13px;font-weight:600}.ratio-value{display:inline-block;margin-left:10px;background:#edf3e9;color:#526849;padding:4px 7px;border-radius:3px;font:10px var(--mono)}.auto-ratio>small{display:block;color:#7b8275;font-size:10px;line-height:1.6;margin-top:6px}.preview-stage.portrait{width:min(100%,270px);max-height:480px;margin-inline:auto}.preview-stage.portrait video{aspect-ratio:inherit}@media(max-width:860px){.preview-stage.portrait{max-height:420px;width:min(100%,236px)}}

/* Let the document scroll naturally, including inside a short browser panel. */
html{min-width:0;min-height:100%;overflow-y:auto;scroll-padding-block:24px}
body{min-width:0;min-height:100vh;min-height:100svh}
.shell{width:100%;min-width:0;padding-bottom:max(32px,env(safe-area-inset-bottom))}
main,.workspace,.export-settings,.workspace>*,.export-settings>*,.preview-caption>span,.option>span,.result-panel>div,.result-panel>div>div{min-width:0}
.section-heading{gap:12px;flex-wrap:wrap}
.meta{flex-shrink:0}
.preview-caption{flex-wrap:wrap;row-gap:8px}
.preview-caption>span{flex:1 1 150px}
.preview-caption>button,.result-check,.message>button{flex-shrink:0}
.list-footer,.result-panel,.job-top,.job-bottom{flex-wrap:wrap}
.list-footer>p{flex:1 1 180px}
.option>span,.result-panel p,.job-bottom>span,.message>span,.import-status{overflow-wrap:anywhere}
.result-panel>div{flex:1 1 220px}
.result-panel>a{flex-shrink:0}
.result-check{flex:0 0 31px}
.auto-ratio>div{display:flex;flex-wrap:wrap;gap:7px 10px;align-items:center}
.auto-ratio .filename-label{flex-basis:100%;margin:0}
.ratio-value{max-width:100%;margin-left:0;overflow-wrap:anywhere}
footer{padding-bottom:24px}footer>p{min-width:0;line-height:1.6}footer svg{flex-shrink:0}
@media(max-width:360px){
 .masthead{height:auto;min-height:80px;flex-wrap:wrap;gap:14px;padding-block:18px}
 .finish-panel{padding:18px 16px}
 .clip-row{grid-template-columns:14px 48px minmax(0,1fr);gap:8px}
 .thumbnail-button{width:48px;height:38px}
 .clip-controls{grid-column:3;justify-content:flex-end}
 .clip-title{white-space:normal;overflow-wrap:anywhere}
 .preview-caption>button{margin-left:auto}
 .sequence-total{gap:12px;flex-wrap:wrap}
}
@media(max-width:420px){.result-panel>div{flex:0 1 auto}}
