diff --git a/desktop/src/apps/NotesApp.test.tsx b/desktop/src/apps/NotesApp.test.tsx
index f364a92d0..a06b72772 100644
--- a/desktop/src/apps/NotesApp.test.tsx
+++ b/desktop/src/apps/NotesApp.test.tsx
@@ -1,6 +1,6 @@
 import { render, screen, act, waitFor, within, fireEvent } from "@testing-library/react";
 import { describe, it, expect, vi, beforeEach } from "vitest";
-import { NotesApp, TodoApp } from "./NotesApp";
+import { NotesApp } from "./NotesApp";
 
 function mockFetch(
   resolver: (url: string, init?: RequestInit) => { ok: boolean; status?: number; body: unknown },
@@ -178,27 +178,3 @@ describe("NotesApp", () => {
   });
 });
 
-describe("TodoApp", () => {
-  beforeEach(() => {
-    vi.restoreAllMocks();
-  });
-
-  it("renders only lists, filtering out notes that share the same API", async () => {
-    vi.stubGlobal(
-      "fetch",
-      mockFetch(() => ({ ok: true, body: [noteDoc, listDoc] })),
-    );
-    render(<TodoApp windowId="w2" />);
-    await flush();
-
-    await waitFor(() => expect(screen.getByText("Sprint backlog")).toBeTruthy());
-    expect(screen.queryByText("Project kickoff")).toBeNull();
-  });
-
-  it("shows the todo empty state when there are no lists", async () => {
-    vi.stubGlobal("fetch", mockFetch(() => ({ ok: true, body: [] })));
-    render(<TodoApp windowId="w2" />);
-    await flush();
-    await waitFor(() => expect(screen.getByText(/no lists yet/i)).toBeTruthy());
-  });
-});
diff --git a/desktop/src/apps/NotesApp.tsx b/desktop/src/apps/NotesApp.tsx
index 7b6f599c4..56d0c523e 100644
--- a/desktop/src/apps/NotesApp.tsx
+++ b/desktop/src/apps/NotesApp.tsx
@@ -1,7 +1,6 @@
 import { useState, useEffect, useCallback, useRef } from "react";
 import {
   StickyNote,
-  ListChecks,
   Plus,
   Clock,
   Users,
@@ -119,19 +118,6 @@ const NOTES_CONFIG: DocKindConfig = {
   showDone: false,
 };
 
-const TODO_CONFIG: DocKindConfig = {
-  kind: "list",
-  appName: "Todo",
-  icon: ListChecks,
-  noun: "list",
-  titlePlaceholder: "List title...",
-  addPlaceholder: "Add a task...",
-  emptyDocs: "No lists yet.",
-  emptyEntries: "Nothing here yet. Add your first task above.",
-  selectPrompt: "Select a list to get started.",
-  showDone: true,
-};
-
 // ---- Sub-components ----
 
 function MemberBadge({ member }: { member: NoteMember }) {
@@ -1171,7 +1157,3 @@ function DocsApp({ config }: { config: DocKindConfig }) {
 export function NotesApp({ windowId: _windowId }: { windowId: string }) {
   return <DocsApp config={NOTES_CONFIG} />;
 }
-
-export function TodoApp({ windowId: _windowId }: { windowId: string }) {
-  return <DocsApp config={TODO_CONFIG} />;
-}
diff --git a/desktop/src/apps/TodoApp.test.tsx b/desktop/src/apps/TodoApp.test.tsx
new file mode 100644
index 000000000..dff67d57c
--- /dev/null
+++ b/desktop/src/apps/TodoApp.test.tsx
@@ -0,0 +1,474 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
+import { render, screen, fireEvent, waitFor } from "@testing-library/react";
+import React from "react";
+
+vi.mock("@/components/ui", () => ({
+  Button: ({
+    children,
+    onClick,
+    disabled,
+    ...rest
+  }: React.ButtonHTMLAttributes<HTMLButtonElement> & { children?: React.ReactNode }) => (
+    <button onClick={onClick} disabled={disabled} {...rest}>
+      {children}
+    </button>
+  ),
+}));
+
+import { TodoApp } from "./TodoApp";
+
+// ---- Test data ----
+
+const NOW_TS = Math.floor(Date.now() / 1000);
+
+const TODO_LIST_A = {
+  id: "tl-abc",
+  owner_user_id: "user-1",
+  title: "Groceries",
+  created_at: NOW_TS - 3600,
+  updated_at: NOW_TS - 600,
+  archived_at: null,
+};
+
+const TODO_LIST_B = {
+  id: "tl-def",
+  owner_user_id: "user-1",
+  title: "Work Tasks",
+  created_at: NOW_TS - 7200,
+  updated_at: NOW_TS - 300,
+  archived_at: null,
+};
+
+const TODO_DETAIL = {
+  ...TODO_LIST_A,
+  items: [
+    {
+      id: "ti-1",
+      list_id: "tl-abc",
+      text: "Buy milk",
+      done: false,
+      position: 0,
+      due_at: null,
+      remind_at: null,
+      author: "user-1",
+      created_at: NOW_TS - 300,
+      updated_at: NOW_TS - 300,
+    },
+    {
+      id: "ti-2",
+      list_id: "tl-abc",
+      text: "Get bread",
+      done: false,
+      position: 1,
+      due_at: NOW_TS + 86400, // tomorrow
+      remind_at: null,
+      author: "",
+      created_at: NOW_TS - 200,
+      updated_at: NOW_TS - 200,
+    },
+    {
+      id: "ti-3",
+      list_id: "tl-abc",
+      text: "Pick up laundry",
+      done: false,
+      position: 2,
+      due_at: NOW_TS - 3600, // 1 hour ago — overdue
+      remind_at: null,
+      author: "",
+      created_at: NOW_TS - 100,
+      updated_at: NOW_TS - 50,
+    },
+    {
+      id: "ti-4",
+      list_id: "tl-abc",
+      text: "Already done",
+      done: true,
+      position: 3,
+      due_at: null,
+      remind_at: null,
+      author: "",
+      created_at: NOW_TS - 50,
+      updated_at: NOW_TS - 25,
+    },
+  ],
+};
+
+function makeFetch(overrides: Record<string, unknown> = {}) {
+  return vi.fn(async (url: string, init?: RequestInit) => {
+    const u = String(url);
+    const method = (init?.method ?? "GET").toUpperCase();
+
+    // List lists
+    if (u === "/api/todo" && method === "GET") {
+      return {
+        ok: true,
+        json: async () =>
+          overrides["GET /api/todo"] ?? [TODO_LIST_A, TODO_LIST_B],
+      };
+    }
+
+    // Create list
+    if (u === "/api/todo" && method === "POST") {
+      const created = overrides["POST /api/todo"] ?? {
+        id: "tl-new",
+        owner_user_id: "user-1",
+        title: "New List",
+        created_at: NOW_TS,
+        updated_at: NOW_TS,
+        archived_at: null,
+      };
+      return { ok: true, json: async () => created };
+    }
+
+    // Get list detail
+    if (u === "/api/todo/tl-abc" && method === "GET") {
+      return {
+        ok: true,
+        json: async () => overrides["GET /api/todo/tl-abc"] ?? TODO_DETAIL,
+      };
+    }
+
+    // Add item
+    if (u === "/api/todo/tl-abc/items" && method === "POST") {
+      const body = JSON.parse((init?.body as string) ?? "{}");
+      return {
+        ok: true,
+        json: async () => ({
+          id: "ti-new",
+          list_id: "tl-abc",
+          text: body.text,
+          done: false,
+          position: 3,
+          due_at: null,
+          remind_at: null,
+          author: "",
+          created_at: NOW_TS,
+          updated_at: NOW_TS,
+        }),
+      };
+    }
+
+    // Patch item (toggle done, edit text)
+    if (u.startsWith("/api/todo/tl-abc/items/") && method === "PATCH") {
+      const body = JSON.parse((init?.body as string) ?? "{}");
+      const itemId = u.split("/").pop();
+      return {
+        ok: true,
+        json: async () => ({
+          id: itemId,
+          list_id: "tl-abc",
+          text: body.text ?? "Buy milk",
+          done: body.done ?? false,
+          position: 0,
+          due_at: null,
+          remind_at: null,
+          author: "",
+          created_at: NOW_TS - 300,
+          updated_at: NOW_TS,
+        }),
+      };
+    }
+
+    // Delete item
+    if (u.startsWith("/api/todo/tl-abc/items/") && method === "DELETE") {
+      return { ok: true, json: async () => ({ ok: true }) };
+    }
+
+    // Reorder
+    if (u === "/api/todo/tl-abc/items/reorder" && method === "PUT") {
+      return { ok: true, json: async () => ({ ok: true }) };
+    }
+
+    return { ok: true, json: async () => ({}) };
+  });
+}
+
+describe("TodoApp", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  // ---- List rendering ----
+
+  it("renders the todo lists from GET /api/todo", async () => {
+    global.fetch = makeFetch() as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() => {
+      expect(screen.getByText("Groceries")).toBeDefined();
+      expect(screen.getByText("Work Tasks")).toBeDefined();
+    });
+  });
+
+  it("shows the Todo header and new-list button", async () => {
+    global.fetch = makeFetch() as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() => expect(screen.getByText("Todo")).toBeDefined());
+    expect(screen.getByLabelText("New list")).toBeDefined();
+  });
+
+  it("shows the empty state when there are no lists", async () => {
+    global.fetch = makeFetch({ "GET /api/todo": [] }) as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() =>
+      expect(screen.getByText(/no lists yet/i)).toBeDefined(),
+    );
+    expect(screen.getByText(/create one/i)).toBeDefined();
+  });
+
+  // ---- Create list ----
+
+  it("creates a list via POST /api/todo and shows it", async () => {
+    const fetchMock = makeFetch({
+      "POST /api/todo": {
+        id: "tl-shopping",
+        owner_user_id: "user-1",
+        title: "Shopping",
+        created_at: NOW_TS,
+        updated_at: NOW_TS,
+        archived_at: null,
+      },
+    });
+    global.fetch = fetchMock as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() => expect(screen.getByText("Groceries")).toBeDefined());
+
+    // Open create form
+    fireEvent.click(screen.getByLabelText("New list"));
+    const input = await screen.findByLabelText("New list title");
+    fireEvent.change(input, { target: { value: "Shopping" } });
+    fireEvent.click(screen.getByLabelText("Create list"));
+
+    await waitFor(() => {
+      const postCalls = (
+        fetchMock.mock.calls as [string, RequestInit?][]
+      ).filter(
+        ([u, init]) =>
+          String(u) === "/api/todo" &&
+          (init?.method ?? "GET").toUpperCase() === "POST",
+      );
+      expect(postCalls.length).toBeGreaterThan(0);
+      const body = JSON.parse(postCalls[0]![1]!.body as string);
+      expect(body.title).toBe("Shopping");
+    });
+
+    await waitFor(() => expect(screen.getByText("Shopping")).toBeDefined());
+  });
+
+  // ---- Item display ----
+
+  it("shows items when a list is selected", async () => {
+    global.fetch = makeFetch() as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() => expect(screen.getByText("Groceries")).toBeDefined());
+    fireEvent.click(screen.getByText("Groceries"));
+
+    await waitFor(() => {
+      expect(screen.getByText("Buy milk")).toBeDefined();
+      expect(screen.getByText("Get bread")).toBeDefined();
+    });
+  });
+
+  it("splits incomplete and completed items into sections", async () => {
+    global.fetch = makeFetch() as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() => expect(screen.getByText("Groceries")).toBeDefined());
+    fireEvent.click(screen.getByText("Groceries"));
+
+    await waitFor(() => {
+      expect(screen.getByLabelText("Incomplete tasks")).toBeDefined();
+      expect(screen.getByLabelText("Completed tasks")).toBeDefined();
+      expect(screen.getByText(/completed/i)).toBeDefined();
+    });
+
+    // Completed item should show in completed section
+    const completedSection = screen.getByLabelText("Completed tasks");
+    expect(completedSection).toBeDefined();
+    // "Already done" has done:true — should be in the completed section
+    expect(screen.getByText("Already done")).toBeDefined();
+    // "Pick up laundry" has done:false — should be in the incomplete section
+    const incompleteSection = screen.getByLabelText("Incomplete tasks");
+    expect(incompleteSection.textContent).toContain("Pick up laundry");
+  });
+
+  // ---- Toggle done (optimistic) ----
+
+  it("toggles a task done via PATCH and shows optimistic update", async () => {
+    const fetchMock = makeFetch();
+    global.fetch = fetchMock as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() => expect(screen.getByText("Groceries")).toBeDefined());
+    fireEvent.click(screen.getByText("Groceries"));
+
+    await waitFor(() => expect(screen.getByText("Buy milk")).toBeDefined());
+
+    // Click the checkbox for "Buy milk"
+    const checkboxes = screen.getAllByLabelText("Mark task done");
+    fireEvent.click(checkboxes[0]!);
+
+    await waitFor(() => {
+      const patchCalls = (
+        fetchMock.mock.calls as [string, RequestInit?][]
+      ).filter(
+        ([u, init]) =>
+          String(u).startsWith("/api/todo/tl-abc/items/ti-1") &&
+          (init?.method ?? "GET").toUpperCase() === "PATCH",
+      );
+      expect(patchCalls.length).toBeGreaterThan(0);
+      const body = JSON.parse(patchCalls[0]![1]!.body as string);
+      expect(body.done).toBe(true);
+    });
+  });
+
+  // ---- Delete item ----
+
+  it("deletes an item via DELETE", async () => {
+    const fetchMock = makeFetch();
+    global.fetch = fetchMock as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() => expect(screen.getByText("Groceries")).toBeDefined());
+    fireEvent.click(screen.getByText("Groceries"));
+
+    await waitFor(() => expect(screen.getByText("Buy milk")).toBeDefined());
+
+    // Find delete button (hover-revealed, but still in DOM)
+    const deleteButtons = screen.getAllByLabelText("Delete task");
+    fireEvent.click(deleteButtons[0]!);
+
+    await waitFor(() => {
+      const delCalls = (
+        fetchMock.mock.calls as [string, RequestInit?][]
+      ).filter(
+        ([u, init]) =>
+          String(u).startsWith("/api/todo/tl-abc/items/ti-1") &&
+          (init?.method ?? "GET").toUpperCase() === "DELETE",
+      );
+      expect(delCalls.length).toBeGreaterThan(0);
+    });
+  });
+
+  // ---- Add item ----
+
+  it("adds a new item via POST /items", async () => {
+    const fetchMock = makeFetch();
+    global.fetch = fetchMock as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() => expect(screen.getByText("Groceries")).toBeDefined());
+    fireEvent.click(screen.getByText("Groceries"));
+
+    await waitFor(() => expect(screen.getByText("Buy milk")).toBeDefined());
+
+    const input = screen.getByLabelText("New task text");
+    fireEvent.change(input, { target: { value: "Buy eggs" } });
+    fireEvent.click(screen.getByLabelText("Add task"));
+
+    await waitFor(() => {
+      const postCalls = (
+        fetchMock.mock.calls as [string, RequestInit?][]
+      ).filter(
+        ([u, init]) =>
+          String(u) === "/api/todo/tl-abc/items" &&
+          (init?.method ?? "GET").toUpperCase() === "POST",
+      );
+      expect(postCalls.length).toBeGreaterThan(0);
+      const body = JSON.parse(postCalls[0]![1]!.body as string);
+      expect(body.text).toBe("Buy eggs");
+    });
+  });
+
+  // ---- Due date display + overdue highlighting ----
+
+  it("displays due dates and highlights overdue items", async () => {
+    global.fetch = makeFetch() as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() => expect(screen.getByText("Groceries")).toBeDefined());
+    fireEvent.click(screen.getByText("Groceries"));
+
+    await waitFor(() => {
+      // "Get bread" has a tomorrow due date — should show but not overdue
+      expect(screen.getByText("Get bread")).toBeDefined();
+      // Overdue text indicator for "Pick up laundry" (overdue + done — shows in completed section)
+      expect(screen.getByText(/overdue/i)).toBeDefined();
+    });
+  });
+
+  // ---- Move up/down ----
+
+  it("reorders items via PUT /reorder", async () => {
+    const fetchMock = makeFetch();
+    global.fetch = fetchMock as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() => expect(screen.getByText("Groceries")).toBeDefined());
+    fireEvent.click(screen.getByText("Groceries"));
+
+    await waitFor(() => expect(screen.getByText("Buy milk")).toBeDefined());
+
+    // "Buy milk" is position 0, so move-up should be disabled.
+    // Move it down (to pos 1)
+    const moveDownButtons = screen.getAllByLabelText("Move task down");
+    fireEvent.click(moveDownButtons[0]!);
+
+    await waitFor(() => {
+      const reorderCalls = (
+        fetchMock.mock.calls as [string, RequestInit?][]
+      ).filter(
+        ([u, init]) =>
+          String(u) === "/api/todo/tl-abc/items/reorder" &&
+          (init?.method ?? "GET").toUpperCase() === "PUT",
+      );
+      expect(reorderCalls.length).toBeGreaterThan(0);
+      const body = JSON.parse(reorderCalls[0]![1]!.body as string);
+      expect(body.items).toBeDefined();
+      expect(Array.isArray(body.items)).toBe(true);
+    });
+  });
+
+  // ---- Inline edit ----
+
+  it("edits an item inline via PATCH", async () => {
+    const fetchMock = makeFetch();
+    global.fetch = fetchMock as typeof fetch;
+    render(<TodoApp windowId="w1" />);
+
+    await waitFor(() => expect(screen.getByText("Groceries")).toBeDefined());
+    fireEvent.click(screen.getByText("Groceries"));
+
+    await waitFor(() => expect(screen.getByText("Buy milk")).toBeDefined());
+
+    // Click edit button
+    const editButtons = screen.getAllByLabelText("Edit task");
+    fireEvent.click(editButtons[0]!);
+
+    // Edit the text
+    const textarea = await screen.findByLabelText("Edit task text");
+    fireEvent.change(textarea, { target: { value: "Buy almond milk" } });
+    fireEvent.click(screen.getByLabelText("Save edit"));
+
+    await waitFor(() => {
+      const patchCalls = (
+        fetchMock.mock.calls as [string, RequestInit?][]
+      ).filter(
+        ([u, init]) =>
+          String(u).startsWith("/api/todo/tl-abc/items/ti-1") &&
+          (init?.method ?? "GET").toUpperCase() === "PATCH",
+      );
+      expect(patchCalls.length).toBeGreaterThan(0);
+      const body = JSON.parse(patchCalls[0]![1]!.body as string);
+      expect(body.text).toBe("Buy almond milk");
+    });
+  });
+});
diff --git a/desktop/src/apps/TodoApp.tsx b/desktop/src/apps/TodoApp.tsx
new file mode 100644
index 000000000..2afb0d00f
--- /dev/null
+++ b/desktop/src/apps/TodoApp.tsx
@@ -0,0 +1,875 @@
+import { useState, useEffect, useCallback, useRef } from "react";
+import {
+  ListChecks,
+  Plus,
+  Clock,
+  Square,
+  CheckSquare,
+  ChevronLeft,
+  Pencil,
+  Trash2,
+  Check,
+  X,
+  ChevronUp,
+  ChevronDown,
+  AlertCircle,
+} from "lucide-react";
+import { Button } from "@/components/ui";
+
+// ---- Types ----
+
+interface TodoList {
+  id: string;
+  owner_user_id: string;
+  title: string;
+  created_at: number;
+  updated_at: number;
+  archived_at: number | null;
+}
+
+interface TodoItem {
+  id: string;
+  list_id: string;
+  text: string;
+  done: boolean;
+  position: number;
+  due_at: number | null;
+  remind_at: number | null;
+  author: string;
+  created_at: number;
+  updated_at: number;
+}
+
+interface TodoDetail extends TodoList {
+  items: TodoItem[];
+}
+
+// ---- Helpers ----
+
+function relativeTime(ts: number): string {
+  const diff = Date.now() - ts * 1000;
+  const mins = Math.floor(diff / 60_000);
+  if (mins < 1) return "just now";
+  if (mins < 60) return `${mins}m ago`;
+  const hrs = Math.floor(mins / 60);
+  if (hrs < 24) return `${hrs}h ago`;
+  const days = Math.floor(hrs / 24);
+  return `${days}d ago`;
+}
+
+function formatDueDate(ts: number): string {
+  const d = new Date(ts * 1000);
+  const now = new Date();
+  const isToday =
+    d.getFullYear() === now.getFullYear() &&
+    d.getMonth() === now.getMonth() &&
+    d.getDate() === now.getDate();
+  const tomorrow = new Date(now);
+  tomorrow.setDate(tomorrow.getDate() + 1);
+  const isTomorrow =
+    d.getFullYear() === tomorrow.getFullYear() &&
+    d.getMonth() === tomorrow.getMonth() &&
+    d.getDate() === tomorrow.getDate();
+
+  const time = d.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
+  if (isToday) return `Today ${time}`;
+  if (isTomorrow) return `Tomorrow ${time}`;
+  return d.toLocaleDateString([], {
+    month: "short",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit",
+  });
+}
+
+function isOverdue(ts: number): boolean {
+  return ts * 1000 < Date.now();
+}
+
+// ---- TodoItemRow ----
+
+function TodoItemRow({
+  item,
+  sectionItems,
+  onToggleDone,
+  onEditSave,
+  onDelete,
+  onMove,
+}: {
+  item: TodoItem;
+  sectionItems: TodoItem[];
+  onToggleDone: (id: string, done: boolean) => void;
+  onEditSave: (id: string, text: string) => Promise<void>;
+  onDelete: (id: string) => void;
+  onMove: (id: string, direction: -1 | 1) => void;
+}) {
+  const [editing, setEditing] = useState(false);
+  const [draft, setDraft] = useState(item.text);
+  const [saving, setSaving] = useState(false);
+  const [saveError, setSaveError] = useState<string | null>(null);
+
+  async function save() {
+    if (!draft.trim() || draft === item.text) {
+      setEditing(false);
+      return;
+    }
+    setSaving(true);
+    setSaveError(null);
+    try {
+      await onEditSave(item.id, draft.trim());
+      setEditing(false);
+    } catch (e) {
+      setSaveError(
+        e instanceof Error ? e.message : "Could not save the edit.",
+      );
+    } finally {
+      setSaving(false);
+    }
+  }
+
+  const overdue = item.due_at && isOverdue(item.due_at) && !item.done;
+  const sectionIdx = sectionItems.findIndex((i) => i.id === item.id);
+
+  return (
+    <li className="group flex flex-col gap-1">
+      <div
+        className={[
+          "flex items-start gap-2 rounded-lg border px-3 py-2.5",
+          overdue
+            ? "border-red-500/30 bg-red-500/5"
+            : "border-shell-border bg-shell-surface",
+        ].join(" ")}
+      >
+        {editing ? (
+          <div className="flex flex-1 flex-col gap-2">
+            <textarea
+              value={draft}
+              onChange={(e) => setDraft(e.target.value)}
+              rows={2}
+              maxLength={20000}
+              aria-label="Edit task text"
+              autoFocus
+              className="resize-none rounded-lg border border-shell-border bg-shell-bg-deep px-3 py-2 text-sm text-shell-text placeholder:text-shell-text-tertiary focus:outline-none focus:ring-2 focus:ring-accent/40"
+            />
+            <div className="flex justify-end gap-2">
+              <Button
+                type="button"
+                variant="ghost"
+                size="sm"
+                onClick={() => {
+                  setDraft(item.text);
+                  setSaveError(null);
+                  setEditing(false);
+                }}
+                disabled={saving}
+                aria-label="Cancel edit"
+              >
+                <X size={13} />
+                Cancel
+              </Button>
+              <Button
+                type="button"
+                size="sm"
+                onClick={save}
+                disabled={saving || !draft.trim()}
+                aria-label="Save edit"
+              >
+                <Check size={13} />
+                {saving ? "Saving..." : "Save"}
+              </Button>
+            </div>
+            {saveError && (
+              <p className="text-xs text-red-400" role="alert">
+                {saveError}
+              </p>
+            )}
+          </div>
+        ) : (
+          <>
+            {/* Checkbox */}
+            <button
+              type="button"
+              onClick={() => onToggleDone(item.id, !item.done)}
+              aria-label={item.done ? "Mark task not done" : "Mark task done"}
+              aria-pressed={item.done}
+              className="mt-0.5 shrink-0 text-shell-text-tertiary transition-colors hover:text-accent"
+            >
+              {item.done ? (
+                <CheckSquare size={16} className="text-accent" />
+              ) : (
+                <Square size={16} />
+              )}
+            </button>
+
+            {/* Text + due date */}
+            <div className="min-w-0 flex-1">
+              <p
+                className={[
+                  "whitespace-pre-wrap text-sm",
+                  item.done
+                    ? "text-shell-text-tertiary line-through"
+                    : "text-shell-text",
+                ].join(" ")}
+              >
+                {item.text}
+              </p>
+              {item.due_at && (
+                <span
+                  className={[
+                    "mt-0.5 inline-flex items-center gap-1 text-xs",
+                    overdue
+                      ? "font-medium text-red-400"
+                      : "text-shell-text-tertiary",
+                  ].join(" ")}
+                >
+                  <Clock size={10} className="shrink-0" />
+                  {formatDueDate(item.due_at)}
+                  {overdue && " · Overdue"}
+                </span>
+              )}
+            </div>
+
+            {/* Action buttons (visible on hover) */}
+            <div className="flex shrink-0 items-center gap-0.5 opacity-0 transition-opacity group-hover:opacity-100 focus-within:opacity-100">
+              {/* Move up */}
+              <button
+                type="button"
+                onClick={() => onMove(item.id, -1)}
+                disabled={sectionIdx <= 0}
+                aria-label="Move task up"
+                className="rounded p-1 text-shell-text-tertiary transition-colors hover:text-shell-text disabled:opacity-30"
+              >
+                <ChevronUp size={14} />
+              </button>
+              {/* Move down */}
+              <button
+                type="button"
+                onClick={() => onMove(item.id, 1)}
+                disabled={sectionIdx < 0 || sectionIdx >= sectionItems.length - 1}
+                aria-label="Move task down"
+                className="rounded p-1 text-shell-text-tertiary transition-colors hover:text-shell-text disabled:opacity-30"
+              >
+                <ChevronDown size={14} />
+              </button>
+              {/* Edit */}
+              <button
+                type="button"
+                onClick={() => setEditing(true)}
+                aria-label="Edit task"
+                className="rounded-md p-1 text-shell-text-tertiary transition-colors hover:text-shell-text"
+              >
+                <Pencil size={14} />
+              </button>
+              {/* Delete */}
+              <button
+                type="button"
+                onClick={() => onDelete(item.id)}
+                aria-label="Delete task"
+                className="rounded-md p-1 text-shell-text-tertiary transition-colors hover:text-red-400"
+              >
+                <Trash2 size={14} />
+              </button>
+            </div>
+          </>
+        )}
+      </div>
+      {item.author && (
+        <span className="pl-1 text-[11px] text-shell-text-tertiary">
+          {item.author} · {relativeTime(item.created_at)}
+        </span>
+      )}
+    </li>
+  );
+}
+
+// ---- TodoDetailPane ----
+
+function TodoDetailPane({
+  listId,
+  onBack,
+}: {
+  listId: string;
+  onBack: () => void;
+}) {
+  const [doc, setDoc] = useState<TodoDetail | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [newText, setNewText] = useState("");
+  const [adding, setAdding] = useState(false);
+  const pendingToggles = useRef<Set<string>>(new Set());
+
+  const loadReqRef = useRef(0);
+  const loadDoc = useCallback(async () => {
+    const myReq = ++loadReqRef.current;
+    try {
+      const r = await fetch(`/api/todo/${listId}`);
+      if (!r.ok) throw new Error("Could not load list.");
+      const raw = await r.json();
+      const data: TodoDetail = {
+        ...raw,
+        items: Array.isArray(raw.items) ? raw.items : [],
+      };
+      if (loadReqRef.current === myReq) setDoc(data);
+    } catch (e) {
+      if (loadReqRef.current === myReq)
+        setError(e instanceof Error ? e.message : "Could not load list.");
+    } finally {
+      if (loadReqRef.current === myReq) setLoading(false);
+    }
+  }, [listId]);
+
+  useEffect(() => {
+    setLoading(true);
+    setError(null);
+    setDoc(null);
+    loadDoc();
+  }, [loadDoc]);
+
+  async function addItem() {
+    if (!newText.trim() || !doc || adding) return;
+    setAdding(true);
+    try {
+      const r = await fetch(`/api/todo/${doc.id}/items`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ text: newText.trim() }),
+      });
+      if (!r.ok) throw new Error("Could not add task.");
+      setNewText("");
+      await loadDoc();
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Could not add task.");
+    } finally {
+      setAdding(false);
+    }
+  }
+
+  async function deleteItem(itemId: string) {
+    if (!doc) return;
+    try {
+      const r = await fetch(`/api/todo/${doc.id}/items/${itemId}`, {
+        method: "DELETE",
+      });
+      if (!r.ok) throw new Error("Could not delete task.");
+      setDoc((prev) =>
+        prev
+          ? { ...prev, items: prev.items.filter((i) => i.id !== itemId) }
+          : prev,
+      );
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Could not delete task.");
+    }
+  }
+
+  async function editItem(itemId: string, text: string) {
+    if (!doc) return;
+    const r = await fetch(`/api/todo/${doc.id}/items/${itemId}`, {
+      method: "PATCH",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ text }),
+    });
+    if (!r.ok) throw new Error("Could not edit task.");
+    setDoc((prev) =>
+      prev
+        ? {
+            ...prev,
+            items: prev.items.map((i) =>
+              i.id === itemId ? { ...i, text } : i,
+            ),
+          }
+        : prev,
+    );
+  }
+
+  async function toggleDone(itemId: string, done: boolean) {
+    if (!doc || pendingToggles.current.has(itemId)) return;
+    pendingToggles.current.add(itemId);
+    // Optimistic update
+    setDoc((prev) =>
+      prev
+        ? {
+            ...prev,
+            items: prev.items.map((i) =>
+              i.id === itemId ? { ...i, done } : i,
+            ),
+          }
+        : prev,
+    );
+    try {
+      const r = await fetch(`/api/todo/${doc.id}/items/${itemId}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ done }),
+      });
+      if (!r.ok) throw new Error("Could not update task.");
+    } catch (e) {
+      // Revert on failure
+      setDoc((prev) =>
+        prev
+          ? {
+              ...prev,
+              items: prev.items.map((i) =>
+                i.id === itemId ? { ...i, done: !done } : i,
+              ),
+            }
+          : prev,
+      );
+      setError(e instanceof Error ? e.message : "Could not update task.");
+    } finally {
+      pendingToggles.current.delete(itemId);
+    }
+  }
+
+  async function moveItem(itemId: string, direction: -1 | 1, sectionItems: TodoItem[]) {
+    if (!doc) return;
+    const docItems: TodoItem[] = Array.isArray(doc.items) ? doc.items : [];
+    const sectionIdx = sectionItems.findIndex((i) => i.id === itemId);
+    if (sectionIdx < 0) return;
+    const newSectionIdx = sectionIdx + direction;
+    if (newSectionIdx < 0 || newSectionIdx >= sectionItems.length) return;
+
+    // Swap the two items within the full array by their ids
+    const itemA = sectionItems[sectionIdx]!;
+    const itemB = sectionItems[newSectionIdx]!;
+    const fullIdxA = docItems.findIndex((i) => i.id === itemA.id);
+    const fullIdxB = docItems.findIndex((i) => i.id === itemB.id);
+    if (fullIdxA < 0 || fullIdxB < 0) return;
+
+    const newItems = [...docItems];
+    [newItems[fullIdxA], newItems[fullIdxB]] = [newItems[fullIdxB]!, newItems[fullIdxA]!];
+    const reordered = newItems.map((item, i) => ({
+      ...item,
+      position: i,
+    }));
+
+    // Optimistic update
+    setDoc((prev) => (prev ? { ...prev, items: reordered } : prev));
+
+    try {
+      const r = await fetch(`/api/todo/${doc.id}/items/reorder`, {
+        method: "PUT",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          items: reordered.map((i) => ({ id: i.id, position: i.position })),
+        }),
+      });
+      if (!r.ok) throw new Error("Could not reorder tasks.");
+    } catch (e) {
+      // Revert
+      await loadDoc();
+      setError(e instanceof Error ? e.message : "Could not reorder tasks.");
+    }
+  }
+
+  if (loading) {
+    return (
+      <div className="flex h-full items-center justify-center">
+        <p className="text-sm text-shell-text-tertiary">Loading...</p>
+      </div>
+    );
+  }
+
+  if (!doc) {
+    return (
+      <div className="flex h-full flex-col">
+        <button
+          type="button"
+          onClick={onBack}
+          aria-label="Back to lists"
+          className="flex items-center gap-1 px-4 py-3 text-sm text-shell-text-secondary transition-colors hover:text-shell-text md:hidden"
+        >
+          <ChevronLeft size={16} />
+          Back
+        </button>
+        <div className="flex flex-1 items-center justify-center">
+          <p className="text-sm text-red-400" role="alert">
+            {error ?? "List not found."}
+          </p>
+        </div>
+      </div>
+    );
+  }
+
+  // Separate incomplete and completed items
+  const items: TodoItem[] = Array.isArray(doc.items) ? doc.items : [];
+  const incomplete = items.filter((i) => !i.done);
+  const complete = items.filter((i) => i.done);
+
+  return (
+    <div className="flex h-full flex-col overflow-hidden">
+      {/* Header */}
+      <div className="flex items-center gap-2 border-b border-shell-border px-4 py-3">
+        <button
+          type="button"
+          onClick={onBack}
+          aria-label="Back to lists"
+          className="flex items-center gap-1 rounded-md text-shell-text-secondary transition-colors hover:text-shell-text md:hidden"
+        >
+          <ChevronLeft size={16} />
+        </button>
+        <h2 className="flex-1 truncate text-sm font-semibold text-shell-text">
+          {doc.title}
+        </h2>
+      </div>
+
+      {/* Body */}
+      <div className="flex-1 overflow-y-auto px-4 py-4">
+        <div className="flex flex-col gap-4">
+          {/* Error banner */}
+          {error && (
+            <div
+              className="flex items-center gap-2 rounded-lg border border-red-500/20 bg-red-500/10 px-3 py-2 text-xs text-red-400"
+              role="alert"
+            >
+              <AlertCircle size={13} className="shrink-0" />
+              {error}
+            </div>
+          )}
+
+          {/* Add task input */}
+          <div className="flex gap-2">
+            <input
+              type="text"
+              value={newText}
+              onChange={(e) => setNewText(e.target.value)}
+              placeholder="Add a task..."
+              aria-label="New task text"
+              maxLength={20000}
+              onKeyDown={(e) => {
+                if (e.key === "Enter") {
+                  e.preventDefault();
+                  void addItem();
+                }
+              }}
+              className="flex-1 rounded-lg border border-shell-border bg-shell-surface px-3 py-2 text-sm text-shell-text placeholder:text-shell-text-tertiary focus:outline-none focus:ring-2 focus:ring-accent/40"
+            />
+            <Button
+              type="button"
+              size="sm"
+              onClick={addItem}
+              disabled={adding || !newText.trim()}
+              aria-label="Add task"
+            >
+              <Plus size={13} />
+              {adding ? "Adding..." : "Add"}
+            </Button>
+          </div>
+
+          {/* Incomplete items */}
+          {incomplete.length > 0 && (
+            <ul className="flex flex-col gap-2" aria-label="Incomplete tasks">
+              {incomplete.map((item) => (
+                <TodoItemRow
+                  key={item.id}
+                  item={item}
+                  sectionItems={incomplete}
+                  onToggleDone={toggleDone}
+                  onEditSave={editItem}
+                  onDelete={deleteItem}
+                  onMove={(id, dir) => moveItem(id, dir, incomplete)}
+                />
+              ))}
+            </ul>
+          )}
+
+          {/* Completed items (collapsed by default) */}
+          {complete.length > 0 && (
+            <div className="flex flex-col gap-2">
+              <p className="text-xs font-medium text-shell-text-tertiary">
+                Completed ({complete.length})
+              </p>
+              <ul className="flex flex-col gap-2" aria-label="Completed tasks">
+                {complete.map((item) => (
+                  <TodoItemRow
+                    key={item.id}
+                    item={item}
+                    sectionItems={complete}
+                    onToggleDone={toggleDone}
+                    onEditSave={editItem}
+                    onDelete={deleteItem}
+                    onMove={(id, dir) => moveItem(id, dir, complete)}
+                  />
+                ))}
+              </ul>
+            </div>
+          )}
+
+          {/* Empty state */}
+          {items.length === 0 && (
+            <div className="flex flex-col items-center gap-2 py-10 text-center">
+              <ListChecks size={28} className="text-shell-text-tertiary" />
+              <p className="text-sm text-shell-text-secondary">
+                Nothing here yet. Add your first task above.
+              </p>
+            </div>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+}
+
+// ---- TodoListItem ----
+
+function TodoListItem({
+  list,
+  selected,
+  onClick,
+}: {
+  list: TodoList;
+  selected: boolean;
+  onClick: () => void;
+}) {
+  return (
+    <li>
+      <button
+        type="button"
+        onClick={onClick}
+        aria-selected={selected}
+        className={[
+          "flex w-full flex-col gap-1 rounded-xl border px-3.5 py-3 text-left transition-colors",
+          selected
+            ? "border-accent bg-accent/10"
+            : "border-shell-border bg-shell-surface hover:border-shell-border-strong",
+        ].join(" ")}
+      >
+        <span className="truncate text-sm font-medium text-shell-text">
+          {list.title}
+        </span>
+        <span className="flex items-center gap-1 text-xs text-shell-text-tertiary">
+          <Clock size={10} className="shrink-0" />
+          {relativeTime(list.updated_at)}
+        </span>
+      </button>
+    </li>
+  );
+}
+
+// ---- CreateTodoForm ----
+
+function CreateTodoForm({
+  onCreated,
+  onCancel,
+}: {
+  onCreated: (list: TodoList) => void;
+  onCancel: () => void;
+}) {
+  const [title, setTitle] = useState("");
+  const [creating, setCreating] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const inputRef = useRef<HTMLInputElement>(null);
+
+  useEffect(() => {
+    inputRef.current?.focus();
+  }, []);
+
+  async function create() {
+    if (!title.trim() || creating) return;
+    setCreating(true);
+    setError(null);
+    try {
+      const r = await fetch("/api/todo", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ title: title.trim() }),
+      });
+      if (!r.ok) throw new Error("Could not create list.");
+      const doc: TodoList = await r.json();
+      setCreating(false);
+      onCreated(doc);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Could not create list.");
+      setCreating(false);
+    }
+  }
+
+  return (
+    <div className="flex flex-col gap-2 rounded-xl border border-shell-border bg-shell-bg-deep p-3">
+      <input
+        ref={inputRef}
+        type="text"
+        value={title}
+        onChange={(e) => setTitle(e.target.value)}
+        placeholder="List title..."
+        aria-label="New list title"
+        maxLength={255}
+        onKeyDown={(e) => {
+          if (e.key === "Enter") {
+            e.preventDefault();
+            void create();
+          }
+          if (e.key === "Escape") onCancel();
+        }}
+        className="w-full rounded-lg border border-shell-border bg-shell-surface px-3 py-2 text-sm text-shell-text placeholder:text-shell-text-tertiary focus:outline-none focus:ring-2 focus:ring-accent/40"
+      />
+      {error && (
+        <p className="text-xs text-red-400" role="alert">
+          {error}
+        </p>
+      )}
+      <div className="flex justify-end gap-2">
+        <Button
+          type="button"
+          variant="ghost"
+          size="sm"
+          onClick={onCancel}
+          disabled={creating}
+          aria-label="Cancel"
+        >
+          Cancel
+        </Button>
+        <Button
+          type="button"
+          size="sm"
+          onClick={create}
+          disabled={creating || !title.trim()}
+          aria-label="Create list"
+        >
+          {creating ? "Creating..." : "Create"}
+        </Button>
+      </div>
+    </div>
+  );
+}
+
+// ---- Main TodoApp ----
+
+export function TodoApp({ windowId: _windowId }: { windowId: string }) {
+  const [lists, setLists] = useState<TodoList[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [listLoadError, setListLoadError] = useState<string | null>(null);
+  const [selectedId, setSelectedId] = useState<string | null>(null);
+  const [showCreate, setShowCreate] = useState(false);
+
+  const loadLists = useCallback(async () => {
+    try {
+      const r = await fetch("/api/todo");
+      if (!r.ok) throw new Error("Could not load lists.");
+      const data: unknown = await r.json();
+      setLists(Array.isArray(data) ? (data as TodoList[]) : []);
+      setListLoadError(null);
+    } catch (e) {
+      setListLoadError(e instanceof Error ? e.message : "Could not load lists.");
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    loadLists();
+  }, [loadLists]);
+
+  function handleCreated(doc: TodoList) {
+    setLists((prev) => [doc, ...prev]);
+    setSelectedId(doc.id);
+    setShowCreate(false);
+  }
+
+  return (
+    <div className="flex h-full overflow-hidden bg-shell-bg">
+      {/* Left pane: list of todo lists */}
+      <div
+        className={[
+          "flex flex-col border-r border-shell-border",
+          selectedId
+            ? "hidden md:flex md:w-72 lg:w-80"
+            : "flex w-full md:w-72 lg:w-80",
+        ].join(" ")}
+      >
+        {/* Header */}
+        <div className="flex items-center gap-2 border-b border-shell-border px-4 py-4">
+          <ListChecks size={17} className="text-accent" />
+          <h1 className="flex-1 text-base font-semibold text-shell-text">
+            Todo
+          </h1>
+          <button
+            type="button"
+            onClick={() => setShowCreate((v) => !v)}
+            aria-label="New list"
+            aria-expanded={showCreate}
+            className={[
+              "flex h-8 w-8 items-center justify-center rounded-lg border transition-colors",
+              showCreate
+                ? "border-accent bg-accent/10 text-accent"
+                : "border-shell-border text-shell-text-secondary hover:border-shell-border-strong hover:text-shell-text",
+            ].join(" ")}
+          >
+            <Plus size={16} />
+          </button>
+        </div>
+
+        {/* Create form */}
+        {showCreate && (
+          <div className="border-b border-shell-border px-3 py-3">
+            <CreateTodoForm
+              onCreated={handleCreated}
+              onCancel={() => setShowCreate(false)}
+            />
+          </div>
+        )}
+
+        {/* List body */}
+        <div className="flex-1 overflow-y-auto px-3 py-3">
+          {loading ? (
+            <p className="text-sm text-shell-text-tertiary">Loading...</p>
+          ) : listLoadError ? (
+            <p className="text-sm text-red-400" role="alert">
+              {listLoadError}
+            </p>
+          ) : lists.length === 0 ? (
+            <div className="flex flex-col items-center gap-2 py-16 text-center">
+              <ListChecks
+                size={28}
+                className="text-shell-text-tertiary"
+              />
+              <p className="text-sm text-shell-text-secondary">
+                No lists yet.
+              </p>
+              <button
+                type="button"
+                onClick={() => setShowCreate(true)}
+                className="text-sm text-accent transition-opacity hover:opacity-80"
+              >
+                Create one
+              </button>
+            </div>
+          ) : (
+            <ul className="flex flex-col gap-2" aria-label="Todo lists">
+              {lists.map((list) => (
+                <TodoListItem
+                  key={list.id}
+                  list={list}
+                  selected={selectedId === list.id}
+                  onClick={() => setSelectedId(list.id)}
+                />
+              ))}
+            </ul>
+          )}
+        </div>
+      </div>
+
+      {/* Right pane: detail */}
+      <div
+        className={[
+          "flex-1 overflow-hidden",
+          selectedId ? "flex flex-col" : "hidden md:flex md:flex-col",
+        ].join(" ")}
+      >
+        {selectedId ? (
+          <TodoDetailPane
+            key={selectedId}
+            listId={selectedId}
+            onBack={() => setSelectedId(null)}
+          />
+        ) : (
+          <div className="flex h-full flex-col items-center justify-center gap-2 text-center">
+            <ListChecks size={32} className="text-shell-text-tertiary" />
+            <p className="text-sm text-shell-text-secondary">
+              Select a list to get started.
+            </p>
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}
diff --git a/desktop/src/apps/__tests__/NotesApp.test.tsx b/desktop/src/apps/__tests__/NotesApp.test.tsx
index 5a4d00e91..48808d30f 100644
--- a/desktop/src/apps/__tests__/NotesApp.test.tsx
+++ b/desktop/src/apps/__tests__/NotesApp.test.tsx
@@ -23,7 +23,7 @@ vi.mock("@/components/ui", () => ({
   ),
 }));
 
-import { NotesApp, TodoApp } from "../NotesApp";
+import { NotesApp } from "../NotesApp";
 
 const NOTE_LIST = [
   { id: "note-1", kind: "note", title: "My First Note", updated_at: new Date().toISOString(), archived_at: null },
@@ -206,79 +206,3 @@ describe("NotesApp", () => {
     });
   });
 });
-
-// ---- Todo (list) variant ----
-
-const MIXED_LIST = [
-  { id: "note-1", kind: "note", title: "My First Note", updated_at: new Date().toISOString(), archived_at: null },
-  { id: "list-1", kind: "list", title: "Groceries", updated_at: new Date().toISOString(), archived_at: null },
-];
-
-const LIST_DETAIL = {
-  id: "list-1",
-  kind: "list",
-  title: "Groceries",
-  updated_at: new Date().toISOString(),
-  entries: [
-    { id: "task-1", text: "Buy milk", done: false, author: null, created_at: new Date().toISOString() },
-  ],
-  members: [],
-};
-
-function makeListFetch() {
-  return vi.fn(async (url: string, init?: RequestInit) => {
-    const u = String(url);
-    const method = (init?.method ?? "GET").toUpperCase();
-
-    if (u === "/api/notes" && method === "GET") {
-      return { ok: true, json: async () => MIXED_LIST };
-    }
-    if (u === "/api/notes/list-1" && method === "GET") {
-      return { ok: true, json: async () => LIST_DETAIL };
-    }
-    if (u.startsWith("/api/notes/list-1/entries/task-1") && method === "PATCH") {
-      return { ok: true, json: async () => ({ ok: true }) };
-    }
-    return { ok: true, json: async () => ({}) };
-  });
-}
-
-describe("TodoApp", () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-  });
-
-  it("shows the Todo header and only list-kind docs", async () => {
-    global.fetch = makeListFetch() as typeof fetch;
-    render(<TodoApp windowId="w1" />);
-
-    await waitFor(() => expect(screen.getByText("Todo")).toBeDefined());
-    // A list doc shows; a note doc is filtered out.
-    await waitFor(() => expect(screen.getByText("Groceries")).toBeDefined());
-    expect(screen.queryByText("My First Note")).toBeNull();
-    expect(screen.getByLabelText("New list")).toBeDefined();
-  });
-
-  it("toggles a task done via PATCH /entries/{id}", async () => {
-    const fetchMock = makeListFetch();
-    global.fetch = fetchMock as typeof fetch;
-    render(<TodoApp windowId="w1" />);
-
-    await waitFor(() => expect(screen.getByText("Groceries")).toBeDefined());
-    fireEvent.click(screen.getByText("Groceries"));
-
-    await waitFor(() => expect(screen.getByText("Buy milk")).toBeDefined());
-    fireEvent.click(screen.getByLabelText("Mark task done"));
-
-    await waitFor(() => {
-      const patch = (fetchMock.mock.calls as [string, RequestInit?][]).filter(
-        ([u, init]) =>
-          String(u) === "/api/notes/list-1/entries/task-1" &&
-          (init?.method ?? "GET").toUpperCase() === "PATCH",
-      );
-      expect(patch.length).toBeGreaterThan(0);
-      const body = JSON.parse(patch[0]![1]!.body as string);
-      expect(body.done).toBe(true);
-    });
-  });
-});
diff --git a/desktop/src/registry/app-registry.ts b/desktop/src/registry/app-registry.ts
index 1d95809a8..a8c8887d4 100644
--- a/desktop/src/registry/app-registry.ts
+++ b/desktop/src/registry/app-registry.ts
@@ -65,7 +65,7 @@ const apps: AppManifest[] = [
   { id: "decisions", name: "Decisions", icon: "inbox", category: "platform", component: () => import("@/apps/DecisionsApp").then((m) => ({ default: m.DecisionsApp })), defaultSize: { w: 640, h: 620 }, minSize: { w: 420, h: 400 }, singleton: true, pinned: false, launchpadOrder: 16.6 },
   { id: "observatory", name: "Observatory", icon: "radar", category: "platform", component: () => import("@/apps/ObservatoryApp").then((m) => ({ default: m.ObservatoryApp })), defaultSize: { w: 620, h: 600 }, minSize: { w: 420, h: 400 }, singleton: true, pinned: false, launchpadOrder: 16.7 },
   { id: "notes", name: "Notes", icon: "sticky-note", category: "platform", component: () => import("@/apps/NotesApp").then((m) => ({ default: m.NotesApp })), defaultSize: { w: 860, h: 620 }, minSize: { w: 520, h: 400 }, singleton: true, pinned: false, launchpadOrder: 16.8 },
-  { id: "todo", name: "Todo", icon: "list-checks", category: "platform", component: () => import("@/apps/NotesApp").then((m) => ({ default: m.TodoApp })), defaultSize: { w: 860, h: 620 }, minSize: { w: 520, h: 400 }, singleton: true, pinned: false, launchpadOrder: 16.85 },
+  { id: "todo", name: "Todo", icon: "list-checks", category: "platform", component: () => import("@/apps/TodoApp").then((m) => ({ default: m.TodoApp })), defaultSize: { w: 860, h: 620 }, minSize: { w: 520, h: 400 }, singleton: true, pinned: false, launchpadOrder: 16.85 },
   { id: "hub", name: "Hub", icon: "users", category: "platform", component: () => import("@/apps/HubApp/HubApp").then((m) => ({ default: m.HubApp })), defaultSize: { w: 760, h: 640 }, minSize: { w: 480, h: 420 }, singleton: true, pinned: false, launchpadOrder: 16.9 },
 
   // OS apps