Preferences: a panel of what the browser remembers about its player, with the kit's motion and confirm-move settings, a game's own declarations, and the host's last table options as defaults

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

template/src/routes/join/[code]/+page.svelte

@@ -4,6 +4,7 @@
 	import Board from '$lib/components/Board.svelte';
 	import Lobby from '$lib/components/Lobby.svelte';
 	import ReportSlip from '$lib/components/ReportSlip.svelte';
+	import Preferences from '$lib/components/Preferences.svelte';
 	import { seatFor } from '$lib/net/client';
 	import { NAME_MAX, playerName, rememberName, Room } from '$lib/net/room.svelte';
 
@@ -16,6 +17,7 @@
 	let error = $state('');
 	let copied = $state(false);
 	let reporting = $state(false);
+	let prefsOpen = $state(false);
 	/** A phrase minted to carry this seat to another device, while it lasts. */
 	let phrase = $state<{ phrase: string; expiresAt: number } | null>(null);
 	let rematching = $state(false);
@@ -120,6 +122,7 @@
 				<button type="button" class="quiet" title="A phrase that brings this seat to another device" onclick={transfer}>Transfer seat</button>
 			{/if}
 		{/if}
+		<button type="button" class="quiet" onclick={() => (prefsOpen = true)}>Preferences</button>
 		<a class="quiet" href="/guide">How to play</a>
 		<a class="quiet" href={room ? `/rules?room=${roomId}` : '/rules'}>Rules</a>
 		{#if room}
@@ -129,6 +132,7 @@
 	</nav>
 </header>
 
+<Preferences bind:open={prefsOpen} />
 {#if room}
 	<ReportSlip {room} bind:open={reporting} />
 {/if}