diff --git a/src/components/journal/ConnectionBar.tsx b/src/components/journal/ConnectionBar.tsx
index 7d780c3..e9cf893 100644
--- a/src/components/journal/ConnectionBar.tsx
+++ b/src/components/journal/ConnectionBar.tsx
@@ -25,7 +25,11 @@ export const ConnectionBar: Component = () => {
   const handleCreateSession = () => {
     const name = newSessionName().trim();
     if (!name) return;
-    createSession(name);
+    const id = createSession(name);
+    if (id) {
+      setSessionId(id);
+      hydrateFromServer(id).catch(() => {});
+    }
     setNewSessionName("");
     setShowNewSession(false);
   };
diff --git a/src/components/journal/CreateSessionDialog.tsx b/src/components/journal/CreateSessionDialog.tsx
index 2b82498..fb23cc4 100644
--- a/src/components/journal/CreateSessionDialog.tsx
+++ b/src/components/journal/CreateSessionDialog.tsx
@@ -2,7 +2,7 @@
  * CreateSessionDialog — modal for naming a new session
  */
 import { Component, createSignal, onMount } from "solid-js";
-import { createSession } from "../stores/journalStream";
+import { createSession, setSessionId, hydrateFromServer } from "../stores/journalStream";
 
 interface CreateSessionDialogProps {
   onClose: () => void;
@@ -12,13 +12,21 @@ export const CreateSessionDialog: Component<CreateSessionDialogProps> = (
   props,
 ) => {
   const [name, setName] = createSignal("");
+  const [creating, setCreating] = createSignal(false);
   let inputRef!: HTMLInputElement;
 
-  const handleCreate = () => {
+  const handleCreate = async () => {
     const trimmed = name().trim();
     if (!trimmed) return;
-    createSession(trimmed);
+    setCreating(true);
+    const id = createSession(trimmed);
+    if (id) {
+      setSessionId(id);
+      // Hydrate the new (empty) session so the UI reflects it immediately
+      await hydrateFromServer(id).catch(() => {});
+    }
     setName("");
+    setCreating(false);
     props.onClose();
   };
 
diff --git a/src/components/journal/StatsView.tsx b/src/components/journal/StatsView.tsx
index 1b2f4f5..bb22dfb 100644
--- a/src/components/journal/StatsView.tsx
+++ b/src/components/journal/StatsView.tsx
@@ -254,7 +254,7 @@ export const StatsView: Component = () => {
 
       {/* Sheet picker — only show if sheets are available */}
       <Show when={sheets().length > 0}>
-        <div class="absolute bottom-3 right-3">
+        <div class="sticky bottom-3 flex justify-end pr-3">
           {/* Dropdown trigger */}
           <button
             class="bg-white border border-gray-300 rounded-full w-8 h-8 flex items-center justify-center shadow-sm hover:bg-gray-50 transition-colors text-gray-500"
diff --git a/src/components/stores/journalStream.ts b/src/components/stores/journalStream.ts
index cbde6ea..0e5b5be 100644
--- a/src/components/stores/journalStream.ts
+++ b/src/components/stores/journalStream.ts
@@ -370,8 +370,8 @@ export async function connectStream(
  * Create a new session by publishing retained metadata to its meta topic.
  * The server picks it up and adds it to the $SESSIONS manifest.
  */
-export function createSession(name: string, players: string[] = []): void {
-  if (!_mqttClient || !_mqttConnected) return;
+export function createSession(name: string, players: string[] = []): string | null {
+  if (!_mqttClient || !_mqttConnected) return null;
 
   const id =
     name
@@ -385,6 +385,8 @@ export function createSession(name: string, players: string[] = []): void {
     qos: 1,
     retain: true,
   });
+
+  return id;
 }
 
 /**