*{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}body{background-color:#f5f5f5;color:#333;line-height:1.6}#root{display:flex;flex-direction:column;min-height:100vh}.container{margin:0 auto;max-width:1200px;padding:0 20px;width:100%}h1,h2,h3,h4,h5,h6{color:#2d3436;margin-bottom:1rem}button{border:none;cursor:pointer;transition:all .2s ease}input,select,textarea{font-family:inherit;font-size:inherit}:root{--primary:#4f46e5;--primary-light:#6366f1;--primary-dark:#4338ca;--secondary:#ec4899;--secondary-light:#f472b6;--success:#10b981;--warning:#f59e0b;--danger:#ef4444;--info:#3b82f6;--light:#f3f4f6;--dark:#1f2937;--gray:#6b7280;--light-gray:#e5e7eb;--white:#fff;--shadow-sm:0 1px 2px #0000000d;--shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;--shadow-md:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;--shadow-xl:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;--radius-sm:0.25rem;--radius:0.5rem;--radius-lg:0.75rem;--radius-xl:1rem;--transition:all 0.3s ease}*{box-sizing:border-box;font-family:Inter,system-ui,-apple-system,sans-serif;margin:0;padding:0}.app-container{background-color:#fafafa;display:flex;flex-direction:column;min-height:100vh}.app-header{background:linear-gradient(135deg,#4f46e5,#4338ca);background:linear-gradient(135deg,var(--primary),var(--primary-dark));box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;box-shadow:var(--shadow-md);color:#fff;overflow:hidden;padding:2rem 0;position:relative;text-align:center}.app-header:before{background-image:radial-gradient(circle at 10% 20%,#ffffff1a 0,#fff0 70%);bottom:0;content:"";left:0;position:absolute;right:0;top:0;z-index:1}.app-header h1{font-size:2.5rem;font-weight:800;letter-spacing:-.025em;margin:0 0 .5rem;position:relative;z-index:2}.app-header p{font-size:1.1rem;line-height:1.5;margin:0 auto;max-width:600px;opacity:.95;position:relative;z-index:2}.app-main{flex:1 1;margin:0 auto;max-width:1200px;padding:2rem;width:100%}.upload-container{background:#fff;border:1px solid #0000000d;border-radius:1rem;border-radius:var(--radius-xl);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;box-shadow:var(--shadow-lg);margin-bottom:2.5rem;padding:2.5rem;transition:all .3s ease;transition:var(--transition)}.upload-container:hover{box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;box-shadow:var(--shadow-xl)}.upload-form{align-items:center;display:flex;flex-wrap:wrap;gap:1rem}.drag-drop-area{background-color:#4f46e505;border:2px dashed #e5e7eb;border:2px dashed var(--light-gray);border-radius:.75rem;border-radius:var(--radius-lg);cursor:pointer;margin-bottom:1.5rem;padding:3rem 2rem;text-align:center;transition:all .3s ease;transition:var(--transition)}.drag-drop-area.active,.drag-drop-area:hover{background-color:#4f46e50d;border-color:#6366f1;border-color:var(--primary-light)}.drag-drop-icon{color:#4f46e5;color:var(--primary);font-size:3rem;margin-bottom:1rem;transition:all .3s ease;transition:var(--transition)}.drag-drop-area:hover .drag-drop-icon{transform:scale(1.1)}.drag-drop-text h3{color:#1f2937;color:var(--dark);font-size:1.25rem;margin-bottom:.5rem}.drag-drop-text p{color:#6b7280;color:var(--gray);margin:0 auto;max-width:500px}.file-input-wrapper{flex:1 1;min-width:250px}#file-upload{display:none}.file-label{background-color:#4f46e5;background-color:var(--primary);border-radius:.5rem;border-radius:var(--radius);box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;box-shadow:var(--shadow);color:#fff;cursor:pointer;display:inline-block;font-weight:600;padding:.8rem 1.5rem;transition:all .3s ease;transition:var(--transition)}.file-label:hover{background-color:#4338ca;background-color:var(--primary-dark);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;box-shadow:var(--shadow-md);transform:translateY(-2px)}.upload-button{align-items:center;background-color:#4f46e5;background-color:var(--primary);border-radius:.5rem;border-radius:var(--radius);box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;box-shadow:var(--shadow);color:#fff;display:inline-flex;font-weight:600;gap:.5rem;justify-content:center;padding:.8rem 2rem;transition:all .3s ease;transition:var(--transition)}.upload-button:hover:not(:disabled){background-color:#4338ca;background-color:var(--primary-dark);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;box-shadow:var(--shadow-md);transform:translateY(-2px)}.upload-button:disabled{box-shadow:none;cursor:not-allowed}.upload-button:disabled,.upload-progress-container{background-color:#e5e7eb;background-color:var(--light-gray)}.upload-progress-container{border-radius:4px;height:8px;margin-top:1rem;overflow:hidden}.upload-progress-bar{background-color:#4f46e5;background-color:var(--primary);border-radius:4px;height:100%;transition:width .3s ease}.status-message{align-items:center;border-radius:.5rem;border-radius:var(--radius);display:flex;font-size:.9rem;gap:.5rem;margin-top:1rem;padding:.8rem}.error-message{background-color:#fef2f2;border:1px solid #fee2e2;color:#d92d20}.success-message{background-color:#ecfdf5;border:1px solid #d1fae5;color:#059669}.info-message{background-color:#eef6ff;border:1px solid #dbeafe;color:#0369a1}.images-container{margin-top:2.5rem}.images-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.images-container h2{align-items:center;color:#1f2937;color:var(--dark);display:flex;font-size:1.75rem;font-weight:700;gap:.5rem;padding-bottom:.5rem}.images-container h2:after{background:linear-gradient(90deg,#4f46e5,#0000);background:linear-gradient(90deg,var(--primary),#0000);content:"";flex:1 1;height:2px;margin-left:1rem}.image-stats{display:flex;gap:1rem;margin-bottom:1.5rem}.stat-item{align-items:center;background-color:#fff;border-radius:.5rem;border-radius:var(--radius);box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;box-shadow:var(--shadow);display:flex;gap:.5rem;padding:.75rem 1.25rem}.stat-icon{color:#4f46e5;color:var(--primary);font-size:1.25rem}.stat-value{color:#1f2937;color:var(--dark);font-weight:600}.stat-label{color:#6b7280;color:var(--gray);font-size:.875rem}.images-grid{grid-gap:1.75rem;display:grid;gap:1.75rem;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));margin-top:1.5rem}.image-card{background:#fff;border:1px solid #0000000d;border-radius:1rem;border-radius:var(--radius-xl);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;box-shadow:var(--shadow-lg);overflow:hidden;position:relative;transition:all .3s ease;transition:var(--transition)}.image-card:hover{box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;box-shadow:var(--shadow-xl);transform:translateY(-8px)}.image-preview-container{height:200px;overflow:hidden;position:relative}.uploaded-image{height:100%;object-fit:cover;transition:all .3s ease;transition:var(--transition);width:100%}.image-card:hover .uploaded-image{transform:scale(1.05)}.image-overlay{align-items:flex-end;background:linear-gradient(0deg,#000000b3 0,#0000);bottom:0;display:flex;left:0;opacity:0;padding:1rem;position:absolute;right:0;top:0;transition:all .3s ease;transition:var(--transition)}.image-card:hover .image-overlay{opacity:1}.image-actions{display:flex;gap:.5rem;transform:translateY(10px);transition:all .3s ease;transition:var(--transition)}.image-card:hover .image-actions{transform:translateY(0)}.image-action-button{align-items:center;background-color:#fff;border:none;border-radius:.5rem;border-radius:var(--radius);color:#1f2937;color:var(--dark);cursor:pointer;display:flex;justify-content:center;padding:.5rem;transition:all .3s ease;transition:var(--transition)}.image-action-button:hover{background-color:#4f46e5;background-color:var(--primary);color:#fff}.image-info{padding:1rem}.image-filename{color:#1f2937;color:var(--dark);font-size:.95rem;font-weight:500;margin-bottom:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.image-meta{color:#6b7280;color:var(--gray);display:flex;font-size:.8rem;justify-content:space-between}.copy-button{align-items:center;background-color:#4f46e5;background-color:var(--primary);border:none;border-radius:.5rem;border-radius:var(--radius);color:#fff;cursor:pointer;display:inline-flex;font-size:.85rem;font-weight:500;gap:.25rem;padding:.5rem 1rem;transition:all .3s ease;transition:var(--transition)}.copy-button:hover{background-color:#4338ca;background-color:var(--primary-dark)}.copy-button.copied{background-color:#10b981;background-color:var(--success)}.app-footer{background-color:#1f2937;background-color:var(--dark);color:#ffffffd9;font-size:.9rem;margin-top:auto;padding:1.5rem 0;text-align:center}.footer-links{margin-top:.75rem}.footer-link{color:#6366f1;color:var(--primary-light);margin:0 .5rem;text-decoration:none;transition:all .3s ease;transition:var(--transition)}.footer-link:hover{color:#fff;text-decoration:underline}.empty-state{background-color:#fff;border-radius:1rem;border-radius:var(--radius-xl);box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;box-shadow:var(--shadow);color:#6b7280;color:var(--gray);padding:4rem 2rem;text-align:center}.empty-state-icon{color:#e5e7eb;color:var(--light-gray);font-size:4rem;margin-bottom:1.5rem}.empty-state h3{color:#1f2937;color:var(--dark);font-size:1.5rem;margin-bottom:.5rem}@media (max-width:768px){.upload-form{flex-direction:column}.file-input-wrapper{margin-bottom:1rem;width:100%}.upload-button{width:100%}.images-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.app-main{padding:1.5rem 1rem}.upload-container{padding:1.5rem}.drag-drop-area{padding:2rem 1rem}}@media (max-width:480px){.app-header h1{font-size:2rem}.images-grid{grid-template-columns:1fr}.images-header{align-items:flex-start;flex-direction:column;gap:1rem}.image-stats{flex-direction:column;gap:.5rem;width:100%}.stat-item{width:100%}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.image-card{animation:fadeIn .3s ease-out}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.pulse{animation:pulse 1.5s infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.spinner{animation:spin 1s linear infinite;display:inline-block}.toast-container{bottom:20px;position:fixed;right:20px;z-index:1000}.toast{align-items:center;animation:fadeIn .3s ease-out forwards,fadeOut .3s ease-in 3s forwards;background-color:#fff;border-radius:.5rem;border-radius:var(--radius);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;box-shadow:var(--shadow-lg);display:flex;gap:.5rem;margin-top:.5rem;max-width:400px;min-width:280px;padding:.75rem 1rem}.toast-success{border-left:4px solid #10b981;border-left:4px solid var(--success)}.toast-error{border-left:4px solid #ef4444;border-left:4px solid var(--danger)}.toast-info{border-left:4px solid #3b82f6;border-left:4px solid var(--info)}.toast-icon{color:#10b981;color:var(--success)}.toast-error .toast-icon{color:#ef4444;color:var(--danger)}.toast-info .toast-icon{color:#3b82f6;color:var(--info)}.toast-message{flex:1 1}.toast-close{background:none;border:none;color:#6b7280;color:var(--gray);cursor:pointer}.skeleton{animation:skeleton-loading 1.5s infinite;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;border-radius:.5rem;border-radius:var(--radius)}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-image{height:200px;width:100%}.skeleton-text{height:1rem;margin-bottom:.5rem}.skeleton-text.short{width:60%}.skeleton-text.long{width:100%}.features-section{background-color:#fff;border-radius:1rem;border-radius:var(--radius-xl);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;box-shadow:var(--shadow-lg);margin-bottom:2.5rem;padding:3rem 0}.features-header{margin-bottom:2rem;text-align:center}.features-header h2{color:#1f2937;color:var(--dark);font-size:2rem;margin-bottom:.5rem}.features-header p{color:#6b7280;color:var(--gray);margin:0 auto;max-width:600px}.features-grid{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));padding:0 2rem}.feature-card{border-radius:.75rem;border-radius:var(--radius-lg);padding:1.5rem;text-align:center;transition:all .3s ease;transition:var(--transition)}.feature-card:hover{background-color:#4f46e50d;transform:translateY(-5px)}.feature-icon{color:#4f46e5;color:var(--primary);font-size:2.5rem;margin-bottom:1rem}.feature-card h3{color:#1f2937;color:var(--dark);margin-bottom:.5rem}.feature-card p{color:#6b7280;color:var(--gray);font-size:.95rem}
/*# sourceMappingURL=main.8bd1c31a.css.map*/