@import"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap";:root{--color-bg-primary: #0f0f1a;--color-bg-secondary: #1a1a2e;--color-bg-tertiary: #252542;--color-bg-card: #16162a;--color-text-primary: #ffffff;--color-text-secondary: #a0a0b0;--color-text-muted: #6b6b7b;--color-accent: #00d9a5;--color-accent-hover: #00f0b5;--color-accent-muted: rgba(0, 217, 165, .15);--color-border: #2a2a4a;--color-border-hover: #3a3a5a;--color-danger: #ff6b6b;--color-warning: #feca57;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 48px;--radius-sm: 6px;--radius-md: 12px;--radius-lg: 16px;--radius-full: 9999px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .2);--shadow-md: 0 4px 16px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--shadow-glow: 0 0 20px rgba(0, 217, 165, .3);--transition-fast: .15s ease;--transition-normal: .25s ease;--transition-slow: .4s ease}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--color-bg-primary);color:var(--color-text-primary);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{min-height:100vh;display:flex;flex-direction:column}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.3}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.25rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);font-family:inherit;font-size:.9375rem;font-weight:500;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);text-decoration:none}.btn-primary{background:var(--color-accent);color:var(--color-bg-primary)}.btn-primary:hover{background:var(--color-accent-hover);box-shadow:var(--shadow-glow)}.btn-primary:disabled{background:var(--color-bg-tertiary);color:var(--color-text-muted);cursor:not-allowed;box-shadow:none}.btn-secondary{background:var(--color-bg-tertiary);color:var(--color-text-primary);border:1px solid var(--color-border)}.btn-secondary:hover{background:var(--color-border);border-color:var(--color-border-hover)}.btn-lg{padding:var(--spacing-md) var(--spacing-lg);font-size:1rem}input[type=number],input[type=text],select{width:100%;padding:var(--spacing-sm) var(--spacing-md);font-family:inherit;font-size:.9375rem;color:var(--color-text-primary);background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-sm);transition:all var(--transition-fast)}input[type=number]:focus,input[type=text]:focus,select:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-muted)}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{opacity:1}input[type=range]{width:100%;height:6px;background:var(--color-bg-tertiary);border-radius:var(--radius-full);appearance:none;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:18px;height:18px;background:var(--color-accent);border-radius:50%;cursor:pointer;transition:transform var(--transition-fast)}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}.card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-lg)}label{display:block;font-size:.875rem;font-weight:500;color:var(--color-text-secondary);margin-bottom:var(--spacing-xs)}.form-group{margin-bottom:var(--spacing-md)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-md)}.text-accent{color:var(--color-accent)}.text-muted{color:var(--color-text-muted)}.text-center{text-align:center}.text-sm{font-size:.875rem}.mt-sm{margin-top:var(--spacing-sm)}.mt-md{margin-top:var(--spacing-md)}.mt-lg{margin-top:var(--spacing-lg)}.mb-md{margin-bottom:var(--spacing-md)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-bg-secondary)}::-webkit-scrollbar-thumb{background:var(--color-bg-tertiary);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-border)}::selection{background:var(--color-accent);color:var(--color-bg-primary)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-fade-in{animation:fadeIn var(--transition-normal) ease-out}.animate-slide-up{animation:slideUp var(--transition-slow) ease-out}.animate-pulse{animation:pulse 2s ease-in-out infinite}.toast-container{position:fixed;bottom:var(--spacing-lg);right:var(--spacing-lg);z-index:1000;display:flex;flex-direction:column;gap:var(--spacing-sm)}.toast{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-lg);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);animation:slideInRight var(--transition-normal) ease-out;max-width:320px}.toast-success{border-color:var(--color-accent)}.toast-error{border-color:var(--color-danger)}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.loading-overlay{position:fixed;inset:0;background:#0f0f1acc;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:999}[data-tooltip]{position:relative}[data-tooltip]:after{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(-8px);padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:.75rem;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--transition-fast)}[data-tooltip]:hover:after{opacity:1}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.image-uploader[data-v-4caa44d4]{width:100%}.file-input[data-v-4caa44d4]{display:none}.upload-zone[data-v-4caa44d4]{position:relative;min-height:400px;border:2px dashed var(--color-border);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-normal);background:var(--color-bg-secondary);overflow:hidden}.upload-zone[data-v-4caa44d4]:hover:not(.has-image):not(.is-loading){border-color:var(--color-accent);background:var(--color-accent-muted);box-shadow:0 0 30px #00d9a51a}.upload-zone.is-dragging[data-v-4caa44d4]{border-color:var(--color-accent);background:var(--color-accent-muted);transform:scale(1.01);box-shadow:0 0 40px #00d9a533}.upload-zone.has-image[data-v-4caa44d4]{cursor:default;border-style:solid;border-color:var(--color-border)}.upload-zone.is-loading[data-v-4caa44d4]{pointer-events:none}.loading-state[data-v-4caa44d4]{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);color:var(--color-text-secondary)}.spinner[data-v-4caa44d4]{width:48px;height:48px;border:3px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;animation:spin-4caa44d4 1s linear infinite}@keyframes spin-4caa44d4{to{transform:rotate(360deg)}}.upload-placeholder[data-v-4caa44d4]{text-align:center;padding:var(--spacing-2xl)}.upload-icon[data-v-4caa44d4]{color:var(--color-text-muted);margin-bottom:var(--spacing-md);transition:color var(--transition-fast)}.upload-zone:hover .upload-icon[data-v-4caa44d4]{color:var(--color-accent)}.upload-placeholder h3[data-v-4caa44d4]{margin-bottom:var(--spacing-xs);color:var(--color-text-primary)}.format-hint[data-v-4caa44d4]{display:flex;gap:var(--spacing-sm);justify-content:center;margin-top:var(--spacing-lg)}.format-tag[data-v-4caa44d4]{padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-bg-tertiary);border-radius:var(--radius-sm);font-size:.75rem;font-weight:500;color:var(--color-text-muted)}.image-preview[data-v-4caa44d4]{width:100%;height:100%;display:flex;flex-direction:column;padding:var(--spacing-md);animation:fadeIn-4caa44d4 var(--transition-normal) ease-out}@keyframes fadeIn-4caa44d4{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.preview-image[data-v-4caa44d4]{max-width:100%;max-height:350px;object-fit:contain;border-radius:var(--radius-md);margin:0 auto;display:block}.image-info[data-v-4caa44d4]{margin-top:var(--spacing-md);padding:var(--spacing-md);background:var(--color-bg-tertiary);border-radius:var(--radius-md);display:flex;flex-wrap:wrap;gap:var(--spacing-md) var(--spacing-xl)}.info-row[data-v-4caa44d4]{display:flex;gap:var(--spacing-sm);align-items:center}.info-label[data-v-4caa44d4]{font-size:.8125rem;color:var(--color-text-muted)}.info-value[data-v-4caa44d4]{font-size:.875rem;font-weight:500;color:var(--color-text-primary)}.clear-btn[data-v-4caa44d4]{position:absolute;top:var(--spacing-md);right:var(--spacing-md);width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-full);color:var(--color-text-secondary);cursor:pointer;font-size:1rem;transition:all var(--transition-fast)}.clear-btn[data-v-4caa44d4]:hover{background:var(--color-danger);border-color:var(--color-danger);color:#fff}.error-message[data-v-4caa44d4]{display:flex;align-items:center;gap:var(--spacing-sm);margin-top:var(--spacing-md);padding:var(--spacing-md);background:#ff6b6b1a;border:1px solid rgba(255,107,107,.3);border-radius:var(--radius-md);color:var(--color-danger);font-size:.875rem}.error-icon[data-v-4caa44d4]{flex-shrink:0}.settings-panel[data-v-9922e983]{display:flex;flex-direction:column;gap:var(--spacing-md)}.panel-title[data-v-9922e983]{font-size:1.25rem;padding-bottom:var(--spacing-md);border-bottom:1px solid var(--color-border)}.image-summary[data-v-9922e983]{padding:var(--spacing-md);background:var(--color-bg-tertiary);border-radius:var(--radius-md)}.summary-item[data-v-9922e983]{display:flex;justify-content:space-between;align-items:center}.summary-label[data-v-9922e983]{font-size:.8125rem;color:var(--color-text-muted)}.summary-value[data-v-9922e983]{font-weight:600;font-size:.9375rem}.section[data-v-9922e983]{padding-top:var(--spacing-md)}.section-label[data-v-9922e983]{display:block;font-size:.875rem;font-weight:500;color:var(--color-text-secondary);margin-bottom:var(--spacing-sm)}.mode-tabs[data-v-9922e983]{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-sm)}.mode-tab[data-v-9922e983]{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-md);background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);font-family:inherit;color:var(--color-text-secondary)}.mode-tab[data-v-9922e983]:hover{border-color:var(--color-border-hover);background:var(--color-bg-secondary)}.mode-tab.active[data-v-9922e983]{border-color:var(--color-accent);background:var(--color-accent-muted);color:var(--color-accent)}.mode-icon[data-v-9922e983]{font-size:1.5rem}.mode-label[data-v-9922e983]{font-size:.75rem;font-weight:500}.grid-info[data-v-9922e983]{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-sm);padding:var(--spacing-md);background:var(--color-bg-tertiary);border-radius:var(--radius-md);text-align:center}.info-item[data-v-9922e983]{display:flex;flex-direction:column;gap:2px}.info-value[data-v-9922e983]{font-size:.9375rem;font-weight:600}.info-label[data-v-9922e983]{font-size:.6875rem;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.format-options[data-v-9922e983]{display:flex;gap:var(--spacing-sm)}.format-btn[data-v-9922e983]{flex:1;padding:var(--spacing-sm) var(--spacing-md);background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-secondary);font-family:inherit;font-size:.875rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.format-btn[data-v-9922e983]:hover{border-color:var(--color-border-hover)}.format-btn.active[data-v-9922e983]{border-color:var(--color-accent);background:var(--color-accent-muted);color:var(--color-accent)}.empty-state[data-v-9922e983]{text-align:center;padding:var(--spacing-2xl) var(--spacing-md);color:var(--color-text-muted)}.empty-icon[data-v-9922e983]{font-size:3rem;margin-bottom:var(--spacing-md);opacity:.5}.empty-state p[data-v-9922e983]{font-size:.9375rem}.split-preview[data-v-7f11be87]{display:flex;flex-direction:column;gap:var(--spacing-md)}.canvas-container[data-v-7f11be87]{display:flex;justify-content:center;align-items:center;padding:var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--radius-md);min-height:300px}.preview-canvas[data-v-7f11be87]{border-radius:var(--radius-sm);box-shadow:var(--shadow-md)}.preview-footer[data-v-7f11be87]{display:flex;justify-content:center}.preview-hint[data-v-7f11be87]{display:flex;align-items:center;gap:var(--spacing-sm);font-size:.8125rem;color:var(--color-text-muted)}.hint-icon[data-v-7f11be87]{font-size:1rem}.export-panel[data-v-7df039cb]{display:flex;flex-direction:column;gap:var(--spacing-md)}.actions[data-v-7df039cb]{display:flex;flex-direction:column;gap:var(--spacing-sm)}.btn-full[data-v-7df039cb]{width:100%}.btn-icon[data-v-7df039cb]{font-size:1.125rem}.spinner-sm[data-v-7df039cb]{display:inline-block;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin-7df039cb .75s linear infinite}@keyframes spin-7df039cb{to{transform:rotate(360deg)}}.error-message[data-v-7df039cb]{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:#ff6b6b1a;border:1px solid rgba(255,107,107,.3);border-radius:var(--radius-md);color:var(--color-danger);font-size:.8125rem}.error-icon[data-v-7df039cb]{flex-shrink:0}.results-preview[data-v-7df039cb]{margin-top:var(--spacing-md)}.results-header[data-v-7df039cb]{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.results-header h3[data-v-7df039cb]{font-size:.9375rem;font-weight:600}.results-meta[data-v-7df039cb]{font-size:.75rem;color:var(--color-text-muted)}.results-grid[data-v-7df039cb]{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:var(--spacing-sm);max-height:300px;overflow-y:auto;padding:var(--spacing-sm);background:var(--color-bg-tertiary);border-radius:var(--radius-md)}.result-item[data-v-7df039cb]{position:relative;aspect-ratio:1;border-radius:var(--radius-sm);overflow:hidden;cursor:pointer;transition:all var(--transition-fast);border:2px solid transparent}.result-item[data-v-7df039cb]:hover{border-color:var(--color-accent);transform:scale(1.05)}.result-item img[data-v-7df039cb]{width:100%;height:100%;object-fit:cover}.result-label[data-v-7df039cb]{position:absolute;bottom:4px;left:4px;padding:2px 6px;background:#00d9a5e6;border-radius:3px;font-size:.625rem;font-weight:600;color:var(--color-bg-primary)}.result-size[data-v-7df039cb]{position:absolute;top:4px;right:4px;padding:2px 4px;background:#000000b3;border-radius:3px;font-size:.5625rem;color:var(--color-text-secondary);opacity:0;transition:opacity var(--transition-fast)}.result-item:hover .result-size[data-v-7df039cb]{opacity:1}.progress-bar[data-v-7df039cb]{height:4px;background:var(--color-bg-tertiary);border-radius:var(--radius-full);overflow:hidden}.progress-fill[data-v-7df039cb]{height:100%;background:var(--color-accent);transition:width var(--transition-fast)}.language-switcher[data-v-fff2c47e]{display:flex;gap:4px;background:var(--color-bg-tertiary);padding:4px;border-radius:var(--radius-sm)}.lang-btn[data-v-fff2c47e]{padding:4px 10px;font-family:inherit;font-size:.75rem;font-weight:600;color:var(--color-text-muted);background:transparent;border:none;border-radius:4px;cursor:pointer;transition:all var(--transition-fast)}.lang-btn[data-v-fff2c47e]:hover{color:var(--color-text-primary)}.lang-btn.active[data-v-fff2c47e]{background:var(--color-accent);color:var(--color-bg-primary)}.app[data-v-43c83b7c]{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(ellipse at top left,rgba(0,217,165,.05) 0%,transparent 50%),radial-gradient(ellipse at bottom right,rgba(0,150,255,.05) 0%,transparent 50%),var(--color-bg-primary);opacity:0;transform:translateY(10px);transition:opacity .4s ease,transform .4s ease}.app.app-ready[data-v-43c83b7c]{opacity:1;transform:translateY(0)}.toast-container[data-v-43c83b7c]{position:fixed;bottom:var(--spacing-lg);right:var(--spacing-lg);z-index:1000;display:flex;flex-direction:column;gap:var(--spacing-sm)}.toast[data-v-43c83b7c]{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-lg);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);animation:slideInRight-43c83b7c .3s ease-out;font-size:.875rem}.toast-success[data-v-43c83b7c]{border-color:var(--color-accent)}.toast-success .toast-icon[data-v-43c83b7c]{color:var(--color-accent)}.toast-error[data-v-43c83b7c]{border-color:var(--color-danger)}.toast-error .toast-icon[data-v-43c83b7c]{color:var(--color-danger)}.toast-info .toast-icon[data-v-43c83b7c]{color:var(--color-text-muted)}.toast-icon[data-v-43c83b7c]{font-weight:700}@keyframes slideInRight-43c83b7c{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.header[data-v-43c83b7c]{padding:var(--spacing-lg) var(--spacing-xl);border-bottom:1px solid var(--color-border);background:#0f0f1acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.header-content[data-v-43c83b7c]{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md)}.header-left[data-v-43c83b7c]{display:flex;align-items:center;gap:var(--spacing-md)}.header-right[data-v-43c83b7c]{display:flex;align-items:center}.logo[data-v-43c83b7c]{display:flex;align-items:center;gap:var(--spacing-sm);font-size:1.5rem;font-weight:700}.logo-img[data-v-43c83b7c]{width:36px;height:36px;object-fit:contain}.tagline[data-v-43c83b7c]{color:var(--color-text-muted);font-size:.875rem;padding-left:var(--spacing-md);border-left:1px solid var(--color-border)}.main[data-v-43c83b7c]{flex:1;padding:var(--spacing-xl)}.container[data-v-43c83b7c]{max-width:1400px;margin:0 auto}.workspace[data-v-43c83b7c]{display:grid;grid-template-columns:1fr 360px;gap:var(--spacing-lg);align-items:start}.preview-area[data-v-43c83b7c]{min-height:500px;display:flex;flex-direction:column}.preview-header[data-v-43c83b7c]{display:flex;justify-content:space-between;align-items:center;padding-bottom:var(--spacing-md);margin-bottom:var(--spacing-md);border-bottom:1px solid var(--color-border)}.image-name[data-v-43c83b7c]{display:flex;align-items:center;gap:var(--spacing-sm);font-weight:500;color:var(--color-text-primary)}.name-icon[data-v-43c83b7c]{font-size:1.25rem}.settings-area[data-v-43c83b7c]{position:sticky;top:var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-lg)}.export-section[data-v-43c83b7c]{padding-top:var(--spacing-lg);border-top:1px solid var(--color-border)}.footer[data-v-43c83b7c]{padding:var(--spacing-lg);text-align:center;border-top:1px solid var(--color-border)}.footer-text[data-v-43c83b7c]{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);font-size:.875rem;color:var(--color-text-secondary);margin:0}.footer-link[data-v-43c83b7c]{display:inline-flex;align-items:center;gap:4px;color:var(--color-text-primary);text-decoration:none;transition:color var(--transition-fast)}.footer-link[data-v-43c83b7c]:hover{color:var(--color-accent)}.footer-divider[data-v-43c83b7c]{color:var(--color-text-muted)}.github-icon[data-v-43c83b7c]{display:inline-flex;align-items:center}.footer-license[data-v-43c83b7c]{font-size:.75rem;color:var(--color-text-muted);margin-top:var(--spacing-xs)}@media(max-width:1024px){.workspace[data-v-43c83b7c]{grid-template-columns:1fr}.settings-area[data-v-43c83b7c]{position:static}}@media(max-width:600px){.header-content[data-v-43c83b7c]{flex-wrap:wrap;gap:var(--spacing-sm)}.header-left[data-v-43c83b7c]{flex-direction:column;align-items:flex-start;gap:var(--spacing-xs)}.tagline[data-v-43c83b7c]{padding-left:0;border-left:none}.main[data-v-43c83b7c]{padding:var(--spacing-md)}}