feat(ui): open photo on tap for touch and fix narrow-screen panel

- Touch/pen tap opens the viewer; mouse click still selects, dblclick opens
- Panel and rail emit a single transform utility so the panel actually
  slides in below 1280px (Tailwind v4 utility ordering made the base
  translate-x-full win over the conditional translate-x-0)
- Add touch-action: manipulation to grid cells

frontend/src/lib/components/PhotoGrid.svelte

@@ -32,6 +32,14 @@
 	const isCursor = (i: number) => cursorIndex === i;
 	const tabIndexFor = (i: number) =>
 		cursorIndex == null ? (i === 0 ? 0 : -1) : isCursor(i) ? 0 : -1;
+
+	let lastPointer = '';
+	function activate(i: number, e: MouseEvent) {
+		const touch = lastPointer === 'touch' || lastPointer === 'pen';
+		lastPointer = '';
+		if (touch) onOpen?.(i);
+		else onSelect?.(i, e);
+	}
 </script>
 
 {#if photos.length === 0}
@@ -48,7 +56,7 @@
 					data-photo-cell
 					tabindex={tabIndexFor(i)}
 					draggable={isSelected(photo.id)}
-					class="border-border bg-bg-muted group relative block aspect-square w-full overflow-hidden rounded-lg border {isSelected(
+					class="border-border bg-bg-muted group relative block aspect-square w-full touch-manipulation overflow-hidden rounded-lg border {isSelected(
 						photo.id
 					)
 						? 'ring-primary ring-2'
@@ -56,8 +64,11 @@
 						? 'outline outline-2 outline-offset-2 outline-text'
 						: ''}"
 					aria-pressed={isSelected(photo.id)}
-					onfocus={() => onCursorFocus?.(i)}
-					onclick={(e) => onSelect?.(i, e)}
+					onpointerdown={(e) => (lastPointer = e.pointerType)}
+					onfocus={() => {
+						if (lastPointer !== 'touch' && lastPointer !== 'pen') onCursorFocus?.(i);
+					}}
+					onclick={(e) => activate(i, e)}
 					ondblclick={() => onOpen?.(i)}
 					ondragstart={(e) => onDragStart?.(i, e)}
 					oncontextmenu={(e) => onContextMenu?.(i, e)}