The guide keeps the room too, every cross-link carries it, and a move picked from the record brings the board into view on a phone

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

src/routes/guide/+page.svelte

@@ -1,5 +1,10 @@
 <script lang="ts">
 	// How to play: a walk through the page, from the hall to a first game.
+	import { page } from '$app/state';
+
+	/** Opened from a table, the page offers the way back to it and carries it to its cross-links. */
+	const room = $derived((page.url.searchParams.get('room') ?? '').toUpperCase());
+	const withRoom = $derived((path: string) => (room ? `${path}?room=${room}` : path));
 </script>
 
 <svelte:head>
@@ -8,9 +13,9 @@
 
 <main class="guide">
 	<header>
-		<a class="back" href="/">Back to the hall</a> · <a class="back" href="/rules">The rules</a>
+		{#if room}<a class="back" href={`/join/${room}`}>Back to your game</a> · {/if}<a class="back" href="/">Back to the hall</a> · <a class="back" href={withRoom('/rules')}>The rules</a>
 		<h1>How to play</h1>
-		<p class="lede">A walk through the page, from the hall to a first game. The game's own rules are on <a href="/rules">the rules page</a>.</p>
+		<p class="lede">A walk through the page, from the hall to a first game. The game's own rules are on <a href={withRoom('/rules')}>the rules page</a>.</p>
 		<nav>
 			<a href="#hall">The hall</a> · <a href="#table">The table</a> · <a href="#board">The board</a> · <a href="#capture">A capture</a> · <a href="#gallery">The Peanut Gallery and table talk</a> ·
 			<a href="#first">A first game</a>