Loading puzzle...
{#each pieces as piece, index (piece.id)}
imageLoaded = true}
onerror={() => console.error('Failed to load puzzle image')}
/>
{#if isComplete}
{/if}
handleDragStart(index)}
ondragover={handleDragOver}
ondrop={() => handleDrop(index)}
ontouchstart={(e) => handleTouchStart(index, e)}
ontouchmove={handleTouchMove}
ontouchend={handleTouchEnd}
role="button"
tabindex="0"
style="
background-image: url('{imageUrl}');
background-size: {gridSize * 100}% {gridSize * 100}%;
background-position: {(piece.correctIndex % gridSize) * (100 / (gridSize - 1))}% {Math.floor(piece.correctIndex / gridSize) * (100 / (gridSize - 1))}%;
"
>
{/each}