@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',Arial,sans-serif;color:#19243c;background:#f7f8fb;font-synthesis:none;--blue:#2651ed;--muted:#778195;--line:#e9ecf2}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;transition:background .16s,box-shadow .16s,color .16s}button:disabled{cursor:default;opacity:.45}button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #8ca7ff;outline-offset:3px}button svg,.file-icon svg,.step-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.topbar{height:90px;background:#fff;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 5.1vw}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}.brand-icon{width:39px;height:43px;display:grid;place-items:center;background:var(--blue);border-radius:11px;color:#fff;overflow:hidden}.brand-icon svg{width:27px;fill:none;stroke:currentColor;stroke-width:2.5}.brand strong{font-family:Manrope,Arial,sans-serif;font-size:19px;letter-spacing:-.6px}.brand-divider{font-weight:400;color:#bcc3d2;margin:0 10px}.brand-name{font-weight:600}.brand small{display:block;margin-top:4px;letter-spacing:1.9px;font-size:8px;color:#81899b}.header-right{display:flex;align-items:center;gap:25px}.private-note{display:flex;align-items:center;gap:8px;font-size:11px;color:#6b778d}.status-dot{display:inline-block;width:6px;height:6px;background:#37ae80;border-radius:50%;margin-right:4px}.icon-button{background:#fff;border:1px solid #dce1eb;border-radius:50%;width:28px;height:28px;color:#68748a;font-size:15px}main{max-width:1540px;margin:auto;padding:42px 5.1vw 24px}.page-intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.eyebrow{color:var(--blue);font-size:9px;letter-spacing:1.55px;font-weight:700;margin-bottom:11px}h1{font-family:Manrope,Arial,sans-serif;font-size:30px;line-height:1.25;letter-spacing:-1.1px;margin:0 0 11px;font-weight:800}.mobile-break{display:none}.page-intro p{margin:0;color:#778195;font-size:12px}.workflow{display:flex;align-items:center;font-size:10px;gap:14px;color:#9aa2b2;padding-top:10px}.workflow span{white-space:nowrap;display:flex;align-items:center;gap:7px}.workflow b{width:23px;height:23px;display:grid;place-items:center;background:#eef0f5;border-radius:50%;font-size:8px;color:#8a94a6}.workflow i{height:1px;width:27px;background:#dce1eb}.workflow .current{color:#2651ed}.workflow .current b{background:#e4ebff;color:var(--blue)}.editor{display:grid;grid-template-columns:305px minmax(0,1fr);background:#fff;border:1px solid #e2e6ef;border-radius:15px;box-shadow:0 7px 25px #203c6c06;overflow:hidden}.controls{border-right:1px solid var(--line);background:#fff}.upload-section{padding:22px 23px 18px}.section-label{display:flex;justify-content:space-between;align-items:center;font-size:9px;font-weight:700;letter-spacing:.8px;color:#6f7a90;margin-bottom:14px}.text-button{border:0;background:none;color:#8892a5;font-size:10px;letter-spacing:0;padding:0}.text-button:hover{color:var(--blue)}.upload-box{width:100%;border:1px dashed #a8b7e0;border-radius:8px;background:#f7f9ff;display:flex;align-items:center;text-align:left;gap:11px;padding:15px 12px;color:var(--blue)}.upload-box:hover{background:#edf2ff;border-color:var(--blue)}.upload-box svg{width:21px;height:25px}.upload-box strong{font-size:12px;font-weight:600;display:block;color:#304269}.upload-box small{display:block;font-size:10px;color:#8491a9;margin-top:4px}.upload-plus{margin-left:auto;font-size:20px;color:#91a1c5}.file-card{display:flex;gap:9px;align-items:center;margin-top:15px}.file-card[hidden]{display:none}.file-icon{display:grid;place-items:center;flex:0 0 29px;height:35px;background:#f1f3f8;border-radius:5px;color:#9099ad}.file-icon svg{width:16px}.file-card>span:nth-child(2){min-width:0;flex:1}.file-card b{font-size:10px;font-weight:500;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:175px}.file-card small{display:block;font-size:9px;color:#99a0ae;margin-top:4px}.demo-badge{font-size:7px;letter-spacing:.5px;padding:4px 5px;background:#f1f3f7;border-radius:3px;color:#8b93a5}.control-section{padding:22px 23px;border-top:1px solid var(--line)}.section-title{display:flex;align-items:center;gap:9px}.step-icon{display:grid;place-items:center;width:26px;height:26px;border-radius:7px;color:var(--blue);background:#edf2ff}.step-icon svg{width:17px;height:17px}.section-title h2{font-size:13px;font-weight:700;letter-spacing:-.2px;margin:0}.auto-badge{margin-left:auto;color:var(--blue);font-size:7px;letter-spacing:.8px;background:#edf2ff;padding:4px 6px;border-radius:4px;font-weight:700}.control-description{font-size:10px;color:#8a93a4;margin:10px 0 18px;line-height:1.6}.presets{display:flex;background:#f5f6f9;padding:3px;border-radius:7px;margin-bottom:22px}.presets button{flex:1;background:transparent;border:0;border-radius:5px;padding:7px 4px;font-size:10px;color:#8992a5}.presets button.selected{color:var(--blue);background:#fff;box-shadow:0 1px 4px #223f7420;font-weight:700}.range-label{display:flex;justify-content:space-between;align-items:center;font-size:10px;margin-bottom:11px}.range-label output{background:#f3f5fa;border:1px solid #e9ecf3;border-radius:4px;padding:3px 6px;font-size:9px;min-width:42px;text-align:center;color:#69758d}input[type=range]{display:block;width:100%;height:4px;accent-color:var(--blue);margin:0;cursor:pointer}input[type=range]:disabled{cursor:default}.range-captions{display:flex;justify-content:space-between;color:#a3a9b5;font-size:8px;margin-top:10px}.check-row{display:flex;align-items:center;gap:7px;font-size:9px;color:#66738a;margin-top:21px;cursor:pointer}.check-row input{accent-color:var(--blue);margin:0;width:12px;height:12px}.info-dot{display:grid;place-items:center;width:11px;height:11px;border:1px solid #a8b2c5;border-radius:50%;font-size:7px;margin-left:auto;color:#939eb2}.advanced{margin-top:15px;color:#939daf;font-size:9px}.advanced summary{cursor:pointer}.advanced p{line-height:1.65;margin-bottom:0}.number-row{display:flex;align-items:center;justify-content:space-between;margin-top:12px;color:#68748b}.number-row small{display:block;font-size:8px;color:#9aa3b4;margin-top:4px}.number-row input{width:55px;border:1px solid #dde2ec;border-radius:4px;padding:5px;font-size:10px;color:#526079}.outline-section{padding-top:20px;padding-bottom:21px}.outline-icon{background:#f3f4f8;color:#8590a6}.switch{margin-left:auto;position:relative;width:30px;height:17px;cursor:pointer}.switch input{position:absolute;opacity:0;width:30px;height:17px;margin:0}.switch span{display:block;width:30px;height:17px;border-radius:15px;background:#dce1ea;pointer-events:none}.switch span:after{content:'';position:absolute;left:3px;top:3px;width:11px;height:11px;background:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 1px 2px #0002}.switch input:checked+span{background:var(--blue)}.switch input:checked+span:after{transform:translateX(13px)}.switch input:focus-visible+span{outline:3px solid #8ca7ff}.outline-controls.disabled{opacity:.5}.color-row{display:flex;align-items:center;justify-content:space-between;margin-top:19px;font-size:10px}.swatches{display:flex;align-items:center;gap:9px}.swatch{width:19px;height:19px;border:1px solid #dce1e9;border-radius:50%;position:relative;padding:0}.swatch.white{background:#fff}.swatch.black{background:#111827}.swatch.blue{background:#2651ed}.swatch.selected{outline:1.5px solid var(--blue);outline-offset:3px}.custom-color{position:relative;display:block;width:21px;height:21px;border:1px dashed #b0b8c8;border-radius:50%;overflow:hidden;cursor:pointer;color:#8793a9}.custom-color svg{pointer-events:none;position:absolute;inset:3px;width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.5}.custom-color input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}.small-note{color:#a1a9b8;font-size:8px;margin:15px 0 0}.export-section{border-top:1px solid var(--line);padding:20px 23px}.download-button{width:100%;border:0;background:var(--blue);color:#fff;border-radius:8px;display:flex;align-items:center;justify-content:center;gap:9px;padding:13px 12px;font-size:11px;font-weight:600;box-shadow:0 3px 7px #2651ed1a}.download-button:hover:not(:disabled){background:#153ed2;box-shadow:0 4px 14px #2651ed30}.download-button svg{width:16px;height:16px}.download-button .arrow{margin-left:auto;font-size:14px;font-weight:400}.download-button>span:nth-child(2){flex:1;text-align:left}.export-section p{font-size:8px;color:#969fb1;text-align:center;margin:10px 0 0}.workspace{min-width:0;display:flex;flex-direction:column}.preview-toolbar{height:63px;display:flex;align-items:center;justify-content:space-between;padding:0 23px;border-bottom:1px solid var(--line);gap:10px}.view-tabs{display:flex;background:#f2f4f8;border-radius:6px;padding:3px}.view-tabs button{border:0;background:none;padding:6px 12px;font-size:10px;border-radius:4px;color:#929bae}.view-tabs button.active{background:#fff;box-shadow:0 1px 4px #1b294718;color:#2d3d5b;font-weight:600}.view-tabs button span{margin-left:5px;font-size:12px}.preview-tools{display:flex;align-items:center;gap:8px}.backgrounds{display:flex;gap:6px;align-items:center}.bg-option{width:15px;height:15px;border:1px solid #dce1e9;border-radius:3px;padding:0}.bg-option.active{outline:1px solid #8ea6ee;outline-offset:2px}.checker{background-color:#fff;background-image:linear-gradient(45deg,#e0e5ed 25%,transparent 25%),linear-gradient(-45deg,#e0e5ed 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e0e5ed 75%),linear-gradient(-45deg,transparent 75%,#e0e5ed 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0}.light{background:#fff}.dark{background:#252b39}.tool-separator{height:15px;width:1px;background:#e7eaf0;margin:0 5px}.zoom-button,.fit-button{border:0;background:none;color:#8b95a8;padding:3px;font-size:15px}.fit-button{font-size:10px;min-width:33px}.preview-area{position:relative;flex:1;min-height:560px;height:620px;overflow:auto;display:grid;place-items:center;padding:46px 28px 30px;background:#fff;isolation:isolate}.checker-bg{background-color:#fff;background-image:linear-gradient(45deg,#f0f2f6 25%,transparent 25%),linear-gradient(-45deg,#f0f2f6 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f0f2f6 75%),linear-gradient(-45deg,transparent 75%,#f0f2f6 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}.preview-area.dark-bg{background:#242a36}.sample-marker{position:absolute;top:19px;left:23px;font-size:9px;color:#a0a7b6;display:flex;align-items:center;gap:9px;z-index:2}.sample-marker span{font-size:7px;letter-spacing:.7px;background:#fff;border:1px solid #e3e7ef;padding:4px 6px;border-radius:3px;color:#7b8ba6}.canvas-wrap{position:relative;flex:none}.canvas-wrap canvas{display:block;width:100%;height:100%}.canvas-wrap .original-layer{position:absolute;inset:0;pointer-events:none}.compare-divider{position:absolute;top:0;bottom:0;width:2px;background:#fff;box-shadow:0 0 0 1px #2345b049;pointer-events:none;z-index:3}.compare-divider span{position:absolute;top:48%;left:-15px;display:grid;place-items:center;width:32px;height:32px;background:#fff;border:1px solid #d5ddeb;border-radius:50%;color:var(--blue);box-shadow:0 2px 8px #20335618}.compare-label{position:absolute;top:9px;background:#fffdf5e8;color:#6d7891;border:1px solid #dee5f4;border-radius:4px;padding:4px 6px;font-size:7px;letter-spacing:1px;pointer-events:none}.before-label{left:9px}.after-label{right:9px}.empty-state{text-align:center;max-width:300px;color:#8a96ad}.empty-icon{background:#ecf1ff;width:68px;height:68px;border-radius:18px;display:grid;place-items:center;margin:auto;color:var(--blue);font-size:33px}.empty-state h2{font-size:16px;color:#425472;margin-top:20px}.empty-state p{font-size:11px;line-height:1.7}.secondary-button{font-size:11px;color:var(--blue);background:#fff;border:1px solid #cbd6f6;border-radius:6px;padding:9px 16px;margin-top:12px}.preview-footer{height:41px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 22px;font-size:8px;color:#9aa3b4;gap:10px}.preview-footer>span:first-child{color:#76869c}.preview-footer .status-dot{width:5px;height:5px}.tip-bar{min-height:65px;display:flex;align-items:center;padding:12px 22px;border-top:1px solid var(--line);gap:11px;background:#fcfdff}.tip-star{font-size:24px;color:#8aa4ed}.tip-bar p{font-size:9px;color:#9ba4b5;line-height:1.8;margin:0}.tip-bar b{display:block;color:#687a98;font-weight:500}.tip-bar button{margin-left:auto;color:#90a4cb;border:0;background:none;font-size:16px}.page-footer{display:flex;justify-content:space-between;gap:15px;font-size:8px;color:#a0a8b8;margin-top:20px}.page-footer>span:first-child{font-style:italic;color:#8d98ae}.page-footer i{margin:0 7px;font-style:normal}.loading-overlay,.drop-overlay{position:absolute;inset:0;display:grid;place-items:center;background:#ffffffa3;backdrop-filter:blur(3px);z-index:10}.processing-card{width:250px;background:#fff;border:1px solid #e3e9f5;border-radius:14px;box-shadow:0 8px 35px #1b357415;padding:25px;text-align:center}.spinner{display:block;width:23px;height:23px;border:2px solid #e2e9ff;border-top-color:var(--blue);border-radius:50%;margin:0 auto 14px;animation:spin .8s linear infinite}.processing-card b{font-size:11px}.processing-card small{font-size:8px;color:#9aa3b4;display:block;margin:10px 0 14px}.progress-track{height:3px;background:#edf1fb;border-radius:3px;margin-top:16px;overflow:hidden}.progress-track span{display:block;height:100%;background:var(--blue);width:8%;transition:width .2s}.drop-overlay{background:#ecf1ffed;border:3px dashed #7799ff;backdrop-filter:none}.drop-overlay b,.drop-overlay span{display:block;text-align:center}.drop-overlay b{font-size:21px;color:var(--blue)}.drop-overlay span{font-size:12px;margin-top:10px;color:#7689ac}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);max-width:min(90vw,550px);background:#1d2c48;color:#fff;padding:13px 20px;border-radius:9px;font-size:12px;line-height:1.6;z-index:50;box-shadow:0 8px 30px #14294c30}dialog{border:1px solid #e0e6f0;border-radius:18px;padding:35px;max-width:480px;width:calc(100% - 30px);color:#283b5c;box-shadow:0 25px 90px #142c5b33}dialog::backdrop{background:#24324b70;backdrop-filter:blur(4px)}dialog h2{font-size:23px;letter-spacing:-.6px;margin-bottom:25px}dialog ol{padding-left:20px}dialog li{font-size:12px;padding-left:5px;margin-bottom:20px}dialog p{font-size:11px;line-height:1.8;color:#8590a6}.help-note{padding:13px;background:#f4f6fb;border-radius:7px}.dialog-close{position:absolute;right:17px;top:12px;border:0;background:none;font-size:23px;color:#919bad}[hidden]{display:none!important}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:1500px){.preview-area{height:700px}.controls{font-size:13px}}@media(max-width:1100px){main{padding:30px 25px}.topbar{padding:0 25px}.workflow{gap:8px}.workflow i{width:14px}.editor{grid-template-columns:280px minmax(0,1fr)}.preview-toolbar{padding:0 14px}.view-tabs button{padding:6px 9px}.preview-tools{gap:4px}.backgrounds{gap:5px}.preview-area{padding-left:18px;padding-right:18px}}@media(max-width:800px){.workflow{display:none}.preview-toolbar{flex-wrap:wrap;height:auto;min-height:75px;padding:10px}.preview-tools{margin-left:auto}.editor{grid-template-columns:250px minmax(0,1fr)}.control-section,.upload-section,.export-section{padding-left:18px;padding-right:18px}.preview-area{min-height:620px}.private-note{display:none}.page-footer{font-size:7px}}@media(max-width:620px){.topbar{height:73px;padding:0 20px}.brand strong{font-size:16px}.brand-icon{width:33px;height:37px}.brand small{font-size:6px}.brand-divider{margin:0 7px}main{padding:28px 15px 20px}.page-intro{margin-bottom:22px}.eyebrow{font-size:8px;letter-spacing:1px}h1{font-size:26px}.mobile-break{display:block}.page-intro p{font-size:10px;line-height:1.8}.editor{display:flex;flex-direction:column}.workspace{order:0}.controls{order:1;border-right:0;display:grid;grid-template-columns:1fr 1fr}.upload-section{grid-column:1/-1;border-top:1px solid var(--line);padding:17px}.upload-box{padding:12px}.file-card{margin-top:10px}.control-section{padding:20px 16px}.outline-section{border-left:1px solid var(--line)}.export-section{grid-column:1/-1;padding:17px}.preview-area{height:390px;min-height:390px;padding:40px 25px 22px;flex:none}.preview-toolbar{min-height:55px;flex-wrap:nowrap;gap:4px}.view-tabs button{font-size:9px;padding:6px 8px}.preview-tools{gap:3px}.backgrounds{gap:5px}.bg-option{width:13px;height:13px}.tool-separator{margin:0 3px}.fit-button{font-size:9px;min-width:25px}.preview-footer{font-size:7px;padding:0 13px}.tip-bar{display:none}.sample-marker{font-size:8px;top:14px;left:14px}.control-description{font-size:9px;min-height:29px;margin-bottom:14px}.section-title h2{font-size:12px}.step-icon{width:23px;height:23px}.auto-badge{display:none}.range-label{font-size:9px}.presets button{font-size:9px}.check-row{font-size:8px;gap:4px;line-height:1.5}.small-note{font-size:8px;line-height:1.5}.swatches{gap:7px}.swatch{width:16px;height:16px}.color-row{font-size:9px}.page-footer{line-height:1.8}.page-footer>span:last-child{max-width:220px;text-align:right}.download-button{padding:14px;font-size:12px}.advanced{font-size:8px}.number-row{flex-wrap:wrap;gap:8px}.section-label{font-size:9px}.private-note{display:none}}@media(prefers-reduced-motion:reduce){*{transition:none!important}.spinner{animation-duration:2s}}