:root{font-family:Segoe UI,Microsoft YaHei,PingFang SC,system-ui,sans-serif;color:#202a25;background:#f4f6f4;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;font-weight:400;--green:#28664e;--green-dark:#194b38;--green-soft:#eaf2ec;--muted:#7e8982;--line:#e8ece8}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,a{font:inherit}button{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #77a98b;outline-offset:3px}button:disabled{cursor:not-allowed}.app-shell{min-height:100vh}.topbar{height:66px;padding:0 max(30px,calc((100vw - 1416px)/2));display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid #edf0ed}.brand{display:flex;align-items:center;gap:10px;color:#21352b;text-decoration:none}.brand-mark{width:34px;height:34px;border-radius:10px;background:#e9f1eb;color:var(--green);display:grid;place-items:center}.brand-name{font-size:16px;font-weight:700;letter-spacing:.02em}.brand-name span{display:block;color:#9aa59d;font-size:8px;letter-spacing:.19em;font-weight:600;margin-top:-1px}.topbar-center{font-size:12px;color:#7c8780;display:flex;align-items:center;gap:9px}.live-dot,.privacy-mark span{width:7px;height:7px;border-radius:50%;background:#72a084;box-shadow:0 0 0 3px #edf5ef}.topbar-right{display:flex;align-items:center;gap:17px}.privacy-mark{font-size:11px;color:#86918a;display:flex;align-items:center;gap:8px}.privacy-mark span{width:6px;height:6px;background:#79a789;box-shadow:none}.avatar{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#eef2ee;color:#65756a;font-size:12px;font-weight:600}.workspace{max-width:1416px;margin:auto;padding:44px 30px 22px}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:27px}.eyebrow{font-size:11px;letter-spacing:.055em;color:#73847a;font-weight:600}.eyebrow span{padding:0 5px;color:#b6c0b9}.page-heading h1{font-size:27px;line-height:1.35;letter-spacing:-.045em;font-weight:600;margin:7px 0 5px;color:#24352b}.page-heading p{margin:0;color:#7e8981;font-size:13px}.sample-button{border:1px solid #dbe7dd;background:#f9fcf9;color:#3d7352;border-radius:8px;padding:10px 15px;display:flex;gap:8px;align-items:center;font-size:12px;font-weight:600;cursor:pointer;transition:.18s}.sample-button:hover:not(:disabled){background:#edf5ef;border-color:#bdd2c3}.work-grid{display:grid;grid-template-columns:minmax(340px,405px) minmax(0,1fr);gap:22px;align-items:stretch}.control-panel,.preview-panel{border:1px solid #e7ebe7;border-radius:12px;background:#fff;box-shadow:0 3px 14px #28372c06}.control-panel{padding:23px 23px 19px;display:flex;flex-direction:column}.section-heading{display:flex;align-items:flex-start;gap:12px;position:relative}.step-index{height:25px;width:28px;border-radius:7px;background:#eef4ef;color:#457356;font-size:10px;letter-spacing:.03em;font-weight:700;display:grid;place-items:center}.section-heading h2{font-size:14px;line-height:1.2;margin:1px 0 4px;font-weight:600;letter-spacing:-.015em}.section-heading p{font-size:11px;color:#929c95;margin:0}.ready-count{margin-left:auto;font-size:10px;color:#99a39c;background:#f6f8f6;padding:4px 7px;border-radius:5px}.upload-list{margin-top:16px}.image-card{height:82px;position:relative;border-radius:8px;border:1px dashed #d8e0da;background:#fbfcfb;overflow:hidden;transition:.15s}.image-card:hover,.image-card.dragging{border-color:#8caf96;background:#f4f8f4}.image-card.filled{border-style:solid;border-color:#e2e8e3}.empty-card{height:100%;width:100%;border:0;background:transparent;display:flex;align-items:center;text-align:left;padding:12px;gap:12px;cursor:pointer}.card-add-icon{width:36px;height:36px;border:1px solid #e6ebe6;background:#fff;border-radius:7px;color:#78907d;display:grid;place-items:center}.card-copy{display:flex;flex-direction:column;gap:5px}.card-copy b{font-size:12px;font-weight:600}.card-copy b i{font-style:normal;font-size:10px;color:#96a199;font-weight:400;padding-left:8px}.card-copy small{font-size:10px;color:#9ba49d}.card-upload{margin-left:auto;margin-right:4px;color:#87948a}.image-card-main{height:100%;width:100%;padding:0;border:0;background:#dce5dc;position:relative;display:block;text-align:left;cursor:pointer}.image-card-main>img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.8)}.image-card-overlay{position:absolute;inset:0;display:flex;align-items:center;padding:0 13px;gap:9px;background:linear-gradient(90deg,#15291fb8,#15291f14 90%);color:#fff}.card-order{font-size:10px;opacity:.75;font-weight:600}.card-name{max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:500}.sample-badge{font-size:9px;border:1px solid rgba(255,255,255,.42);padding:2px 5px;border-radius:4px;color:#ffffffeb}.card-duration{font-size:10px;margin-left:auto;opacity:.86}.replace-hint{position:absolute;right:12px;bottom:7px;display:flex;align-items:center;gap:2px;font-size:9px;color:#ffffffbf;opacity:0;transition:.15s}.image-card-main:hover .replace-hint,.image-card-main:focus-visible .replace-hint{opacity:1}.remove-image{position:absolute;right:7px;top:7px;width:25px;height:25px;border:1px solid rgba(255,255,255,.26);border-radius:6px;background:#10201759;color:#fff;display:grid;place-items:center;cursor:pointer;opacity:0;transition:.15s}.image-card:hover .remove-image,.remove-image:focus-visible{opacity:1}.sequence-link{height:20px;display:flex;align-items:center;justify-content:center;gap:3px;color:#abb6ad}.sequence-link span{width:30px;height:1px;background:#e9ede9}.sequence-link svg{margin:0 -1px}.drop-overlay{position:absolute;inset:0;z-index:4;display:flex;align-items:center;justify-content:center;gap:8px;background:#edf6eff0;color:#386f4d;font-size:12px;font-weight:600}.upload-note{display:flex;align-items:center;gap:7px;margin:12px 0 0;font-size:10px;color:#8d9990}.note-icon{display:flex;color:#82948a}.upload-note i{width:3px;height:3px;background:#c2cbc4;border-radius:50%}.panel-divider{height:1px;background:#edf0ed;margin:20px 0 19px}.section-heading.compact{margin-bottom:15px}.settings-group{border:0;padding:0;margin:0 0 15px;min-width:0}.settings-group legend{font-size:11px;font-weight:600;color:#657369;margin-bottom:8px;padding:0}.preset-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.preset-option{min-height:70px;border:1px solid #e8ece8;border-radius:7px;background:#fff;display:grid;grid-template-columns:30px 1fr;grid-template-rows:1fr 1fr;align-items:end;padding:9px 8px;column-gap:7px;text-align:left;cursor:pointer;transition:.15s}.preset-option:hover{border-color:#bfd0c2}.preset-option.selected,.fit-options button.selected{border-color:#8eae96;background:#f7faf7;box-shadow:0 0 0 1px #59896514}.preset-option>span:nth-child(2){font-size:11px;font-weight:600;align-self:end}.preset-option small{grid-column:2;color:#9aa39c;font-size:9px;align-self:start;margin-top:3px}.preset-icon{grid-row:1/3;align-self:center;width:25px;height:34px;border:1.5px solid #94a297;border-radius:3px;display:grid;place-items:center}.preset-icon i{width:12px;height:18px;border:1px solid #bdc8bf;border-radius:1px}.preset-icon.landscape{width:34px;height:24px}.preset-icon.landscape i{width:20px;height:12px}.preset-icon.square{width:28px;height:28px}.preset-icon.square i{width:15px;height:15px}.preset-option.selected .preset-icon{border-color:#528263}.preset-option.selected .preset-icon i{border-color:#81a38a}.fit-group{margin-top:1px;margin-bottom:0}.fit-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.fit-options button{min-width:0;display:flex;align-items:center;gap:9px;padding:8px 9px;border:1px solid #e8ece8;border-radius:7px;background:#fff;text-align:left;cursor:pointer;transition:.15s}.fit-options button:hover{border-color:#c0d0c3}.fit-options button>span:last-child{display:flex;flex-direction:column;gap:3px}.fit-options b{font-size:10px;font-weight:600}.fit-options small{font-size:9px;color:#98a29b;white-space:nowrap}.fit-diagram{width:29px;height:30px;border:1px solid #d5ded6;background:#f6f8f6;border-radius:3px;display:grid;place-items:center;overflow:hidden}.fit-diagram i{display:block;width:12px;height:18px;border-radius:1px;background:#98b29c}.fit-diagram.cover i{width:27px;height:18px;background:linear-gradient(90deg,#91aa95 0 30%,#729378 30% 70%,#91aa95 70%)}.fit-options button.selected .fit-diagram{border-color:#b6cdbb}.action-area{margin-top:auto;padding-top:20px}.generate-button{width:100%;height:43px;border:0;border-radius:7px;background:#28664e;color:#fff;display:flex;align-items:center;justify-content:center;gap:9px;font-size:12px;font-weight:600;cursor:pointer;box-shadow:0 2px 4px #20533824;transition:.18s}.generate-button:hover:not(:disabled){background:#21583f;transform:translateY(-1px);box-shadow:0 4px 10px #20533830}.generate-button:disabled{background:#b9c9bd;color:#eff3ef;box-shadow:none}.generate-button>span{margin-left:auto;margin-right:12px;font-size:10px;font-weight:500;color:#ffffffb8}.action-area>p{display:flex;align-items:center;justify-content:center;gap:6px;color:#96a098;font-size:9px;margin:11px 0 0}.lock-icon{font-size:13px;color:#8b9a8f}.error-message{margin-top:13px;padding:9px 10px;background:#fff4f1;border:1px solid #f3d5ce;border-radius:6px;color:#a04939;font-size:11px;line-height:1.5;display:flex;align-items:flex-start;gap:7px}.error-message svg{flex:none;margin-top:1px}.preview-panel{padding:20px 22px 14px;min-width:0;background:#fff}.preview-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.preview-kicker{font-size:8px;letter-spacing:.17em;color:#9aa79d;font-weight:700}.preview-header h2{margin:2px 0 0;font-size:14px;font-weight:600}.preview-meta{display:flex;align-items:center;gap:8px}.resolution-tag,.fps-tag{padding:5px 7px;border-radius:4px;background:#f5f7f5;color:#7b897e;font-size:9px;font-weight:500}.fps-tag{color:#9aa39d;background:none;padding:5px 1px}.stage{position:relative;height:clamp(350px,51vw,520px);max-height:520px;min-height:325px;background:#17211e;border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center;isolation:isolate}.stage:before,.stage:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0}.stage:before{background:radial-gradient(ellipse at 50% 48%,rgba(77,96,84,.16),transparent 54%)}.stage:after{background:linear-gradient(115deg,rgba(255,255,255,.012),transparent 40%,rgba(255,255,255,.018))}.stage-grain{position:absolute;inset:0;opacity:.13;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.15'/%3E%3C/svg%3E");pointer-events:none;z-index:0}.stage-corner{position:absolute;width:12px;height:12px;border-color:#ebf2ed38;border-style:solid;z-index:2}.corner-tl{top:13px;left:13px;border-width:1px 0 0 1px}.corner-tr{top:13px;right:13px;border-width:1px 1px 0 0}.corner-bl{bottom:13px;left:13px;border-width:0 0 1px 1px}.corner-br{bottom:13px;right:13px;border-width:0 1px 1px 0}.image-preview,.result-video{position:relative;z-index:1;height:calc(100% - 44px);width:auto;max-width:calc(100% - 48px);aspect-ratio:9/16;object-fit:contain;background:#101614;border-radius:3px;box-shadow:0 12px 42px #0000004d}.image-preview{overflow:hidden}.image-preview img{width:100%;height:100%;object-fit:contain;display:block}.image-preview.cover img{object-fit:cover}.image-preview.contain img{object-fit:contain}.stage.shape-landscape .image-preview,.stage.shape-landscape .result-video{aspect-ratio:16/9;width:min(78%,680px);height:auto;max-height:calc(100% - 90px)}.stage.shape-square .image-preview,.stage.shape-square .result-video{aspect-ratio:1;width:auto;height:min(78%,440px)}.result-video{max-height:100%;outline:0}.result-video.contain{object-fit:contain}.result-video.cover{object-fit:cover}.preview-image-caption{position:absolute;bottom:12px;left:12px;display:flex;gap:6px;align-items:center;padding:5px 8px;border-radius:4px;background:#121d1891;color:#f4f7f3;font-size:9px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.preview-image-caption>span:not(.preview-dot){opacity:.52}.preview-dot{width:5px;height:5px;border-radius:50%;background:#89b995}.empty-stage{z-index:1;text-align:center;display:flex;align-items:center;flex-direction:column}.empty-illustration{height:106px;width:152px;position:relative;margin-bottom:13px}.empty-frame{position:absolute;width:69px;height:88px;border-radius:5px;display:grid;place-items:center}.frame-back{top:10px;left:22px;border:1px solid rgba(197,215,200,.23);color:#c5d7c847;transform:rotate(-9deg);background:#dbe8dd06}.frame-front{top:4px;left:65px;border:1px solid rgba(196,221,200,.38);color:#8fb49a;background:#c5ddc80f;transform:rotate(8deg)}.empty-spark{position:absolute;color:#b0c5b2;font-size:13px}.spark-a{top:7px;right:23px}.spark-b{bottom:7px;left:10px;font-size:10px;opacity:.6}.empty-stage h3{margin:0 0 6px;color:#d7dfd9;font-weight:500;font-size:13px}.empty-stage p{margin:0;color:#87948b;font-size:10px}.empty-stage>button{display:flex;align-items:center;gap:6px;margin-top:17px;padding:7px 11px;border-radius:5px;border:1px solid rgba(195,215,199,.19);background:#d0e1d30f;color:#b6c9ba;font-size:10px;cursor:pointer}.empty-stage>button:hover{background:#d0e1d31c}.play-preview{z-index:2;position:absolute;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.37);background:#131e198c;color:#fff;display:grid;place-items:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer}.play-preview svg{margin-left:2px}.processing-overlay{position:absolute;inset:0;z-index:3;display:grid;place-items:center;background:#101a161f}.processing-pill{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:6px;background:#16251ddb;color:#e9efe9;font-size:10px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.processing-pill b{font-weight:600;color:#a9c9ae}.timeline-heading{display:flex;align-items:center;justify-content:space-between;margin:16px 1px 8px}.timeline-heading>div{display:flex;align-items:baseline;gap:8px}.timeline-label{font-size:11px;font-weight:600;color:#526157}.timeline-sub{font-size:9px;color:#a0aaa2}.total-duration{font-size:9px;color:#9ca69f}.total-duration b{margin-left:6px;color:#536057;font-weight:600;font-variant-numeric:tabular-nums}.timeline{padding:0 2px}.time-ruler{display:flex;justify-content:space-between;padding:0 0 5px 1px;color:#aab2ac;font-size:8px;font-variant-numeric:tabular-nums}.track{height:52px;display:flex;position:relative;gap:3px}.clip{position:relative;display:flex;align-items:center;gap:8px;padding:0 9px;border-radius:4px;overflow:hidden;background-color:#eff2ef;border:1px solid #e5eae5;color:#768179;font-size:9px}.main-clip{width:75%;background-size:cover;background-position:center}.secondary-clip{flex:1;background-size:cover;background-position:center}.clip.has-image{color:#fff;border-color:#ffffff1f}.clip-number{font-size:8px;opacity:.72}.clip-title{font-size:10px;font-weight:600;white-space:nowrap}.clip-duration{margin-left:auto;font-size:9px;opacity:.77}.playhead{position:absolute;top:-4px;bottom:-3px;width:1px;left:0;background:#c45f52;z-index:2}.playhead:before{content:"";position:absolute;left:-3px;top:-1px;width:7px;height:7px;background:#c45f52;border-radius:1px;transform:rotate(45deg)}.preview-footer{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding-top:10px;border-top:1px solid #eff1ef}.preview-footer>span{display:flex;align-items:center;gap:7px;font-size:9px;color:#95a098}.codec-dot{width:6px;height:6px;border-radius:50%;background:#81a68a}.download-button{display:flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid #dfe8e0;border-radius:5px;background:#f9fbf9;color:#3e7350;font-size:10px;font-weight:600;text-decoration:none;transition:.15s}.download-button:hover{border-color:#b4cbb9;background:#f1f7f2}.workspace-footer{display:flex;justify-content:space-between;color:#abb4ad;font-size:9px;margin:17px 2px 0}.workspace-footer span:first-child{font-weight:600;letter-spacing:.04em}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:1250px){.work-grid{grid-template-columns:390px minmax(0,1fr)}.preview-panel{padding-left:24px;padding-right:24px}.stage{height:clamp(420px,43vw,520px)}}@media(max-width:850px){.workspace{padding:33px 22px 20px}.work-grid{grid-template-columns:minmax(0,1fr);gap:16px}.control-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:22px;padding:19px}.control-panel>.section-heading:first-child,.upload-list,.upload-note,.panel-divider,.section-heading.compact,.settings-group,.action-area,.error-message{grid-column:1/-1}.panel-divider{margin:16px 0}.section-heading.compact{margin-bottom:12px}.settings-group{margin-bottom:13px}.action-area{padding-top:3px}.preview-panel{padding:17px}.stage{height:min(69vw,510px);min-height:320px}}@media(max-width:560px){.topbar{height:57px;padding:0 16px}.topbar-center{display:none}.privacy-mark{font-size:10px}.avatar{width:27px;height:27px}.workspace{padding:25px 13px 18px}.page-heading{align-items:center;margin-bottom:18px}.page-heading h1{font-size:20px;margin-top:6px;letter-spacing:-.04em}.page-heading p{font-size:11px}.eyebrow{font-size:9px}.sample-button{padding:8px 9px;font-size:10px;white-space:nowrap;gap:5px}.sample-button svg{width:14px}.control-panel{display:flex;padding:16px}.section-heading{gap:9px}.section-heading h2{font-size:13px}.section-heading p{font-size:10px}.image-card{height:76px}.preset-option{padding:8px 6px;grid-template-columns:25px 1fr;column-gap:5px;min-height:65px}.preset-icon{transform:scale(.88);transform-origin:left center}.preset-option>span:nth-child(2){font-size:10px}.preset-option small{font-size:8px}.fit-options{gap:6px}.fit-options button{gap:6px;padding:7px 6px}.fit-options b{font-size:9px}.fit-options small{font-size:8px}.fit-diagram{width:25px;height:27px}.preview-panel{padding:14px 11px 11px;border-radius:10px}.preview-header{margin:0 2px 11px}.preview-meta{gap:5px}.resolution-tag,.fps-tag{font-size:8px;padding:4px 5px}.stage{height:min(113vw,460px);min-height:295px;border-radius:6px}.image-preview,.result-video{height:calc(100% - 34px);max-width:calc(100% - 34px)}.stage.shape-landscape .image-preview,.stage.shape-landscape .result-video{width:90%;max-height:calc(100% - 74px)}.stage.shape-square .image-preview,.stage.shape-square .result-video{height:min(77%,350px)}.empty-stage h3{font-size:12px}.empty-stage p{font-size:9px}.timeline-heading{margin-top:13px}.timeline-sub{font-size:8px}.track{height:46px}.workspace-footer{font-size:8px;margin-top:14px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.workspace-footer>button{border:0;padding:4px 0;background:transparent;color:#87958b;font-size:9px;cursor:pointer;text-decoration:underline;text-decoration-color:#d6ded7;text-underline-offset:3px}.workspace-footer>button:hover{color:var(--green)}.copyright-dialog{width:min(440px,calc(100vw - 32px));max-width:none;padding:0;border:1px solid #e4eae4;border-radius:14px;background:#fff;color:#26352b;box-shadow:0 24px 80px #10221733;overflow:visible}.copyright-dialog::backdrop{background:#131f1885;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.copyright-card{padding:30px 32px 26px}.copyright-eyebrow{font-size:9px;font-weight:700;letter-spacing:.14em;color:#829188}.copyright-eyebrow span{padding:0 4px;color:#aeb9b0}.copyright-card h2{font-size:20px;line-height:1.35;letter-spacing:-.025em;margin:13px 0 10px;font-weight:600;color:#293c30}.copyright-card p{margin:0;color:#68766d;font-size:13px;line-height:1.9;overflow-wrap:anywhere}.copyright-card p a{color:#28664e;text-decoration:underline;text-decoration-color:#b9d0be;text-underline-offset:3px}.copyright-card p a:hover{color:#194b38}.copyright-dismiss{width:100%;height:40px;margin-top:22px;border:0;border-radius:7px;background:#28664e;color:#fff;font-size:12px;font-weight:600;cursor:pointer;transition:background .15s}.copyright-dismiss:hover{background:#194b38}.copyright-dismiss:focus-visible{outline-offset:3px}@media(max-width:560px){.copyright-card{padding:25px 22px 21px}.copyright-card h2{font-size:18px}.copyright-card p{font-size:12px}}
