.input-image-section.svelte-1oxhoso{margin-bottom:2rem;background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:1.5rem}.input-image-section.svelte-1oxhoso h4:where(.svelte-1oxhoso){margin:0 0 1rem;color:#1f2937;font-size:1.1rem;font-weight:600}.upload-area.svelte-1oxhoso{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;border:2px dashed #d1d5db;border-radius:8px;background-color:#fff;cursor:pointer;transition:all .2s ease-in-out;text-align:center;padding:2rem}.upload-area.svelte-1oxhoso:hover{border-color:#3b82f6;background-color:#f0f9ff}.upload-area.svelte-1oxhoso p:where(.svelte-1oxhoso){margin:1rem 0;color:#6b7280;font-size:1rem}.input-image-container.svelte-1oxhoso{display:flex;flex-direction:column;gap:1.5rem;align-items:center}.input-image-preview.svelte-1oxhoso{position:relative;display:inline-block}.input-image-preview.svelte-1oxhoso img:where(.svelte-1oxhoso){max-width:400px;max-height:300px;border-radius:8px;box-shadow:0 4px 6px #0000001a}.convert-controls.svelte-1oxhoso{display:flex;flex-direction:column;gap:.5rem;align-items:center}@media (min-width: 768px){.input-image-container.svelte-1oxhoso{flex-direction:row;align-items:flex-start}.convert-controls.svelte-1oxhoso{margin-left:1rem}}.sample-images-section.svelte-1oxhoso{margin-top:2rem;background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:1.5rem}.sample-images-section.svelte-1oxhoso h3:where(.svelte-1oxhoso){color:#1f2937;font-size:1.4rem;font-weight:600;margin:0 0 1rem}.sample-images-grid.svelte-1oxhoso{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.75rem}.sample-image-container.svelte-1oxhoso{aspect-ratio:1;border-radius:8px;overflow:hidden;background:#fff;border:1px solid #e2e8f0;transition:transform .3s ease,box-shadow .3s ease}.sample-image-container.svelte-1oxhoso:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.sample-image.svelte-1oxhoso{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.sample-image-container.svelte-1oxhoso:hover .sample-image:where(.svelte-1oxhoso){transform:scale(1.05)}@media (min-width: 768px){.input-image-container.svelte-1oxhoso{flex-direction:row;align-items:flex-start}.convert-controls.svelte-1oxhoso{margin-left:1rem}.sample-images-grid.svelte-1oxhoso{grid-template-columns:repeat(6,1fr)}}@media (max-width: 768px){.input-image-preview.svelte-1oxhoso img:where(.svelte-1oxhoso){max-width:100%}.sample-images-grid.svelte-1oxhoso{grid-template-columns:repeat(3,1fr)}}