update some minor ux issues

frontend/src/routes/[fam]/+layout.svelte

@@ -21,8 +21,12 @@
 	let disabled = $derived(!!data.famAccess?.disabled);
 	let accessReason = $derived(data.famAccess?.reason || '');
 	// Settings stays usable while paused so admins can apply a code / manage billing.
+	let hasAuth = $derived(!!data.session);
 	let locked = $derived(disabled && !page.url.pathname.endsWith('/settings'));
 
+	$effect(() => {
+		console.log(data, page.url.pathname.includes('/join'), locked);
+	});
 	// ── Post-checkout activation (event-driven) ──
 	// Landing with ?checkout=return: if the webhook has already landed we show
 	// the welcome notice; otherwise show an "activating" state and wait for the
@@ -89,16 +93,22 @@
 
 	function accessMessage(reason: string, parent: boolean) {
 		const map: Record<string, string> = {
-			code_expired: parent ? 'Access paused — your code has expired. Add a new one.' : 'Access paused.',
+			code_expired: parent
+				? 'Access paused — your code has expired. Add a new one.'
+				: 'Access paused.',
 			code_disabled: parent ? 'Access paused — your access code was disabled.' : 'Access paused.',
-			subscription_inactive: parent ? 'Access paused — check your subscription payment.' : 'Access paused.',
-			canceled: parent ? 'Access paused — renew your subscription or add a code.' : 'Access paused.',
+			subscription_inactive: parent
+				? 'Access paused — check your subscription payment.'
+				: 'Access paused.',
+			canceled: parent
+				? 'Access paused — renew your subscription or add a code.'
+				: 'Access paused.',
 			no_access: parent ? 'Access paused — add an access code to get started.' : 'Access paused.'
 		};
 		return map[reason] || 'Access paused.';
 	}
 
-		// Claim toast watcher (admin only)
+	// Claim toast watcher (admin only)
 	let claimToast = $state('');
 	let prevClaimedIds = new Set<string>();
 	let mounted = false;
@@ -173,25 +183,28 @@
 		</TopNav>
 		<main class="app-main">
 			<div class="page-wrap">
-			<div class="page-content" class:locked>{@render children()}</div>
-			{#if locked}
-				<div class="disabled-overlay">
-					<div class="disabled-card">
-						{#if activating}
-							<div class="spinner" aria-hidden="true"></div>
-							<strong>Activating your subscription…</strong>
-							<span>Payment received — this usually only takes a few seconds.</span>
-						{:else}
-							<strong>Access paused</strong>
-							<span>
-								{isParent
-									? 'Add an access code or resume your subscription to keep using FamChore.'
-									: 'Your family access is paused.'}
-							</span>
-						{/if}
+				<div class="page-content" class:locked>{@render children()}</div>
+
+				{#if locked}
+					<div class="disabled-overlay">
+						<div class="disabled-card">
+							{#if !hasAuth}
+								<h2>You need to be logged in to view this page</h2>
+							{:else if activating}
+								<div class="spinner" aria-hidden="true"></div>
+								<strong>Activating your subscription…</strong>
+								<span>Payment received — this usually only takes a few seconds.</span>
+							{:else}
+								<strong>Access paused</strong>
+								<span>
+									{isParent
+										? 'Add an access code or resume your subscription to keep using FamChore.'
+										: 'Your family access is paused.'}
+								</span>
+							{/if}
+						</div>
 					</div>
-				</div>
-			{/if}
+				{/if}
 			</div>
 		</main>
 		{#if claimToast}