#app,body,html{height:100%}.desktop-only[data-v-416f5539]{display:flex}@media (max-width:768px){.desktop-only[data-v-416f5539]{display:none}}.mobile-overlay[data-v-416f5539]{position:fixed;inset:0;background:rgba(0,0,0,.2);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:1001}.mobile-drawer[data-v-416f5539]{position:fixed;top:0;right:0;height:100vh;width:280px;background:hsla(0,0%,100%,.92);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);box-shadow:var(--shadow-lg);z-index:1002;display:flex;flex-direction:column;border-left:1px solid rgba(0,0,0,.06)}.drawer-header[data-v-416f5539]{display:flex;align-items:center;justify-content:flex-end;padding:1rem;border-bottom:1px solid rgba(0,0,0,.06)}.drawer-close[data-v-416f5539]{width:32px;height:32px;border:none;background:rgba(0,0,0,.05);cursor:pointer;color:var(--gray-600);font-size:20px;line-height:1;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s}.drawer-close[data-v-416f5539]:hover{background:rgba(0,0,0,.1);color:var(--gray-900)}.drawer-nav[data-v-416f5539]{display:flex;flex-direction:column;padding:1rem;gap:.5rem}.drawer-nav .nav-link[data-v-416f5539]{font-size:.9375rem;padding:.75rem 1rem;border-radius:10px;color:var(--gray-700);text-decoration:none;transition:all .2s;font-weight:500;border:none}.drawer-nav .nav-link.router-link-active[data-v-416f5539],.drawer-nav .nav-link[data-v-416f5539]:hover{background:rgba(0,122,255,.1);color:var(--primary)}.overlay-fade-enter-active[data-v-416f5539],.overlay-fade-leave-active[data-v-416f5539]{transition:opacity .3s cubic-bezier(.4,0,.2,1)}.overlay-fade-enter-from[data-v-416f5539],.overlay-fade-leave-to[data-v-416f5539]{opacity:0}.drawer-slide-enter-active[data-v-416f5539],.drawer-slide-leave-active[data-v-416f5539]{transition:transform .3s cubic-bezier(.4,0,.2,1)}.drawer-slide-enter-from[data-v-416f5539],.drawer-slide-leave-to[data-v-416f5539]{transform:translateX(100%)}.processing-overlay[data-v-31a13c64]{position:fixed;inset:0;background:hsla(0,0%,100%,.5);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:1000}.processing-box[data-v-31a13c64]{background:hsla(0,0%,100%,.9);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);color:var(--gray-900);padding:20px 32px;border-radius:16px;box-shadow:var(--shadow-lg);font-size:16px;font-weight:500;border:1px solid rgba(0,0,0,.06)}.xhs-images[data-v-31a13c64]{margin-top:24px}.xhs-header[data-v-31a13c64]{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px}.xhs-title[data-v-31a13c64]{font-size:1.25rem;font-weight:600;color:var(--gray-900);margin:0;letter-spacing:-.01em}.xhs-toolbar[data-v-31a13c64]{display:flex;gap:12px}.badge[data-v-31a13c64]{margin-left:6px;padding:2px 8px;background:hsla(0,0%,100%,.3);border-radius:12px;font-size:12px;font-weight:600}.btn[data-v-31a13c64]{cursor:pointer;border:none;border-radius:8px;padding:8px 16px;font-size:13px;font-weight:500;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-sm)}.btn[data-v-31a13c64]:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn[data-v-31a13c64]:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.btn-primary[data-v-31a13c64]{color:#fff;background:var(--primary)}.btn-primary[data-v-31a13c64]:hover{background:var(--primary-dark)}.btn-secondary[data-v-31a13c64]{color:var(--primary);background:rgba(0,122,255,.1)}.btn-secondary[data-v-31a13c64]:hover{background:rgba(0,122,255,.15)}.xhs-grid[data-v-31a13c64]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}@media (min-width:768px){.xhs-grid[data-v-31a13c64]{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width:1024px){.xhs-grid[data-v-31a13c64]{grid-template-columns:repeat(4,minmax(0,1fr))}}.xhs-card[data-v-31a13c64]{background:var(--white);border-radius:16px;padding:12px;box-shadow:var(--shadow-sm);border:1px solid var(--gray-200);transition:all .3s cubic-bezier(.4,0,.2,1)}.xhs-card[data-v-31a13c64]:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--gray-300)}.xhs-card-image[data-v-31a13c64]{width:100%;aspect-ratio:10/16;-o-object-fit:cover;object-fit:cover;border-radius:12px;background:var(--gray-50)}.xhs-card-actions[data-v-31a13c64]{display:flex;justify-content:center;gap:10px;margin:12px 0 4px}.pill[data-v-31a13c64]{border:none;border-radius:8px;padding:6px 14px;font-size:12px;font-weight:500;color:#fff;background:var(--primary);cursor:pointer;transition:all .2s;box-shadow:var(--shadow-sm)}.pill[data-v-31a13c64]:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}.pill-secondary[data-v-31a13c64]{background:rgba(0,122,255,.1);color:var(--primary)}.pill-secondary[data-v-31a13c64]:hover{background:rgba(0,122,255,.15)}.ks-video video[data-v-31a13c64],.xhs-video video[data-v-31a13c64]{width:100%;max-width:640px;border-radius:16px;box-shadow:var(--shadow-md)}.video-actions[data-v-31a13c64]{margin-top:16px;display:flex;gap:12px;flex-wrap:wrap}@media (min-width:768px){.features-list[data-v-31a13c64]{grid-template-columns:repeat(4,1fr)!important}}

