diff --git a/DESIGN.md b/DESIGN.md
index 21b1602f..62191fe0 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -42,14 +42,14 @@ The public web must show the artifact before explaining the product. Real Sessio
 ### Desktop app
 
 - **Core principle:** The desktop app is the author’s private preparation surface. Projects and Sessions are the home; search and publishing are actions within that context.
-- **Shell:** Persistent left sidebar (240px) + main pane. Sidebar lists projects derived from `project_groups_v` and remains visible across every main-pane state.
+- **Shell:** Persistent resizable left sidebar (240px default, 200–360px) + main pane. Sidebar lists projects derived from `project_groups_v` and remains visible across every main-pane state.
 - **Sidebar:** Warm surface background, soft right border. Top-left wordmark `Spool.`, then a `PROJECTS` section label with a sort menu, then project rows. A divider separates derived projects from the always-last `Loose` entry.
 - **Project row:** Display name on the left, faint source-color dots in the middle, monospace count on the right. Active and hover states use `surface2`.
 - **Home:** Pinned Sessions above a recent feed bucketed by date. Entry to search is ⌘K or the top-right trigger.
 - **Project view:** Recent feed of one project with sort and source filters. A `PINNED` segment surfaces project-pinned Sessions on top.
 - **Session detail:** Opens as a main-pane state, not a modal. Share and Publish actions belong in the detail header.
 - **Search overlay (⌘K):** Floats above the current main pane on a dimmed backdrop, scoped to `All` or the current project. Fast and AI modes share the same surface.
-- **Width:** Window width ~960px; main-pane content stays near 720px; sidebar stays fixed at 240px.
+- **Width:** Window width ~960px; main-pane content stays near 720px; the sidebar remembers widths from 200–360px and defaults to 240px.
 
 ### Shape
 
diff --git a/apps/app/e2e/session-tree-sidebar-resize.spec.ts b/apps/app/e2e/session-tree-sidebar-resize.spec.ts
new file mode 100644
index 00000000..1a2e6630
--- /dev/null
+++ b/apps/app/e2e/session-tree-sidebar-resize.spec.ts
@@ -0,0 +1,106 @@
+import { mkdirSync, writeFileSync } from 'node:fs'
+import { join } from 'node:path'
+
+import { test, expect } from '@playwright/test'
+
+import { launchApp, waitForSync, type AppContext } from './helpers/launch'
+
+const ROOT_UUID = 'aaaaaaaa-aaaa-4aaa-8aaa-aaaaaaaaaaaa'
+const CHILD_UUID = 'bbbbbbbb-bbbb-4bbb-8bbb-bbbbbbbbbbbb'
+
+let ctx: AppContext
+
+test.beforeEach(async () => {
+  ctx = await launchApp({
+    extraFixtures: ({ codexDir }) => {
+      const dayDir = join(codexDir, '2026', '07', '19')
+      mkdirSync(dayDir, { recursive: true })
+      writeCodexSession(dayDir, ROOT_UUID, '12-00-00', '2026-07-19T12:00:00Z', null)
+      writeCodexSession(dayDir, CHILD_UUID, '12-01-00', '2026-07-19T12:01:00Z', ROOT_UUID)
+    },
+  })
+})
+
+test.afterEach(async () => {
+  await ctx?.cleanup()
+})
+
+test('library renders Codex child sessions as a collapsed tree', async () => {
+  const { window } = ctx
+  await waitForSync(window)
+  await window.locator('[data-testid="sidebar-library"]').click()
+
+  const root = window.locator(`[data-testid="session-row"][data-session-uuid="${ROOT_UUID}"]`)
+  const child = window.locator(`[data-testid="session-row"][data-session-uuid="${CHILD_UUID}"]`)
+  await expect(root).toBeVisible()
+  await expect(child).toBeHidden()
+
+  const toggle = root.locator('[data-testid="session-tree-toggle"]')
+  await expect(toggle).toHaveAttribute('aria-expanded', 'false')
+  await toggle.focus()
+  await toggle.press('Enter')
+
+  await expect(toggle).toHaveAttribute('aria-expanded', 'true')
+  await expect(child).toBeVisible()
+  await expect(child).toHaveAttribute('data-tree-depth', '1')
+  await expect(window.locator('[data-testid="session-detail"]')).toHaveCount(0)
+})
+
+test('sidebar separator supports keyboard, drag, reset, and persistence', async () => {
+  const { window } = ctx
+  const sidebar = window.locator('[data-testid="sidebar"]')
+  const handle = window.locator('[data-testid="sidebar-resize-handle"]')
+  await expect(handle).toBeVisible()
+
+  await handle.focus()
+  await handle.press('ArrowRight')
+  await expect(handle).toHaveAttribute('aria-valuenow', '248')
+  expect(Math.round((await sidebar.boundingBox())!.width)).toBe(248)
+
+  const box = await handle.boundingBox()
+  if (!box) throw new Error('sidebar resize handle has no bounding box')
+  await window.mouse.move(box.x + box.width / 2, box.y + box.height / 2)
+  await window.mouse.down()
+  await window.mouse.move(box.x + box.width / 2 + 32, box.y + box.height / 2)
+  await window.mouse.up()
+  await expect(handle).toHaveAttribute('aria-valuenow', '280')
+
+  expect(await window.evaluate(() => localStorage.getItem('spool:sidebar-width'))).toBe('280')
+  await handle.dblclick()
+  await expect(handle).toHaveAttribute('aria-valuenow', '240')
+  expect(await window.evaluate(() => localStorage.getItem('spool:sidebar-width'))).toBe('240')
+})
+
+function writeCodexSession(
+  dir: string,
+  uuid: string,
+  fileTime: string,
+  timestamp: string,
+  parentSessionUuid: string | null,
+): void {
+  const sessionMeta = {
+    timestamp,
+    type: 'session_meta',
+    payload: {
+      id: uuid,
+      cwd: '/tmp/tree-project',
+      ...(parentSessionUuid
+        ? {
+            parent_thread_id: parentSessionUuid,
+            thread_source: 'subagent',
+            source: { subagent: 'review' },
+          }
+        : { source: 'cli' }),
+    },
+  }
+  const userMessage = {
+    timestamp,
+    type: 'event_msg',
+    payload: {
+      type: 'user_message',
+      message: parentSessionUuid ? 'Review the parent session.' : 'Implement the parent feature.',
+    },
+  }
+  const filePath = join(dir, `rollout-2026-07-19T${fileTime}-${uuid}.jsonl`)
+  writeFileSync(filePath, `${JSON.stringify(sessionMeta)}\n${JSON.stringify(userMessage)}\n`)
+}
diff --git a/apps/app/src/renderer/App.tsx b/apps/app/src/renderer/App.tsx
index b210fea9..4c8890a6 100644
--- a/apps/app/src/renderer/App.tsx
+++ b/apps/app/src/renderer/App.tsx
@@ -47,7 +47,8 @@ import ShareEditorPage from './components/ShareEditorPage.js'
 import ShareSessionDialog from './components/ShareSessionDialog.js'
 import SharesPage from './components/SharesPage.js'
 import Sidebar from './components/Sidebar.js'
-import SidebarRail from './components/SidebarRail.js'
+import SidebarRail, { DEFAULT_SIDEBAR_WIDTH } from './components/SidebarRail.js'
+import SidebarResizeHandle, { clampSidebarWidth } from './components/SidebarResizeHandle.js'
 import { useHotkeys } from './hooks/useHotkeys.js'
 import { useLanguageBootstrap } from './i18n/useLanguageBootstrap.js'
 import { composeFromSession, sessionDraftId } from './lib/compose-from-session.js'
@@ -58,6 +59,7 @@ import { loadThemeEditorState, saveThemeEditorState } from './theme/persist.js'
 
 type View = 'search' | 'session' | 'shares' | 'share-editor' | 'security'
 type SettingsTab = 'general' | 'appearance' | 'shortcuts' | 'sources' | 'agent' | 'security'
+const SIDEBAR_WIDTH_STORAGE_KEY = 'spool:sidebar-width'
 
 type FragmentSearchResult = FragmentResult & { kind: 'fragment' }
 
