body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0;padding:0}*{box-sizing:border-box}.app{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0 auto;max-width:1200px;padding:20px}.app-header{margin-bottom:40px;text-align:center}.app-header h1{color:#2c3e50;margin-bottom:10px}.app-header p{color:#7f8c8d;font-size:1.1em}.upload-section{margin-bottom:30px;text-align:center}#file-input{display:none}.upload-section label{background-color:#3498db;border-radius:4px;color:#fff;cursor:pointer;display:inline-block;font-size:1.1em;padding:12px 24px;transition:background-color .3s}.upload-section label:hover{background-color:#2980b9}.preview-section{align-items:center;display:flex;flex-direction:column;margin-top:20px}.preview-section h3{color:#333;font-size:18px;margin-bottom:15px}.thumbnails-grid{grid-gap:15px;display:grid;gap:15px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));margin-top:10px;max-width:800px;width:100%}.thumbnail-item{background-color:#fff;border:1px solid #ddd;box-shadow:0 2px 4px #0000001a;padding:8px;text-align:center;transition:transform .2s}.thumbnail-item,.thumbnail-wrapper{border-radius:4px;position:relative}.thumbnail-wrapper{height:0;margin-bottom:8px;overflow:visible;padding-bottom:100%;width:100%}.thumbnail-wrapper .thumbnail{height:100%;left:0;object-fit:contain;position:absolute;top:0;width:100%}.remove-button{align-items:center;background-color:#f44;border:none;border-radius:50%;box-shadow:0 2px 4px #0003;color:#fff;cursor:pointer;display:flex;font-size:16px;font-weight:700;height:24px;justify-content:center;position:absolute;right:0;top:0;transition:all .2s;width:24px;z-index:10}.remove-button:hover{background-color:#c00;transform:scale(1.1)}.remove-button:active{transform:scale(.9)}.thumbnail{background-color:#fff;border-radius:4px;height:120px;margin-bottom:8px;object-fit:contain;width:120px}.thumbnail-name{-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#666;display:-webkit-box;font-size:12px;max-width:120px;overflow:hidden;text-align:center;text-overflow:ellipsis;word-break:break-word}.image-container{border:1px solid #ddd;border-radius:4px;display:inline-block;overflow:hidden;position:relative}.preview-image{display:block;max-height:400px;max-width:100%}.processing-section{margin-bottom:30px}.mode-selector{display:flex;gap:10px;justify-content:center;margin-bottom:20px}.mode-selector button{background-color:#fff;border:1px solid #ddd;border-radius:4px;cursor:pointer;padding:10px 20px;transition:all .3s}.mode-selector button.active{background-color:#3498db;border-color:#3498db;color:#fff}.mode-selector button:hover:not(.active){background-color:#f5f5f5}.settings-panel{background-color:#f9f9f9;border:1px solid #e0e0e0;border-radius:4px;padding:20px}.resize-settings{margin-bottom:20px}.resize-options{margin-bottom:15px}.aspect-ratio-checkbox{align-items:center;cursor:pointer;display:flex;font-size:14px;gap:5px;margin:0}.aspect-ratio-checkbox input{margin:0}.dimension-inputs{align-items:center;display:flex;gap:15px;justify-content:center;margin-bottom:15px}.height-with-checkbox{align-items:center;display:flex;gap:10px}.input-group{display:flex;flex-direction:column;gap:5px}.input-group label{color:#555;font-size:14px;font-weight:500}.input-group input,.percentage-input input{border:1px solid #ddd;border-radius:4px;padding:8px;width:120px}.percentage-input{align-items:center;display:flex;flex-direction:column;gap:5px}.percentage-input label{color:#555;font-size:14px;font-weight:500}.percentage-input input{width:200px}.convert-settings,.crop-settings{margin-bottom:20px}.crop-inputs-container{align-items:flex-end;display:flex;flex-wrap:wrap;gap:15px;justify-content:center;margin-bottom:10px}.crop-input-group{display:flex;flex-direction:column;gap:5px}.crop-input-group label{color:#333;font-size:14px;font-weight:500}.crop-input-group input{border:1px solid #ddd;border-radius:4px;font-size:14px;padding:8px 10px;width:100px}.crop-input-group input:focus{border-color:#4caf50;box-shadow:0 0 0 2px #4caf501a;outline:none}.undo-selection-button{background-color:#f44336;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:14px;padding:10px 20px;transition:background-color .3s}.undo-selection-button:hover{background-color:#d32f2f}.undo-selection-button:active{transform:scale(.98)}.download-button{background-color:#4caf50;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;margin-top:15px;padding:10px 20px;transition:background-color .3s}.download-button:hover{background-color:#45a049}.download-button:disabled{background-color:#ccc;cursor:not-allowed}input[type=number],select{border:1px solid #ddd;border-radius:4px;font-size:1em;padding:8px 12px;width:120px}.process-button{background-color:#2ecc71;border:none;border-radius:4px;color:#fff;cursor:pointer;display:block;font-size:1.1em;padding:12px;transition:background-color .3s;width:100%}.process-button:hover:not(:disabled){background-color:#27ae60}.process-button:disabled{background-color:#95a5a6;cursor:not-allowed}.error-message{background-color:#f8d7da;color:#721c24;margin-bottom:20px;padding:15px}.error-message,.result-section{border-radius:4px;text-align:center}.result-section{background-color:#d4edda;color:#155724;padding:20px}.result-section h3{margin-top:0}.crop-canvas{left:0;pointer-events:none;position:absolute;top:0}.hint{color:#7f8c8d;font-size:.9em;margin-top:10px;text-align:center;width:100%}.compress-settings{background-color:#f5f5f5;border-radius:8px;margin-top:20px;padding:20px}.quality-slider-container{margin:20px 0}.quality-slider{background:#ddd;border-radius:4px;height:8px;opacity:.7;outline:none;transition:opacity .2s;width:100%}.quality-slider:hover{opacity:1}.quality-value{align-items:center;display:flex;justify-content:space-between;margin-top:10px}.quality-number{color:#2c3e50;font-size:18px;font-weight:700}.quality-label{color:#7f8c8d;font-size:14px;text-transform:uppercase}.compress-tips{background-color:#e8f4f8;border-radius:4px;line-height:1.5;margin-top:15px;padding:10px;text-align:left}.icon-generator-settings{background-color:#f5f5f5;border-radius:8px;margin-top:20px;padding:20px}.icon-generator-settings ul{line-height:1.8;margin-left:20px;text-align:left}.image-info{background-color:#e8f4f8;border-radius:4px;margin-top:15px;padding:10px;text-align:left}.valid-size{color:#27ae60}.invalid-size,.valid-size{font-weight:700;margin-top:5px}.invalid-size{color:#e74c3c}.app-footer{border-top:1px solid #eee;color:#7f8c8d;font-size:.9em;margin-top:50px;padding-top:20px;text-align:center}@media (max-width:768px){.crop-settings,.resize-settings{align-items:center;flex-direction:column}input[type=number],select{width:200px}}
/*# sourceMappingURL=main.529192f0.css.map*/