/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */.img-dropzone[data-v-cd698822]{border:2px dashed var(--gray-300);background:var(--gray-50);cursor:pointer;text-align:center;border-radius:16px;justify-content:center;align-items:center;width:100%;min-height:200px;margin-bottom:24px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.img-dropzone[data-v-cd698822]:hover{border-color:var(--primary);background:#007aff0d}.img-dropzone.dragover[data-v-cd698822]{border-color:var(--primary);background:#007aff1a;transform:scale(1.01)}.img-dropzone-content[data-v-cd698822]{box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:40px 20px;display:flex}.preview-container[data-v-cd698822]{justify-content:center;align-items:center;width:100%;height:150px;margin-bottom:16px;display:flex}.preview-in-dropzone[data-v-cd698822]{-o-object-fit:contain;object-fit:contain;width:auto;max-width:100%;height:auto;max-height:100%;box-shadow:var(--shadow-md);border-radius:12px;margin:0 auto;display:block}.upload-icon[data-v-cd698822]{color:var(--gray-400);justify-content:center;align-items:center;width:100%;margin-bottom:16px;transition:color .3s;display:flex}.img-dropzone:hover .upload-icon[data-v-cd698822]{color:var(--primary)}.img-dropzone-content p[data-v-cd698822]{color:var(--gray-500);text-align:center;width:100%;margin:4px 0;font-size:.875rem}.img-dropzone-content p[data-v-cd698822]:first-of-type{color:var(--gray-700);font-size:1rem;font-weight:500}.compress-list[data-v-cd698822]{margin-top:0}.compress-header[data-v-cd698822]{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.compress-header h3[data-v-cd698822]{color:var(--gray-900);letter-spacing:-.01em;margin:0;font-size:1.125rem;font-weight:600}.clear-all-btn[data-v-cd698822]{color:#ff3b30;cursor:pointer;background:#ff3b301a;border:none;border-radius:8px;padding:6px 12px;font-size:.8125rem;font-weight:500;transition:all .2s}.clear-all-btn[data-v-cd698822]:hover{background:#ff3b3033}.compress-items[data-v-cd698822]{flex-direction:column;gap:12px;display:flex}.compress-item[data-v-cd698822]{background:var(--white);border:1px solid var(--gray-200);box-shadow:var(--shadow-sm);border-radius:12px;grid-template-columns:1fr auto auto auto auto;align-items:center;gap:16px;padding:12px 16px;transition:all .3s cubic-bezier(.4,0,.2,1);display:grid;position:relative}.compress-item[data-v-cd698822]:hover{box-shadow:var(--shadow-md);border-color:var(--gray-300);transform:translateY(-2px)}.file-info[data-v-cd698822]{align-items:center;gap:12px;min-width:0;display:flex}.file-thumbnail[data-v-cd698822]{background:var(--gray-50);border:1px solid #0000000d;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:relative;overflow:hidden}.file-thumbnail img[data-v-cd698822]{-o-object-fit:cover;object-fit:cover;width:100%;height:100%}.thumbnail-placeholder[data-v-cd698822]{color:var(--gray-400)}.file-name[data-v-cd698822]{color:var(--gray-900);white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:.875rem;font-weight:500;overflow:hidden}.file-size[data-v-cd698822]{color:var(--gray-500);white-space:nowrap;font-size:.8125rem;font-weight:500}.compress-progress[data-v-cd698822]{background:var(--gray-100);border-radius:3px;width:80px;height:6px;overflow:hidden}.progress-bar[data-v-cd698822]{border-radius:3px;height:100%;transition:width .3s}.compress-result[data-v-cd698822]{white-space:nowrap;align-items:center;gap:12px;display:flex}.compress-result span[data-v-cd698822]:first-child{color:var(--gray-900);min-width:60px;font-size:.8125rem;font-weight:500}.download-link[data-v-cd698822]{background:var(--primary);color:#fff;box-shadow:var(--shadow-sm);border-radius:6px;padding:6px 12px;font-size:.75rem;font-weight:500;text-decoration:none;transition:all .2s}.download-link[data-v-cd698822]:hover{background:var(--primary-dark);box-shadow:var(--shadow-md);transform:translateY(-1px)}.compress-ratio[data-v-cd698822]{text-align:right;min-width:50px;font-size:.75rem;font-weight:600}.ratio-good[data-v-cd698822]{color:#34c759}.ratio-normal[data-v-cd698822]{color:#ff9500}.ratio-neutral[data-v-cd698822]{color:var(--gray-500)}.remove-file-btn[data-v-cd698822]{color:var(--gray-400);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.remove-file-btn[data-v-cd698822]:hover{color:#ff3b30;background:#ff3b301a}.loading-state[data-v-cd698822]{color:var(--gray-500);flex-direction:column;justify-content:center;align-items:center;padding:40px;display:flex}.loading-spinner[data-v-cd698822]{border:3px solid var(--gray-200);border-top:3px solid var(--primary);border-radius:50%;width:32px;height:32px;margin-bottom:12px;animation:spin-cd698822 1s linear infinite}@keyframes spin-cd698822{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@media (max-width:768px){.compress-item[data-v-cd698822]{grid-template-rows:auto auto auto;grid-template-columns:1fr auto;gap:8px 16px}.file-info[data-v-cd698822]{grid-column:1/-1}.file-size[data-v-cd698822]{justify-self:start}.compress-progress[data-v-cd698822]{justify-self:end}.compress-result[data-v-cd698822]{border-top:1px solid var(--gray-100);grid-column:1/-1;justify-content:space-between;margin-top:4px;padding-top:8px}.remove-file-btn[data-v-cd698822]{position:absolute;top:8px;right:8px}.img-dropzone-content[data-v-cd698822]{padding:30px 15px}.preview-in-dropzone[data-v-cd698822]{max-height:120px}}@media (max-width:480px){.compress-header[data-v-cd698822]{flex-direction:column;align-items:flex-start;gap:8px}.clear-all-btn[data-v-cd698822]{align-self:flex-end}.file-name[data-v-cd698822]{font-size:.8125rem}.compress-result[data-v-cd698822]{flex-wrap:wrap;gap:8px}}.compare-container[data-v-cd698822]{width:100%;height:300px;box-shadow:var(--shadow-lg);border:1px solid #0000000d;border-radius:16px;position:relative;overflow:hidden}.compare-image[data-v-cd698822]{-o-object-fit:cover;object-fit:cover;width:100%;height:100%;position:absolute;top:0;left:0}.compare-image.compressed[data-v-cd698822]{clip-path:inset(0 50% 0 0)}.compare-slider[data-v-cd698822]{cursor:col-resize;width:2px;height:100%;position:absolute;top:0;left:50%;box-shadow:0 0 10px #0003}.compare-slider[data-v-cd698822],.slider-button[data-v-cd698822]{background:var(--white);justify-content:center;align-items:center;display:flex}.slider-button[data-v-cd698822]{width:40px;height:40px;color:var(--primary);border-radius:50%;box-shadow:0 2px 8px #0003}.slider-button svg path[data-v-cd698822]{fill:var(--primary)}.compare-info[data-v-cd698822]{z-index:10;color:#fff;text-shadow:0 1px 3px #00000080;justify-content:space-between;font-size:.75rem;font-weight:600;display:flex;position:absolute;top:16px;left:16px;right:16px}.info-ratio[data-v-cd698822]{color:#34c759;margin-left:8px}.download-link.disabled[data-v-cd698822]{opacity:.5;cursor:not-allowed;pointer-events:none;background:var(--gray-400);box-shadow:none}


/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */body{background:var(--gray-50)}.img-workspace,.img-workspace>*,.tool-content,.tool-content>*,.tools,.tools .container{margin-top:0!important;margin-bottom:0!important;padding-top:0!important}.tools .container{margin-bottom:0!important;padding-top:0!important;padding-bottom:0!important}.tool-content{z-index:1;max-width:none;position:relative;min-height:240px!important;padding-top:24px!important;padding-bottom:0!important}.img-workspace{flex-direction:column;width:100%;display:flex;gap:0!important;min-height:200px!important;margin:0!important;padding:0!important}.img-dropzone{box-sizing:border-box;background:#fff;border:2px dashed #60a5fa;border-radius:10px;width:min(680px,92%);overflow:visible;height:200px!important;margin:0 auto!important;padding:0!important}.img-dropzone.dragover,.img-dropzone:hover{background:#3b82f60f;border-color:#3b82f6}.img-dropzone-content{color:#475569;margin:0;padding:0;gap:12px!important}.upload-icon{color:#60a5fa!important;justify-content:center!important;align-items:center!important;width:64px!important;height:64px!important;display:flex!important}.upload-icon svg{opacity:1!important;visibility:visible!important;color:#60a5fa!important;stroke:#60a5fa!important;fill:none!important;stroke-width:2px!important;width:48px!important;height:48px!important;margin-bottom:0!important;display:block!important}.upload-icon svg *{stroke:inherit!important;color:inherit!important}.img-dropzone-content p{color:#64748b;padding:0 20px;margin:0!important;font-size:15px!important;line-height:1.5!important}.img-dropzone-content p:first-of-type{color:#374151!important;margin-bottom:4px!important;font-size:16px!important;font-weight:600!important}.img-dropzone-content p:last-of-type{color:#6b7280!important;font-size:14px!important;line-height:1.4!important}.compress-list{margin-top:0!important;margin-bottom:0!important;padding-top:0!important;padding-bottom:0!important}.content-wrapper{grid-template-rows:1fr!important;grid-template-columns:1fr 1fr!important;align-items:stretch!important;gap:12px!important;height:320px!important;min-height:320px!important;max-height:320px!important;margin-top:24px!important;padding-top:0!important;display:grid!important}.demo-section{margin-top:0!important;display:flex!important}.demo-compare,.demo-section{width:100%!important;height:100%!important;min-height:0!important;max-height:100%!important}.demo-compare{background:#f8fafc;border-radius:10px;overflow:hidden;flex:1!important}.compare-container{-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%!important;height:100%!important;min-height:0!important;max-height:100%!important;position:relative!important}.compare-image{inset:0}.compare-image.original{z-index:1}.compare-image.compressed{z-index:2}.compare-info{z-index:4;font-size:12px;top:8px;left:8px;right:8px}.info-compressed,.info-original{background:#0000008c;border-radius:4px;padding:4px 8px}.info-ratio{color:#10b981;margin-left:6px}.compare-slider{z-index:3;background:#fffffff2;width:4px;bottom:0;transform:translate(-50%)}.slider-button{background:#2563eb;border:2px solid #fff;width:26px;height:26px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.features-section{background:#fff;border-radius:10px;flex-direction:column!important;height:100%!important;min-height:0!important;max-height:100%!important;margin-top:0!important;padding:12px!important;display:flex!important;overflow:hidden!important}.features-title{color:#1e3a8a;font-weight:600;margin:0 0 6px!important;font-size:16px!important}.tool-links{margin-bottom:6px!important}.tool-link{color:#1e3a8a;background:#e0edff;border:1px solid #93c5fd;border-radius:999px;align-items:center;gap:8px;padding:6px 12px;font-size:13px;font-weight:600;text-decoration:none;display:inline-flex}.tool-link:hover{background:#d6e6ff}.features-desc{color:#64748b;margin:4px 0 8px!important;font-size:12px!important;line-height:1.5!important}.feature-list{flex-direction:column;display:flex;flex:1!important;gap:6px!important;overflow:hidden!important}.feature-item{background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 1px 3px #0000000f;flex-shrink:1!important;min-height:0!important;padding:8px 10px!important}.feature-content h3{color:#111827;font-weight:600;margin:0 0 4px!important;font-size:13px!important}.feature-content p{color:#6b7280;margin:0;font-size:11px!important;line-height:1.4!important}@media (max-width:1024px){.compare-container{min-height:0}}@media (max-width:768px){.tool-content{min-height:180px!important;padding-top:20px!important}.img-workspace{min-height:140px!important}.img-dropzone{height:150px!important}.upload-icon{color:#60a5fa!important;width:56px!important;height:56px!important}.upload-icon svg{stroke:#60a5fa!important;color:#60a5fa!important;width:40px!important;height:40px!important}.img-dropzone-content p{font-size:14px!important}.img-dropzone-content p:first-of-type{font-size:15px!important}.content-wrapper{grid-template-columns:1fr!important;height:200px!important;min-height:200px!important;max-height:200px!important;margin-top:20px!important}.features-section{padding:10px!important;overflow:visible!important}.feature-list{gap:4px!important}.feature-item{padding:6px 8px!important}}@media (max-width:480px){.tool-content{min-height:160px!important;padding-top:16px!important}.img-workspace{min-height:120px!important}.img-dropzone{height:130px!important}.upload-icon{color:#60a5fa!important;width:48px!important;height:48px!important}.upload-icon svg{stroke:#60a5fa!important;color:#60a5fa!important;width:36px!important;height:36px!important}.img-dropzone-content p{font-size:13px!important}.img-dropzone-content p:first-of-type{font-size:14px!important}.content-wrapper{height:180px!important;min-height:180px!important;max-height:180px!important}.compare-container{min-height:0}}

/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */:root{--shadow-sm:0 1px 3px #0000000a;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 10px 30px #0000001f}html{scrollbar-color:var(--gray-300)transparent}html::-webkit-scrollbar-track{background:0 0}.container{padding:.2rem .75rem}.header{-webkit-backdrop-filter:saturate(180%)blur(var(--blur-amount));background:#ffffffb8;border-bottom:.5px solid #00000014}.mobile-menu-btn{background:0 0}.mobile-menu-btn span{transition:all .3s}.mobile-menu-btn.active span:first-child{transform:rotate(45deg)translate(5px,5px)}.mobile-menu-btn.active span:nth-child(3){transform:rotate(-45deg)translate(7px,-6px)}.nav-link:hover{background:#007aff14}.nav-link.active:after{transform:translate(-50%)}.language-select:focus{box-shadow:0 0 0 3px #007aff1a}.tab-btn{background:0 0}.tab-btn:hover{background:#007aff14}.tab-btn.active{background:#007aff1a}.toast{-webkit-backdrop-filter:saturate(180%)blur(20px);background:#ffffffeb;border:1px solid #0000000f;transform:translateY(-20px)scale(.95)}.toast.show{transform:translateY(0)scale(1)}@media (max-width:768px){.container{margin:0;padding:0 1rem}.nav{justify-content:space-between;height:52px;position:relative}.logo{flex-shrink:0;order:1;font-size:1.125rem}.language-switcher{flex-shrink:0;order:2;position:absolute;right:48px}.mobile-menu-btn{border-radius:8px;flex-shrink:0;order:3;padding:8px;transition:background .2s;background-color:#0000!important;border:none!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;display:flex!important}.mobile-menu-btn:active{background-color:var(--gray-100)}.mobile-menu-btn span{border-radius:2px;background-color:var(--gray-700)!important;display:block!important}.language-select{border:1px solid var(--gray-300);background-color:var(--white);width:auto;min-width:auto;box-shadow:var(--shadow-sm);border-radius:8px;padding:6px 28px 6px 10px;font-size:.8125rem}.language-select:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #007aff1a}.logo-icon{width:32px;height:32px}.footer-content{text-align:center;flex-direction:column;align-items:center;gap:1.5rem;padding:1rem}.tab-header{gap:.25rem;padding:.5rem}.tab-btn{text-align:center;flex:0 0 calc(50% - 0.125rem);padding:.625rem .75rem;font-size:.8125rem}.footer-qrcode{width:56px;height:56px}}@media (max-width:480px){.footer-qrcode{border-radius:8px;width:48px;height:48px;padding:2px}.footer-desc{font-size:.75rem}}.tool-icon{background:linear-gradient(135deg,#007aff1a,#5ac8fa1a)}.tool-icon svg{stroke-width:2px}.tool-main{background:0 0}.editor-split{padding:0 1.5rem}.json-input::-webkit-scrollbar,.json-view::-webkit-scrollbar{width:10px;height:10px}.json-input::-webkit-scrollbar-track,.json-view::-webkit-scrollbar-track{background:0 0}.json-input::-webkit-scrollbar-thumb,.json-view::-webkit-scrollbar-thumb{background-color:var(--gray-400);background-clip:padding-box;border:2px solid #0000;border-radius:10px}.json-input::-webkit-scrollbar-thumb:hover,.json-view::-webkit-scrollbar-thumb:hover{background-color:var(--gray-500)}.input-error{background-color:#ff3b301a;border-top:1px solid #ff3b3033}.json-expander:before{content:"▾"}.json-expandable.collapsed .json-expander:before{content:"▸"}.tool-container{padding:0 1.5rem}@media (max-width:768px){.tool-container{height:calc(100vh - 160px);padding:0 1rem}.editor-split{grid-template-columns:1fr;padding:0 1rem}.tool-header{border-radius:12px;padding:1rem}.tool-header h1{font-size:1.25rem}}:root{--img-shadow:0 1px 3px #0000001a}.img-dropzone{transition:all .3s}.img-preview-info{background:#000000b3;transition:transform .3s}.section-header{padding:24px 24px 16px}.section-header h2{margin:0 0 8px}.img-dropzone:hover{background:#007aff0d}.upload-icon{transition:all .3s}.img-dropzone-content h3{margin:0 0 8px}.img-dropzone-content p{margin:0 0 16px}.convert-info{flex:none}.convert-preview{border:1px solid #0000000d}.convert-details h4{margin:0 0 4px}.format-selector-inline{flex:none}.format-select{transition:all .2s}.format-select:focus{box-shadow:0 0 0 3px #007aff1a}.format-select-icon{transition:color .2s}.convert-status{flex:none}.status-converting{background:#007aff1a}.status-completed{background:#34c7591a}.status-error{background:#ff3b301a}.progress-fill{transition:width .3s}.btn-remove{background:#ff3b301a}.btn-remove:hover{background:#ff3b3033}.empty-state h3{margin:0 0 8px}.img-dropzone.dragover{background:#007aff1a}@media (max-width:768px){.img-workspace{margin-top:16px}.tool-content{margin:0;padding:16px 0}.section-header{padding:20px 20px 12px}.section-header h2{font-size:1.125rem}.section-header p{font-size:.8125rem;line-height:1.4}.upload-section{margin-bottom:16px;padding:20px}.img-dropzone{margin:16px auto;padding:32px 16px}.convert-list{padding:20px}.convert-item{padding:16px}.convert-header{flex-direction:column;align-items:stretch;gap:16px}.convert-info{order:1}.format-selector-inline{order:2;max-width:none;margin:0}.convert-status{order:3;align-self:flex-end}.convert-actions{flex-wrap:wrap;justify-content:center}.convert-actions a,.convert-actions button{text-align:center;flex:1;min-width:80px}.convert-status.has-error-message{order:3;align-self:stretch}.error-message{margin-top:6px;font-size:.75rem}}@media (max-width:480px){.section-header,.upload-section{padding:16px}.section-header h2{font-size:1rem}.section-header p{font-size:.75rem;line-height:1.3}.img-dropzone{min-height:180px;margin:12px auto;padding:24px 12px}.upload-icon svg{width:48px;height:48px}.img-dropzone h3{font-size:1rem}.img-dropzone p{font-size:.8125rem}.upload-tips{flex-direction:column;gap:8px}.tip-item{font-size:.6875rem}.convert-list{padding:16px}.format-selector-inline .format-select{padding:8px 28px 8px 10px;font-size:.8125rem}.format-selector-inline .format-select-icon{right:6px}.format-label{font-size:.75rem}.convert-info{flex-direction:column;align-items:flex-start;gap:8px}.convert-preview{width:40px;height:40px}.convert-details h4{font-size:.875rem}.convert-meta{font-size:.75rem}.convert-actions a,.convert-actions button{padding:10px 12px;font-size:.8125rem}.convert-status{order:3;align-self:flex-end}.convert-status.has-error-message{order:3;align-self:stretch}.error-message{margin-top:6px;font-size:.75rem}.convert-actions{flex-wrap:wrap;justify-content:center}}.seo-content{margin:28px 0 40px;box-shadow:0 8px 24px #0f172a0f}.seo-content h1{margin:0 0 10px}.seo-content h2{margin:18px 0 10px}.seo-content h3{margin:6px 0 12px}.seo-content .seo-description{margin:0 auto 18px}.seo-content .format-card{background:linear-gradient(#fff,#fafafa);padding:14px 14px 12px;transition:transform .2s,box-shadow .2s,border-color .2s;box-shadow:0 2px 8px #0000000a}.seo-content .format-card:hover{box-shadow:0 10px 20px #3b82f614}.seo-content .format-card h4{margin:0 0 6px}.seo-content .format-card p{margin:0 0 8px}.seo-content .features-list{margin:16px auto 0;padding:0}@media (max-width:1024px){.seo-content-wrap{z-index:2;position:relative}.seo-content{border-radius:16px;padding:28px 20px}.seo-content h1{font-size:24px}}@media (max-width:640px){.seo-content-wrap{z-index:2;position:relative}.seo-content{margin:18px 12px 28px;padding:22px 16px}.seo-content h1{font-size:22px}.seo-content h2{font-size:18px}.seo-content h3{font-size:14px}.seo-content .format-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.status-error{color:#dc2626;margin-top:4px}.status-done{color:#16a34a}.status-converting{color:#2563eb}.status-waiting{color:#6b7280}.convert-actions{padding:16px 0}.btn-convert[disabled]{opacity:.6;cursor:not-allowed}.convert-preview{-o-object-fit:contain;object-fit:contain;border:1px solid #e5e7eb;width:80px;height:80px}.progress-wrap{margin-top:8px}.progress-bar{background:#e5e7eb;border-radius:999px;height:8px}.progress-inner{background:linear-gradient(90deg,#60a5fa,#3b82f6);width:0;height:100%;transition:width .2s}.progress-text{color:#6b7280;margin-top:6px;font-size:12px}

/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme;@layer base{*,::backdrop,:after,:before{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}:host,html{-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,var(--font-sans,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"));font-feature-settings:var(--default-font-feature-settings,initial);font-variation-settings:var(--default-font-variation-settings,initial);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,var(--font-mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace));font-feature-settings:var(--default-mono-font-feature-settings,initial);font-variation-settings:var(--default-mono-font-variation-settings,initial);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,optgroup,select,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){::-moz-placeholder{color:currentColor}::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::-moz-placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.fixed{position:fixed}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.mt-1{margin-top:calc(var(--spacing,.25rem)*1)}.mt-2{margin-top:calc(var(--spacing,.25rem)*2)}.block{display:block}.flex{display:flex}.hidden{display:none}.table{display:table}.h-2{height:calc(var(--spacing,.25rem)*2)}.w-full{width:100%}.flex-shrink{flex-shrink:1}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.flex-wrap{flex-wrap:wrap}.rounded{border-radius:.25rem}.border{border-style:var(--tw-border-style);border-width:1px}.bg-blue-600{background-color:var(--color-blue-600,oklch(54.6% .245 262.881))}.bg-gray-200{background-color:var(--color-gray-200,oklch(92.8% .006 264.531))}.text-sm{font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,1.42857))}.text-gray-600{color:var(--color-gray-600,oklch(44.6% .03 256.802))}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.backdrop-filter{backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4,0,.2,1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s))}}.card{border-radius:var(--radius-lg,.5rem);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-gray-200,oklch(92.8% .006 264.531));background-color:var(--color-white,#fff);--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.btn{height:calc(var(--spacing,.25rem)*10);border-radius:var(--radius-md,.375rem);background-color:var(--color-blue-600,oklch(54.6% .245 262.881));padding-inline:calc(var(--spacing,.25rem)*4);color:var(--color-white,#fff)}@media (hover:hover){.btn:hover{background-color:var(--color-blue-700,oklch(48.8% .243 264.376))}}.btn:disabled{cursor:not-allowed;opacity:.6}.btn-secondary{background-color:var(--color-gray-600,oklch(44.6% .03 256.802))}@media (hover:hover){.btn-secondary:hover{background-color:var(--color-gray-700,oklch(37.3% .034 259.733))}}.btn-danger{background-color:var(--color-red-600,oklch(57.7% .245 27.325))}@media (hover:hover){.btn-danger:hover{background-color:var(--color-red-700,oklch(50.5% .213 27.518))}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}:root{--primary:#007aff;--primary-dark:#0051d5;--primary-light:#5ac8fa;--gray-50:#f5f5f7;--gray-100:#e8e8ed;--gray-200:#d1d1d6;--gray-300:#c7c7cc;--gray-400:#aeaeb2;--gray-500:#8e8e93;--gray-600:#636366;--gray-700:#48484a;--gray-800:#3a3a3c;--gray-900:#1c1c1e;--white:#fff;--shadow-sm:0 1px 3px rgba(0,0,0,.04);--shadow-md:0 4px 12px rgba(0,0,0,.08);--shadow-lg:0 10px 30px rgba(0,0,0,.12);--blur-amount:20px}*{margin:0;padding:0;box-sizing:border-box}body,html{height:100%}html{overflow-y:scroll;scrollbar-width:thin;scrollbar-color:var(--gray-300) transparent}html::-webkit-scrollbar{width:8px}html::-webkit-scrollbar-track{background:transparent}html::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:10px}html::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}body{background:linear-gradient(135deg,#f5f7fa,#e8eaf0);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,SF Pro Text,Helvetica Neue,Helvetica,Arial,sans-serif;color:var(--gray-900);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{width:100%;max-width:1800px;margin:0 auto;padding:.2rem .75rem .2rem .75rem}.tools .container{padding-left:0!important;padding-right:0!important;max-width:none!important;margin-left:0!important;margin-right:0!important;width:100%!important}main{flex:1;display:flex;flex-direction:column;min-height:calc(100vh - 136px)}.header{background:hsla(0,0%,100%,.72);backdrop-filter:saturate(180%) blur(var(--blur-amount));-webkit-backdrop-filter:saturate(180%) blur(var(--blur-amount));border-bottom:.5px solid rgba(0,0,0,.08);position:sticky;top:0;z-index:100;box-shadow:var(--shadow-sm)}.nav{justify-content:flex-start;height:56px}.logo,.nav{display:flex;align-items:center}.logo{font-size:1.25rem;font-weight:600;color:var(--gray-900);text-decoration:none;gap:.5rem;padding-left:0;letter-spacing:-.02em;transition:all .3s cubic-bezier(.4,0,.2,1)}.logo:hover{opacity:.7}.logo-icon{animation:gentle-float 3s ease-in-out infinite;width:36px;height:36px;border-radius:10px;transition:all .3s cubic-bezier(.4,0,.2,1)}@keyframes gentle-float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.logo:hover .logo-icon{transform:scale(1.05);box-shadow:var(--shadow-md)}.mobile-menu-btn{display:none;flex-direction:column;justify-content:center;align-items:center;width:32px;height:32px;background:none;border:none;cursor:pointer;padding:4px;margin-left:auto;position:relative;z-index:1002;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none}.mobile-menu-btn span{display:block;height:2px;width:20px;background-color:var(--gray-700);border-radius:1px;transition:all .3s ease;margin:2px 0}.mobile-menu-btn.active span:first-child{transform:rotate(45deg) translate(5px,5px)}.mobile-menu-btn.active span:nth-child(2){opacity:0}.mobile-menu-btn.active span:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}.nav-links{gap:1.5rem;margin-left:2.5rem;margin-right:auto}.nav-link,.nav-links{display:flex;align-items:center}.nav-link{color:var(--gray-700);text-decoration:none;font-weight:500;font-size:.9375rem;padding:.5rem .75rem;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;gap:.25rem;border-radius:8px}.nav-link:hover{color:var(--primary);background:rgba(0,122,255,.08)}.nav-link.active{color:var(--primary);font-weight:600}.nav-link.active:after{content:"";position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:24px;height:3px;background-color:var(--primary);border-radius:2px}.language-switcher{display:flex;align-items:center;margin-left:auto;flex-shrink:0}.language-select{background-color:var(--white);border:1px solid var(--gray-300);color:var(--gray-700);padding:6px 32px 6px 12px;font-size:.875rem;cursor:pointer;outline:none;transition:all .3s cubic-bezier(.4,0,.2,1);min-width:auto;width:auto;font-weight:500;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:8px;box-shadow:var(--shadow-sm);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath fill='%23636366' d='M6 8 2 4h8z'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat}.language-select:hover{background-color:var(--gray-50);border-color:var(--gray-400)}.language-select:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(0,122,255,.1)}.language-select option{background:var(--white);color:var(--gray-700);padding:8px}.tools-tabs{overflow:hidden;height:100%;display:flex;flex-direction:column}.tab-header{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--gray-200);background:var(--white);padding:.5rem 1rem;gap:.5rem}.tab-btn{padding:.5rem 1rem;border:none;background:none;color:var(--gray-600);font-weight:500;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);text-decoration:none;font-size:.875rem;position:relative;white-space:nowrap;display:inline-block;border-radius:8px}.tab-btn:hover{color:var(--primary);background:rgba(0,122,255,.08)}.tab-btn.active{color:var(--primary);font-weight:600;background:rgba(0,122,255,.1)}.tab-btn.active:after{content:"";position:absolute;bottom:-8px;left:1rem;right:1rem;height:2px;background-color:var(--primary);border-radius:1px}.footer{padding:1.5rem 0;font-size:.8125rem;color:var(--gray-500);margin-top:2rem;border-top:1px solid var(--gray-200)}.footer-content{gap:3rem;padding:1rem 2rem;min-height:80px}.footer-content,.footer-left{display:flex;align-items:center}.footer-left{gap:2rem}.footer-brand{display:flex;align-items:center;gap:.5rem}.footer-logo{width:40px;height:40px;border-radius:10px;padding:2px;background:var(--white);box-shadow:var(--shadow-sm)}.footer-brand span{color:var(--gray-500);font-size:.8125rem}.footer-qrcode-wrapper{display:flex;align-items:center;gap:.5rem}.footer-qrcode{width:40px;height:40px;border-radius:10px;padding:2px;background:var(--white);box-shadow:var(--shadow-sm)}.footer-desc,.footer-qrcode-wrapper span{color:var(--gray-500);font-size:.8125rem}.footer-desc{flex:1;line-height:1.6;display:flex;align-items:center}.toast{position:fixed;top:20px;right:20px;padding:12px 20px;background:hsla(0,0%,100%,.92);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);color:var(--gray-900);border-radius:12px;font-size:.875rem;font-weight:500;opacity:0;transform:translateY(-20px) scale(.95);transition:all .4s cubic-bezier(.4,0,.2,1);z-index:1000;box-shadow:var(--shadow-lg);border:1px solid rgba(0,0,0,.06)}.toast.show{opacity:1;transform:translateY(0) scale(1)}@media (max-width:768px){.container{margin:0;padding:0 1rem}.nav{height:52px;justify-content:space-between;position:relative}.logo{order:1;flex-shrink:0;font-size:1.125rem}.language-switcher{order:2;position:absolute;right:48px;flex-shrink:0}.mobile-menu-btn{order:3;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;background-color:transparent!important;border:none!important;flex-shrink:0;padding:8px;border-radius:8px;transition:background .2s}.mobile-menu-btn:active{background-color:var(--gray-100)}.mobile-menu-btn span{display:block!important;background-color:var(--gray-700)!important;border-radius:2px}.language-select{min-width:auto;width:auto;font-size:.8125rem;padding:6px 28px 6px 10px;border:1px solid var(--gray-300);background-color:var(--white);border-radius:8px;box-shadow:var(--shadow-sm)}.language-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(0,122,255,.1)}.logo-icon{width:32px;height:32px}.footer-content{flex-direction:column;align-items:center;text-align:center;gap:1.5rem;padding:1rem}.tab-header{padding:.5rem;gap:.25rem}.tab-btn{flex:0 0 calc(50% - 0.125rem);font-size:.8125rem;text-align:center;padding:.625rem .75rem}.footer-qrcode{width:56px;height:56px}}@media (max-width:480px){.footer-qrcode{width:48px;height:48px;padding:2px;border-radius:8px}.footer-desc{font-size:.75rem}}.tools{flex-grow:1}.tools-grid{display:grid;gap:1.5rem}.tool-card{text-decoration:none;background:var(--white);border-radius:16px;padding:1.5rem;box-shadow:var(--shadow-sm);border:1px solid var(--gray-200);transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;gap:1rem}.tool-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--gray-300)}.tool-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(0,122,255,.1),rgba(90,200,250,.1))}.tool-icon svg{stroke:var(--primary);fill:none;stroke-width:2}.tool-card h3{font-size:1.125rem;font-weight:600;color:var(--gray-900);letter-spacing:-.01em}.tool-card p{color:var(--gray-600);font-size:.875rem;line-height:1.5}.tool-main{flex:1;padding:.5rem 0;display:flex;flex-direction:column;min-height:calc(100vh - 100px);background:transparent}.tool-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;border-radius:16px;background:var(--white);box-shadow:var(--shadow-sm);margin-bottom:1rem}.tool-header h1{font-size:1.5rem;font-weight:600;color:var(--gray-900);letter-spacing:-.02em}.tool-actions{display:flex;gap:.75rem;align-items:center}.btn{height:2rem;padding:0 1.25rem;border:none;border-radius:10px;background:var(--primary);color:#fff;font-weight:500;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);font-size:.875rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;min-width:70px;box-shadow:var(--shadow-sm)}.btn:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn:active{transform:translateY(0);box-shadow:var(--shadow-sm)}#clearBtn{background:#ff3b30}#clearBtn:hover{background:#d32f2f}.tool-content{overflow:visible}.editor-split{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;height:80vh;padding:0 1.5rem 0}.editor-input{flex:1;display:flex;flex-direction:column;background:var(--white);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-md);border:1px solid var(--gray-200);transition:all .3s cubic-bezier(.4,0,.2,1)}.editor-input:focus-within{box-shadow:var(--shadow-lg);border-color:var(--primary)}.json-input{flex:1;padding:1rem;background-color:#1c1c1e;color:#f5f5f7;font-family:SF Mono,Monaco,Menlo,Consolas,monospace;font-size:.875rem;line-height:1.6;border:none;outline:none;resize:none;white-space:pre;-moz-tab-size:4;-o-tab-size:4;tab-size:4;overflow:auto;cursor:text}.json-input::-webkit-scrollbar,.json-view::-webkit-scrollbar{width:10px;height:10px}.json-input::-webkit-scrollbar-track,.json-view::-webkit-scrollbar-track{background:transparent}.json-input::-webkit-scrollbar-thumb,.json-view::-webkit-scrollbar-thumb{background-color:var(--gray-400);border-radius:10px;border:2px solid transparent;background-clip:padding-box}.json-input::-webkit-scrollbar-thumb:hover,.json-view::-webkit-scrollbar-thumb:hover{background-color:var(--gray-500)}.input-error{display:none;padding:.875rem 1rem;background-color:rgba(255,59,48,.1);color:#ff3b30;font-size:.875rem;border-top:1px solid rgba(255,59,48,.2);border-radius:0 0 16px 16px}.editor-container{background:var(--white);border-radius:16px;position:relative;box-shadow:var(--shadow-md);border:1px solid var(--gray-200)}.editor-container,.editor-wrapper{flex:1;display:flex;flex-direction:column;overflow:hidden}.editor-wrapper{background:#1c1c1e}.input-container{position:relative;display:flex;height:100%;background-color:#1c1c1e;border-radius:16px;overflow:hidden;flex:1}.json-view{padding:1rem;overflow:auto;color:#f5f5f7;flex:1;font-family:SF Mono,Monaco,Menlo,Consolas,monospace;font-weight:500;white-space:pre}.json-error,.json-view{background:#1c1c1e;line-height:1.6;font-size:.875rem}.json-error{padding:1.5rem;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,sans-serif;border-radius:16px;color:#ff3b30}.json-key{color:#5ac8fa;font-size:.875rem;font-weight:600;line-height:1.6}.json-string{color:#32d74b}.json-number,.json-string{font-size:.875rem;font-weight:500;line-height:1.6}.json-number{color:#ffd60a}.json-object{color:#f5f5f7}.json-array,.json-object{font-size:.875rem;font-weight:500;line-height:1.6}.json-array{color:#ff9f0a}.json-boolean{color:#bf5af2}.json-boolean,.json-null{font-size:.875rem;font-weight:500;line-height:1.6}.json-null{color:#ff453a}.json-summary{color:var(--gray-500);font-size:.875rem;font-weight:500;margin-left:.25rem;display:none;line-height:1.6}.json-expandable.collapsed .json-summary{display:inline-block}.json-expandable{position:relative;padding-left:1.5rem;white-space:nowrap;line-height:1.6;display:block}.json-expander{position:absolute;left:0;top:0;width:24px;height:24px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;color:var(--gray-400);line-height:24px;text-align:center;transition:color .2s}.json-expander:hover{color:var(--primary)}.json-expander:before{content:"\25be";font-size:18px}.json-content{border-left:1px solid var(--gray-600);margin-left:2rem;display:block}.json-line{padding-left:1.5rem;left:0;height:24px;line-height:24px;margin-left:-8px}.json-expandable.collapsed{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;height:24px}.json-expandable.collapsed .json-content{display:none}.json-expandable.collapsed .json-expander:before{content:"\25b8"}.tool-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;height:calc(100vh - 180px);padding:0 1.5rem 0}@media (max-width:768px){.tool-container{height:calc(100vh - 160px);padding:0 1rem}.editor-split{padding:0 1rem;grid-template-columns:1fr}.tool-header{padding:1rem;border-radius:12px}.tool-header h1{font-size:1.25rem}}.content-area{display:flex;flex-direction:column;flex:1;padding:0 .75rem;margin:.25rem 0 0 0}.seo-content{margin-top:auto;margin-bottom:0;text-align:center;padding:1.5rem 1rem;background:linear-gradient(135deg,#f8fafc,#e2e8f0 50%,#cbd5e1);border-radius:16px;color:var(--gray-800);position:relative;overflow:hidden;border:1px solid var(--gray-200)}.seo-content h1{font-size:1.75rem;color:var(--gray-900);line-height:1.15;background:linear-gradient(135deg,var(--primary) 0,#8b5cf6 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.seo-content h1,.seo-content h2{margin:0 0 .75rem 0;position:relative;z-index:1}.seo-content h2{font-size:1.25rem;color:var(--primary);line-height:1.2}.seo-content h3{font-weight:500;color:var(--gray-700);margin:0 0 1rem 0;line-height:1.3}.seo-content h3,.seo-description{font-size:1rem;position:relative;z-index:1}.seo-description{color:var(--gray-600);margin:0;max-width:800px;margin:0 auto;padding:0 1rem}.features-list{list-style:none;padding:0;margin:0 0 2rem 0;position:relative;z-index:1;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem}.features-list li{position:relative;padding:1rem 1.5rem 1rem 3rem;color:var(--gray-700);line-height:1.6;transition:all .3s ease;border-radius:12px;background:#fff;border:1px solid var(--gray-100);box-shadow:0 2px 8px rgba(0,0,0,.05)}.features-list li:hover{background:linear-gradient(135deg,rgba(59,130,246,.05),rgba(59,130,246,.02));transform:translateY(-2px);box-shadow:0 8px 25px rgba(59,130,246,.15);border-color:var(--primary)}.features-list li:before{content:"\2713";position:absolute;left:1rem;top:1rem;color:#fff;font-weight:700;font-size:1.2rem;background:linear-gradient(135deg,var(--primary) 0,#8b5cf6 100%);width:1.75rem;height:1.75rem;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .3s ease;box-shadow:0 2px 8px rgba(59,130,246,.3)}.features-list li:hover:before{transform:scale(1.1) rotate(1turn);box-shadow:0 4px 12px rgba(59,130,246,.4)}.notice-text{color:var(--gray-600);line-height:1.6;margin:0;padding:1rem;background:linear-gradient(135deg,rgba(59,130,246,.08),rgba(59,130,246,.03));border-radius:12px;border-left:4px solid var(--primary);font-size:.95rem;text-align:center;max-width:800px;margin:0 auto;box-shadow:0 3px 12px rgba(59,130,246,.08)}.input-section{margin-bottom:.5rem;background:#fff;padding:1.1rem;border-radius:12px;box-shadow:0 4px 16px rgba(0,0,0,.06);border:1px solid hsla(0,0%,100%,.2)}.input-group{display:flex;flex-direction:column;gap:.75rem}.input-label{font-size:1rem;font-weight:600;color:var(--gray-800);margin:0;display:flex;align-items:center;gap:.5rem}.input-label:before{content:"\1F517";font-size:1.2rem}.input-wrapper{position:relative;display:flex;align-items:center}.url-input{flex:1;padding:.875rem 1rem;padding-right:8rem;border:2px solid var(--gray-200);border-radius:10px;font-size:.95rem;background:#fff;transition:all .3s cubic-bezier(.4,0,.2,1);outline:none;box-shadow:0 2px 4px rgba(0,0,0,.05)}.url-input:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(37,99,235,.1),0 4px 12px rgba(0,0,0,.1);transform:translateY(-1px)}.url-input::-moz-placeholder{color:var(--gray-400);font-style:italic}.url-input::placeholder{color:var(--gray-400);font-style:italic}.input-actions{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);display:flex;gap:.375rem}.action-btn{width:2.25rem;height:2.25rem;border:none;border-radius:8px;background:var(--gray-100);color:var(--gray-600);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.action-btn:hover{background:var(--primary);color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px rgba(37,99,235,.3)}.action-btn svg{width:1.125rem;height:1.125rem}.result-section{background:#fff;border-radius:12px;box-shadow:0 6px 24px rgba(0,0,0,.08);overflow:hidden;margin:.25rem 0 .5rem 0;border:1px solid hsla(0,0%,100%,.2)}.result-content{padding:.5rem .75rem}.cover-section{margin-bottom:1rem}.cover-section h4{font-size:1.05rem;font-weight:600;color:var(--gray-800);margin:0 0 1rem 0}.cover-image{text-align:center;margin-bottom:1rem}.cover-image img{max-width:100%;max-height:320px;border-radius:12px;box-shadow:0 8px 25px rgba(0,0,0,.15);-o-object-fit:cover;object-fit:cover}.user-guide{margin-top:.75rem;padding:.5rem;background:var(--gray-50);border-radius:8px;border-left:3px solid var(--primary)}.guide-text{margin:0;font-size:.75rem;color:var(--gray-600);display:flex;align-items:center;gap:.5rem;line-height:1.4}.images-section h4,.video-section h4{font-size:1.1rem;font-weight:600;color:var(--gray-800);margin:0 0 1rem 0}.video-player{margin-bottom:.5rem;text-align:center}.video-player video{max-width:100%;max-height:340px;border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.12);background:#000}.images-section{display:none}@media (max-width:768px){.content-area{padding:0 .5rem}.seo-content{padding:2rem 1rem;margin-top:3rem;margin-bottom:1.5rem}.seo-content h1{font-size:1.75rem}.seo-content h2{font-size:1.25rem}.seo-content h3{font-size:1rem}.input-section{padding:1.25rem;margin-bottom:1rem}.url-input{padding:.875rem 1rem;padding-right:7rem;font-size:.95rem}.action-btn{width:2rem;height:2rem}.action-btn svg{width:1rem;height:1rem}.result-content{padding:1rem}.cover-image img{max-height:220px}.video-player video{max-height:280px}.features-list{grid-template-columns:1fr;gap:.75rem}.features-list li{padding:.875rem 1rem .875rem 2.5rem}.features-list li:before{left:.75rem;top:.875rem;width:1.5rem;height:1.5rem;font-size:1rem}}.img-dropzone{min-height:200px;margin-bottom:24px}.img-dropzone-content{flex-direction:column;padding:40px 20px;height:100%;box-sizing:border-box}.img-dropzone-content,.preview-container{display:flex;align-items:center;justify-content:center;width:100%}.preview-container{height:150px;margin-bottom:16px}.preview-in-dropzone{max-width:100%;max-height:100%;width:auto;height:auto;-o-object-fit:contain;object-fit:contain;border-radius:12px;box-shadow:var(--shadow-md);display:block;margin:0 auto}.upload-icon{transition:color .3s ease;width:100%}.img-dropzone-content p{margin:4px 0;width:100%;text-align:center}.img-dropzone-content p:first-of-type{font-size:1rem;color:var(--gray-700);font-weight:500}.compress-list{margin-top:0}.compress-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.compress-header h3{font-size:1.125rem;font-weight:600;color:var(--gray-900);margin:0;letter-spacing:-.01em}.clear-all-btn{background:rgba(255,59,48,.1);color:#ff3b30;border:none;padding:6px 12px;border-radius:8px;font-size:.8125rem;cursor:pointer;transition:all .2s;font-weight:500}.clear-all-btn:hover{background:rgba(255,59,48,.2)}.compress-items{display:flex;flex-direction:column;gap:12px}.compress-item{display:grid;grid-template-columns:1fr auto auto auto auto;align-items:center;gap:16px;padding:12px 16px;background:var(--white);border:1px solid var(--gray-200);border-radius:12px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:var(--shadow-sm)}.compress-item:hover{box-shadow:var(--shadow-md);border-color:var(--gray-300);transform:translateY(-2px)}.file-info{gap:12px;min-width:0}.file-info,.file-thumbnail{display:flex;align-items:center}.file-thumbnail{position:relative;width:40px;height:40px;flex-shrink:0;border-radius:8px;overflow:hidden;background:var(--gray-50);justify-content:center;border:1px solid rgba(0,0,0,.05)}.file-thumbnail img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.thumbnail-placeholder{color:var(--gray-400)}.file-name{font-size:.875rem;color:var(--gray-900);overflow:hidden;text-overflow:ellipsis;min-width:0}.file-name,.file-size{font-weight:500;white-space:nowrap}.file-size{font-size:.8125rem;color:var(--gray-500)}.compress-progress{width:80px;height:6px;background:var(--gray-100);border-radius:3px;overflow:hidden}.progress-bar{height:100%;transition:width .3s ease}.compress-result{display:flex;align-items:center;gap:12px;white-space:nowrap}.compress-result span:first-child{font-size:.8125rem;font-weight:500;color:var(--gray-900);min-width:60px}.download-link{background:var(--primary);color:#fff;padding:6px 12px;border-radius:6px;font-size:.75rem;font-weight:500;text-decoration:none;transition:all .2s;box-shadow:var(--shadow-sm)}.download-link:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}.compress-ratio{font-size:.75rem;font-weight:600;min-width:50px;text-align:right}.ratio-good{color:#34c759}.ratio-normal{color:#ff9500}.ratio-neutral{color:var(--gray-500)}.remove-file-btn{background:none;border:none;color:var(--gray-400);cursor:pointer;padding:4px;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.remove-file-btn:hover{background:rgba(255,59,48,.1);color:#ff3b30}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;color:var(--gray-500)}.loading-spinner{width:32px;height:32px;border:3px solid var(--gray-200);border-top:3px solid var(--primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:12px}@media (max-width:768px){.compress-item{grid-template-columns:1fr auto;grid-template-rows:auto auto auto;gap:8px 16px}.file-info{grid-column:1/-1}.file-size{justify-self:start}.compress-progress{justify-self:end}.compress-result{grid-column:1/-1;justify-content:space-between;border-top:1px solid var(--gray-100);padding-top:8px;margin-top:4px}.remove-file-btn{position:absolute;top:8px;right:8px}.img-dropzone-content{padding:30px 15px}.preview-in-dropzone{max-height:120px}}@media (max-width:480px){.compress-header{flex-direction:column;align-items:flex-start;gap:8px}.clear-all-btn{align-self:flex-end}.file-name{font-size:.8125rem}.compress-result{flex-wrap:wrap;gap:8px}}.compare-container{position:relative;width:100%;height:300px;border-radius:16px;overflow:hidden;box-shadow:var(--shadow-lg);border:1px solid rgba(0,0,0,.05)}.compare-image{position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.compare-image.compressed{clip-path:inset(0 50% 0 0)}.compare-slider{position:absolute;top:0;left:50%;width:2px;height:100%;cursor:col-resize;box-shadow:0 0 10px rgba(0,0,0,.2)}.compare-slider,.slider-button{background:var(--white);display:flex;align-items:center;justify-content:center}.slider-button{width:40px;height:40px;border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.2);color:var(--primary)}.slider-button svg path{fill:var(--primary)}.compare-info{position:absolute;top:16px;left:16px;right:16px;display:flex;justify-content:space-between;z-index:10;color:#fff;font-size:.75rem;font-weight:600;text-shadow:0 1px 3px rgba(0,0,0,.5)}.info-ratio{margin-left:8px;color:#34c759}.download-link.disabled{opacity:.5;cursor:not-allowed;pointer-events:none;background:var(--gray-400);box-shadow:none}.editor-section{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 2px 12px rgba(0,0,0,.08)}.adjustment-header{background:#f8fafc;border-radius:12px;padding:1rem;margin-bottom:1rem;border:1px solid #e2e8f0}.adjustment-header .adjustment-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem;margin:0}.adjustment-header .control-item{display:flex;align-items:center;padding:.375rem;background:#fff;border:1px solid #e5e7eb;border-radius:8px}.adjustment-header .control-item label{font-size:.875rem;font-weight:500;color:#374151;min-width:60px;text-align:left}.adjustment-header .slider{flex:1;height:6px;border-radius:3px;background:#e5e7eb;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.adjustment-header .slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#3b82f6;cursor:pointer;border:2px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.2);-webkit-transition:all .15s ease;transition:all .15s ease}.adjustment-header .slider::-webkit-slider-thumb:hover{background:#2563eb;transform:scale(1.1)}.adjustment-header .slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#3b82f6;cursor:pointer;border:2px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.2)}.adjustment-header .slider-value{font-size:.875rem;font-weight:600;color:#3b82f6;min-width:30px;text-align:center}.editor-toolbar{background:#f8fafc;border-radius:12px;padding:1.5rem;border:1px solid #e2e8f0;-ms-overflow-style:none;scrollbar-width:none}.editor-toolbar,.toolbar-group{margin-bottom:1.5rem}.toolbar-group h4{margin:0 0 .75rem 0;font-size:.875rem;color:#334155;text-transform:uppercase;letter-spacing:.5px}.tool-buttons{display:flex;flex-wrap:wrap;gap:.5rem}.tool-btn{display:flex;align-items:center;gap:.5rem;padding:.625rem 1rem;background:#fff;border:1px solid #d1d5db;border-radius:8px;color:#374151;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .15s ease;white-space:nowrap}.tool-btn:hover{background:#f3f4f6;border-color:#9ca3af;transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,.1)}.tool-btn:active{transform:translateY(0);box-shadow:0 1px 2px rgba(0,0,0,.1)}.tool-btn.active{background:#3b82f6;border-color:#3b82f6;color:#fff}.tool-btn svg{flex-shrink:0}.tool-btn.reset-btn{background:#f59e0b;border-color:#f59e0b;color:#fff}.tool-btn.reset-btn:hover{background:#d97706;border-color:#d97706}.tool-btn.download-btn{background:#10b981;border-color:#10b981;color:#fff;font-weight:600}.tool-btn.download-btn:hover{background:#059669;border-color:#059669;transform:translateY(-1px);box-shadow:0 4px 8px rgba(16,185,129,.3)}.editor-canvas{background:#f8fafc;padding:1.5rem;min-height:500px;border:2px dashed #cbd5e1;transition:all .3s ease}.image-container{display:flex;align-items:center;justify-content:center;min-height:400px;position:relative;width:100%}.image-container img{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain;border-radius:8px}cropper-canvas{width:100%!important;height:600px!important;min-height:600px!important;max-height:none!important;display:block!important;border-radius:8px;overflow:hidden}cropper-canvas[style*="display: none"]{display:none!important}cropper-image{width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.upload-area{width:100%;min-height:600px;display:flex;align-items:center;justify-content:center;border:2px dashed #d1d5db;border-radius:12px;background:#f9fafb;transition:all .3s ease;cursor:pointer}.upload-area:hover{border-color:#3b82f6;background:#eff6ff;transform:translateY(-2px);box-shadow:0 4px 12px rgba(59,130,246,.15)}.upload-content{text-align:center;padding:2rem;max-width:400px}.upload-icon{margin:0 auto 1.5rem;width:64px;height:64px;display:flex;align-items:center;justify-content:center;background:#e5e7eb;border-radius:50%}.upload-area:hover .upload-icon{background:#3b82f6;color:#fff;transform:scale(1.1)}.upload-content h3{margin:0 0 .5rem 0;font-size:1.25rem;font-weight:600;color:#1f2937}.upload-content p{margin:0 0 1.5rem 0;color:#6b7280;font-size:.875rem;line-height:1.5}.upload-button{display:inline-block;padding:.75rem 1.5rem;background:#3b82f6;color:#fff;border-radius:8px;font-size:.875rem;font-weight:500;transition:all .3s ease}.upload-area:hover .upload-button{background:#2563eb;transform:translateY(-1px);box-shadow:0 4px 8px rgba(59,130,246,.3)}.seo-content{margin-top:3rem;padding:2rem;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.08)}.seo-content h1{font-size:2rem;font-weight:700;color:#1f2937;margin-bottom:1rem}.seo-content h2{font-size:1.5rem;font-weight:600;color:#374151;margin:2rem 0 1rem 0;border-bottom:2px solid #e5e7eb;padding-bottom:.5rem}.seo-content h3{font-size:1.25rem;color:#4b5563;margin:1.5rem 0 .5rem 0}.seo-description{font-size:1.125rem;line-height:1.7;color:#6b7280;text-align:center;margin:1rem 0 2rem 0}.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin:1.5rem 0}.feature-card{background:#f8fafc;padding:1.5rem;border-radius:12px;border:1px solid #e2e8f0;transition:all .3s ease}.feature-card:hover{background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.1);transform:translateY(-2px)}.feature-card h4{font-size:1.125rem;font-weight:600;color:#1f2937;margin-bottom:.75rem}.feature-card p{font-size:.875rem;line-height:1.6;color:#6b7280;margin:0}.tutorial-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin:1.5rem 0}.step-item{display:flex;align-items:flex-start;gap:1rem;padding:1.5rem;background:#fff;border:1px solid #e5e7eb;border-radius:12px;transition:all .3s ease}.step-item:hover{box-shadow:0 4px 12px rgba(0,0,0,.1);transform:translateY(-2px)}.step-number{flex-shrink:0;width:40px;height:40px;background:#3b82f6;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:1.125rem}.step-content h4{font-size:1rem;font-weight:600;color:#1f2937;margin:0 0 .5rem 0}.step-content p{font-size:.875rem;line-height:1.6;color:#6b7280;margin:0}.faq-section{display:grid;gap:1rem;margin:1.5rem 0}.faq-item{padding:1.5rem;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;transition:all .3s ease}.faq-item:hover{background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.1)}.faq-item h4{font-size:1rem;font-weight:600;color:#1f2937;margin:0 0 .75rem 0}.faq-item p{font-size:.875rem;line-height:1.6;color:#6b7280;margin:0}@media (max-width:768px){.editor-section{padding:1rem}.adjustment-header{padding:1rem;margin-bottom:1rem}.adjustment-header .adjustment-controls{grid-template-columns:1fr;gap:.75rem}.adjustment-header .control-item{display:flex;align-items:center;padding:.375rem}.adjustment-header .control-item label{min-width:50px;text-align:left;font-size:.8rem}.adjustment-header .slider-value{font-size:.8rem;text-align:center;min-width:25px}.editor-toolbar{padding:1rem}.tool-buttons{flex-direction:column}.tool-btn{justify-content:center;width:100%}.editor-canvas{padding:1rem;min-height:300px}.image-container{min-height:250px}.image-container img{max-height:50vh}.seo-content{padding:1rem;margin-top:1.5rem}.seo-content h1{font-size:1.5rem}.seo-content h2{font-size:1.25rem}.feature-grid,.tutorial-steps{grid-template-columns:1fr;gap:1rem}.step-item{padding:1rem}.step-number{width:32px;height:32px;font-size:1rem}}@media (max-width:480px){.toolbar-group h4{font-size:.75rem}.tool-btn{padding:.5rem .75rem;font-size:.8rem}.tool-btn svg{width:14px;height:14px}.slider-value{font-size:.75rem;min-width:25px}.control-item{padding:.5rem}.editor-canvas{padding:.75rem;min-height:250px;width:100%;margin:0;border-radius:12px}.image-container{min-height:200px;width:100%;margin:0;padding:0}.image-container img{max-height:40vh}cropper-canvas{height:300px!important;min-height:300px!important;width:100%!important;border-radius:12px}.upload-area{min-height:300px;width:100%;margin:0;border-radius:12px}}.loading{opacity:.6;pointer-events:none}.loading:after{content:"";position:absolute;top:50%;left:50%;width:32px;height:32px;margin:-16px 0 0 -16px;border:3px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.editor-tip{background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;padding:1rem;margin-bottom:1rem;color:#1e40af;font-size:.875rem;line-height:1.5}.editor-tip strong{font-weight:600}.editor-toolbar::-webkit-scrollbar{display:none}.editor-main{display:flex;gap:24px;min-height:600px;align-items:flex-start}.left-toolbar{flex:0 0 200px;padding:20px;height:-moz-fit-content;height:fit-content;position:sticky;top:20px}.editor-canvas,.left-toolbar{background:#fff;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.1)}.editor-canvas{flex:1;min-height:600px;overflow:hidden}.right-toolbar{flex:0 0 200px;background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 8px rgba(0,0,0,.1);height:-moz-fit-content;height:fit-content;position:sticky;top:20px}.toolbar-group{margin-bottom:24px}.toolbar-group:last-child{margin-bottom:0}.toolbar-group h4{margin:0 0 12px 0;font-size:14px;font-weight:600;color:#374151;text-align:center}.tool-buttons.vertical{display:flex;flex-direction:column;gap:8px}.tool-buttons.vertical .tool-btn{width:100%;justify-content:flex-start;padding:12px 16px;font-size:13px;border-radius:8px;transition:all .2s ease}.tool-buttons.vertical .tool-btn:hover{background:#f3f4f6;transform:translateY(-1px)}.tool-buttons.vertical .tool-btn.active{background:#3b82f6;color:#fff}.tool-buttons.vertical .tool-btn svg{margin-right:8px;flex-shrink:0}.adjustment-controls{display:flex;flex-direction:column;gap:16px}.control-item{display:flex;align-items:center}.control-item label{font-size:12px;font-weight:500;color:#6b7280;min-width:60px;text-align:left}.control-item .slider{flex:1;height:6px;border-radius:3px;background:#e5e7eb;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.control-item .slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#3b82f6;cursor:pointer;border:2px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.2)}.control-item .slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#3b82f6;cursor:pointer;border:2px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.2)}.control-item .slider-value{font-size:12px;font-weight:600;color:#374151;min-width:30px;text-align:center}@media (max-width:768px){.editor-main{flex-direction:column;gap:16px}.left-toolbar,.right-toolbar{flex:none;position:static;width:100%;margin:0;border-radius:12px}.tool-buttons.vertical{flex-direction:row;flex-wrap:wrap}.tool-buttons.vertical .tool-btn{flex:1;min-width:120px}.adjustment-controls{flex-direction:column;gap:12px}.control-item{display:flex;align-items:center}.control-item label{min-width:50px;text-align:left;font-size:11px}.control-item .slider-value{min-width:25px;text-align:center;font-size:11px}.upload-area{min-height:400px;margin:0;width:100%;border-radius:12px}.upload-content{padding:1.5rem}.upload-content h3{font-size:1.125rem}.upload-content p{font-size:.8rem}cropper-canvas{height:400px!important;min-height:400px!important;width:100%!important;border-radius:12px}.editor-canvas{padding:1rem;min-height:400px;width:100%;margin:0;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.1)}.image-container{min-height:350px;width:100%;margin:0;padding:0}}.aspect-select{width:100%;padding:12px 16px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#374151;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;background-size:16px;padding-right:40px}.aspect-select:hover{border-color:#9ca3af;background-color:#f9fafb}.aspect-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.1)}.preview-area{width:100%;height:200px;border:2px solid #e5e7eb;border-radius:8px;background:#f9fafb;justify-content:center;overflow:hidden;position:relative}.preview-area,.preview-empty{display:flex;align-items:center}.preview-empty{flex-direction:column;gap:8px;color:#9ca3af}.preview-empty svg{opacity:.6}.preview-empty span{font-size:12px;font-weight:500}.preview-area img{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain;border-radius:4px}.preview-area.has-image{background:#fff;border-color:#d1d5db}@media (max-width:768px){.aspect-select{font-size:12px;padding:10px 14px;padding-right:36px;background-size:14px;background-position:right 10px center}.preview-area{height:150px}.preview-empty span{font-size:11px}}.size-info{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:.75rem;margin-top:.75rem;font-size:.8rem;width:100%}.size-item{display:flex;justify-content:space-between;align-items:center;padding:.25rem 0;border-bottom:1px solid #e5e7eb}.size-item:last-child{border-bottom:none}.size-item label{font-weight:500;color:#64748b;font-size:.75rem}.size-item span{font-weight:600;color:#334155;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.75rem}.toolbar-group .size-info{margin-top:12px;background:#fff;border:1px solid #e5e7eb}@media (max-width:768px){.size-info{font-size:.75rem;padding:.5rem;margin-top:.5rem}.size-item label,.size-item span{font-size:.7rem}}.manual-size-controls{margin-top:.75rem;padding:.75rem;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px}.manual-size-controls h5{margin:0 0 .75rem 0;font-size:.75rem;font-weight:600;color:#374151;text-align:center}.size-input-group{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.75rem}.size-input-item{display:flex;flex-direction:column;gap:.25rem}.size-input-item label{font-size:.7rem;font-weight:500;color:#64748b}.size-input-item input{width:100%;padding:.5rem;border:1px solid #d1d5db;border-radius:6px;font-size:.75rem;font-family:Monaco,Menlo,Ubuntu Mono,monospace;background:#fff;transition:all .2s ease}.size-input-item input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.1)}.size-input-item input:invalid{border-color:#ef4444}.size-control-buttons{display:flex;flex-direction:column;gap:.5rem}.size-btn{width:100%;padding:.5rem .75rem;border:none;border-radius:6px;font-size:.7rem;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;background:#3b82f6;color:#fff}.size-btn:hover{background:#2563eb;transform:translateY(-1px)}.size-btn:active{transform:translateY(0)}.size-btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}@media (max-width:768px){.manual-size-controls{padding:.5rem;margin-top:.5rem}.manual-size-controls h5{font-size:.7rem;margin-bottom:.5rem}.size-input-group{flex-direction:row;gap:.5rem;margin-bottom:.5rem}.size-input-item{flex:1}.size-input-item label{font-size:.65rem}.size-input-item input{padding:.4rem;font-size:.7rem}.size-control-buttons{flex-direction:column;gap:.4rem}.size-btn{padding:.5rem;font-size:.7rem}}@media (max-width:480px){.manual-size-controls{padding:.4rem}.size-input-group{flex-direction:column;gap:.4rem}.size-input-item{flex:none}.size-input-item input{padding:.35rem;font-size:.65rem}.size-control-buttons{flex-direction:column;gap:.3rem}.size-btn{flex:none;padding:.45rem;font-size:.65rem}}.img-dropzone{width:100%;height:400px;background:#f8f9fa;border:2px dashed #ddd;border-radius:8px;transition:all .2s}.img-dropzone.dragover{background:rgba(37,99,235,.05);border-color:#2563eb}.img-dropzone-content{text-align:center;color:#666}.img-dropzone-content svg{width:48px;height:48px;margin-bottom:12px;stroke:currentColor}.img-dropzone-content p{font-size:14px;line-height:1.5}.img-dropzone-content p:last-child{margin-top:8px;font-size:12px;color:#999}.color-picker{display:none;margin-top:20px;gap:20px}.preview-section{flex:1;position:relative;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.1)}#imageCanvas{width:100%;height:400px;cursor:crosshair;-o-object-fit:contain;object-fit:contain}.color-pointer{position:fixed;width:24px;height:24px;pointer-events:none;z-index:1000;display:none;transform:translate(-50%,-50%);border-radius:50%;box-shadow:0 0 0 2px #fff,0 0 0 3px rgba(0,0,0,.2)}.color-info{width:250px;padding:20px;background:#fff;border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.1)}.color-preview{width:100%;height:60px;border-radius:6px;margin-bottom:16px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}.color-values{gap:12px}.color-value,.color-values{display:flex;flex-direction:column}.color-value{gap:4px}.color-value span{font-size:12px;color:#666}.color-value input{width:100%;padding:8px;border:1px solid #eee;border-radius:4px;font-family:monospace;font-size:14px;color:#333;background:#f8f9fa}.tool-content{flex:1;overflow:hidden;margin-bottom:2rem}.color-history{background:#fff;border-radius:12px;box-shadow:0 1px 3px rgba(0,0,0,.1);padding:16px;margin:12px 0;min-height:68px;position:relative}.color-history:after{content:"取色记录";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#ccc;font-size:14px;pointer-events:none}.color-list{display:flex;gap:10px;flex-wrap:wrap;position:relative;z-index:1;min-height:36px}.color-list:not(:empty)~.color-history:after{display:none}.color-item{width:36px;height:36px;border-radius:8px;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1),0 2px 4px rgba(0,0,0,.05);transition:all .2s ease}.color-item:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px rgba(0,0,0,.1),0 4px 8px rgba(0,0,0,.1)}@media (max-width:768px){.color-history{padding:12px;margin:8px 0;min-height:56px}.color-list{gap:8px;min-height:32px}.color-item{width:32px;height:32px;border-radius:6px}}.tools .tool-content{padding:12px 0 24px}.convert-section,.format-section,.upload-section{margin-bottom:32px;background:var(--white);border-radius:16px;box-shadow:var(--shadow-sm);border:1px solid var(--gray-200);overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}.convert-section:hover,.format-section:hover,.upload-section:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--gray-300)}.section-header{padding:24px 24px 16px 24px;border-bottom:1px solid var(--gray-100);background:var(--gray-50)}.section-header h2{margin:0 0 8px 0;font-size:1.25rem;font-weight:600;color:var(--gray-900);display:flex;align-items:center;gap:8px;letter-spacing:-.01em}.section-header p{margin:0;color:var(--gray-500);font-size:.875rem;line-height:1.5;word-break:break-word}.upload-section{display:flex;flex-direction:column;justify-content:space-between;align-items:center;min-height:300px}.upload-content{width:100%;padding:24px}.img-dropzone,.upload-content{display:flex;justify-content:center;align-items:center}.img-dropzone{flex-direction:column;margin:24px auto;padding:48px 24px;border:2px dashed var(--gray-300);border-radius:16px;transition:all .3s cubic-bezier(.4,0,.2,1);background:var(--gray-50);position:relative;overflow:hidden;max-width:800px;width:90%;z-index:2}.img-dropzone:hover{border-color:var(--primary);background:rgba(0,122,255,.05);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.upload-icon{margin-bottom:16px;color:var(--gray-400);transition:all .3s ease}.img-dropzone:hover .upload-icon{color:var(--primary);transform:scale(1.05)}.img-dropzone-content h3{margin:0 0 8px 0;font-size:1.125rem;font-weight:600;color:var(--gray-900)}.img-dropzone-content p{margin:0 0 16px 0;color:var(--gray-500);font-size:.9375rem}.upload-link{color:var(--primary);font-weight:500;text-decoration:none;cursor:pointer}.upload-link:hover{text-decoration:underline}.upload-tips{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:16px}.tip-item{font-size:.75rem;color:var(--gray-600);padding:6px 12px;border-radius:999px;border:1px solid var(--gray-200);box-shadow:var(--shadow-sm)}.convert-section,.tip-item{background:var(--white)}.convert-list{display:flex;flex-direction:column;gap:16px;padding:24px}.convert-item{background:var(--white);border:1px solid var(--gray-200);border-radius:12px;padding:20px;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-sm)}.convert-item:hover{border-color:var(--gray-300);box-shadow:var(--shadow-md);transform:translateY(-2px)}.convert-header{justify-content:space-between;margin-bottom:16px;gap:20px}.convert-header,.convert-info{display:flex;align-items:center}.convert-info{gap:12px;flex:0 0 auto}.convert-preview{width:48px;height:48px;-o-object-fit:cover;object-fit:cover;border-radius:8px;border:1px solid rgba(0,0,0,.05);background:var(--gray-50)}.convert-details h4{margin:0 0 4px 0;font-size:.9375rem;font-weight:600;color:var(--gray-900)}.convert-meta{margin:0;font-size:.8125rem;color:var(--gray-500)}.format-selector-inline{flex:0 0 auto;max-width:200px;margin:0 15px}.format-label{display:block;font-size:.75rem;color:var(--gray-500);margin-bottom:6px;font-weight:500}.format-select-wrapper{position:relative}.format-select{width:100%;padding:8px 30px 8px 12px;border:1px solid var(--gray-300);border-radius:8px;background:var(--white);font-size:.875rem;color:var(--gray-900);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:all .2s ease;font-family:inherit}.format-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(0,122,255,.1)}.format-select:hover:not(:disabled){border-color:var(--gray-400)}.format-select:disabled{background-color:var(--gray-50);color:var(--gray-400);cursor:not-allowed;border-color:var(--gray-200)}.format-select:disabled+.format-select-icon{color:var(--gray-300)}.format-selector-inline.disabled{opacity:.6}.format-selector-inline.disabled .format-label{color:var(--gray-400)}.format-select-icon{position:absolute;right:8px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--gray-500);transition:color .2s ease}.convert-status{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-size:.8125rem;font-weight:500;flex:0 0 auto}.convert-status.has-error-message,.convert-status.status-error{flex-direction:column;align-items:flex-start;border-radius:12px}.convert-status.has-error-message{padding:8px 12px}.convert-status .status-text{display:flex;align-items:center;gap:6px}.status-waiting{background:var(--gray-100);color:var(--gray-600)}.status-converting{background:rgba(0,122,255,.1);color:var(--primary)}.status-completed{background:rgba(52,199,89,.1);color:#34c759}.status-error{background:rgba(255,59,48,.1);color:#ff3b30}.error-message{margin-top:8px;padding:8px 12px;background:var(--gray-50);color:var(--gray-600);border-radius:6px;font-size:.75rem;font-weight:400;line-height:1.4;border-left:3px solid #ff3b30}.convert-progress{margin-bottom:16px}.progress-bar{width:100%;height:6px;background:var(--gray-100);border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:var(--primary);border-radius:3px;transition:width .3s ease}.convert-actions{display:flex;gap:12px;justify-content:flex-end}.convert-actions a,.convert-actions button{padding:8px 16px;border-radius:8px;font-size:.875rem;font-weight:500;text-decoration:none;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);border:none;box-shadow:var(--shadow-sm)}.btn-convert{background:var(--primary);color:#fff;margin-right:0}.btn-convert:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn-convert.disabled,.btn-convert:disabled{background:var(--gray-300)!important;color:var(--gray-500)!important;cursor:not-allowed!important;transform:none!important;box-shadow:none!important}.btn-download{background:#34c759;color:#fff;display:flex;align-items:center;gap:6px}.btn-download:hover{background:#248a3d;transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn-link{background:var(--gray-500);color:#fff;display:inline-flex;align-items:center;justify-content:center}.btn-link:hover{background:var(--gray-600);color:#fff;text-decoration:none;transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn-remove{background:rgba(255,59,48,.1);color:#ff3b30;box-shadow:none!important}.btn-remove:hover{background:rgba(255,59,48,.2);transform:translateY(-1px)}.btn-remove:disabled{background:var(--gray-100)!important;color:var(--gray-400)!important;cursor:not-allowed!important;transform:none!important}.btn-retry{background:#ff9500!important;color:#fff!important}.btn-retry:hover{background:#e08400!important;box-shadow:var(--shadow-md)!important}.empty-state{text-align:center;padding:60px 20px;color:var(--gray-500)}.empty-state svg{width:64px;height:64px;margin-bottom:16px;opacity:.5;color:var(--gray-400)}.empty-state h3{margin:0 0 8px 0;font-size:1.125rem;font-weight:600;color:var(--gray-900)}.empty-state p{margin:0;font-size:.875rem}.img-dropzone.dragover{border-color:var(--primary);background:rgba(0,122,255,.1);transform:scale(1.01)}.img-dropzone.dragover .img-dropzone-content{color:var(--primary)}.tools{padding-top:24px}.img-workspace{position:relative;z-index:3;margin-top:24px}@media (max-width:768px){.img-workspace{margin-top:16px}.tool-content{padding:16px 0;margin:0}.section-header{padding:20px 20px 12px 20px}.section-header h2{font-size:1.125rem}.section-header p{font-size:.8125rem;line-height:1.4}.upload-section{padding:20px;margin-bottom:16px}.img-dropzone{margin:16px auto;padding:32px 16px}.convert-list{padding:20px}.convert-item{padding:16px}.convert-header{flex-direction:column;align-items:stretch;gap:16px}.convert-info{order:1}.format-selector-inline{order:2;max-width:none;margin:0}.convert-status{order:3;align-self:flex-end}.convert-actions{justify-content:center;flex-wrap:wrap}.convert-actions a,.convert-actions button{flex:1;min-width:80px;text-align:center}.convert-status.has-error-message{align-self:stretch;order:3}.error-message{font-size:.75rem;margin-top:6px}}@media (max-width:480px){.section-header,.upload-section{padding:16px}.section-header h2{font-size:1rem}.section-header p{font-size:.75rem;line-height:1.3}.img-dropzone{margin:12px auto;padding:24px 12px;min-height:180px}.upload-icon svg{width:48px;height:48px}.img-dropzone h3{font-size:1rem}.img-dropzone p{font-size:.8125rem}.upload-tips{flex-direction:column;gap:8px}.tip-item{font-size:.6875rem}.convert-list{padding:16px}.format-selector-inline .format-select{padding:8px 28px 8px 10px;font-size:.8125rem}.format-selector-inline .format-select-icon{right:6px}.format-label{font-size:.75rem}.convert-info{flex-direction:column;align-items:flex-start;gap:8px}.convert-preview{width:40px;height:40px}.convert-details h4{font-size:.875rem}.convert-meta{font-size:.75rem}.convert-actions a,.convert-actions button{padding:10px 12px;font-size:.8125rem}.convert-status{order:3;align-self:flex-end}.convert-status.has-error-message{align-self:stretch;order:3}.error-message{font-size:.75rem;margin-top:6px}.convert-actions{justify-content:center;flex-wrap:wrap}}.seo-content-wrap{position:relative;z-index:2}.seo-content{margin:28px 0 40px 0;background:#fff;border:1px solid #e5e7eb;border-radius:20px;box-shadow:0 8px 24px rgba(15,23,42,.06);padding:36px 28px;width:100%;max-width:none}.seo-content h1{margin:0 0 10px 0;font-size:28px;line-height:1.25;font-weight:800;color:#1d4ed8;text-align:center}.seo-content h2{margin:18px 0 10px 0;font-size:20px;font-weight:700;color:#0f172a;text-align:center}.seo-content h3{margin:6px 0 12px 0;font-size:16px;font-weight:600;color:#334155;text-align:center}.seo-content .seo-description{margin:0 auto 18px auto;max-width:880px;font-size:14px;line-height:1.8;color:#6b7280;text-align:center;border-top:1px solid #f1f5f9;padding-top:14px}.seo-content .format-grid{margin-top:10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.seo-content .format-card{background:linear-gradient(180deg,#fff,#fafafa);border:1px solid #e5e7eb;border-radius:14px;padding:14px 14px 12px 14px;box-shadow:0 2px 8px rgba(0,0,0,.04);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.seo-content .format-card:hover{transform:translateY(-2px);border-color:#bfdbfe;box-shadow:0 10px 20px rgba(59,130,246,.08)}.seo-content .format-card h4{margin:0 0 6px 0;font-size:15px;color:#0f172a;font-weight:700}.seo-content .format-card p{margin:0 0 8px 0;font-size:13px;color:#64748b;line-height:1.6}.seo-content .format-ext{display:inline-block;font-size:12px;color:#2563eb;background:#eef2ff;border:1px solid #dbeafe;padding:2px 8px;border-radius:999px}.seo-content .features-list{margin:16px auto 0 auto;padding:0 0 0 0;max-width:880px;list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px 14px}.seo-content .features-list li{position:relative;padding-left:20px;font-size:13px;color:#475569}.seo-content .features-list li:before{content:"✓";position:absolute;left:0;top:0;color:#10b981;font-weight:700}.upload-section .section-header h2{color:#0f172a}.upload-section .section-header p{color:#64748b}.upload-section{border-radius:16px}@media (max-width:1024px){.seo-content-wrap{position:relative;z-index:2}.seo-content{padding:28px 20px;border-radius:16px}.seo-content h1{font-size:24px}}@media (max-width:640px){.seo-content-wrap{position:relative;z-index:2}.seo-content{margin:18px 12px 28px;padding:22px 16px}.seo-content h1{font-size:22px}.seo-content h2{font-size:18px}.seo-content h3{font-size:14px}.seo-content .format-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}:root{--img-border-radius:8px;--img-padding:1.5rem;--img-gap:1rem;--img-shadow:0 1px 3px rgba(0,0,0,.1)}.img-dropzone{border:2px dashed var(--gray-200);border-radius:var(--img-border-radius);padding:2rem;text-align:center;transition:all .3s ease;cursor:pointer}.img-dropzone.dragover,.img-dropzone:hover{border-color:var(--primary);background:rgba(var(--primary-rgb),.05)}.img-dropzone-content{color:var(--gray-500)}.img-dropzone-content svg{margin-bottom:var(--img-gap);stroke:var(--gray-400)}.img-dropzone-content p{margin:0;font-size:.875rem}.img-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--img-gap);margin-top:1.5rem}.img-preview-item{position:relative;border-radius:var(--img-border-radius);overflow:hidden;box-shadow:var(--img-shadow)}.img-preview-image{width:100%;height:200px;-o-object-fit:cover;object-fit:cover}.img-preview-info{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.7);color:#fff;padding:.5rem;font-size:.75rem;transform:translateY(100%);transition:transform .3s ease}.img-preview-item:hover .img-preview-info{transform:translateY(0)}.img-preview-size{display:block;margin-bottom:.25rem}.img-preview-name{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (max-width:768px){.img-preview{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.img-preview-image{height:150px}}