@@ -145,6 +147,8 @@ export default function App() {
   const [searchOverlayOpen, setSearchOverlayOpen] = useState(false)
   const [searchScopeProject, setSearchScopeProject] = useState<ScopeValue | null>(null)
   const [sidebarCollapsed, setSidebarCollapsed] = useState(false)
+  const [sidebarWidth, setSidebarWidth] = useState(loadSidebarWidth)
+  const [sidebarResizing, setSidebarResizing] = useState(false)
   const [sharePanelOpen, setSharePanelOpen] = useState(true)
   const trafficLightInset = typeof window !== 'undefined' && window.spool?.platform === 'darwin'
   /** Active share-editor session: conversation, the user's last
@@ -1040,6 +1044,7 @@ export default function App() {
           }
         : {})}
       chromeOnly={!trafficLightInset && sidebarCollapsed}
+      width={sidebarWidth}
       onSettingsClick={() => {
         setSettingsTab('general')
         setShowSettings(true)
@@ -1084,6 +1089,14 @@ export default function App() {
           onTogglePanel={() => setSharePanelOpen((v) => !v)}
           sidebar={sidebarElement}
           sidebarCollapsed={sidebarCollapsed}
+          sidebarWidth={sidebarWidth}
+          sidebarResizing={sidebarResizing}
+          onSidebarWidthChange={setSidebarWidth}
+          onSidebarResizeStart={() => setSidebarResizing(true)}
+          onSidebarResizeEnd={(width) => {
+            setSidebarResizing(false)
+            persistSidebarWidth(width)
+          }}
           onToggleSidebar={toggleSidebar}
           trafficLightInset={trafficLightInset}
         />
@@ -1146,14 +1159,29 @@ export default function App() {
         sidebarCollapsed={sidebarCollapsed}
         onToggleSidebar={toggleSidebar}
         trafficLightInset={trafficLightInset}
+        sidebarWidth={sidebarWidth}
+        sidebarResizing={sidebarResizing}
       />
       <div className="flex min-h-0 flex-1">
         <SidebarRail
           collapsed={sidebarCollapsed}
           collapsedWidth={!trafficLightInset ? 'chrome' : 'none'}
+          width={sidebarWidth}
+          resizing={sidebarResizing}
         >
           {sidebarElement}
         </SidebarRail>
+        {!sidebarCollapsed && (
+          <SidebarResizeHandle
+            width={sidebarWidth}
+            onWidthChange={setSidebarWidth}
+            onResizeStart={() => setSidebarResizing(true)}
+            onResizeEnd={(width) => {
+              setSidebarResizing(false)
+              persistSidebarWidth(width)
+            }}
+          />
+        )}
         <div className="relative flex min-w-0 flex-1 flex-col">
           <div className="relative flex min-h-0 flex-1 flex-col">
             {isSharesView ? (
@@ -1394,6 +1422,23 @@ export default function App() {
   )
 }
 
+function loadSidebarWidth(): number {
+  try {
+    const stored = Number.parseInt(localStorage.getItem(SIDEBAR_WIDTH_STORAGE_KEY) ?? '', 10)
+    return Number.isFinite(stored) ? clampSidebarWidth(stored) : DEFAULT_SIDEBAR_WIDTH
+  } catch {
+    return DEFAULT_SIDEBAR_WIDTH
+  }
+}
+
+function persistSidebarWidth(width: number): void {
+  try {
+    localStorage.setItem(SIDEBAR_WIDTH_STORAGE_KEY, String(clampSidebarWidth(width)))
+  } catch {
+    // Storage may be unavailable in hardened or test renderers.
+  }
+}
+
 const AgentSelector = memo(function AgentSelector({
   agents,
   activeAgent,
diff --git a/apps/app/src/renderer/components/AppTopBar.tsx b/apps/app/src/renderer/components/AppTopBar.tsx
index 2bf349ae..9ec77e35 100644
--- a/apps/app/src/renderer/components/AppTopBar.tsx
+++ b/apps/app/src/renderer/components/AppTopBar.tsx
@@ -2,10 +2,14 @@ import { PanelLeft } from 'lucide-react'
 import type { CSSProperties, ReactNode } from 'react'
 import { useTranslation } from 'react-i18next'
 
+import { DEFAULT_SIDEBAR_WIDTH } from './SidebarRail.js'
+
 type Props = {
   sidebarCollapsed: boolean
   onToggleSidebar: () => void
   trafficLightInset?: boolean
+  sidebarWidth?: number
+  sidebarResizing?: boolean
   /** Page-level chrome (page title, primary action). Rendered into a
    *  flex slot to the right of the sidebar fold toggle. */
   children?: ReactNode
@@ -22,6 +26,8 @@ export default function AppTopBar({
   sidebarCollapsed,
   onToggleSidebar,
   trafficLightInset = true,
+  sidebarWidth = DEFAULT_SIDEBAR_WIDTH,
+  sidebarResizing = false,
   children,
 }: Props) {
   const { t } = useTranslation()
@@ -30,6 +36,8 @@ export default function AppTopBar({
   const sidebarTitle = sidebarCollapsed
     ? `${t('sidebar.expand')} (⌘B)`
     : `${t('sidebar.collapse')} (⌘B)`
+  const collapsedWidth = trafficLightInset ? 0 : 48
+  const widthTransition = sidebarResizing ? '' : 'transition-[width] duration-[280ms] ease-out'
 
   if (!trafficLightInset && !children) {
     return null
@@ -48,10 +56,8 @@ export default function AppTopBar({
           with the content pane below. */}
       <div className="pointer-events-none absolute inset-0 flex" aria-hidden="true">
         <div
-          className={[
-            'flex-none transition-[width] duration-[280ms] ease-out bg-warm-surface dark:bg-dark-surface',
-            sidebarCollapsed ? (trafficLightInset ? 'w-0' : 'w-12') : 'w-60',
-          ].join(' ')}
+          className={`flex-none ${widthTransition} bg-warm-surface dark:bg-dark-surface`}
+          style={{ width: sidebarCollapsed ? collapsedWidth : sidebarWidth }}
         />
         <div className="bg-warm-bg dark:bg-dark-bg flex-1" />
       </div>
@@ -74,19 +80,15 @@ export default function AppTopBar({
               />
             </div>
             <div
-              className={[
-                'flex-none transition-[width] duration-[280ms] ease-out',
-                sidebarCollapsed ? 'w-0' : 'w-[134px]',
-              ].join(' ')}
+              className={`flex-none ${widthTransition}`}
+              style={{ width: sidebarCollapsed ? 0 : Math.max(0, sidebarWidth - 106) }}
               aria-hidden="true"
             />
           </>
         ) : (
           <div
-            className={[
-              'flex-none transition-[width] duration-[280ms] ease-out',
-              sidebarCollapsed ? 'w-12' : 'w-60',
-            ].join(' ')}
+            className={`flex-none ${widthTransition}`}
+            style={{ width: sidebarCollapsed ? 48 : sidebarWidth }}
             aria-hidden="true"
           />
         )}
diff --git a/apps/app/src/renderer/components/LibraryLanding.tsx b/apps/app/src/renderer/components/LibraryLanding.tsx
index 13de52b0..6529d8d3 100644
--- a/apps/app/src/renderer/components/LibraryLanding.tsx
+++ b/apps/app/src/renderer/components/LibraryLanding.tsx
@@ -4,6 +4,7 @@ import { useCallback, useEffect, useMemo, useRef, useState, type ReactNode } fro
 import { useTranslation } from 'react-i18next'
 
 import { insertSessionSorted } from '../../shared/sessionSort.js'
+import { buildSessionForest, type SessionTreeNode } from '../lib/sessionTree.js'
 import { FeaturedEmptyState } from './EmptyState.js'
 import VirtualSessionList, { type SessionListRow } from './VirtualSessionList.js'
 
@@ -184,10 +185,24 @@ export default function LibraryLanding({ onOpenSession, onCopySessionId, onShare
 
   // i18n.language is a stable per-locale key; depending on `t` (which
   // changes identity on most renders) would rebuild rows constantly.
+  const sessionForest = useMemo(() => buildSessionForest(recentSessions ?? []), [recentSessions])
+  const treeNodes = useMemo(() => {
+    const nodes = new Map<string, SessionTreeNode>()
+    const visit = (node: SessionTreeNode): void => {
+      nodes.set(node.session.sessionUuid, node)
+      for (const child of node.children) visit(child)
+    }
+    for (const root of sessionForest) visit(root)
+    return nodes
+  }, [sessionForest])
   const buckets = useMemo(
-    () => (recentSessions ? bucketByDate(recentSessions, looseTranslator(t)) : []),
+    () =>
+      bucketByDate(
+        sessionForest.map((node) => node.session),
+        looseTranslator(t),
+      ),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [recentSessions, i18n.language],
+    [sessionForest, i18n.language],
   )
   const totalSessions = pinnedSessions.length + (recentSessions?.length ?? 0)
   const pinnedLabel = useMemo(
@@ -225,14 +240,8 @@ export default function LibraryLanding({ onOpenSession, onCopySessionId, onShare
         dataAttr: { 'data-bucket': bucket.key },
       })
       for (const s of bucket.sessions) {
-        out.push({
-          kind: 'session',
-          id: s.sessionUuid,
-          session: s,
-          showProject: true,
-          bucket: bucket.key,
-          headerId: `bucket-${bucket.key}`,
-        })
+        const node = treeNodes.get(s.sessionUuid)
+        if (node) appendTreeRows(out, node, bucket.key, `bucket-${bucket.key}`)
       }
     }
     out.push({
@@ -243,7 +252,7 @@ export default function LibraryLanding({ onOpenSession, onCopySessionId, onShare
       total: totalSessions,
     })
     return out
-  }, [pinnedSessions, pinnedLabel, buckets, loadingMore, exhausted, totalSessions])
+  }, [pinnedSessions, pinnedLabel, buckets, treeNodes, loadingMore, exhausted, totalSessions])
 
   return (
     <div data-testid="library-landing" className="flex h-full flex-col overflow-hidden">
@@ -270,6 +279,33 @@ export default function LibraryLanding({ onOpenSession, onCopySessionId, onShare
   )
 }
 
+function appendTreeRows(
+  rows: SessionListRow[],
+  node: SessionTreeNode,
+  bucket: BucketKey,
+  headerId: string,
+  depth = 0,
+  ancestorIds: string[] = [],
+): void {
+  rows.push({
+    kind: 'session',
+    id: node.session.sessionUuid,
+    session: node.session,
+    showProject: true,
+    bucket,
+    headerId,
+    treeDepth: depth,
+    treeAncestorIds: ancestorIds,
+    treeChildCount: node.children.length,
+  })
+  for (const child of node.children) {
+    appendTreeRows(rows, child, bucket, headerId, depth + 1, [
+      ...ancestorIds,
+      node.session.sessionUuid,
+    ])
+  }
+}
+
 function looseTranslator(t: ReturnType<typeof useTranslation>['t']): TranslateFn {
   return (key) => (t as unknown as (k: string) => string)(key)
 }
diff --git a/apps/app/src/renderer/components/PageLayout.tsx b/apps/app/src/renderer/components/PageLayout.tsx
index 6cf2a0b3..9c089c20 100644
--- a/apps/app/src/renderer/components/PageLayout.tsx
+++ b/apps/app/src/renderer/components/PageLayout.tsx
@@ -2,6 +2,7 @@ import type { ReactNode } from 'react'
 
 import AppTopBar from './AppTopBar.js'
 import SidebarRail, { FOLD_EASE } from './SidebarRail.js'
+import SidebarResizeHandle from './SidebarResizeHandle.js'
 
 const RIGHT_PANEL_WIDTH = 280
 
@@ -11,6 +12,11 @@ type Props = {
    *  its app-wide handlers wired up. */
   sidebar: ReactNode
   sidebarCollapsed: boolean
+  sidebarWidth: number
+  sidebarResizing: boolean
+  onSidebarWidthChange: (width: number) => void
+  onSidebarResizeStart: () => void
+  onSidebarResizeEnd: (width: number) => void
   onToggleSidebar: () => void
   trafficLightInset?: boolean
   /** Page chrome that gets portaled into the top bar's flex slot
@@ -40,6 +46,11 @@ type Props = {
 export default function PageLayout({
   sidebar,
   sidebarCollapsed,
+  sidebarWidth,
+  sidebarResizing,
+  onSidebarWidthChange,
+  onSidebarResizeStart,
+  onSidebarResizeEnd,
   onToggleSidebar,
   trafficLightInset = true,
   topBar,
@@ -53,6 +64,8 @@ export default function PageLayout({
         sidebarCollapsed={sidebarCollapsed}
         onToggleSidebar={onToggleSidebar}
         trafficLightInset={trafficLightInset}
+        sidebarWidth={sidebarWidth}
+        sidebarResizing={sidebarResizing}
       >
         {topBar}
       </AppTopBar>
@@ -60,18 +73,23 @@ export default function PageLayout({
         <SidebarRail
           collapsed={sidebarCollapsed}
           collapsedWidth={!trafficLightInset ? 'chrome' : 'none'}
+          width={sidebarWidth}
+          resizing={sidebarResizing}
         >
           {sidebar}
         </SidebarRail>
+        {!sidebarCollapsed && (
+          <SidebarResizeHandle
+            width={sidebarWidth}
+            onWidthChange={onSidebarWidthChange}
+            onResizeStart={onSidebarResizeStart}
+            onResizeEnd={onSidebarResizeEnd}
+          />
+        )}
         <div className="relative flex min-w-0 flex-1 flex-col">{children}</div>
         {/* Outer animates width 0 ↔ 280; inner is hardcoded to
          *  RIGHT_PANEL_WIDTH so ControlPanel's ~1000-node subtree doesn't
-         *  re-lay out each frame — outer just clips. (Sidebar's content
-         *  gets the same treatment for free because Sidebar's root is
-         *  `w-60 flex-none`; ControlPanel's root is `w-full` so we apply
-         *  the fixed width here.) Duration is scaled so per-pixel velocity
-         *  matches the sidebar's 280ms / 240px ≈ 1.17ms/px — otherwise the
-         *  wider right panel would snap ~17% faster than the sidebar. */}
+         *  re-lay out each frame; the outer wrapper only clips it. */}
         <div
           className="flex-none overflow-hidden"
           style={{
diff --git a/apps/app/src/renderer/components/SessionRow.tsx b/apps/app/src/renderer/components/SessionRow.tsx
index b9eb84d2..cf09f547 100644
--- a/apps/app/src/renderer/components/SessionRow.tsx
+++ b/apps/app/src/renderer/components/SessionRow.tsx
@@ -7,6 +7,8 @@ import {
   SquarePen,
   AlertTriangle,
   Check,
+  ChevronRight,
+  CornerDownRight,
 } from 'lucide-react'
 import type React from 'react'
 import { useState } from 'react'
@@ -32,6 +34,10 @@ type Props = {
   onOpenSession: (uuid: string) => void
   onCopySessionId: (source: Session['source']) => void
   onShare?: (uuid: string) => void
+  treeDepth?: number
+  treeChildCount?: number
+  treeExpanded?: boolean
+  onToggleTree?: () => void
 }
 
 export default function SessionRow({
@@ -43,6 +49,10 @@ export default function SessionRow({
   onOpenSession,
   onCopySessionId,
   onShare,
+  treeDepth = 0,
+  treeChildCount = 0,
+  treeExpanded = false,
+  onToggleTree,
 }: Props) {
   const { t } = useTranslation()
   const [resuming, setResuming] = useState(false)
@@ -77,18 +87,46 @@ export default function SessionRow({
     <div
       data-testid="session-row"
       data-session-uuid={session.sessionUuid}
+      data-tree-depth={treeDepth}
       {...(pinned ? { 'data-pinned': '' } : {})}
       role="button"
       tabIndex={0}
       onClick={handleOpen}
       onKeyDown={(event) => {
+        if (event.target !== event.currentTarget) return
         if (event.key === 'Enter' || event.key === ' ') {
           event.preventDefault()
           handleOpen()
         }
       }}
       className="group hover:bg-warm-surface dark:hover:bg-dark-surface focus:bg-warm-surface dark:focus:bg-dark-surface flex cursor-pointer items-start gap-3 px-5 py-3 transition-colors duration-75 focus:outline-none"
+      style={{ paddingLeft: 20 + Math.min(treeDepth, 6) * 20 }}
     >
+      <div className="text-warm-faint dark:text-dark-muted flex h-5 w-4 flex-none items-center justify-center">
+        {treeChildCount > 0 && onToggleTree ? (
+          <button
+            type="button"
+            data-testid="session-tree-toggle"
+            onClick={(event) => {
+              event.stopPropagation()
+              onToggleTree()
+            }}
+            aria-label={`${t(treeExpanded ? 'common.collapse' : 'common.expand')}: ${title}`}
+            aria-expanded={treeExpanded}
+            title={t('library.childSessions', { count: treeChildCount })}
+            className="text-warm-muted dark:text-dark-muted hover:bg-warm-surface2 dark:hover:bg-dark-surface2 hover:text-warm-text dark:hover:text-dark-text focus-visible:ring-warm-accent dark:focus-visible:ring-dark-accent inline-flex h-6 w-6 items-center justify-center rounded transition-colors duration-75 focus-visible:ring-1 focus-visible:outline-none"
+          >
+            <ChevronRight
+              size={13}
+              strokeWidth={1.7}
+              aria-hidden
+              className={`transition-transform duration-150 motion-reduce:transition-none ${treeExpanded ? 'rotate-90' : ''}`}
+            />
+          </button>
+        ) : treeDepth > 0 ? (
+          <CornerDownRight size={12} strokeWidth={1.5} aria-hidden />
+        ) : null}
+      </div>
       <div className="min-w-0 flex-1">
         <div className="mb-0.5 flex items-center gap-2">
           <SourceBadge source={session.source} />
@@ -107,6 +145,7 @@ export default function SessionRow({
           )}
           {date} · {t('session.msgs_other', { count: session.messageCount })}
           {model && ` · ${model}`}
+          {treeChildCount > 0 && ` · ${t('library.childSessions', { count: treeChildCount })}`}
         </p>
       </div>
 
diff --git a/apps/app/src/renderer/components/ShareEditorPage.tsx b/apps/app/src/renderer/components/ShareEditorPage.tsx
index c82c8cf1..593fc233 100644
--- a/apps/app/src/renderer/components/ShareEditorPage.tsx
+++ b/apps/app/src/renderer/components/ShareEditorPage.tsx
@@ -50,6 +50,11 @@ type Props = {
    *  state as the rest of the app. */
   sidebar: ReactNode
   sidebarCollapsed: boolean
+  sidebarWidth: number
+  sidebarResizing: boolean
+  onSidebarWidthChange: (width: number) => void
+  onSidebarResizeStart: () => void
+  onSidebarResizeEnd: (width: number) => void
   onToggleSidebar: () => void
   trafficLightInset?: boolean
 }
@@ -74,6 +79,11 @@ export default function ShareEditorPage({
   onTogglePanel,
   sidebar,
   sidebarCollapsed,
+  sidebarWidth,
+  sidebarResizing,
+  onSidebarWidthChange,
+  onSidebarResizeStart,
+  onSidebarResizeEnd,
   onToggleSidebar,
   trafficLightInset = true,
 }: Props) {
@@ -775,6 +785,11 @@ export default function ShareEditorPage({
     <PageLayout
       sidebar={sidebar}
       sidebarCollapsed={sidebarCollapsed}
+      sidebarWidth={sidebarWidth}
+      sidebarResizing={sidebarResizing}
+      onSidebarWidthChange={onSidebarWidthChange}
+      onSidebarResizeStart={onSidebarResizeStart}
+      onSidebarResizeEnd={onSidebarResizeEnd}
       onToggleSidebar={onToggleSidebar}
       trafficLightInset={trafficLightInset}
       topBar={topBarContent}
diff --git a/apps/app/src/renderer/components/Sidebar.tsx b/apps/app/src/renderer/components/Sidebar.tsx
index 088a814d..12dceed0 100644
--- a/apps/app/src/renderer/components/Sidebar.tsx
+++ b/apps/app/src/renderer/components/Sidebar.tsx
@@ -29,6 +29,7 @@ import {
 } from '../../shared/sidebarSort.js'
 import Menu from './Menu.js'
 import PinIcon from './PinIcon.js'
+import { DEFAULT_SIDEBAR_WIDTH } from './SidebarRail.js'
 
 type Props = {
   activeIdentityKey: string | null
@@ -58,6 +59,7 @@ type Props = {
     onToggle: () => void
   }
   chromeOnly?: boolean
+  width?: number
 }
 
 export default function Sidebar({
@@ -85,6 +87,7 @@ export default function Sidebar({
   onShareSession,
   sidebarToggle,
   chromeOnly = false,
+  width = DEFAULT_SIDEBAR_WIDTH,
 }: Props) {
   const { t } = useTranslation()
   const sidebarSortLabel = (value: SidebarSortOrder): string => {
@@ -166,9 +169,10 @@ export default function Sidebar({
     <aside
       data-testid="sidebar"
       className={[
-        'w-60 flex-none flex flex-col h-full overflow-hidden transition-colors duration-[280ms] ease-out',
+        'flex-none flex flex-col h-full overflow-hidden transition-colors duration-[280ms] ease-out',
         chromeOnly ? 'bg-warm-bg dark:bg-dark-bg' : 'bg-warm-surface dark:bg-dark-surface',
       ].join(' ')}
+      style={{ width }}
     >
       {sidebarToggle && (
         <div className="flex flex-none flex-col gap-0.5 px-2 pt-1">
diff --git a/apps/app/src/renderer/components/SidebarRail.tsx b/apps/app/src/renderer/components/SidebarRail.tsx
index e5e79bd3..9652829e 100644
--- a/apps/app/src/renderer/components/SidebarRail.tsx
+++ b/apps/app/src/renderer/components/SidebarRail.tsx
@@ -10,32 +10,40 @@ import type { ReactNode } from 'react'
 // rail below it, so all fold motion is pinned to this token.
 export const FOLD_EASE = 'cubic-bezier(0, 0, 0.2, 1)'
 export const FOLD_DURATION_MS = 280
+export const DEFAULT_SIDEBAR_WIDTH = 240
+export const MIN_SIDEBAR_WIDTH = 200
+export const MAX_SIDEBAR_WIDTH = 360
 
 type Props = {
   collapsed: boolean
   children: ReactNode
   collapsedWidth?: 'none' | 'chrome'
+  width?: number
+  resizing?: boolean
 }
 
 /**
- * Animated 240px ↔ 0 column that hosts the app's left navigation
+ * Animated sidebar-width ↔ 0 column that hosts the app's left navigation
  * sidebar. The wrapper clips its child via overflow-hidden so the
- * sidebar contents (Sidebar root is `w-60 flex-none`) never reflow
- * during the fold — only the wrapper's width transitions.
+ * sidebar contents do not overflow during the fold.
  *
  * Used by both the top-level App shell and PageLayout (share editor).
  * Single source for the rail's timing keeps it in lock-step with
  * AppTopBar's bg sidebar segment, which paints the same surface
  * colour over the top of the chrome.
  */
-export default function SidebarRail({ collapsed, collapsedWidth = 'none', children }: Props) {
-  const collapsedClass = collapsedWidth === 'chrome' ? 'w-12' : 'w-0'
+export default function SidebarRail({
+  collapsed,
+  collapsedWidth = 'none',
+  width = DEFAULT_SIDEBAR_WIDTH,
+  resizing = false,
+  children,
+}: Props) {
+  const collapsedPixels = collapsedWidth === 'chrome' ? 48 : 0
   return (
     <div
-      className={[
-        'flex-none overflow-hidden transition-[width] duration-[280ms] ease-out',
-        collapsed ? collapsedClass : 'w-60',
-      ].join(' ')}
+      className={`flex-none overflow-hidden ${resizing ? '' : 'transition-[width] duration-[280ms] ease-out'}`}
+      style={{ width: collapsed ? collapsedPixels : width }}
       aria-hidden={collapsed && collapsedWidth === 'none'}
     >
       {children}
diff --git a/apps/app/src/renderer/components/SidebarResizeHandle.test.ts b/apps/app/src/renderer/components/SidebarResizeHandle.test.ts
new file mode 100644
index 00000000..0b0e8bc5
--- /dev/null
+++ b/apps/app/src/renderer/components/SidebarResizeHandle.test.ts
@@ -0,0 +1,11 @@
+import { describe, expect, it } from 'vite-plus/test'
+
+import { clampSidebarWidth } from './SidebarResizeHandle.js'
+
+describe('clampSidebarWidth', () => {
+  it('rounds values and enforces the supported range', () => {
+    expect(clampSidebarWidth(199)).toBe(200)
+    expect(clampSidebarWidth(247.6)).toBe(248)
+    expect(clampSidebarWidth(361)).toBe(360)
+  })
+})
diff --git a/apps/app/src/renderer/components/SidebarResizeHandle.tsx b/apps/app/src/renderer/components/SidebarResizeHandle.tsx
new file mode 100644
index 00000000..525d5485
--- /dev/null
+++ b/apps/app/src/renderer/components/SidebarResizeHandle.tsx
@@ -0,0 +1,106 @@
+import { useRef, type KeyboardEvent, type PointerEvent } from 'react'
+import { useTranslation } from 'react-i18next'
+
+import { DEFAULT_SIDEBAR_WIDTH, MAX_SIDEBAR_WIDTH, MIN_SIDEBAR_WIDTH } from './SidebarRail.js'
+
+type Props = {
+  width: number
+  onWidthChange: (width: number) => void
+  onResizeStart: () => void
+  onResizeEnd: (width: number) => void
+}
+
+type DragState = {
+  pointerId: number
+  startX: number
+  startWidth: number
+  currentWidth: number
+}
+
+export function clampSidebarWidth(width: number): number {
+  return Math.min(MAX_SIDEBAR_WIDTH, Math.max(MIN_SIDEBAR_WIDTH, Math.round(width)))
+}
+
+export default function SidebarResizeHandle({
+  width,
+  onWidthChange,
+  onResizeStart,
+  onResizeEnd,
+}: Props) {
+  const { t } = useTranslation()
+  const dragRef = useRef<DragState | null>(null)
+
+  function beginDrag(event: PointerEvent<HTMLDivElement>) {
+    if (event.button !== 0) return
+    dragRef.current = {
+      pointerId: event.pointerId,
+      startX: event.clientX,
+      startWidth: width,
+      currentWidth: width,
+    }
+    event.currentTarget.setPointerCapture(event.pointerId)
+    onResizeStart()
+    event.preventDefault()
+  }
+
+  function moveDrag(event: PointerEvent<HTMLDivElement>) {
+    const drag = dragRef.current
+    if (!drag || drag.pointerId !== event.pointerId) return
+    drag.currentWidth = clampSidebarWidth(drag.startWidth + event.clientX - drag.startX)
+    onWidthChange(drag.currentWidth)
+  }
+
+  function finishDrag(event: PointerEvent<HTMLDivElement>) {
+    const drag = dragRef.current
+    if (!drag || drag.pointerId !== event.pointerId) return
+    dragRef.current = null
+    if (event.currentTarget.hasPointerCapture(event.pointerId)) {
+      event.currentTarget.releasePointerCapture(event.pointerId)
+    }
+    onResizeEnd(drag.currentWidth)
+  }
+
+  function handleKeyDown(event: KeyboardEvent<HTMLDivElement>) {
+    let next: number | null = null
+    const step = event.shiftKey ? 24 : 8
+    if (event.key === 'ArrowLeft') next = width - step
+    else if (event.key === 'ArrowRight') next = width + step
+    else if (event.key === 'Home') next = MIN_SIDEBAR_WIDTH
+    else if (event.key === 'End') next = MAX_SIDEBAR_WIDTH
+    if (next === null) return
+    event.preventDefault()
+    const clamped = clampSidebarWidth(next)
+    onWidthChange(clamped)
+    onResizeEnd(clamped)
+  }
+
+  function resetWidth() {
+    onWidthChange(DEFAULT_SIDEBAR_WIDTH)
+    onResizeEnd(DEFAULT_SIDEBAR_WIDTH)
+  }
+
+  return (
+    <div className="relative z-20 w-0 flex-none">
+      <div
+        role="separator"
+        aria-label={t('sidebar.resize')}
+        aria-orientation="vertical"
+        aria-valuemin={MIN_SIDEBAR_WIDTH}
+        aria-valuemax={MAX_SIDEBAR_WIDTH}
+        aria-valuenow={width}
+        tabIndex={0}
+        data-testid="sidebar-resize-handle"
+        onPointerDown={beginDrag}
+        onPointerMove={moveDrag}
+        onPointerUp={finishDrag}
+        onPointerCancel={finishDrag}
+        onKeyDown={handleKeyDown}
+        onDoubleClick={resetWidth}
+        title={t('sidebar.resize')}
+        className="group absolute inset-y-0 -left-1 w-2 cursor-col-resize touch-none focus-visible:outline-none"
+      >
+        <span className="bg-warm-border dark:bg-dark-border group-hover:bg-warm-accent dark:group-hover:bg-dark-accent group-focus-visible:bg-warm-accent dark:group-focus-visible:bg-dark-accent absolute inset-y-0 left-[3px] w-px transition-colors duration-75" />
+      </div>
+    </div>
+  )
+}
diff --git a/apps/app/src/renderer/components/VirtualSessionList.tsx b/apps/app/src/renderer/components/VirtualSessionList.tsx
index 8de6f5c5..6e1066a8 100644
--- a/apps/app/src/renderer/components/VirtualSessionList.tsx
+++ b/apps/app/src/renderer/components/VirtualSessionList.tsx
@@ -24,6 +24,9 @@ export type SessionListRow =
       showProject?: boolean
       bucket?: BucketKey
       headerId: string | null
+      treeDepth?: number
+      treeAncestorIds?: string[]
+      treeChildCount?: number
     }
   | { kind: 'footer'; id: string; loading: boolean; exhausted: boolean; total: number }
 
@@ -60,6 +63,7 @@ export default function VirtualSessionList({
   // the set are open (we keep "closed" rather than "open" so newly arriving
   // headers default to open without needing to pre-populate state).
   const [closed, setClosed] = useState<Set<string>>(new Set())
+  const [openTreeNodes, setOpenTreeNodes] = useState<Set<string>>(new Set())
 
   const toggleHeader = useCallback((id: string) => {
     setClosed((prev) => {
@@ -71,12 +75,23 @@ export default function VirtualSessionList({
   }, [])
 
   const visible = useMemo<SessionListRow[]>(() => {
-    if (!collapsibleSections || closed.size === 0) return rows
     return rows.filter((r) => {
-      if (r.kind === 'session') return r.headerId == null || !closed.has(r.headerId)
+      if (r.kind === 'session') {
+        if (collapsibleSections && r.headerId != null && closed.has(r.headerId)) return false
+        return r.treeAncestorIds?.every((id) => openTreeNodes.has(id)) ?? true
+      }
       return true
     })
-  }, [rows, closed, collapsibleSections])
+  }, [rows, closed, collapsibleSections, openTreeNodes])
+
+  const toggleTreeNode = useCallback((id: string) => {
+    setOpenTreeNodes((prev) => {
+      const next = new Set(prev)
+      if (next.has(id)) next.delete(id)
+      else next.add(id)
+      return next
+    })
+  }, [])
 
   return (
     <Virtuoso
@@ -109,6 +124,14 @@ export default function VirtualSessionList({
             {...(row.pinned ? { pinned: true } : {})}
             {...(row.showProject ? { showProject: true } : {})}
             {...(row.bucket ? { bucket: row.bucket } : {})}
+            {...(row.treeDepth !== undefined ? { treeDepth: row.treeDepth } : {})}
+            {...(row.treeChildCount
+              ? {
+                  treeChildCount: row.treeChildCount,
+                  treeExpanded: openTreeNodes.has(row.session.sessionUuid),
+                  onToggleTree: () => toggleTreeNode(row.session.sessionUuid),
+                }
+              : {})}
             {...(onPinChange ? { onPinChange } : {})}
             onOpenSession={onOpenSession}
             onCopySessionId={onCopySessionId}
diff --git a/apps/app/src/renderer/i18n/locales/de.json b/apps/app/src/renderer/i18n/locales/de.json
index ecfc255b..0214a22a 100644
--- a/apps/app/src/renderer/i18n/locales/de.json
+++ b/apps/app/src/renderer/i18n/locales/de.json
@@ -48,6 +48,7 @@
     "projects": "Projekte",
     "collapse": "Seitenleiste einklappen",
     "expand": "Seitenleiste ausklappen",
+    "resize": "Seitenleiste skalieren",
     "copySessionId": "Sitzungs-ID kopieren",
     "shareSession": "Sitzung teilen",
     "pin": "Anheften",
@@ -149,6 +150,8 @@
     "bucket_earlierWeek": "Früher diese Woche",
     "bucket_earlierMonth": "Früher diesen Monat",
     "bucket_older": "Älter",
+    "childSessions_one": "{{count}} untergeordnete Sitzung",
+    "childSessions_other": "{{count}} untergeordnete Sitzungen",
     "footer_loadingMore": "Ältere Sitzungen werden geladen…",
     "footer_endOf_one": "Ende — {{count}} Sitzung",
     "footer_endOf_other": "Ende — {{count}} Sitzungen"
diff --git a/apps/app/src/renderer/i18n/locales/en.json b/apps/app/src/renderer/i18n/locales/en.json
index 9dcbc3b1..aeb499a9 100644
--- a/apps/app/src/renderer/i18n/locales/en.json
+++ b/apps/app/src/renderer/i18n/locales/en.json
@@ -48,6 +48,7 @@
     "projects": "Projects",
     "collapse": "Collapse sidebar",
     "expand": "Expand sidebar",
+    "resize": "Resize sidebar",
     "copySessionId": "Copy session ID",
     "shareSession": "Share session",
     "pin": "Pin",
@@ -149,6 +150,8 @@
     "bucket_earlierWeek": "Earlier this week",
     "bucket_earlierMonth": "Earlier this month",
     "bucket_older": "Older",
+    "childSessions_one": "{{count}} child session",
+    "childSessions_other": "{{count}} child sessions",
     "footer_loadingMore": "Loading older sessions…",
     "footer_endOf_one": "End of {{count}} session",
     "footer_endOf_other": "End of {{count}} sessions"
diff --git a/apps/app/src/renderer/i18n/locales/fr.json b/apps/app/src/renderer/i18n/locales/fr.json
index 913a2378..09460f80 100644
--- a/apps/app/src/renderer/i18n/locales/fr.json
+++ b/apps/app/src/renderer/i18n/locales/fr.json
@@ -48,6 +48,7 @@
     "projects": "Projets",
     "collapse": "Réduire la barre latérale",
     "expand": "Déplier la barre latérale",
+    "resize": "Redimensionner la barre latérale",
     "copySessionId": "Copier l'ID de session",
     "shareSession": "Partager la session",
     "pin": "Épingler",
@@ -149,6 +150,8 @@
     "bucket_earlierWeek": "Plus tôt cette semaine",
     "bucket_earlierMonth": "Plus tôt ce mois-ci",
     "bucket_older": "Plus ancien",
+    "childSessions_one": "{{count}} session enfant",
+    "childSessions_other": "{{count}} sessions enfant",
     "footer_loadingMore": "Chargement des sessions plus anciennes…",
     "footer_endOf_one": "Fin — {{count}} session",
     "footer_endOf_other": "Fin — {{count}} sessions"
diff --git a/apps/app/src/renderer/i18n/locales/ja.json b/apps/app/src/renderer/i18n/locales/ja.json
index 30d80cdc..92846004 100644
--- a/apps/app/src/renderer/i18n/locales/ja.json
+++ b/apps/app/src/renderer/i18n/locales/ja.json
@@ -48,6 +48,7 @@
     "projects": "プロジェクト",
     "collapse": "サイドバーを折りたたむ",
     "expand": "サイドバーを展開",
+    "resize": "サイドバーの幅を変更",
     "copySessionId": "セッション ID をコピー",
     "shareSession": "セッションを共有",
     "pin": "ピン留め",
@@ -144,6 +145,7 @@
     "bucket_earlierWeek": "今週",
     "bucket_earlierMonth": "今月",
     "bucket_older": "それ以前",
+    "childSessions_other": "子セッション {{count}} 件",
     "footer_loadingMore": "古いセッションを読み込んでいます…",
     "footer_endOf_other": "{{count}} 件のセッション"
   },
diff --git a/apps/app/src/renderer/i18n/locales/ko.json b/apps/app/src/renderer/i18n/locales/ko.json
index 56f86349..296d9c32 100644
--- a/apps/app/src/renderer/i18n/locales/ko.json
+++ b/apps/app/src/renderer/i18n/locales/ko.json
@@ -48,6 +48,7 @@
     "projects": "프로젝트",
     "collapse": "사이드바 접기",
     "expand": "사이드바 펼치기",
+    "resize": "사이드바 너비 조절",
     "copySessionId": "세션 ID 복사",
     "shareSession": "세션 공유",
     "pin": "고정",
@@ -144,6 +145,7 @@
     "bucket_earlierWeek": "이번 주 초",
     "bucket_earlierMonth": "이번 달 초",
     "bucket_older": "이전",
+    "childSessions_other": "하위 세션 {{count}}개",
     "footer_loadingMore": "이전 세션 불러오는 중…",
     "footer_endOf_other": "총 {{count}}개 세션"
   },
diff --git a/apps/app/src/renderer/i18n/locales/zh-CN.json b/apps/app/src/renderer/i18n/locales/zh-CN.json
index 79af5d2d..3e1fcd12 100644
--- a/apps/app/src/renderer/i18n/locales/zh-CN.json
+++ b/apps/app/src/renderer/i18n/locales/zh-CN.json
@@ -48,6 +48,7 @@
     "projects": "项目",
     "collapse": "收起侧栏",
     "expand": "展开侧栏",
+    "resize": "调整侧栏宽度",
     "copySessionId": "复制会话 ID",
     "shareSession": "分享会话",
     "pin": "置顶",
@@ -144,6 +145,7 @@
     "bucket_earlierWeek": "本周早些时候",
     "bucket_earlierMonth": "本月早些时候",
     "bucket_older": "更早",
+    "childSessions_other": "{{count}} 个子会话",
     "footer_loadingMore": "正在加载更早的会话…",
     "footer_endOf_other": "共 {{count}} 个会话"
   },
diff --git a/apps/app/src/renderer/i18n/locales/zh-TW.json b/apps/app/src/renderer/i18n/locales/zh-TW.json
index 01de5c04..7d11ef61 100644
--- a/apps/app/src/renderer/i18n/locales/zh-TW.json
+++ b/apps/app/src/renderer/i18n/locales/zh-TW.json
@@ -48,6 +48,7 @@
     "projects": "專案",
     "collapse": "收合側欄",
     "expand": "展開側欄",
+    "resize": "調整側欄寬度",
     "copySessionId": "複製會話 ID",
     "shareSession": "分享會話",
     "pin": "釘選",
@@ -144,6 +145,7 @@
     "bucket_earlierWeek": "本週稍早",
     "bucket_earlierMonth": "本月稍早",
     "bucket_older": "更早",
+    "childSessions_other": "{{count}} 個子會話",
     "footer_loadingMore": "正在載入更早的會話…",
     "footer_endOf_other": "共 {{count}} 個會話"
   },
diff --git a/apps/app/src/renderer/lib/sessionTree.test.ts b/apps/app/src/renderer/lib/sessionTree.test.ts
new file mode 100644
index 00000000..821c29c8
--- /dev/null
+++ b/apps/app/src/renderer/lib/sessionTree.test.ts
@@ -0,0 +1,61 @@
+import type { Session } from '@spool-lab/core'
+import { describe, expect, it } from 'vite-plus/test'
+
+import { buildSessionForest } from './sessionTree.js'
+
+function session(
+  sessionUuid: string,
+  parentSessionUuid: string | null,
+  startedAt: string,
+): Session {
+  return {
+    id: 1,
+    projectId: 1,
+    sourceId: 2,
+    sessionUuid,
+    parentSessionUuid,
+    filePath: `/tmp/${sessionUuid}.jsonl`,
+    title: sessionUuid,
+    startedAt,
+    endedAt: startedAt,
+    messageCount: 1,
+    hasToolUse: false,
+    cwd: '/tmp',
+    model: null,
+    source: 'codex',
+    projectDisplayPath: '/tmp',
+    projectDisplayName: 'tmp',
+    scanFindingCount: 0,
+    scanHighCount: 0,
+    scanPurgedCount: 0,
+    scanCompletedAt: null,
+  }
+}
+
+describe('buildSessionForest', () => {
+  it('builds nested sessions and sorts siblings chronologically', () => {
+    const forest = buildSessionForest([
+      session('root', null, '2026-01-01T00:00:00Z'),
+      session('later', 'root', '2026-01-01T00:02:00Z'),
+      session('earlier', 'root', '2026-01-01T00:01:00Z'),
+      session('grandchild', 'earlier', '2026-01-01T00:03:00Z'),
+    ])
+
+    expect(forest.map((node) => node.session.sessionUuid)).toEqual(['root'])
+    expect(forest[0]?.children.map((node) => node.session.sessionUuid)).toEqual([
+      'earlier',
+      'later',
+    ])
+    expect(forest[0]?.children[0]?.children[0]?.session.sessionUuid).toBe('grandchild')
+  })
+
+  it('promotes orphaned and cyclic sessions to roots', () => {
+    const forest = buildSessionForest([
+      session('orphan', 'missing', '2026-01-01T00:00:00Z'),
+      session('a', 'b', '2026-01-01T00:01:00Z'),
+      session('b', 'a', '2026-01-01T00:02:00Z'),
+    ])
+
+    expect(forest.map((node) => node.session.sessionUuid)).toEqual(['orphan', 'a', 'b'])
+  })
+})
diff --git a/apps/app/src/renderer/lib/sessionTree.ts b/apps/app/src/renderer/lib/sessionTree.ts
new file mode 100644
index 00000000..03035c6c
--- /dev/null
+++ b/apps/app/src/renderer/lib/sessionTree.ts
@@ -0,0 +1,52 @@
+import type { Session } from '@spool-lab/core'
+
+export type SessionTreeNode = {
+  session: Session
+  children: SessionTreeNode[]
+}
+
+export function buildSessionForest(sessions: Session[]): SessionTreeNode[] {
+  const nodes = new Map<string, SessionTreeNode>(
+    sessions.map((session) => [session.sessionUuid, { session, children: [] }]),
+  )
+  const roots: SessionTreeNode[] = []
+
+  for (const session of sessions) {
+    const node = nodes.get(session.sessionUuid)!
+    const parentUuid = session.parentSessionUuid
+    const parent = parentUuid ? nodes.get(parentUuid) : undefined
+    if (!parent || createsCycle(session.sessionUuid, parentUuid!, nodes)) {
+      roots.push(node)
+      continue
+    }
+    parent.children.push(node)
+  }
+
+  const sortChildren = (node: SessionTreeNode): void => {
+    node.children.sort(compareChronologically)
+    for (const child of node.children) sortChildren(child)
+  }
+  for (const root of roots) sortChildren(root)
+
+  return roots
+}
+
+function createsCycle(
+  childUuid: string,
+  parentUuid: string,
+  nodes: Map<string, SessionTreeNode>,
+): boolean {
+  const seen = new Set([childUuid])
+  let current: string | null = parentUuid
+  while (current) {
+    if (seen.has(current)) return true
+    seen.add(current)
+    current = nodes.get(current)?.session.parentSessionUuid ?? null
+  }
+  return false
+}
+
+function compareChronologically(a: SessionTreeNode, b: SessionTreeNode): number {
+  const byTime = a.session.startedAt.localeCompare(b.session.startedAt)
+  return byTime || a.session.sessionUuid.localeCompare(b.session.sessionUuid)
+}
diff --git a/packages/core/src/db/db.ts b/packages/core/src/db/db.ts
index 0251cd4d..a8c4a066 100644
--- a/packages/core/src/db/db.ts
+++ b/packages/core/src/db/db.ts
@@ -16,7 +16,7 @@ export const DB_PATH = join(SPOOL_DIR, 'spool.db')
  * Latest schema version the running build knows how to migrate to.
  * Bump in lockstep with the last `db.pragma('user_version = N')` in runMigrations.
  */
-export const LATEST_SCHEMA_VERSION = 15
+export const LATEST_SCHEMA_VERSION = 16
 
 let _db: Database.Database | null = null
 let _wasNewDb = false
@@ -103,6 +103,7 @@ export function runMigrations(db: Database.Database): void {
       project_id     INTEGER NOT NULL REFERENCES projects(id),
       source_id      INTEGER NOT NULL REFERENCES sources(id),
       session_uuid   TEXT NOT NULL UNIQUE,
+      parent_session_uuid TEXT,
       file_path      TEXT NOT NULL UNIQUE,
       title          TEXT,
       title_source   TEXT NOT NULL DEFAULT 'derived',
@@ -737,6 +738,14 @@ export function runMigrations(db: Database.Database): void {
     db.pragma('user_version = 15')
   }
 
+  if (version < 16) {
+    if (!columnExists(db, 'sessions', 'parent_session_uuid')) {
+      db.exec('ALTER TABLE sessions ADD COLUMN parent_session_uuid TEXT')
+    }
+    db.exec('CREATE INDEX IF NOT EXISTS idx_sessions_parent ON sessions(parent_session_uuid)')
+    db.pragma('user_version = 16')
+  }
+
   rebuildFtsTableIfEmpty(db, 'messages', 'messages_fts_trigram')
   rebuildFtsTableIfEmpty(db, 'session_search', 'session_search_fts')
   rebuildFtsTableIfEmpty(db, 'session_search', 'session_search_fts_trigram')
diff --git a/packages/core/src/db/migration-v12.test.ts b/packages/core/src/db/migration-v12.test.ts
index 8d585b28..5a0ab308 100644
--- a/packages/core/src/db/migration-v12.test.ts
+++ b/packages/core/src/db/migration-v12.test.ts
@@ -21,8 +21,8 @@ function seedProjectAndSession(db: Database.Database, sessionUuid: string): numb
 }
 
 describe('migration v12 — security scan schema', () => {
-  it('LATEST_SCHEMA_VERSION is 15', () => {
-    expect(LATEST_SCHEMA_VERSION).toBe(15)
+  it('LATEST_SCHEMA_VERSION is 16', () => {
+    expect(LATEST_SCHEMA_VERSION).toBe(16)
   })
 
   it('adds 5 scan_* columns to sessions (profile / completed_at / finding_count / high_count / purged_count)', () => {
diff --git a/packages/core/src/db/migration-v16.test.ts b/packages/core/src/db/migration-v16.test.ts
new file mode 100644
index 00000000..dab4d61e
--- /dev/null
+++ b/packages/core/src/db/migration-v16.test.ts
@@ -0,0 +1,54 @@
+import Database from 'better-sqlite3'
+import { describe, expect, it } from 'vite-plus/test'
+
+import { LATEST_SCHEMA_VERSION, runMigrations } from './db.js'
+
+describe('migration v16: parent session relationships', () => {
+  it('adds the parent column and index to a v15 database', () => {
+    const db = new Database(':memory:')
+    runMigrations(db)
+    db.exec('DROP INDEX idx_sessions_parent')
+    db.pragma('user_version = 15')
+
+    // SQLite cannot drop a column safely across every supported runtime, so
+    // simulate the v15 shape in a fresh attached table and swap it into place.
+    db.exec(`
+      ALTER TABLE sessions RENAME TO sessions_v16;
+      CREATE TABLE sessions (
+        id INTEGER PRIMARY KEY,
+        project_id INTEGER NOT NULL REFERENCES projects(id),
+        source_id INTEGER NOT NULL REFERENCES sources(id),
+        session_uuid TEXT NOT NULL UNIQUE,
+        file_path TEXT NOT NULL UNIQUE,
+        title TEXT,
+        title_source TEXT NOT NULL DEFAULT 'derived',
+        started_at TEXT NOT NULL,
+        ended_at TEXT NOT NULL,
+        message_count INTEGER NOT NULL DEFAULT 0,
+        has_tool_use INTEGER NOT NULL DEFAULT 0,
+        cwd TEXT,
+        model TEXT,
+        raw_file_mtime TEXT,
+        created_at TEXT NOT NULL DEFAULT (datetime('now')),
+        scan_profile TEXT,
+        scan_completed_at TEXT,
+        scan_finding_count INTEGER NOT NULL DEFAULT 0,
+        scan_high_count INTEGER NOT NULL DEFAULT 0,
+        scan_purged_count INTEGER NOT NULL DEFAULT 0
+      );
+      DROP TABLE sessions_v16;
+    `)
+
+    runMigrations(db)
+
+    const columns = db.prepare('PRAGMA table_info(sessions)').all() as Array<{ name: string }>
+    expect(columns.map((column) => column.name)).toContain('parent_session_uuid')
+    const indexes = db
+      .prepare("SELECT name FROM sqlite_master WHERE type = 'index' AND tbl_name = 'sessions'")
+      .all() as Array<{ name: string }>
+    expect(indexes.map((index) => index.name)).toContain('idx_sessions_parent')
+    expect((db.pragma('user_version') as Array<{ user_version: number }>)[0]?.user_version).toBe(
+      LATEST_SCHEMA_VERSION,
+    )
+  })
+})
diff --git a/packages/core/src/db/published-shares-cache.test.ts b/packages/core/src/db/published-shares-cache.test.ts
index 38f62db8..fd4f442f 100644
--- a/packages/core/src/db/published-shares-cache.test.ts
+++ b/packages/core/src/db/published-shares-cache.test.ts
@@ -4,6 +4,7 @@ import { join } from 'node:path'
 
 import { afterEach, describe, expect, it, vi } from 'vite-plus/test'
 
+import { LATEST_SCHEMA_VERSION } from './db.js'
 import type { PublishedShareCacheItem } from './published-shares-cache.js'
 
 const tempDirs: string[] = []
@@ -64,10 +65,10 @@ describe('published_shares_cache schema (v15)', () => {
     expect(names).toContain('idx_published_shares_cache_draft_id')
   })
 
-  it('user_version reaches 15 after migration', async () => {
+  it('user_version reaches the latest schema after migration', async () => {
     const { db } = await load()
     const v = (db.pragma('user_version') as Array<{ user_version: number }>)[0]?.user_version
-    expect(v).toBe(15)
+    expect(v).toBe(LATEST_SCHEMA_VERSION)
   })
 
   it('upsertMany inserts new rows and listAll returns them by published_at desc', async () => {
diff --git a/packages/core/src/db/queries.test.ts b/packages/core/src/db/queries.test.ts
index a410cfee..0b4b9152 100644
--- a/packages/core/src/db/queries.test.ts
+++ b/packages/core/src/db/queries.test.ts
@@ -165,6 +165,20 @@ describe('upsertSession (title_source authority)', () => {
       .get('sess-1') as { file_path: string }
     expect(row.file_path).toBe('/real/path.jsonl')
   })
+
+  it('persists and updates the parent session relationship', () => {
+    upsertSession(db, baseOpts({ parentSessionUuid: 'parent-1' }))
+    let row = db
+      .prepare('SELECT parent_session_uuid FROM sessions WHERE session_uuid = ?')
+      .get('sess-1') as { parent_session_uuid: string | null }
+    expect(row.parent_session_uuid).toBe('parent-1')
+
+    upsertSession(db, baseOpts({ parentSessionUuid: 'parent-2' }))
+    row = db
+      .prepare('SELECT parent_session_uuid FROM sessions WHERE session_uuid = ?')
+      .get('sess-1') as { parent_session_uuid: string | null }
+    expect(row.parent_session_uuid).toBe('parent-2')
+  })
 })
 
 describe('getOrCreateAskProject', () => {
diff --git a/packages/core/src/db/queries.ts b/packages/core/src/db/queries.ts
index fbac1068..0c47f7d8 100644
--- a/packages/core/src/db/queries.ts
+++ b/packages/core/src/db/queries.ts
@@ -177,6 +177,7 @@ export function upsertSession(
     projectId: number
     sourceId: number
     sessionUuid: string
+    parentSessionUuid?: string | null
     filePath: string
     title: string
     startedAt: string
@@ -189,6 +190,7 @@ export function upsertSession(
   },
   mode: UpsertSessionMode = 'rewrite',
 ): number {
+  const parentSessionUuid = opts.parentSessionUuid ?? null
   const existing = db
     .prepare('SELECT id, file_path FROM sessions WHERE session_uuid = ?')
     .get(opts.sessionUuid) as { id: number; file_path: string } | undefined
@@ -221,12 +223,14 @@ export function upsertSession(
     db.prepare(`
       UPDATE sessions SET
         title = CASE WHEN title_source = 'derived' THEN ? ELSE title END,
+        parent_session_uuid = ?,
         file_path = ?,
         started_at = ?, ended_at = ?,
         has_tool_use = ?, cwd = ?, model = ?, raw_file_mtime = ?
       WHERE id = ?
     `).run(
       opts.title,
+      parentSessionUuid,
       opts.filePath,
       opts.startedAt,
       opts.endedAt,
@@ -242,14 +246,15 @@ export function upsertSession(
   const result = db
     .prepare(`
     INSERT INTO sessions
-      (project_id, source_id, session_uuid, file_path, title,
+      (project_id, source_id, session_uuid, parent_session_uuid, file_path, title,
        started_at, ended_at, message_count, has_tool_use, cwd, model, raw_file_mtime)
-    VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)
+    VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)
   `)
     .run(
       opts.projectId,
       opts.sourceId,
       opts.sessionUuid,
+      parentSessionUuid,
       opts.filePath,
       opts.title,
       opts.startedAt,
@@ -430,7 +435,8 @@ export function recomputeMessageCount(db: Database.Database, sessionId: number):
 export const SESSION_SELECT = `
   SELECT
     s.id, s.project_id AS projectId, s.source_id AS sourceId,
-    s.session_uuid AS sessionUuid, s.file_path AS filePath,
+    s.session_uuid AS sessionUuid, s.parent_session_uuid AS parentSessionUuid,
+    s.file_path AS filePath,
     s.title, s.started_at AS startedAt, s.ended_at AS endedAt,
     s.message_count AS messageCount, s.has_tool_use AS hasToolUse,
     s.cwd, s.model,
@@ -1316,6 +1322,7 @@ export function rowToSession(r: Record<string, unknown>): Session {
     projectId: r['projectId'] as number,
     sourceId: r['sourceId'] as number,
     sessionUuid: r['sessionUuid'] as string,
+    parentSessionUuid: (r['parentSessionUuid'] as string | null) ?? null,
     filePath: r['filePath'] as string,
     title: r['title'] as string | null,
     startedAt: r['startedAt'] as string,
diff --git a/packages/core/src/parsers/codex.test.ts b/packages/core/src/parsers/codex.test.ts
index 9702f563..750a3693 100644
--- a/packages/core/src/parsers/codex.test.ts
+++ b/packages/core/src/parsers/codex.test.ts
@@ -67,6 +67,29 @@ describe('parseCodexSession', () => {
     expect(parseCodexSession(fp)?.gitRemote).toBe('git@github.com:paperboytm/im.git')
   })
 
+  it('preserves the parent thread for review and spawned subagent sessions', () => {
+    const fp = writeTmpSession([
+      {
+        timestamp: '2026-04-05T12:05:00Z',
+        type: 'session_meta',
+        payload: {
+          id: 'session-child',
+          parent_thread_id: 'session-parent',
+          thread_source: 'subagent',
+          source: { subagent: 'review' },
+          cwd: '/tmp/project',
+        },
+      },
+      {
+        timestamp: '2026-04-05T12:05:01Z',
+        type: 'event_msg',
+        payload: { type: 'user_message', message: 'Review the current changes.' },
+      },
+    ])
+
+    expect(parseCodexSession(fp)?.parentSessionUuid).toBe('session-parent')
+  })
+
   it('filters guardian approval transcript sessions from indexing', () => {
     const fp = writeTmpSession([
       {
diff --git a/packages/core/src/parsers/codex.ts b/packages/core/src/parsers/codex.ts
index 52023143..be8f9518 100644
--- a/packages/core/src/parsers/codex.ts
+++ b/packages/core/src/parsers/codex.ts
@@ -8,7 +8,7 @@ import type { ParseSessionResult, ParsedSession } from '../types.js'
 // The parsing brain lives in @spool-lab/session-kit (browser-safe, shared
 // with the web reader); this wrapper owns only the streamed file I/O.
 
-export const CODEX_INDEX_VERSION = 'codex-v6-project-identity-from-session-git-remote'
+export const CODEX_INDEX_VERSION = 'codex-v7-parent-session-tree'
 
 const READ_CHUNK_SIZE = 1024 * 1024
 
diff --git a/packages/core/src/projects/sessions.test.ts b/packages/core/src/projects/sessions.test.ts
index b087eaab..bcf0b794 100644
--- a/packages/core/src/projects/sessions.test.ts
+++ b/packages/core/src/projects/sessions.test.ts
@@ -155,6 +155,42 @@ describe('listRecentSessionsPage', () => {
     expect(page2.sessions.map((s) => s.sessionUuid)).toEqual(['a'])
     expect(page2.nextCursor).toBeNull()
   })
+
+  it('paginates roots while returning their nested child sessions', () => {
+    db.exec(`
+      INSERT INTO sessions (
+        project_id, source_id, session_uuid, parent_session_uuid, file_path,
+        title, started_at, ended_at, message_count, has_tool_use, raw_file_mtime
+      ) VALUES
+        (1,1,'root','', '/root','root','2026-05-04T00:00:00Z','2026-05-04T00:00:00Z',1,0,'2026-05-04T00:00:00Z'),
+        (1,1,'child','root','/child','child','2026-05-04T00:01:00Z','2026-05-04T00:01:00Z',1,0,'2026-05-04T00:01:00Z'),
+        (1,1,'grandchild','child','/grandchild','grandchild','2026-05-04T00:02:00Z','2026-05-04T00:02:00Z',1,0,'2026-05-04T00:02:00Z');
+    `)
+
+    const page1 = listRecentSessionsPage(db, { limit: 1 })
+    expect(page1.sessions.map((session) => session.sessionUuid)).toEqual([
+      'root',
+      'child',
+      'grandchild',
+    ])
+    expect(page1.nextCursor?.sessionUuid).toBe('root')
+
+    const page2 = listRecentSessionsPage(db, { limit: 1, cursor: page1.nextCursor! })
+    expect(page2.sessions.map((session) => session.sessionUuid)).toEqual(['c'])
+  })
+
+  it('promotes a child whose parent is absent from the index', () => {
+    db.exec(`
+      INSERT INTO sessions (
+        project_id, source_id, session_uuid, parent_session_uuid, file_path,
+        title, started_at, ended_at, message_count, has_tool_use, raw_file_mtime
+      ) VALUES
+        (1,1,'orphan','missing','/orphan','orphan','2026-05-04T00:00:00Z','2026-05-04T00:00:00Z',1,0,'2026-05-04T00:00:00Z');
+    `)
+
+    const page = listRecentSessionsPage(db, { limit: 1 })
+    expect(page.sessions.map((session) => session.sessionUuid)).toEqual(['orphan'])
+  })
 })
 
 describe('listProjectDirectoryCounts', () => {
diff --git a/packages/core/src/projects/sessions.ts b/packages/core/src/projects/sessions.ts
index dcbb32c3..9846ed67 100644
--- a/packages/core/src/projects/sessions.ts
+++ b/packages/core/src/projects/sessions.ts
@@ -67,14 +67,21 @@ export function listRecentSessionsPage(
   options: { limit?: number; cursor?: SessionsCursor } = {},
 ): SessionsPage {
   const { limit = DEFAULT_PAGE_SIZE, cursor } = options
-  const conditions: string[] = ['s.message_count > 0']
+  const conditions: string[] = [
+    's.message_count > 0',
+    `(s.parent_session_uuid IS NULL OR NOT EXISTS (
+      SELECT 1 FROM sessions parent
+      WHERE parent.session_uuid = s.parent_session_uuid
+        AND parent.message_count > 0
+    ))`,
+  ]
   const params: unknown[] = []
   if (cursor) {
     const c = cursorWhere('recent', cursor)
     conditions.push(c.sql)
     params.push(...c.params)
   }
-  return executePage(db, conditions, params, 'recent', limit)
+  return executeRecentTreePage(db, conditions, params, limit)
 }
 
 export type DirectoryCount = {
@@ -167,6 +174,62 @@ function executePage(
   return { sessions, nextCursor }
 }
 
+function executeRecentTreePage(
+  db: Database.Database,
+  conditions: string[],
+  params: unknown[],
+  limit: number,
+): SessionsPage {
+  const rows = db
+    .prepare(`
+    ${SESSION_SELECT}
+    WHERE ${conditions.join(' AND ')}
+    ORDER BY ${orderByClause('recent')}
+    LIMIT ?
+  `)
+    .all(...params, limit + 1) as Array<Record<string, unknown>>
+
+  const hasMore = rows.length > limit
+  const rootRows = hasMore ? rows.slice(0, limit) : rows
+  const roots = rootRows.map(rowToSession)
+  const lastRoot = roots.at(-1)
+  const nextCursor =
+    hasMore && lastRoot
+      ? {
+          startedAt: lastRoot.startedAt,
+          sessionUuid: lastRoot.sessionUuid,
+          messageCount: lastRoot.messageCount,
+          title: lastRoot.title ?? '',
+        }
+      : null
+
+  if (roots.length === 0) return { sessions: [], nextCursor }
+
+  const placeholders = roots.map(() => '?').join(',')
+  const descendants = db
+    .prepare(`
+    WITH RECURSIVE descendant_ids(session_uuid) AS (
+      SELECT child.session_uuid
+      FROM sessions child
+      WHERE child.parent_session_uuid IN (${placeholders})
+      UNION
+      SELECT child.session_uuid
+      FROM sessions child
+      JOIN descendant_ids parent ON child.parent_session_uuid = parent.session_uuid
+    )
+    ${SESSION_SELECT}
+    WHERE s.session_uuid IN (SELECT session_uuid FROM descendant_ids)
+      AND s.message_count > 0
+    ORDER BY s.started_at ASC, s.session_uuid ASC
+  `)
+    .all(...roots.map((root) => root.sessionUuid)) as Array<Record<string, unknown>>
+
+  return {
+    sessions: [...roots, ...descendants.map(rowToSession)],
+    nextCursor,
+  }
+}
+
 function orderByClause(sortOrder: ProjectSessionSortOrder): string {
   // session_uuid is the unique tiebreaker so the page boundary is deterministic
   // and keyset pagination skips exactly the rows already shown.
diff --git a/packages/core/src/sync/syncer.ts b/packages/core/src/sync/syncer.ts
index 5664231b..50dd7dc4 100644
--- a/packages/core/src/sync/syncer.ts
+++ b/packages/core/src/sync/syncer.ts
@@ -391,6 +391,7 @@ export class Syncer {
             projectId,
             sourceId,
             sessionUuid: parsed.sessionUuid,
+            parentSessionUuid: parsed.parentSessionUuid ?? null,
             filePath,
             title: parsed.title,
             startedAt: parsed.startedAt,
diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts
index ad998f6f..d2967f46 100644
--- a/packages/core/src/types.ts
+++ b/packages/core/src/types.ts
@@ -16,6 +16,7 @@ export interface ParsedMessage {
 export interface ParsedSession {
   source: SessionSource
   sessionUuid: string
+  parentSessionUuid?: string | null
   filePath: string
   title: string
   cwd: string
@@ -37,6 +38,7 @@ export interface Session {
   projectId: number
   sourceId: number
   sessionUuid: string
+  parentSessionUuid: string | null
   filePath: string
   title: string | null
   startedAt: string
diff --git a/packages/session-kit/src/messages.ts b/packages/session-kit/src/messages.ts
index 0fbf7ba4..938e4dcd 100644
--- a/packages/session-kit/src/messages.ts
+++ b/packages/session-kit/src/messages.ts
@@ -20,6 +20,7 @@ export interface ParsedMessage {
 export interface ParsedProviderSession {
   source: 'claude' | 'codex'
   sessionUuid: string
+  parentSessionUuid?: string | null
   filePath: string
   title: string
   cwd: string
@@ -293,6 +294,7 @@ export function parseCodexSessionLines(
   const eventMessages: ParsedMessage[] = []
   const responseMessages: ParsedMessage[] = []
   let sessionUuid = ''
+  let parentSessionUuid: string | null = null
   let cwd = ''
   let model = ''
   let isInternalAssessmentSession = false
@@ -326,6 +328,9 @@ export function parseCodexSessionLines(
 
     if (type === 'session_meta' && payload) {
       if (!sessionUuid && payload['id']) sessionUuid = payload['id'] as string
+      if (typeof payload['parent_thread_id'] === 'string') {
+        parentSessionUuid = payload['parent_thread_id'] || null
+      }
       if (payload['cwd']) cwd = payload['cwd'] as string
       const source = payload['source']
       if (isGuardianSubagentSource(source)) isInternalAssessmentSession = true
@@ -446,6 +451,7 @@ export function parseCodexSessionLines(
     session: {
       source: 'codex',
       sessionUuid: sessionUuid || filePath,
+      parentSessionUuid,
       filePath,
       title,
       cwd,