The hall's table selectors read from and write to the preferences, so the panel and the hall agree

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Jm2auWk6RP71CjaAb4FMoG

template/src/lib/components/Hall.svelte

@@ -16,13 +16,10 @@
 	let name = $state(playerName());
 	let code = $state('');
 	/** The host's choices for the next table, from the game's declared options. */
-	// A new table starts from the preferences' table defaults, which the hall's own selectors also set.
-	let options = $state<Record<string, string>>(
+	// A new table starts from the preferences' table defaults; the hall's selectors set the same keys.
+	const options = $derived<Record<string, string>>(
 		Object.fromEntries((game.options ?? []).map((o) => [o.key, o.choices.some((c) => c.value === prefs[`table.${o.key}`]) ? String(prefs[`table.${o.key}`]) : o.default]))
 	);
-	$effect(() => {
-		for (const o of game.options ?? []) if (prefs[`table.${o.key}`] !== options[o.key]) setPref(`table.${o.key}`, options[o.key]);
-	});
 	let prefsOpen = $state(false);
 	let busy = $state(false);
 	let error = $state('');
@@ -182,7 +179,7 @@
 					<div class="option-block">
 						<label class="option">
 							<span>{o.label}</span>
-							<select bind:value={options[o.key]}>
+							<select value={options[o.key]} onchange={(e) => setPref(`table.${o.key}`, e.currentTarget.value)}>
 								{#each o.choices as c (c.value)}<option value={c.value}>{c.label}</option>{/each}
 							</select>
 						</label>