@charset "UTF-8";
:root{font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;color:#172235;background:#f4f6fa;font-synthesis:none;font-size:16px}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,.dropzone:focus-within{outline:3px solid #7890ff;outline-offset:4px}header{height:88px;border-bottom:1px solid #e0e5ee;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 5%}.brand{display:flex;align-items:center;gap:12px;font-weight:750;font-size:22px;color:inherit;text-decoration:none}.brand-icon{background:#2443ed;color:#fff;border-radius:9px;width:34px;height:38px;display:grid;place-items:center;font-size:28px}.brand-en{font-size:12px;letter-spacing:2px;color:#778399;margin-left:6px}.local-badge{font-size:13px;color:#52617a;border:1px solid #dfe5ee;border-radius:30px;padding:9px 15px}main{max-width:1460px;margin:auto;padding:48px 5% 24px}.heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:34px}.eyebrow{font-size:12px;color:#2443ed;letter-spacing:2px;font-weight:700}h1{font-size:clamp(28px,3vw,40px);letter-spacing:-1.3px;margin:12px 0 10px;font-weight:720}.heading p{margin:0;color:#69768a;line-height:1.7}.ratio-mark{font-size:62px;letter-spacing:-4px;font-weight:300;color:#a5afc3}.ratio-mark span{color:#2443ed;margin:0 7px}.workspace{display:grid;grid-template-columns:330px minmax(0,1fr);gap:26px;align-items:start}.panel{background:#fff;border:1px solid #e1e6ef;border-radius:16px;padding:24px;margin-bottom:16px}.section-heading{display:flex;align-items:center;gap:10px;margin-bottom:20px}h2{font-size:16px;margin:0;font-weight:650}.step{font-size:12px;color:#7b87a0;border:1px solid #dbe1ee;border-radius:5px;padding:4px}.dropzone{display:flex;align-items:center;text-align:center;flex-direction:column;border:1.5px dashed #c2cbed;background:#f7f9ff;border-radius:10px;padding:26px 10px;gap:10px;position:relative;cursor:pointer}.dropzone:hover,.dropzone.dragover{background:#eef1ff;border-color:#2443ed}.dropzone input{position:absolute;width:100%;height:100%;inset:0;opacity:0;cursor:pointer}.upload-icon{color:#2443ed;font-size:25px;background:#e9eeff;width:44px;height:44px;display:grid;place-items:center;border-radius:12px;margin-bottom:3px}.dropzone strong{font-size:14px;max-width:100%;overflow-wrap:anywhere}.dropzone>span:last-of-type{font-size:12px;color:#7b879c}.text-button{border:0;background:none;color:#62728e;font-size:13px;padding:12px 0 0}#demo{display:block;margin:auto}.settings>label{display:block;font-size:14px;margin-bottom:9px;color:#536078}.settings select{width:100%;padding:12px;background:#fff;border:1px solid #d9e0ea;border-radius:8px;color:#25334b;font-size:14px;margin-bottom:22px}.fit-note{display:flex;align-items:flex-start;gap:11px;margin:0 0 24px;padding:14px;background:#f5f7fb;border-radius:8px}.fit-note>span{color:#2443ed;font-size:20px}.fit-note strong{font-size:13px;font-weight:600}.fit-note p{font-size:12px;line-height:1.8;color:#768299;margin:5px 0 0}.primary{border:0;border-radius:8px;background:#2443ed;color:#fff;padding:14px 18px;font-size:14px;font-weight:600;display:flex;justify-content:space-between;align-items:center;gap:18px}.primary:hover:not(:disabled){background:#1936d1}#convert{width:100%}#status{font-size:12px;color:#6d7b92;margin:13px 0 0;line-height:1.7}progress{width:100%;height:6px;accent-color:#2443ed;margin-top:12px}#error{font-size:13px;color:#b43232;line-height:1.7;background:#fff3f3;padding:10px;border-radius:6px}.privacy{font-size:12px;line-height:1.7;color:#7b879b;text-align:center;padding:0 8px}.preview{background:#eef1f6;border:1px solid #dfe5ee;border-radius:16px;min-height:684px;overflow:hidden}.preview-heading{padding:24px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#ffffffb8;border-bottom:1px solid #e0e5ed}.preview-heading h2{display:flex;align-items:center;gap:9px}#count{font-size:12px;background:#e8ecf4;color:#60708b;border-radius:5px;min-width:23px;padding:4px;text-align:center}.preview-heading p{font-size:12px;margin:8px 0 0;color:#7b879b}.secondary{padding:10px 14px;border:1px solid #d5ddea;border-radius:7px;background:#fff;color:#394962;font-size:13px;white-space:nowrap}.secondary:hover:not(:disabled){border-color:#2443ed;color:#2443ed}#empty{display:flex;min-height:560px;align-items:center;justify-content:center;flex-direction:column;padding:40px 20px;text-align:center;background-image:radial-gradient(#d0d7e5 .8px,transparent .8px);background-size:18px 18px}.paper-outline{width:150px;aspect-ratio:3/4;display:flex;align-items:center;justify-content:center;flex-direction:column;background:white;border:1px solid #d7dfec;box-shadow:8px 8px 0 #e6eaf2;border-radius:5px;gap:12px}.paper-outline span{font-size:35px;font-weight:300;color:#b4bdd0}.paper-outline div{font-size:12px;color:#9aa7bc;border:1px dashed #d7dfec;width:120px;height:92px;display:grid;place-items:center}h3{font-size:18px;font-weight:600;margin:30px 0 0}#empty p{font-size:13px;color:#7b879b;margin:12px 0 25px}.empty-spec{display:flex;gap:12px;align-items:center;color:#8591a7;font-size:12px}.empty-spec i{width:3px;height:3px;background:#aab4c6;border-radius:50%}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:22px;padding:24px}.gallery:empty{display:none}.image-card{min-width:0}.image-card img{width:100%;height:auto;aspect-ratio:3/4;object-fit:contain;background:#fff;display:block;box-shadow:0 3px 14px #25334b12;border:1px solid #dfe4ed;border-radius:3px}.card-info{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-top:12px;font-size:13px}.card-info a{color:#2443ed;text-decoration:none;font-size:12px}.card-info a:hover{text-decoration:underline}.card-detail{font-size:12px;color:#8490a4;margin-top:5px}footer{display:flex;justify-content:space-between;color:#8b96a8;font-size:12px;margin-top:36px;padding-top:18px;border-top:1px solid #e1e6ee}[hidden]{display:none!important}dialog{border:1px solid #dfe5ee;border-radius:16px;padding:28px;max-width:400px;width:90%;color:#172235}dialog::backdrop{background:#17223570}dialog p,dialog label{font-size:14px}dialog input{width:100%;padding:10px;border:1px solid #c2cbed;border-radius:6px;margin-top:8px}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}.dialog-actions button{border:0;border-radius:6px;padding:10px 18px}@media(min-width:1400px){.workspace{grid-template-columns:360px minmax(0,1fr)}.gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:800px){header{height:70px}.brand-en{display:none}main{padding-top:30px}.workspace{grid-template-columns:1fr}.ratio-mark{font-size:48px}.panel{padding:20px}.preview{min-height:450px}#empty{min-height:410px}.preview-heading{padding:20px}.heading p{font-size:14px}.gallery{grid-template-columns:repeat(2,minmax(0,1fr));padding:16px;gap:16px}}@media(max-width:400px){.local-badge{font-size:11px;padding:7px 9px}.ratio-mark{display:none}.preview-heading{flex-wrap:wrap}.brand{font-size:20px}.gallery{grid-template-columns:1fr}}

.check-row{display:flex;align-items:center;gap:10px;font-size:14px;cursor:pointer}.check-row input{width:18px;height:18px;accent-color:#2443ed;flex-shrink:0}.helper{font-size:12px;line-height:1.8;color:#69768a;margin:10px 0 16px}.page-plan{background:#eef1ff;color:#3346a2;font-size:13px;line-height:1.8;border-radius:8px;padding:12px;margin:0}.watermark input[type=text]{width:100%;border:1px solid #d9e0ea;border-radius:8px;padding:12px;color:#25334b;font-size:14px}.watermark input[type=range]{width:100%;accent-color:#2443ed;cursor:pointer}.watermark .range-label{display:flex;justify-content:space-between}.range-label output{font-variant-numeric:tabular-nums;color:#2443ed}.watermark .helper:last-child{margin-bottom:0}@media(min-width:801px){.preview{position:sticky;top:20px;max-height:calc(100vh - 40px);overflow:auto}.preview-heading{position:sticky;top:0;z-index:1;background:#f9fafc}}
.image-card img{aspect-ratio:auto}.gallery{align-items:start}.heading h1{font-size:clamp(26px,3vw,38px)}
.tool-entries{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:32px}.tool-entries a{display:flex;flex-direction:column;gap:9px;padding:20px 22px;border:1px solid #d9e0ec;border-radius:12px;background:#fff;color:#36445e;text-decoration:none;transition:border-color .15s,background .15s}.tool-entries strong{font-size:16px;font-weight:650}.tool-entries span{font-size:13px;line-height:1.7;color:#738098}.tool-entries a:hover{border-color:#8092f5;background:#f7f8ff}.tool-entries a[aria-current=page]{border-color:#2443ed;background:#eef1ff;box-shadow:inset 0 0 0 1px #2443ed}.tool-entries a[aria-current=page] strong{color:#2443ed}@media(max-width:540px){.tool-entries{grid-template-columns:1fr;gap:10px;margin-bottom:26px}.tool-entries a{padding:15px 17px}}
#watermark-options{margin-top:18px}#watermark-options>label{display:block;font-size:14px;margin-bottom:9px;color:#536078}#watermark-options>.range-label{display:flex}.brand{white-space:nowrap}@media(max-width:540px){header{height:auto;min-height:70px;flex-wrap:wrap;gap:12px;padding-top:14px;padding-bottom:14px}.brand{font-size:20px}.local-badge{font-size:12px}}

#live-preview{padding:24px;text-align:center} .live-toolbar{display:flex;align-items:center;justify-content:center;gap:20px} #live-status{font-size:13px;color:#71809c;min-height:20px} #live-canvas canvas{display:block;width:100%;max-width:525px;height:auto;margin:16px auto;background:white;box-shadow:0 3px 18px #18234218} #live-preview[hidden]{display:none}