@import url(https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fraunces:wght@600;700;900&display=swap);body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box}:root{--color-text-primary:#0a0a0a;--color-text-secondary:#525252;--color-text-tertiary:#a3a3a3;--color-bg-primary:#fff;--color-bg-secondary:#fafafa;--color-bg-tertiary:#f5f5f5;--color-accent:#537385;--color-accent-hover:#3d5a6a;--color-accent-light:#e8eef1;--color-border:#e5e5e5;--color-border-light:#f5f5f5;--shadow-sm:0 1px 2px #0000000a;--shadow-md:0 4px 16px #0000000a;--shadow-lg:0 8px 32px #0000000f;--space-xs:0.5rem;--space-sm:1rem;--space-md:1.5rem;--space-lg:2rem;--space-xl:3rem;--space-2xl:4rem;--font-body:"DM Sans",-apple-system,sans-serif;--font-display:"Fraunces",serif}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#fafafa;background:var(--color-bg-secondary);color:#0a0a0a;color:var(--color-text-primary);font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);line-height:1.6;margin:0}.App{display:flex;flex-direction:column;min-height:100vh}.header{background:radial-gradient(ellipse at center,#537385 0,#022534 100%);border-bottom:none;padding:4rem 2rem;padding:var(--space-2xl) var(--space-lg);text-align:center}.header h1{color:#fff;font-family:Fraunces,serif;font-family:var(--font-display);font-size:3rem;font-weight:700;letter-spacing:-.02em;line-height:1.1;margin:0 0 1rem;margin:0 0 var(--space-sm) 0}.header p{color:#ffffffe6;font-size:1.125rem;font-weight:400;margin:0 auto;max-width:600px}.main{flex:1 1;margin:0 auto;max-width:1400px;padding:4rem 2rem;padding:var(--space-2xl) var(--space-lg);width:100%}.dropzone{background:#fff;background:var(--color-bg-primary);border:2px dashed #e5e5e5;border:2px dashed var(--color-border);border-radius:16px;cursor:pointer;margin-bottom:3rem;margin-bottom:var(--space-xl);padding:4rem;padding:var(--space-2xl);transition:all .3s cubic-bezier(.4,0,.2,1)}.dropzone.active,.dropzone:hover{background:#e8eef1;background:var(--color-accent-light);border-color:#537385;border-color:var(--color-accent);box-shadow:0 4px 16px #0000000a;box-shadow:var(--shadow-md)}.dropzone-content{align-items:center;color:#525252;color:var(--color-text-secondary);display:flex;flex-direction:column;gap:1.5rem;gap:var(--space-md)}.dropzone-content svg{color:#537385;color:var(--color-accent)}.dropzone-content p{color:#0a0a0a;color:var(--color-text-primary);font-size:1.125rem;font-weight:600;margin:0}.dropzone-content small{color:#a3a3a3;color:var(--color-text-tertiary);font-size:.875rem}.update-notice{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background-color:#fffffff2;border:1px solid #e5e5e5;border:1px solid var(--color-border);border-radius:12px;box-shadow:0 4px 16px #0000000a;box-shadow:var(--shadow-md);color:#0a0a0a;color:var(--color-text-primary);cursor:pointer;font-size:14px;font-weight:400;left:16px;max-width:320px;padding:12px 24px;position:fixed;top:80px;transition:all .3s ease;z-index:9999}.update-notice:hover{background-color:#e8eef1;background-color:var(--color-accent-light);border-color:#537385;border-color:var(--color-accent);box-shadow:0 8px 32px #0000000f;box-shadow:var(--shadow-lg);color:#3d5a6a;color:var(--color-accent-hover)}.step-header{align-items:flex-start;display:flex;gap:1.5rem;gap:var(--space-md);margin-bottom:2rem;margin-bottom:var(--space-lg)}.step-number{color:#a3a3a3;color:var(--color-text-tertiary);flex-shrink:0;font-family:Fraunces,serif;font-family:var(--font-display);font-size:2.5rem;font-weight:700;line-height:1}.step-content{flex:1 1}.step-content h3{color:#0a0a0a;color:var(--color-text-primary);font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:1.5rem;font-weight:600;margin:0 0 .5rem;margin:0 0 var(--space-xs) 0}.step-content p{color:#525252;color:var(--color-text-secondary);font-size:1rem;line-height:1.6;margin:0}.instructions{background:#fff;background:var(--color-bg-primary);border:1px solid #f5f5f5;border:1px solid var(--color-border-light);border-radius:16px;box-shadow:0 1px 2px #0000000a;box-shadow:var(--shadow-sm);margin-bottom:3rem;margin-bottom:var(--space-xl);padding:3rem;padding:var(--space-xl)}.instructions h3{color:#0a0a0a;color:var(--color-text-primary);font-size:1.25rem;font-weight:600;margin:0 0 1.5rem;margin:0 0 var(--space-md) 0}.instructions ol{color:#525252;color:var(--color-text-secondary);line-height:1.8;margin:0;padding-left:1.5rem;padding-left:var(--space-md)}.instructions li{margin-bottom:1rem;margin-bottom:var(--space-sm)}.instructions li:last-child{margin-bottom:0}.privacy-note{border-top:1px solid #f5f5f5;border-top:1px solid var(--color-border-light);color:#a3a3a3;color:var(--color-text-tertiary);font-size:.875rem;line-height:1.6;margin:1.5rem 0 0;margin:var(--space-md) 0 0 0;padding-top:1.5rem;padding-top:var(--space-md)}.error{background:#fef2f2;border:1px solid #fee2e2;border-radius:12px;color:#991b1b;white-space:pre-line}.error,.progress{font-size:.9375rem;margin-bottom:1.5rem;margin-bottom:var(--space-md);padding:1.5rem;padding:var(--space-md)}.progress{background:#e8eef1;background:var(--color-accent-light);border:1px solid #bfdbfe;border-radius:12px;color:#3d5a6a;color:var(--color-accent-hover);font-weight:500}.columns{grid-gap:3rem;grid-gap:var(--space-xl);display:grid;gap:3rem;gap:var(--space-xl);grid-template-columns:1fr 1fr;margin-bottom:3rem;margin-bottom:var(--space-xl)}.column{background:#fff;background:var(--color-bg-primary);border:1px solid #f5f5f5;border:1px solid var(--color-border-light);border-radius:16px;box-shadow:0 1px 2px #0000000a;box-shadow:var(--shadow-sm);padding:3rem;padding:var(--space-xl)}.column-header{border-bottom:1px solid #f5f5f5;border-bottom:1px solid var(--color-border-light);margin-bottom:1.5rem;margin-bottom:var(--space-md);padding-bottom:1.5rem;padding-bottom:var(--space-md)}.column-header h2{color:#0a0a0a;color:var(--color-text-primary);font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:1.5rem;font-weight:600;margin:0 0 1.5rem;margin:0 0 var(--space-md) 0}.control{display:flex;flex-direction:column;gap:.5rem;gap:var(--space-xs)}.control label{color:#525252;color:var(--color-text-secondary);font-size:.9375rem;font-weight:500}.control input[type=number],.control input[type=text],.control select{background:#fff;background:var(--color-bg-primary);border:1px solid #e5e5e5;border:1px solid var(--color-border);border-radius:10px;font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:.9375rem;padding:.75rem;transition:all .2s}.control input[type=text].small-input{font-size:.875rem;max-width:400px;padding:.625rem .75rem}.control input[type=text].small-input::placeholder{color:#a3a3a3;color:var(--color-text-tertiary)}.control input[type=number]:focus,.control input[type=text]:focus,.control select:focus{border-color:#537385;border-color:var(--color-accent);box-shadow:0 0 0 3px #e8eef1;box-shadow:0 0 0 3px var(--color-accent-light);outline:none}.format-button-group{display:flex;flex-wrap:wrap;gap:12px;margin:1rem 0;margin:var(--space-sm) 0}.format-btn{background:#f5f5f5;background:var(--color-bg-tertiary);border:1px solid #e5e5e5;border:1px solid var(--color-border);border-radius:100px;color:#525252;color:var(--color-text-secondary);cursor:pointer;font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:.875rem;font-weight:500;padding:.625rem 1.5rem;transition:all .2s}.format-btn:hover{background:#e8eef1;background:var(--color-accent-light);color:#537385;color:var(--color-accent)}.format-btn.selected,.format-btn:hover{border-color:#537385;border-color:var(--color-accent)}.format-btn.selected{background:#537385;background:var(--color-accent);color:#fff}.dimension-controls{display:flex;flex-direction:column;gap:12px}.dimension-button-group{align-items:center;display:flex;flex-wrap:wrap;gap:10px}.dimension-btn{background:#f5f5f5;background:var(--color-bg-tertiary);border:1px solid #e5e5e5;border:1px solid var(--color-border);border-radius:100px;color:#525252;color:var(--color-text-secondary);cursor:pointer;font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:.875rem;font-weight:500;min-width:75px;padding:.625rem 1.25rem;transition:all .2s}.dimension-btn:hover{background:#e8eef1;background:var(--color-accent-light);color:#537385;color:var(--color-accent)}.dimension-btn.selected,.dimension-btn:hover{border-color:#537385;border-color:var(--color-accent)}.dimension-btn.selected{background:#537385;background:var(--color-accent);color:#fff}.dimension-input{-webkit-appearance:none;-moz-appearance:textfield;background:#fff;background:var(--color-bg-primary);border:1px solid #e5e5e5;border:1px solid var(--color-border);border-radius:100px!important;font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:.875rem;padding:.625rem 1.25rem;transition:all .2s;width:120px}.dimension-input:focus{border-color:#537385;border-color:var(--color-accent);box-shadow:0 0 0 3px #e8eef1;box-shadow:0 0 0 3px var(--color-accent-light);outline:none}.dimension-input::placeholder{color:#a3a3a3;color:var(--color-text-tertiary)}.image-grid{grid-gap:1.5rem;grid-gap:var(--space-md);border:2px dashed #0000;border-radius:12px;display:grid;gap:1.5rem;gap:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(150px,1fr));min-height:200px;padding:1.5rem;padding:var(--space-md);transition:all .3s ease}.image-grid.drag-over{background:#e8eef1;background:var(--color-accent-light);border-color:#537385;border-color:var(--color-accent)}.image-item{background:#f5f5f5;background:var(--color-bg-tertiary);border:1px solid #f5f5f5;border:1px solid var(--color-border-light);border-radius:12px;cursor:move;padding:.5rem;padding:var(--space-xs);position:relative;transition:all .2s}.image-item:hover{border-color:#e5e5e5;border-color:var(--color-border);box-shadow:0 4px 16px #0000000a;box-shadow:var(--shadow-md);transform:translateY(-4px)}.image-item img{border-radius:8px;display:block;height:auto;margin-bottom:.5rem;margin-bottom:var(--space-xs);width:100%}.image-info{display:flex;flex-direction:column;gap:.25rem}.image-info small{color:#a3a3a3;color:var(--color-text-tertiary);font-size:.75rem;word-break:break-word}.remove-btn{align-items:center;background:#fff;border:1px solid #e5e5e5;border:1px solid var(--color-border);border-radius:50%;box-shadow:0 1px 2px #0000000a;box-shadow:var(--shadow-sm);color:#525252;color:var(--color-text-secondary);cursor:pointer;display:flex;font-size:1rem;height:28px;justify-content:center;line-height:1;position:absolute;right:12px;top:12px;transition:all .2s;width:28px;z-index:10}.remove-btn:hover{background:#fef2f2;border-color:#fee2e2;box-shadow:0 4px 16px #0000000a;box-shadow:var(--shadow-md);color:#dc2626;transform:scale(1.1)}.conversion-controls{background:#fff;background:var(--color-bg-primary);border:1px solid #f5f5f5;border:1px solid var(--color-border-light);border-radius:16px;box-shadow:0 1px 2px #0000000a;box-shadow:var(--shadow-sm);margin-bottom:1.5rem;margin-bottom:var(--space-md);padding:3rem;padding:var(--space-xl)}.conversion-controls h2{color:#0a0a0a;color:var(--color-text-primary);font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:1.5rem;font-weight:600;margin:0 0 2rem;margin:0 0 var(--space-lg) 0}.controls-row{grid-gap:2rem;grid-gap:var(--space-lg);display:grid;gap:2rem;gap:var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:2rem;margin-bottom:var(--space-lg)}.help-text{color:#a3a3a3;color:var(--color-text-tertiary);display:block;font-size:.8125rem;line-height:1.5;margin-top:.5rem}.help-text.center{margin-top:.5rem;margin-top:var(--space-xs);text-align:center}.control.checkbox{align-items:center;flex-direction:row}.control.checkbox.inline{margin-bottom:.5rem;margin-bottom:var(--space-xs)}.control.checkbox.inline.small label{color:#525252;color:var(--color-text-secondary);font-size:.875rem}.control.checkbox.inline.small input[type=checkbox]{height:16px;width:16px}.control.checkbox label{align-items:center;cursor:pointer;display:flex;gap:.5rem;gap:var(--space-xs)}.control.checkbox input[type=checkbox]{accent-color:#537385;accent-color:var(--color-accent);cursor:pointer;height:18px;width:18px}.control input[type=range]{-webkit-appearance:none;background:#f5f5f5;background:var(--color-bg-tertiary);border-radius:3px;height:6px;outline:none;width:100%}.control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#537385;background:var(--color-accent);border-radius:50%;cursor:pointer;height:18px;-webkit-transition:all .2s;transition:all .2s;width:18px}.control input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.control input[type=range]::-moz-range-thumb{background:#537385;background:var(--color-accent);border:none;border-radius:50%;cursor:pointer;height:18px;-moz-transition:all .2s;transition:all .2s;width:18px}.control input[type=range]::-moz-range-thumb:hover{transform:scale(1.2)}.control input[type=range]:disabled{cursor:not-allowed;opacity:.5}.convert-btn{background:#537385;background:var(--color-accent);border:none;border-radius:12px;color:#fff;cursor:pointer;font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:1rem;font-weight:600;margin-top:1.5rem;margin-top:var(--space-md);padding:1rem 2rem;transition:all .2s;width:100%}.convert-btn:hover:not(:disabled){background:#3d5a6a;background:var(--color-accent-hover);box-shadow:0 4px 16px #0000000a;box-shadow:var(--shadow-md);transform:translateY(-2px)}.convert-btn.disabled,.convert-btn:disabled{background:#a3a3a3;background:var(--color-text-tertiary);cursor:not-allowed;opacity:.5}.button-group{display:flex;gap:1.5rem;gap:var(--space-md);margin-top:1.5rem;margin-top:var(--space-md)}.button-group .convert-btn{flex:1 1;margin-top:0}.clear-btn{background:#0000;border:1px solid #e5e5e5;border:1px solid var(--color-border);border-radius:12px;color:#525252;color:var(--color-text-secondary);cursor:pointer;font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:1rem;font-weight:600;padding:1rem 1.5rem;transition:all .2s;white-space:nowrap}.clear-btn:hover:not(:disabled){background:#f5f5f5;background:var(--color-bg-tertiary);border-color:#525252;border-color:var(--color-text-secondary);box-shadow:0 1px 2px #0000000a;box-shadow:var(--shadow-sm);transform:translateY(-2px)}.clear-btn:disabled{cursor:not-allowed;opacity:.5}.footer{background:#fff;background:var(--color-bg-primary);border-top:1px solid #e5e5e5;border-top:1px solid var(--color-border);margin-top:4rem;margin-top:var(--space-2xl);padding:3rem 2rem;padding:var(--space-xl) var(--space-lg);text-align:center}.footer p{color:#a3a3a3;color:var(--color-text-tertiary);font-size:.875rem;margin:.5rem 0}.footer a,.footer button{background:none;border:none;color:#537385;color:var(--color-accent);cursor:pointer;font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-weight:500;padding:0;text-decoration:none;transition:color .2s}.footer a:hover,.footer button:hover{color:#3d5a6a;color:var(--color-accent-hover);text-decoration:underline}.footer-link{background:none;border:none;color:#537385;color:var(--color-accent);cursor:pointer;font:inherit;font-weight:500;padding:0;text-decoration:underline;transition:color .2s}.footer-link:hover{color:#3d5a6a;color:var(--color-accent-hover)}.modal-overlay{align-items:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:#00000080;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:10000}.modal-content{background-color:#fff;background-color:var(--color-bg-primary);border:1px solid #f5f5f5;border:1px solid var(--color-border-light);border-radius:16px;box-shadow:0 8px 32px #0000000f;box-shadow:var(--shadow-lg);max-width:500px;padding:4rem;padding:var(--space-2xl);width:100%}.modal-header{align-items:center;border-bottom:1px solid #f5f5f5;border-bottom:1px solid var(--color-border-light);display:flex;justify-content:space-between;margin-bottom:2rem;margin-bottom:var(--space-lg);padding-bottom:1.5rem;padding-bottom:var(--space-md)}.modal-header h2{color:#0a0a0a;color:var(--color-text-primary);font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:1.5rem;font-weight:600;margin:0}.modal-close{align-items:center;background:none;border:none;color:#a3a3a3;color:var(--color-text-tertiary);cursor:pointer;display:flex;font-size:2rem;height:32px;justify-content:center;line-height:1;padding:0;transition:color .2s;width:32px}.modal-close:hover{color:#537385;color:var(--color-accent)}.modal-success{padding:3rem 0;padding:var(--space-xl) 0;text-align:center}.success-icon{color:#537385;color:var(--color-accent);font-size:3rem;margin-bottom:1.5rem;margin-bottom:var(--space-md)}.success-title{color:#0a0a0a;color:var(--color-text-primary);font-size:1.25rem;font-weight:600;margin-bottom:.5rem;margin-bottom:var(--space-xs)}.success-message{color:#525252;color:var(--color-text-secondary);margin:0}.modal-form{gap:1.5rem;gap:var(--space-md)}.form-field,.modal-form{display:flex;flex-direction:column}.form-field{gap:.5rem;gap:var(--space-xs)}.form-field label{font-size:.875rem;font-weight:500}.form-field label,.form-input{color:#0a0a0a;color:var(--color-text-primary)}.form-input{background:#fff;background:var(--color-bg-primary);border:1px solid #e5e5e5;border:1px solid var(--color-border);border-radius:10px;box-sizing:border-box;font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:.9375rem;padding:.75rem 1rem;transition:all .2s;width:100%}.form-input:focus{border-color:#537385;border-color:var(--color-accent);box-shadow:0 0 0 3px #e8eef1;box-shadow:0 0 0 3px var(--color-accent-light);outline:none}.form-input::placeholder{color:#a3a3a3;color:var(--color-text-tertiary)}.form-textarea{min-height:100px;resize:vertical}.form-error{background:#fef2f2;border:1px solid #fee2e2;border-radius:8px;color:#dc2626;font-size:.875rem;margin-bottom:1rem;margin-bottom:var(--space-sm);padding:1rem;padding:var(--space-sm)}.form-submit{background-color:#537385;background-color:var(--color-accent);border:none;border-radius:10px;color:#fff;cursor:pointer;font-family:DM Sans,-apple-system,sans-serif;font-family:var(--font-body);font-size:1rem;font-weight:600;padding:.875rem 1.5rem;transition:all .2s;width:100%}.form-submit:hover:not(:disabled){background-color:#3d5a6a;background-color:var(--color-accent-hover);box-shadow:0 4px 16px #0000000a;box-shadow:var(--shadow-md);transform:translateY(-2px)}.form-submit.submitting,.form-submit:disabled{cursor:not-allowed;opacity:.5}@media (max-width:768px){:root{--space-xl:2rem;--space-2xl:2.5rem}.header h1{font-size:2rem}.header p{font-size:1rem}.columns{grid-template-columns:1fr}.image-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.controls-row{grid-template-columns:1fr}.button-group{flex-direction:column}.button-group .convert-btn{flex:none}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.image-item{animation:fadeIn .3s ease-out}
/*# sourceMappingURL=main.01ae4fd0.css.map*/