Login screen redesign

frontend/src/lib/components/ClientShell.svelte

@@ -2,6 +2,7 @@
   import { invalidateAll } from '$app/navigation';
   import { goto } from '$app/navigation';
   import { page } from '$app/state';
+  import Lean101Logo from '$lib/components/Lean101Logo.svelte';
   import { clientSession, hasModuleAccess, sessionHydrated } from '$lib/session';
   import { onMount, tick } from 'svelte';
   import packageInfo from '../../../package.json';
@@ -216,6 +217,12 @@
     });
   });
 
+  $effect(() => {
+    if ($sessionHydrated && !$clientSession && !isRootRoute) {
+      goto('/', { replaceState: true });
+    }
+  });
+
   onMount(() => {
     syncViewport();
 
@@ -254,6 +261,19 @@
   <title>{pageTitle(page.url.pathname)} | Hunter Premium Produce</title>
 </svelte:head>
 
+{#if !$clientSession}
+  <div class="signed-out-shell">
+    {#if isRootRoute}
+      {@render children()}
+    {:else}
+      <section class="locked-card loading-card signed-out-card">
+        <p class="workspace-label">Checking Session</p>
+        <h2>Returning to the client login screen.</h2>
+        <p>Only authenticated client users can open workspace routes directly.</p>
+      </section>
+    {/if}
+  </div>
+{:else}
 <div class="app-shell">
   {#if showBottomNav && navOpen}
     <button aria-label="Close navigation" class="nav-backdrop" type="button" onclick={() => (navOpen = false)}></button>
@@ -263,8 +283,7 @@
     <aside class="sidebar">
       <div class="brand-row">
         <a class="brand" href="/">
-          <span class="brand-mark">HP</span>
-          <span>Hunter Premium Produce</span>
+          <Lean101Logo className="sidebar-logo" showTagline={false} />
         </a>
       </div>
 
@@ -440,19 +459,12 @@
     </header>
 
     <main class="content">
-      {#if !isRootRoute && (!$sessionHydrated || isRestoringSession)}
+      {#if !isRootRoute && isRestoringSession}
         <section class="locked-card loading-card">
           <p class="workspace-label">Checking Session</p>
           <h2>Restoring your client workspace.</h2>
           <p>Refreshing the current page with the saved browser session before deciding whether sign-in is required.</p>
         </section>
-      {:else if !isRootRoute && !$clientSession}
-        <section class="locked-card">
-          <p class="workspace-label">Client Sign-In Required</p>
-          <h2>Sign in on the Hunter Premium Produce home page to unlock workspace data.</h2>
-          <p>The client-facing routes stay empty until a valid client session is active.</p>
-          <a href="/">Return to sign-in</a>
-        </section>
       {:else}
         {@render children()}
       {/if}
@@ -624,7 +636,9 @@
   {/if}
 {/if}
 
-{#if paletteOpen}
+{/if}
+
+{#if $clientSession && paletteOpen}
   <div class="palette-overlay" role="presentation" onclick={() => (paletteOpen = false)}>
     <div
       class="palette"
@@ -720,6 +734,15 @@
     min-height: 100vh;
   }
 
+  .signed-out-shell {
+    min-height: 100vh;
+    padding: 1.5rem;
+  }
+
+  .signed-out-card {
+    margin: 0 auto;
+  }
+
   .nav-backdrop {
     display: none;
   }
@@ -753,14 +776,10 @@
   }
 
   .brand {
-    display: inline-flex;
-    align-items: center;
-    gap: 0.68rem;
-    font-size: 1.08rem;
-    font-weight: 700;
+    display: block;
+    width: 100%;
   }
 
-  .brand-mark,
   .nav-icon {
     display: inline-flex;
     align-items: center;
@@ -773,10 +792,16 @@
     letter-spacing: 0.04em;
   }
 
-  .brand-mark {
-    width: 1.9rem;
-    height: 1.9rem;
-    border-radius: 0.68rem;
+  .sidebar :global(.sidebar-logo) {
+    width: min(100%, 12.2rem);
+  }
+
+  .sidebar :global(.sidebar-logo .logo-copy strong) {
+    font-size: 1.6rem;
+  }
+
+  .sidebar :global(.sidebar-logo .logo-mark) {
+    width: 2.6rem;
   }
 
   .nav-toggle,