autofocus issues

src/routes/(app)/diary/[date]/add-entry/+page.svelte

@@ -29,6 +29,16 @@
 	let scanLoading = $state(false);
 	let scanError = $state<string | null>(null);
 
+	let searchInput = $state<HTMLInputElement | null>(null);
+	$effect(() => { if (searchInput) setTimeout(() => searchInput?.focus(), 50); });
+
+	let gramsInput = $state<HTMLInputElement | null>(null);
+	$effect(() => {
+		if (selectedProduct && gramsInput) {
+			setTimeout(() => gramsInput?.focus(), 50);
+		}
+	});
+
 	function handleSearch(value: string) {
 		q = value;
 		clearTimeout(debounceTimer);
@@ -113,11 +123,11 @@
 					<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
 				</svg>
 				<input
+					bind:this={searchInput}
 					type="search"
 					placeholder="Search foods…"
 					value={q}
 					oninput={(e) => handleSearch(e.currentTarget.value)}
-					autofocus
 					class="w-full bg-zinc-900 border border-zinc-700 rounded-xl pl-9 pr-4 py-2.5 text-sm text-zinc-100 placeholder-zinc-500 focus:outline-none focus:border-green-500 transition-colors"
 				/>
 			</div>
@@ -224,6 +234,7 @@
 					class="w-11 h-11 rounded-xl bg-zinc-800 hover:bg-zinc-700 transition-colors text-lg font-medium flex items-center justify-center"
 				>−</button>
 				<input
+					bind:this={gramsInput}
 					type="number"
 					bind:value={grams}
 					min="1"

src/routes/(app)/diary/[date]/edit-entry/[entry_id]/+page.svelte

@@ -25,6 +25,11 @@
 	let saving = $state(false);
 	let deleting = $state(false);
 
+	let gramsInput = $state<HTMLInputElement | null>(null);
+	$effect(() => {
+		if (entry && gramsInput) gramsInput.focus();
+	});
+
 	const preview = $derived(entry ? {
 		calories: Math.round(entry.product.calories * grams / 100),
 		protein: Math.round(entry.product.protein * grams / 100 * 10) / 10,
@@ -113,12 +118,12 @@
 						class="w-12 h-12 rounded-xl bg-zinc-900 hover:bg-zinc-800 transition-colors text-xl font-medium flex items-center justify-center"
 					>−</button>
 					<input
+						bind:this={gramsInput}
 						type="number"
 						bind:value={grams}
 						min="1"
 						max="5000"
 						inputmode="decimal"
-						autofocus
 						class="flex-1 bg-zinc-900 border border-zinc-700 rounded-xl px-4 py-3 text-center text-2xl font-semibold focus:outline-none focus:border-green-500 transition-colors"
 					/>
 					<button