:root{color:#151715;font-synthesis:none;text-rendering:optimizelegibility;--paper:#efede6;--paper-deep:#e5e1d7;--ink:#151715;--muted:#6e6d66;--line:#c9c6bc;--accent:#bf493f;background:#efede6;font-family:Helvetica Neue,Helvetica,Arial,Hiragino Sans,Yu Gothic,sans-serif}*{box-sizing:border-box}html{background:var(--paper);scroll-behavior:smooth}body{background:var(--paper);min-width:320px;min-height:100vh;color:var(--ink);margin:0}button,input,select{font:inherit}button,label,input[type=range],select{touch-action:manipulation}button{color:inherit}a{color:inherit;text-decoration:none}.site-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;min-height:76px;padding:0 3.2vw;display:flex}.brand{letter-spacing:.12em;align-items:baseline;gap:10px;display:flex}.brand strong{font-size:13px}.brand span,.header-note,.section-kicker,.section-heading>div>span,.about-section>span,footer,.hero-label{letter-spacing:.16em;text-transform:uppercase;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}.brand span{color:var(--accent)}.header-note{color:var(--muted)}main{overflow:clip}.hero{border-bottom:1px solid var(--line);padding:66px 3.2vw 78px}.hero-label{color:var(--muted);margin-bottom:clamp(74px,12vw,160px)}.hero-grid{grid-template-columns:minmax(0,1.6fr) minmax(280px,.7fr);align-items:end;gap:6vw;display:grid}.hero h1{letter-spacing:-.07em;margin:0;font-size:clamp(54px,7.2vw,120px);font-weight:450;line-height:.92}.hero h1 span{display:block}.hero-copy{padding-bottom:.4em;font-size:clamp(16px,1.35vw,21px);line-height:1.85}.hero-copy>p{margin:0}.local-note{border-top:1px solid var(--line);color:var(--muted);padding-top:20px;font-size:12px;line-height:1.75;margin-top:28px!important}.local-note i{background:var(--accent);border-radius:50%;width:7px;height:7px;margin-right:9px;display:inline-block}.workspace{border-bottom:1px solid var(--line);grid-template-columns:minmax(0,1.55fr) minmax(330px,.65fr);display:grid}.preview-column,.settings-column{padding:34px 3.2vw 44px}.preview-column{border-right:1px solid var(--line)}.section-kicker{color:var(--muted);justify-content:space-between;margin-bottom:24px;display:flex}.canvas-shell{background:#151715;justify-content:center;align-items:center;min-height:420px;display:flex;position:relative;overflow:hidden}.canvas-shell canvas{object-fit:contain;max-width:100%;max-height:72vh;display:block}.canvas-shell.ratio-1-1 canvas{aspect-ratio:1}.canvas-shell.ratio-4-5 canvas{aspect-ratio:4/5}.canvas-shell.ratio-16-9 canvas{aspect-ratio:16/9}.canvas-shell.ratio-9-16 canvas{aspect-ratio:9/16}.canvas-empty{color:#efede6;text-align:center;place-content:center;display:grid;position:absolute;inset:0}.canvas-empty span{letter-spacing:.18em;font-family:ui-monospace,monospace;font-size:11px}.canvas-empty p{color:#efede699;margin:12px 0 0;font-size:13px}.playback-bar{border-bottom:1px solid var(--line);grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:16px 0;display:grid}.play-button,.section-actions button,.setting-title-row button,.export-result button{border:1px solid var(--ink);cursor:pointer;letter-spacing:.1em;text-transform:uppercase;background:0 0;padding:10px 15px;font-family:ui-monospace,monospace;font-size:11px}button:disabled{cursor:not-allowed;opacity:.35}.playback-bar input{accent-color:var(--accent);width:100%;min-width:0}.playback-bar output{color:var(--muted);font-family:ui-monospace,monospace;font-size:10px}.notice{color:var(--muted);min-height:1.65em;margin:15px 0 0;font-size:12px;line-height:1.65}.settings-column{background:#e5e1d773}.setting-block,.setting-row,.range-row,.check-row{border-top:1px solid var(--line)}.setting-block{padding:22px 0}.setting-block h2{margin:0 0 16px;font-size:14px;font-weight:500}.transition-grid{grid-template-columns:repeat(2,1fr);gap:6px;display:grid}.transition-grid button{border:1px solid var(--line);cursor:pointer;text-align:left;background:0 0;flex-direction:column;align-items:flex-start;gap:5px;min-height:62px;padding:11px 12px;display:flex}.transition-grid button b{letter-spacing:.08em;text-transform:uppercase;font-family:ui-monospace,monospace;font-size:11px;font-weight:600}.transition-grid button span{color:var(--muted);font-size:9px}.transition-grid button.is-active{background:var(--ink);border-color:var(--ink);color:var(--paper)}.transition-grid button.is-active span{color:#efede6b8}.transition-grid button:last-child:nth-child(odd){grid-column:1/-1}.motion-option-block{padding-top:0}.direction-grid{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.direction-grid button{border:1px solid var(--line);cursor:pointer;background:0 0;flex-direction:column;align-items:center;gap:6px;padding:12px 4px;display:flex}.direction-grid button b{font-size:22px;font-weight:400}.direction-grid button span{color:var(--muted);font-size:9px}.direction-grid button.is-active{background:var(--ink);border-color:var(--ink);color:var(--paper)}.direction-grid button.is-active span{color:#efede6b8}.setting-row{justify-content:space-between;align-items:center;min-height:58px;display:flex}.setting-row>span,.range-row b,.check-row span{font-size:12px;font-weight:500}.setting-row select{color:var(--ink);text-align:right;background:0 0;border:0;max-width:58%;font-size:12px}.range-row{padding:18px 0;display:block}.range-row>span{justify-content:space-between;margin-bottom:12px;display:flex}.range-row output{color:var(--muted);font-family:ui-monospace,monospace;font-size:10px}.range-row input{accent-color:var(--accent);width:100%}.check-row{align-items:center;gap:10px;padding:18px 0;display:flex}.check-row input{accent-color:var(--accent);width:17px;height:17px}.transform-block{margin-top:10px}.setting-title-row{justify-content:space-between;align-items:center;display:flex}.setting-title-row h2{margin:0}.setting-title-row button{border-color:var(--line);padding:7px 10px}.transform-block .range-row:last-child{padding-bottom:0}.stage-section,.export-section{border-bottom:1px solid var(--line);padding:58px 3.2vw 70px}.section-heading{justify-content:space-between;align-items:end;margin-bottom:32px;display:flex}.section-heading h2{letter-spacing:-.05em;margin:12px 0 0;font-size:clamp(32px,4vw,62px);font-weight:450;line-height:1}.section-heading>p{color:var(--muted);max-width:390px;margin:0;font-size:13px;line-height:1.7}.section-actions{gap:8px;display:flex}.section-actions button{border-color:var(--line)}.drop-zone{cursor:pointer;text-align:center;border:1px dashed #9f9c92;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:136px;padding:24px;transition:background .2s,border-color .2s;display:flex}.drop-zone.is-dragging{border-color:var(--accent);background:#e3ded2}.drop-zone input{opacity:0;width:1px;height:1px;position:absolute;overflow:hidden}.drop-zone b{font-size:17px;font-weight:500}.drop-zone span{color:var(--muted);font-size:11px}.stage-list{border-top:1px solid var(--line);margin-top:28px}.stage-card{border-bottom:1px solid var(--line);grid-template-columns:48px 112px 1fr auto;align-items:center;gap:22px;padding:16px 0;display:grid}.stage-number{color:var(--muted);font-family:ui-monospace,monospace;font-size:11px}.stage-card img{aspect-ratio:4/3;object-fit:cover;background:#d5d1c7;width:112px;display:block}.stage-info label{gap:5px;display:grid}.stage-fields{grid-template-columns:minmax(150px,1fr) 108px;align-items:end;gap:18px;display:grid}.stage-info label span,.export-result span{color:var(--muted);letter-spacing:.13em;font-family:ui-monospace,monospace;font-size:9px}.stage-info input{border:0;border-bottom:1px solid var(--line);color:var(--ink);background:0 0;border-radius:0;width:min(100%,380px);padding:5px 0 7px;font-size:17px}.stage-info select{border:0;border-bottom:1px solid var(--line);color:var(--ink);background:0 0;border-radius:0;width:100%;padding:7px 0;font-size:12px}.stage-info p{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;max-width:36vw;margin:8px 0 2px;font-size:10px;overflow:hidden}.stage-info small{color:var(--muted);font-family:ui-monospace,monospace;font-size:9px}.stage-controls{gap:5px;display:flex}.stage-controls button{border:1px solid var(--line);cursor:pointer;background:0 0;width:34px;height:34px}.export-section{background:#e6e2d8}.export-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.export-card{border:1px solid var(--ink);cursor:pointer;text-align:left;background:0 0;flex-direction:column;align-items:flex-start;min-height:160px;padding:22px;display:flex}.export-card span{color:var(--muted);letter-spacing:.14em;font-family:ui-monospace,monospace;font-size:9px}.export-card b{margin-top:auto;font-size:22px;font-weight:500}.export-card small{color:var(--muted);margin-top:9px;font-size:10px}.export-primary{background:var(--ink);color:var(--paper)}.export-primary span,.export-primary small{color:#efede69e}.progress-track{background:#cfcabf;height:3px;margin-top:18px;overflow:hidden}.progress-track i{background:var(--accent);height:100%;transition:width .12s linear;display:block}.export-result{border-top:1px solid var(--line);grid-template-columns:minmax(240px,.8fr) 1fr;align-items:center;gap:30px;margin-top:42px;padding-top:30px;display:grid}.result-media{background:#151715;justify-content:center;align-items:center;max-height:420px;display:flex;overflow:hidden}.result-media video,.result-media img{max-width:100%;max-height:420px;display:block}.export-result h3{overflow-wrap:anywhere;margin:10px 0;font-size:20px;font-weight:500}.export-result p{color:var(--muted);margin-bottom:24px;font-size:12px}.about-section{grid-template-columns:.35fr 1fr 1fr;gap:28px;padding:80px 3.2vw 96px;display:grid}.about-section>span{color:var(--muted);padding-top:9px}.about-section h2{letter-spacing:-.04em;margin:0;font-size:clamp(28px,3vw,48px);font-weight:450;line-height:1.2}.about-section p{color:var(--muted);margin:0;font-size:14px;line-height:1.9}.about-section .oss-note{border-top:1px solid var(--line);letter-spacing:.06em;margin-top:24px;padding-top:16px;font-family:ui-monospace,monospace;font-size:9px}.oss-note a{text-underline-offset:3px;text-decoration:underline}footer{background:var(--ink);color:var(--paper);justify-content:space-between;align-items:center;min-height:86px;padding:0 3.2vw;display:flex}@media (width>=901px){.preview-column{align-self:start;position:sticky;top:0}}@media (width<=900px){.hero-grid,.workspace{grid-template-columns:1fr}.hero-copy{max-width:600px}.preview-column{border-bottom:1px solid var(--line);border-right:0}.about-section{grid-template-columns:1fr 1fr}.about-section>span{grid-column:1/-1}}@media (width<=640px){.site-header{min-height:64px;padding:0 18px}.header-note{display:none}.hero{padding:42px 18px 50px}.hero-label{margin-bottom:64px}.hero-grid{gap:34px}.hero h1{letter-spacing:-.075em;font-size:clamp(45px,13vw,58px);line-height:.96}.hero-copy{font-size:15px;line-height:1.75}.preview-column,.settings-column{padding:28px 18px 34px}.canvas-shell{min-height:300px}.canvas-shell canvas{max-height:66vh}.playback-bar{grid-template-columns:auto 1fr;gap:10px}.playback-bar output{text-align:right;grid-column:1/-1}.direction-grid button span{display:none}.stage-section,.export-section{padding:46px 18px 54px}.section-heading{flex-direction:column;align-items:flex-start;gap:24px}.section-heading h2{font-size:39px}.section-actions{width:100%}.section-actions button{flex:1}.drop-zone{min-height:124px}.stage-card{grid-template-columns:30px 76px 1fr;align-items:start;gap:12px}.stage-card img{width:76px}.stage-controls{grid-column:2/-1;justify-content:flex-end}.stage-info p{max-width:46vw}.stage-fields{grid-template-columns:1fr;gap:10px}.export-grid{grid-template-columns:1fr}.export-card{min-height:142px}.export-result{grid-template-columns:1fr}.about-section{grid-template-columns:1fr;padding:60px 18px 72px}.about-section>span{grid-column:auto}footer{min-height:76px;padding:0 18px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}