diff --git a/CHANGELOG.fr.md b/CHANGELOG.fr.md
index 1a34346..7c0ae1c 100644
--- a/CHANGELOG.fr.md
+++ b/CHANGELOG.fr.md
@@ -2,6 +2,10 @@
 
 ## [Non publié]
 
+### Modifié
+
+- Rapports : les trois tableaux de rapport hiérarchiques (Comparaison réel-vs-réel, réel-vs-budget, et Tendances par catégorie) permettent désormais de **replier ou déplier chaque niveau de la hiérarchie de catégories**, plus seulement le premier. Chaque catégorie parente — y compris les intermédiaires — porte son propre chevron ; en déplier une révèle ses enfants directs (eux-mêmes repliés), pour descendre un niveau à la fois. Les tableaux s'ouvrent entièrement repliés (seules les catégories de premier niveau visibles), « Tout déplier » ouvre tous les niveaux d'un coup, et vos choix de repli sont désormais enregistrés **par profil** — dans la base de données du profil, donc détruits avec lui — au lieu du navigateur. Les sous-totaux et les lignes de résultat restent rigoureusement inchangés quel que soit ce que vous repliez (#288).
+
 ## [0.13.0] - 2026-07-12
 
 ### Ajouté
diff --git a/CHANGELOG.md b/CHANGELOG.md
index baa699f..9131ae0 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,10 @@
 
 ## [Unreleased]
 
+### Changed
+
+- Reports: the three hierarchical report tables (real-vs-real Compare, real-vs-budget Compare, and Trends by category) now let you **collapse or expand every level of the category hierarchy**, not just the top level. Every parent category — including the intermediate ones — carries its own chevron; expanding one reveals its direct children (themselves collapsed), so you drill down one level at a time. The tables open fully collapsed (only the top-level categories visible), "Expand all" opens every level at once, and your collapse choices are now saved **per profile** — in the profile's own database, so they are destroyed with the profile — instead of in the browser. Subtotals and result lines stay exactly the same whatever you fold away (#288).
+
 ## [0.13.0] - 2026-07-12
 
 ### Added
diff --git a/src/components/reports/BudgetVsActualTable.tsx b/src/components/reports/BudgetVsActualTable.tsx
index bd8f1b0..2257db5 100644
--- a/src/components/reports/BudgetVsActualTable.tsx
+++ b/src/components/reports/BudgetVsActualTable.tsx
@@ -29,11 +29,11 @@ interface BudgetVsActualTableProps {
 
 const STORAGE_KEY = "subtotals-position";
 
-// Collapse groups keyed by category id; depth mirrors the render logic below
-// (a missing depth is derived from parent_id) so hidden rows are exactly a
-// group's indented descendants.
+// Collapse groups keyed by category id; a row is hidden when any ancestor
+// (walking parent_id) is collapsed, so every parent level is collapsible.
 const BVA_COLLAPSE_ACCESSORS: CollapseAccessors<BudgetVsActualRow> = {
-  keyOf: (row) => String(row.category_id),
+  keyOf: (row) => `p:${row.category_id}`,
+  parentKeyOf: (row) => (row.parent_id != null ? `p:${row.parent_id}` : null),
   depthOf: (row) => row.depth ?? (row.parent_id !== null && !row.is_parent ? 1 : 0),
   isParent: (row) => row.is_parent,
 };
@@ -116,11 +116,12 @@ export default function BudgetVsActualTable({ data }: BudgetVsActualTableProps)
           const depth = row.depth ?? (row.parent_id !== null && !row.is_parent ? 1 : 0);
           const isTopParent = isParent && depth === 0;
           const isIntermediateParent = isParent && depth >= 1;
-          const collapsed = isTopParent && groups.isCollapsed(row);
+          const collapsed = isParent && groups.isCollapsed(row);
           const paddingClass = depth >= 3 ? "pl-20" : depth === 2 ? "pl-14" : depth === 1 ? "pl-8" : "px-3";
           return (
             <tr
               key={`${row.category_id}-${row.is_parent}-${depth}`}
+              aria-level={isParent ? depth + 1 : undefined}
               className={`border-b border-[var(--border)]/50 ${
                 isTopParent ? "bg-[color-mix(in_srgb,var(--muted)_30%,var(--card))] font-semibold" :
                 isIntermediateParent ? "bg-[color-mix(in_srgb,var(--muted)_15%,var(--card))] font-medium" : ""
@@ -133,7 +134,7 @@ export default function BudgetVsActualTable({ data }: BudgetVsActualTableProps)
                     ? `${paddingClass} bg-[color-mix(in_srgb,var(--muted)_15%,var(--card))]`
                     : `${paddingClass} bg-[var(--card)]`
               }`}>
-                {isTopParent ? (
+                {isParent ? (
                   <button
                     type="button"
                     onClick={() => groups.toggle(row)}
@@ -255,7 +256,7 @@ export default function BudgetVsActualTable({ data }: BudgetVsActualTableProps)
         {hasGroups && (
           <button
             type="button"
-            onClick={() => (allExpanded ? groups.collapseAll() : groups.expandAll(data))}
+            onClick={() => (allExpanded ? groups.collapseAll(data) : groups.expandAll(data))}
             className="inline-flex items-center gap-1.5 px-2.5 py-1 rounded-lg text-xs font-medium text-[var(--muted-foreground)] hover:bg-[var(--muted)] transition-colors"
           >
             {allExpanded ? <ChevronsDownUp size={13} /> : <ChevronsUpDown size={13} />}
diff --git a/src/components/reports/CategoryOverTimeTable.tsx b/src/components/reports/CategoryOverTimeTable.tsx
index 42f9fed..fd7d8f2 100644
--- a/src/components/reports/CategoryOverTimeTable.tsx
+++ b/src/components/reports/CategoryOverTimeTable.tsx
@@ -93,12 +93,13 @@ export default function CategoryOverTimeTable({ data }: CategoryOverTimeTablePro
         const depth = row.depth;
         const isTopParent = isParent && depth === 0;
         const isIntermediateParent = isParent && depth >= 1;
-        const collapsed = isTopParent && groups.isCollapsed(row);
+        const collapsed = isParent && groups.isCollapsed(row);
         const paddingClass =
           depth >= 3 ? "pl-20" : depth === 2 ? "pl-14" : depth === 1 ? "pl-8" : "px-3";
         return (
           <tr
             key={`${row.categoryId ?? "uncat"}-${isParent}-${depth}-${row.categoryName}`}
+            aria-level={isParent ? depth + 1 : undefined}
             className={`border-b border-[var(--border)]/50 ${
               isTopParent
                 ? "bg-[color-mix(in_srgb,var(--muted)_30%,var(--card))] font-semibold"
@@ -116,7 +117,7 @@ export default function CategoryOverTimeTable({ data }: CategoryOverTimeTablePro
                     : `${paddingClass} bg-[var(--card)]`
               }`}
             >
-              {isTopParent ? (
+              {isParent ? (
                 <button
                   type="button"
                   onClick={() => groups.toggle(row)}
@@ -211,7 +212,7 @@ export default function CategoryOverTimeTable({ data }: CategoryOverTimeTablePro
         <div className="flex justify-end items-center gap-1 px-3 py-2 border-b border-[var(--border)]">
           <button
             type="button"
-            onClick={() => (allExpanded ? groups.collapseAll() : groups.expandAll(data.tree))}
+            onClick={() => (allExpanded ? groups.collapseAll(data.tree) : groups.expandAll(data.tree))}
             className="inline-flex items-center gap-1.5 px-2.5 py-1 rounded-lg text-xs font-medium text-[var(--muted-foreground)] hover:bg-[var(--muted)] transition-colors"
           >
             {allExpanded ? <ChevronsDownUp size={13} /> : <ChevronsUpDown size={13} />}
diff --git a/src/components/reports/CategoryTable.tsx b/src/components/reports/CategoryTable.tsx
deleted file mode 100644
index c7e653a..0000000
--- a/src/components/reports/CategoryTable.tsx
+++ /dev/null
@@ -1,74 +0,0 @@
-import { useTranslation } from "react-i18next";
-import type { CategoryBreakdownItem } from "../../shared/types";
-
-const cadFormatter = (value: number) =>
-  new Intl.NumberFormat("en-CA", { style: "currency", currency: "CAD", maximumFractionDigits: 0 }).format(value);
-
-interface CategoryTableProps {
-  data: CategoryBreakdownItem[];
-  hiddenCategories?: Set<string>;
-}
-
-export default function CategoryTable({ data, hiddenCategories }: CategoryTableProps) {
-  const { t } = useTranslation();
-
-  const visibleData = hiddenCategories?.size
-    ? data.filter((d) => !hiddenCategories.has(d.category_name))
-    : data;
-
-  if (visibleData.length === 0) {
-    return (
-      <div className="bg-[var(--card)] border border-[var(--border)] rounded-xl p-8 text-center text-[var(--muted-foreground)]">
-        {t("dashboard.noData")}
-      </div>
-    );
-  }
-
-  const grandTotal = visibleData.reduce((sum, row) => sum + row.total, 0);
-
-  return (
-    <div className="bg-[var(--card)] border border-[var(--border)] rounded-xl overflow-hidden">
-      <div className="overflow-x-auto overflow-y-auto" style={{ maxHeight: "calc(100vh - 220px)" }}>
-        <table className="w-full text-sm">
-          <thead className="sticky top-0 z-20">
-            <tr className="border-b border-[var(--border)] bg-[var(--card)]">
-              <th className="text-left px-3 py-2 font-medium text-[var(--muted-foreground)] bg-[var(--card)]">
-                {t("budget.category")}
-              </th>
-              <th className="text-right px-3 py-2 font-medium text-[var(--muted-foreground)] bg-[var(--card)]">
-                {t("common.total")}
-              </th>
-              <th className="text-right px-3 py-2 font-medium text-[var(--muted-foreground)] bg-[var(--card)]">
-                %
-              </th>
-            </tr>
-          </thead>
-          <tbody>
-            {visibleData.map((row) => (
-              <tr key={row.category_id ?? "uncategorized"} className="border-b border-[var(--border)]/50">
-                <td className="px-3 py-1.5">
-                  <span className="flex items-center gap-2">
-                    <span
-                      className="w-2.5 h-2.5 rounded-full shrink-0"
-                      style={{ backgroundColor: row.category_color }}
-                    />
-                    {row.category_name}
-                  </span>
-                </td>
-                <td className="text-right px-3 py-1.5">{cadFormatter(row.total)}</td>
-                <td className="text-right px-3 py-1.5 text-[var(--muted-foreground)]">
-                  {grandTotal !== 0 ? `${((row.total / grandTotal) * 100).toFixed(1)}%` : "—"}
-                </td>
-              </tr>
-            ))}
-            <tr className="border-t-2 border-[var(--border)] font-bold text-sm bg-[var(--muted)]/20">
-              <td className="px-3 py-3">{t("common.total")}</td>
-              <td className="text-right px-3 py-3">{cadFormatter(grandTotal)}</td>
-              <td className="text-right px-3 py-3 text-[var(--muted-foreground)]">100%</td>
-            </tr>
-          </tbody>
-        </table>
-      </div>
-    </div>
-  );
-}
diff --git a/src/components/reports/ComparePeriodTable.tsx b/src/components/reports/ComparePeriodTable.tsx
index e77b70c..483371b 100644
--- a/src/components/reports/ComparePeriodTable.tsx
+++ b/src/components/reports/ComparePeriodTable.tsx
@@ -59,10 +59,11 @@ function deltaColor(value: number, higherIsBetter: boolean): string {
 
 const STORAGE_KEY = "compare-subtotals-position";
 
-// Collapse groups keyed by category id; depth/parent mirror the render logic
-// below so the hidden rows are exactly a group's indented descendants.
+// Collapse groups keyed by category id; a row is hidden when any ancestor
+// (walking parent_id) is collapsed, so every parent level is collapsible.
 const COMPARE_COLLAPSE_ACCESSORS: CollapseAccessors<CategoryDelta> = {
-  keyOf: (row) => String(row.categoryId),
+  keyOf: (row) => `p:${row.categoryId}`,
+  parentKeyOf: (row) => (row.parent_id != null ? `p:${row.parent_id}` : null),
   depthOf: (row) => row.depth ?? 0,
   isParent: (row) => row.is_parent ?? false,
 };
@@ -154,12 +155,13 @@ export default function ComparePeriodTable({
           const depth = row.depth ?? 0;
           const isTopParent = isParent && depth === 0;
           const isIntermediateParent = isParent && depth >= 1;
-          const collapsed = isTopParent && groups.isCollapsed(row);
+          const collapsed = isParent && groups.isCollapsed(row);
           const paddingClass =
             depth >= 3 ? "pl-20" : depth === 2 ? "pl-14" : depth === 1 ? "pl-8" : "px-3";
           return (
             <tr
               key={`${row.categoryId ?? "uncat"}-${isParent}-${depth}-${row.categoryName}`}
+              aria-level={isParent ? depth + 1 : undefined}
               className={`border-b border-[var(--border)]/50 ${
                 isTopParent
                   ? "bg-[color-mix(in_srgb,var(--muted)_30%,var(--card))] font-semibold"
@@ -177,7 +179,7 @@ export default function ComparePeriodTable({
                       : `${paddingClass} bg-[var(--card)]`
                 }`}
               >
-                {isTopParent ? (
+                {isParent ? (
                   <button
                     type="button"
                     onClick={() => groups.toggle(row)}
@@ -349,7 +351,7 @@ export default function ComparePeriodTable({
         {hasGroups && (
           <button
             type="button"
-            onClick={() => (allExpanded ? groups.collapseAll() : groups.expandAll(rows))}
+            onClick={() => (allExpanded ? groups.collapseAll(rows) : groups.expandAll(rows))}
             className="inline-flex items-center gap-1.5 px-2.5 py-1 rounded-lg text-xs font-medium text-[var(--muted-foreground)] hover:bg-[var(--muted)] transition-colors"
           >
             {allExpanded ? <ChevronsDownUp size={13} /> : <ChevronsUpDown size={13} />}
diff --git a/src/components/reports/overTimeTableModel.test.ts b/src/components/reports/overTimeTableModel.test.ts
index 04073eb..eae9d05 100644
--- a/src/components/reports/overTimeTableModel.test.ts
+++ b/src/components/reports/overTimeTableModel.test.ts
@@ -45,23 +45,26 @@ function makeData(months: string[], tree: OverTimeRow[]): CategoryOverTimeData {
 
 const MONTHS = ["2025-01", "2025-02"];
 
-// A realistic parent-first depth-first tree (income → expense → transfer):
+// A realistic parent-first depth-first tree, three levels deep on the expense
+// side (income → expense → transfer):
 //   Revenus (parent, id 1)
-//     Paie      (leaf, id 11)
-//     Bonus     (leaf, id 12)
+//     Paie          (leaf, id 11)
+//     Bonus         (leaf, id 12)
 //   Dépenses (parent, id 2)
-//     Épicerie  (leaf, id 21)
-//     Resto     (leaf, id 22)
-//   Loyer     (top-level leaf, id 23)
-//   Épargne   (transfer leaf, id 3)
+//     Alimentation  (INTERMEDIATE parent, id 20)
+//       Épicerie    (leaf, id 21)
+//       Resto       (leaf, id 22)
+//   Loyer           (top-level leaf, id 23)
+//   Épargne         (transfer leaf, id 3)
 function buildTree(): OverTimeRow[] {
   return [
     mkRow(1, "Revenus", [3000, 3500], "income", { is_parent: true, depth: 0 }),
     mkRow(11, "Paie", [3000, 3000], "income", { parent_id: 1, depth: 1 }),
     mkRow(12, "Bonus", [0, 500], "income", { parent_id: 1, depth: 1 }),
     mkRow(2, "Dépenses", [500, 800], "expense", { is_parent: true, depth: 0 }),
-    mkRow(21, "Épicerie", [400, 600], "expense", { parent_id: 2, depth: 1 }),
-    mkRow(22, "Resto", [100, 200], "expense", { parent_id: 2, depth: 1 }),
+    mkRow(20, "Alimentation", [500, 800], "expense", { is_parent: true, parent_id: 2, depth: 1 }),
+    mkRow(21, "Épicerie", [400, 600], "expense", { parent_id: 20, depth: 2 }),
+    mkRow(22, "Resto", [100, 200], "expense", { parent_id: 20, depth: 2 }),
     mkRow(23, "Loyer", [1000, 1000], "expense", { depth: 0 }),
     mkRow(3, "Épargne", [200, 200], "transfer", { depth: 0 }),
   ];
@@ -70,6 +73,7 @@ function buildTree(): OverTimeRow[] {
 const acc = OVERTIME_COLLAPSE_ACCESSORS;
 /** Mirrors the hook: a group is collapsed unless its key is in the expanded set. */
 const isCollapsed = (expanded: Set<string>) => (row: OverTimeRow) => !expanded.has(acc.keyOf(row));
+const names = (rows: OverTimeRow[]) => rows.map((r) => r.categoryName);
 
 describe("overTimeTableModel — storage key", () => {
   it("uses a trends-specific key, distinct from the comparable tables", () => {
@@ -79,13 +83,18 @@ describe("overTimeTableModel — storage key", () => {
 });
 
 describe("overTimeTableModel — collapse accessors", () => {
-  it("keys by category id and reads the snake_case hierarchy block", () => {
-    const parent = buildTree()[0];
-    const leaf = buildTree()[1];
-    expect(acc.keyOf(parent)).toBe("1");
-    expect(acc.depthOf(leaf)).toBe(1);
-    expect(acc.isParent(parent)).toBe(true);
-    expect(acc.isParent(leaf)).toBe(false);
+  it("keys parents/leaves injectively (p:<id>) and climbs parent_id", () => {
+    const revenus = buildTree()[0]; // parent
+    const paie = buildTree()[1]; // leaf under Revenus
+    const alimentation = buildTree()[4]; // intermediate parent
+    expect(acc.keyOf(revenus)).toBe("p:1");
+    expect(acc.parentKeyOf(revenus)).toBeNull(); // root
+    expect(acc.parentKeyOf(paie)).toBe("p:1"); // climbs to Revenus
+    expect(acc.parentKeyOf(alimentation)).toBe("p:2"); // climbs to Dépenses
+    expect(acc.depthOf(paie)).toBe(1);
+    expect(acc.isParent(revenus)).toBe(true);
+    expect(acc.isParent(paie)).toBe(false);
+    expect(acc.isParent(alimentation)).toBe(true);
   });
 });
 
@@ -101,12 +110,14 @@ describe("overTimeTableModel.groupOverTimeSections", () => {
 
     // Full hierarchy: the parent row is present (unlike the leaves-only reducer sections).
     const income = nonTransferSections.find((s) => s.type === "income")!;
-    expect(income.rows.map((r) => r.categoryName)).toEqual(["Revenus", "Paie", "Bonus"]);
+    expect(names(income.rows)).toEqual(["Revenus", "Paie", "Bonus"]);
     expect(income.rows[0].is_parent).toBe(true);
 
+    // Expense carries the intermediate parent (Alimentation) too, parent-first.
     const expense = nonTransferSections.find((s) => s.type === "expense")!;
-    expect(expense.rows.map((r) => r.categoryName)).toEqual([
+    expect(names(expense.rows)).toEqual([
       "Dépenses",
+      "Alimentation",
       "Épicerie",
       "Resto",
       "Loyer",
@@ -114,7 +125,7 @@ describe("overTimeTableModel.groupOverTimeSections", () => {
     expect(transferSection?.rows.map((r) => r.categoryName)).toEqual(["Épargne"]);
   });
 
-  it("keeps subtotals as the reducer's leaf sums — a parent is never double-counted", () => {
+  it("keeps subtotals as the reducer's leaf sums — parents (incl. intermediate) are never double-counted", () => {
     const data = makeData(MONTHS, buildTree());
     const analysis = computeOverTimeResults(data);
     const { nonTransferSections } = groupOverTimeSections(analysis, data.tree);
@@ -125,7 +136,8 @@ describe("overTimeTableModel.groupOverTimeSections", () => {
     expect(income.monthly).toEqual({ "2025-01": 3000, "2025-02": 3500 });
 
     const expense = nonTransferSections.find((s) => s.type === "expense")!;
-    // Épicerie 1000 + Resto 300 + Loyer 2000 = 3300 (Dépenses parent excluded).
+    // Épicerie 1000 + Resto 300 + Loyer 2000 = 3300 (Dépenses AND Alimentation
+    // parents excluded, even though Alimentation carries a [500,800] series).
     expect(expense.total).toBe(3300);
   });
 
@@ -148,12 +160,13 @@ describe("overTimeTableModel — collapse behaviour (via visibleRows)", () => {
     const income = nonTransferSections.find((s) => s.type === "income")!;
     const visIncome = visibleRows(income.rows, acc, isCollapsed(new Set()));
     // Revenus stays (its own subtotal row); Paie/Bonus are folded away.
-    expect(visIncome.map((r) => r.categoryName)).toEqual(["Revenus"]);
+    expect(names(visIncome)).toEqual(["Revenus"]);
 
     const expense = nonTransferSections.find((s) => s.type === "expense")!;
     const visExpense = visibleRows(expense.rows, acc, isCollapsed(new Set()));
-    // Dépenses folds its children; the top-level leaf Loyer always stays.
-    expect(visExpense.map((r) => r.categoryName)).toEqual(["Dépenses", "Loyer"]);
+    // Dépenses folds its whole subtree (Alimentation + its leaves); the top-level
+    // leaf Loyer always stays.
+    expect(names(visExpense)).toEqual(["Dépenses", "Loyer"]);
   });
 
   it("reveals Paie (revenue) under Revenus once its group is expanded", () => {
@@ -161,28 +174,55 @@ describe("overTimeTableModel — collapse behaviour (via visibleRows)", () => {
     const { nonTransferSections } = groupOverTimeSections(computeOverTimeResults(data), data.tree);
     const income = nonTransferSections.find((s) => s.type === "income")!;
 
-    const visible = visibleRows(income.rows, acc, isCollapsed(new Set(["1"])));
-    expect(visible.map((r) => r.categoryName)).toEqual(["Revenus", "Paie", "Bonus"]);
+    const visible = visibleRows(income.rows, acc, isCollapsed(new Set(["p:1"])));
+    expect(names(visible)).toEqual(["Revenus", "Paie", "Bonus"]);
     expect(visible.some((r) => r.categoryName === "Paie")).toBe(true);
   });
 
+  it("cascades across three levels: a root reveals only its direct child parent, not the leaves", () => {
+    const data = makeData(MONTHS, buildTree());
+    const { nonTransferSections } = groupOverTimeSections(computeOverTimeResults(data), data.tree);
+    const expense = nonTransferSections.find((s) => s.type === "expense")!;
+
+    // Expand Dépenses only: Alimentation (direct child) shows, Loyer stays, but
+    // Épicerie/Resto (grandchildren under the still-collapsed Alimentation) do NOT.
+    const rootOnly = visibleRows(expense.rows, acc, isCollapsed(new Set(["p:2"])));
+    expect(names(rootOnly)).toEqual(["Dépenses", "Alimentation", "Loyer"]);
+
+    // Expand Dépenses AND Alimentation: the leaves finally appear.
+    const bothOpen = visibleRows(expense.rows, acc, isCollapsed(new Set(["p:2", "p:20"])));
+    expect(names(bothOpen)).toEqual(["Dépenses", "Alimentation", "Épicerie", "Resto", "Loyer"]);
+
+    // Expand the intermediate but NOT the root: a collapsed ancestor wins, nothing
+    // under Dépenses is revealed.
+    const intermediateOnly = visibleRows(expense.rows, acc, isCollapsed(new Set(["p:20"])));
+    expect(names(intermediateOnly)).toEqual(["Dépenses", "Loyer"]);
+  });
+
   it("collapse is purely visual: subtotals, before-transfers and net are unchanged", () => {
     const data = makeData(MONTHS, buildTree());
     const analysis = computeOverTimeResults(data);
     const { nonTransferSections } = groupOverTimeSections(analysis, data.tree);
     const income = nonTransferSections.find((s) => s.type === "income")!;
+    const expense = nonTransferSections.find((s) => s.type === "expense")!;
 
     // Figures come from the raw tree (never the visible rows), so they hold in
     // every collapse state.
     expect(analysis.beforeTransfers.total).toBe(3200); // 6500 income − 3300 expense
     expect(analysis.net.total).toBe(3600); // 3200 + 400 transfer
     expect(income.total).toBe(6500);
+    expect(expense.total).toBe(3300);
 
     // Folding vs expanding a group only changes how many rows are visible.
     const collapsed = visibleRows(income.rows, acc, isCollapsed(new Set()));
-    const expanded = visibleRows(income.rows, acc, isCollapsed(new Set(["1"])));
+    const expanded = visibleRows(income.rows, acc, isCollapsed(new Set(["p:1"])));
     expect(collapsed.length).toBeLessThan(expanded.length);
-    // The subtotal the table shows is identical in both states.
-    expect(income.total).toBe(6500);
+
+    // Expanding the intermediate expense level does not move the section subtotal.
+    const expenseAllOpen = visibleRows(expense.rows, acc, isCollapsed(new Set(["p:2", "p:20"])));
+    expect(expenseAllOpen.length).toBeGreaterThan(
+      visibleRows(expense.rows, acc, isCollapsed(new Set())).length,
+    );
+    expect(expense.total).toBe(3300);
   });
 });
diff --git a/src/components/reports/overTimeTableModel.ts b/src/components/reports/overTimeTableModel.ts
index a0d5cd7..60337fa 100644
--- a/src/components/reports/overTimeTableModel.ts
+++ b/src/components/reports/overTimeTableModel.ts
@@ -10,13 +10,14 @@ import type { OverTimeAnalysis, OverTimeType } from "./overTimeResults";
  */
 
 /**
- * Collapse groups keyed by category id; depth/parent mirror the tree the render
- * indents by, so a collapsed group hides exactly its indented descendants. The
+ * Collapse groups keyed by category id; a row is hidden when any ancestor
+ * (walking parent_id) is collapsed, so every parent level is collapsible. The
  * `OverTimeRow` hierarchy block is snake_case (mirrors `CategoryDelta`), so these
  * accessors compose with `collapsibleRows` / `useCollapsibleGroups` unchanged.
  */
 export const OVERTIME_COLLAPSE_ACCESSORS: CollapseAccessors<OverTimeRow> = {
-  keyOf: (row) => String(row.categoryId),
+  keyOf: (row) => `p:${row.categoryId}`,
+  parentKeyOf: (row) => (row.parent_id != null ? `p:${row.parent_id}` : null),
   depthOf: (row) => row.depth,
   isParent: (row) => row.is_parent,
 };
diff --git a/src/hooks/useCollapsibleGroups.ts b/src/hooks/useCollapsibleGroups.ts
index 8bd58f7..ec1f5b6 100644
--- a/src/hooks/useCollapsibleGroups.ts
+++ b/src/hooks/useCollapsibleGroups.ts
@@ -1,93 +1,133 @@
-import { useCallback, useState } from "react";
+import { useCallback, useEffect, useState } from "react";
 import {
   type CollapseAccessors,
   collapsibleKeys,
+  isCollapsedFor,
   parseStoredExpanded,
   serializeExpanded,
   visibleRows,
 } from "../utils/collapsibleRows";
+import { getPreference, setPreference } from "../services/userPreferenceService";
 
 export interface CollapsibleGroups<T> {
   /** Filters a section's rows down to the ones visible under the current state. */
   visible: (rows: T[]) => T[];
-  /** True when this top-level parent row is collapsed (its children are hidden). */
+  /** True when this parent row is collapsed (its subtree is hidden). */
   isCollapsed: (row: T) => boolean;
   /** Flip one group between collapsed and expanded, then persist. */
   toggle: (row: T) => void;
   /** Expand every collapsible group found in `rows`, then persist. */
   expandAll: (rows: T[]) => void;
-  /** Collapse every group (back to the default), then persist. */
-  collapseAll: () => void;
+  /** Collapse every collapsible group found in `rows`, then persist. */
+  collapseAll: (rows: T[]) => void;
   /** True when `rows` has at least one group and all of them are expanded. */
   allExpanded: (rows: T[]) => boolean;
-  /** Number of collapsible top-level groups in `rows`. */
+  /** Number of collapsible groups (parents, any depth) in `rows`. */
   groupCount: (rows: T[]) => number;
 }
 
 /**
- * Per-report collapse/expand state for the hierarchical comparable tables
- * (issue #254). Groups are collapsed by default (issue #260): the persisted
- * value is the set of *expanded* group keys, so a first-ever visit (empty set)
- * shows every group collapsed with only its subtotal, while any group the user
- * expands is remembered.
+ * Per-report collapse/expand state for the hierarchical tables (issue #254/#265),
+ * generalised to every hierarchy level (issue #288).
  *
- * Persistence uses localStorage, the same synchronous store the sibling
- * "subtotals on top/bottom" toggle already uses in these tables. State is kept
- * per report via a distinct `storageKey`.
+ * The persisted value is the set of keys whose state DIFFERS from the default
+ * (see `isCollapsedFor`), so `defaultExpanded: false` + an empty set = everything
+ * collapsed — the reports' established behaviour — while `defaultExpanded: true`
+ * + an empty set = everything expanded.
+ *
+ * Persistence lives in `user_preferences`, the profile's own SQLite table, so the
+ * state is scoped per profile for free and is destroyed with the profile (no
+ * localStorage residue surviving `deleteProfile` — a privacy-first requirement).
+ * Reads/writes are async; hydration runs in an effect. There is no visible flash
+ * because the default state IS what renders first, and hydration can only reveal
+ * what the user had opened. `storageKey: null` disables persistence entirely
+ * (pure in-memory state, for the category trees).
+ *
+ * The hook stays context-free — it never calls `useProfile()` — because the
+ * `user_preferences` key is already per-profile (it lives in the profile's DB).
  */
 export function useCollapsibleGroups<T>(
-  storageKey: string,
+  storageKey: string | null,
   acc: CollapseAccessors<T>,
+  options?: { defaultExpanded?: boolean },
 ): CollapsibleGroups<T> {
-  const [expanded, setExpanded] = useState<Set<string>>(() =>
-    parseStoredExpanded(
-      typeof localStorage !== "undefined" ? localStorage.getItem(storageKey) : null,
-    ),
-  );
+  const defaultExpanded = options?.defaultExpanded ?? false;
+
+  // Keys whose state differs from the default. Initial = default (empty), then an
+  // effect hydrates from user_preferences when a storageKey is set.
+  const [flipped, setFlipped] = useState<Set<string>>(() => new Set());
+
+  useEffect(() => {
+    if (storageKey === null) {
+      // No persistence: reset to the default state on (re)mount / key change.
+      setFlipped(new Set());
+      return;
+    }
+    let cancelled = false;
+    void getPreference(storageKey)
+      .then((raw) => {
+        if (!cancelled) setFlipped(parseStoredExpanded(raw));
+      })
+      .catch(() => {
+        // Best-effort: a read failure just keeps the default state.
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [storageKey]);
 
   const persist = useCallback(
     (next: Set<string>) => {
-      try {
-        localStorage.setItem(storageKey, serializeExpanded(next));
-      } catch {
-        // Best-effort: a write failure just means the next session falls back
-        // to the collapsed default.
+      setFlipped(next);
+      if (storageKey !== null) {
+        void setPreference(storageKey, serializeExpanded(next)).catch(() => {
+          // Best-effort: a write failure just means the next session falls back
+          // to the default state.
+        });
       }
-      setExpanded(next);
     },
     [storageKey],
   );
 
-  const isCollapsed = useCallback((row: T) => !expanded.has(acc.keyOf(row)), [expanded, acc]);
+  const isCollapsed = useCallback(
+    (row: T) => isCollapsedFor(flipped, acc.keyOf(row), defaultExpanded),
+    [flipped, acc, defaultExpanded],
+  );
 
   const visible = useCallback((rows: T[]) => visibleRows(rows, acc, isCollapsed), [acc, isCollapsed]);
 
   const toggle = useCallback(
     (row: T) => {
       const key = acc.keyOf(row);
-      const next = new Set(expanded);
+      const next = new Set(flipped);
       if (next.has(key)) next.delete(key);
       else next.add(key);
       persist(next);
     },
-    [expanded, acc, persist],
+    [flipped, acc, persist],
   );
 
+  // In `defaultExpanded` polarity the flipped set holds the *collapsed* keys, so
+  // expanding everything means clearing it; collapsing everything means filling
+  // it. The polarity is inverted when the default is collapsed.
   const expandAll = useCallback(
-    (rows: T[]) => persist(new Set(collapsibleKeys(rows, acc))),
-    [acc, persist],
+    (rows: T[]) => persist(defaultExpanded ? new Set() : new Set(collapsibleKeys(rows, acc))),
+    [acc, persist, defaultExpanded],
   );
 
-  const collapseAll = useCallback(() => persist(new Set()), [persist]);
+  const collapseAll = useCallback(
+    (rows: T[]) => persist(defaultExpanded ? new Set(collapsibleKeys(rows, acc)) : new Set()),
+    [acc, persist, defaultExpanded],
+  );
 
   const groupCount = useCallback((rows: T[]) => collapsibleKeys(rows, acc).length, [acc]);
 
   const allExpanded = useCallback(
     (rows: T[]) => {
       const keys = collapsibleKeys(rows, acc);
-      return keys.length > 0 && keys.every((k) => expanded.has(k));
+      return keys.length > 0 && keys.every((k) => !isCollapsedFor(flipped, k, defaultExpanded));
     },
-    [expanded, acc],
+    [flipped, acc, defaultExpanded],
   );
 
   return { visible, isCollapsed, toggle, expandAll, collapseAll, allExpanded, groupCount };
diff --git a/src/utils/collapsibleRows.test.ts b/src/utils/collapsibleRows.test.ts
index d3cc4a7..cd30aed 100644
--- a/src/utils/collapsibleRows.test.ts
+++ b/src/utils/collapsibleRows.test.ts
@@ -1,102 +1,234 @@
 import { describe, it, expect } from "vitest";
 import {
   type CollapseAccessors,
+  MAX_TREE_DEPTH,
   collapsibleKeys,
+  isCollapsedFor,
   parseStoredExpanded,
   serializeExpanded,
   visibleRows,
 } from "./collapsibleRows";
+import { reorderRows } from "./reorderRows";
 
-/** Tiny hierarchy row for the tests: key, depth, is-parent. */
+/** Tiny hierarchy row: id, parent id, is-parent flag, indentation depth. */
 interface Row {
-  k: string;
-  d: number;
-  p: boolean;
+  id: number;
+  parent: number | null;
+  is_parent: boolean;
+  depth: number;
 }
 
 const acc: CollapseAccessors<Row> = {
-  keyOf: (r) => r.k,
-  depthOf: (r) => r.d,
-  isParent: (r) => r.p,
+  keyOf: (r) => `p:${r.id}`,
+  parentKeyOf: (r) => (r.parent === null ? null : `p:${r.parent}`),
+  isParent: (r) => r.is_parent,
+  depthOf: (r) => r.depth,
 };
 
-const row = (k: string, d: number, p: boolean): Row => ({ k, d, p });
+const r = (id: number, parent: number | null, is_parent: boolean, depth: number): Row => ({
+  id,
+  parent,
+  is_parent,
+  depth,
+});
 
-// A two-group tree with one nested sub-group:
-//   Housing (parent, d0)
-//     Rent (leaf, d1)
-//     Utilities (parent, d1)        <- intermediate parent
-//       Power (leaf, d2)
-//   Salary (parent, d0)
-//     Paycheck (leaf, d1)
-//   Misc (leaf, d0)                 <- top-level leaf, not a group
-const tree: Row[] = [
-  row("housing", 0, true),
-  row("rent", 1, false),
-  row("utilities", 1, true),
-  row("power", 2, false),
-  row("salary", 0, true),
-  row("paycheck", 1, false),
-  row("misc", 0, false),
+// A three-level tree (income → expense → transfer shape is irrelevant here; the
+// point is the depth):
+//   Housing (parent, id 1)
+//     Rent (leaf, id 11)
+//     Utilities (INTERMEDIATE parent, id 12)
+//       Power (leaf, id 121)
+//       Water (leaf, id 122)
+//   Salary (parent, id 2)
+//     Paycheck (leaf, id 21)
+//   Misc (top-level leaf, id 3)
+const dfsTree: Row[] = [
+  r(1, null, true, 0), // Housing
+  r(11, 1, false, 1), // Rent
+  r(12, 1, true, 1), // Utilities (intermediate)
+  r(121, 12, false, 2), // Power
+  r(122, 12, false, 2), // Water
+  r(2, null, true, 0), // Salary
+  r(21, 2, false, 1), // Paycheck
+  r(3, null, false, 0), // Misc
 ];
 
-// Default = collapsed: a group is collapsed unless its key is in the expanded set.
-const isCollapsed = (expanded: Set<string>) => (r: Row) => !expanded.has(r.k);
+// The EXACT same tree, emitted level-order (BFS) — the order the budget grid
+// produces. The ancestor-walk must mask identically to the DFS order.
+const bfsTree: Row[] = [
+  r(1, null, true, 0), // Housing
+  r(2, null, true, 0), // Salary
+  r(3, null, false, 0), // Misc
+  r(11, 1, false, 1), // Rent
+  r(12, 1, true, 1), // Utilities
+  r(21, 2, false, 1), // Paycheck
+  r(121, 12, false, 2), // Power
+  r(122, 12, false, 2), // Water
+];
 
-describe("collapsibleRows.visibleRows", () => {
-  it("collapses every group by default (empty expanded set)", () => {
-    const visible = visibleRows(tree, acc, isCollapsed(new Set()));
-    // Only depth-0 rows survive: the two group headers + the top-level leaf.
-    expect(visible.map((r) => r.k)).toEqual(["housing", "salary", "misc"]);
+/** Report polarity: a group is collapsed unless its key is in the expanded set. */
+const isCollapsed = (expanded: Set<string>) => (row: Row) => !expanded.has(acc.keyOf(row));
+const ids = (rows: Row[]) => rows.map((row) => row.id);
+const idSet = (rows: Row[]) => new Set(ids(rows));
+
+describe("collapsibleRows.visibleRows — ancestor-walk visibility", () => {
+  it("collapses every level by default (empty set) ⇒ only roots survive", () => {
+    const visible = visibleRows(dfsTree, acc, isCollapsed(new Set()));
+    // Housing + Salary (root parents) + Misc (root leaf); everything deeper folds.
+    expect(ids(visible)).toEqual([1, 2, 3]);
   });
 
-  it("reveals a group's full subtree (incl. nested sub-groups) when expanded", () => {
-    const visible = visibleRows(tree, acc, isCollapsed(new Set(["housing"])));
-    expect(visible.map((r) => r.k)).toEqual([
-      "housing",
-      "rent",
-      "utilities",
-      "power",
-      "salary",
-      "misc",
-    ]);
+  it("expanding a root reveals ONLY its direct children, not its grandchildren", () => {
+    const visible = visibleRows(dfsTree, acc, isCollapsed(new Set(["p:1"])));
+    // Rent + Utilities appear; Power/Water (grandchildren) stay folded because the
+    // intermediate Utilities is still collapsed.
+    expect(ids(visible)).toEqual([1, 11, 12, 2, 3]);
+    expect(visible.some((row) => row.id === 121)).toBe(false);
+    expect(visible.some((row) => row.id === 122)).toBe(false);
   });
 
-  it("keeps groups independent — expanding one leaves the others collapsed", () => {
-    const visible = visibleRows(tree, acc, isCollapsed(new Set(["salary"])));
-    expect(visible.map((r) => r.k)).toEqual(["housing", "salary", "paycheck", "misc"]);
+  it("expanding a root AND its intermediate reveals the leaves", () => {
+    const visible = visibleRows(dfsTree, acc, isCollapsed(new Set(["p:1", "p:12"])));
+    expect(ids(visible)).toEqual([1, 11, 12, 121, 122, 2, 3]);
   });
 
-  it("shows everything when all groups are expanded", () => {
-    const visible = visibleRows(tree, acc, isCollapsed(new Set(["housing", "salary"])));
-    expect(visible).toHaveLength(tree.length);
+  it("a collapsed ancestor always wins: expanding an intermediate whose root is collapsed reveals nothing", () => {
+    const visible = visibleRows(dfsTree, acc, isCollapsed(new Set(["p:12"])));
+    // Housing is collapsed, so Utilities (and thus Power/Water) stay hidden even
+    // though Utilities itself is expanded.
+    expect(ids(visible)).toEqual([1, 2, 3]);
   });
 
-  it("always keeps a top-level leaf that has no group", () => {
-    const visible = visibleRows(tree, acc, isCollapsed(new Set()));
-    expect(visible.some((r) => r.k === "misc")).toBe(true);
+  it("keeps groups independent — expanding Salary leaves Housing folded", () => {
+    const visible = visibleRows(dfsTree, acc, isCollapsed(new Set(["p:2"])));
+    expect(ids(visible)).toEqual([1, 2, 21, 3]);
+  });
+
+  it("shows every row once all parents are expanded", () => {
+    const visible = visibleRows(dfsTree, acc, isCollapsed(new Set(["p:1", "p:12", "p:2"])));
+    expect(visible).toHaveLength(dfsTree.length);
+  });
+
+  it("BFS (level-order) rows mask IDENTICALLY to DFS rows — the test that would have killed v1", () => {
+    const states: Set<string>[] = [
+      new Set(),
+      new Set(["p:1"]),
+      new Set(["p:1", "p:12"]),
+      new Set(["p:12"]),
+      new Set(["p:2"]),
+      new Set(["p:1", "p:12", "p:2"]),
+    ];
+    for (const expanded of states) {
+      const dfs = idSet(visibleRows(dfsTree, acc, isCollapsed(expanded)));
+      const bfs = idSet(visibleRows(bfsTree, acc, isCollapsed(expanded)));
+      expect(bfs).toEqual(dfs);
+    }
+  });
+
+  it("masking is unchanged when subtotals are moved to the bottom (reorderRows)", () => {
+    const expanded = new Set(["p:1", "p:12"]);
+    const normal = idSet(visibleRows(dfsTree, acc, isCollapsed(expanded)));
+    // Order-independent: run reorder FIRST (subtotals below their children), then
+    // filter. v1's depth-cursor algorithm broke exactly here.
+    const bottomFirst = reorderRows(dfsTree, false);
+    const afterReorder = idSet(visibleRows(bottomFirst, acc, isCollapsed(expanded)));
+    expect(afterReorder).toEqual(normal);
+  });
+
+  it("always keeps a top-level leaf that has no parent", () => {
+    const visible = visibleRows(dfsTree, acc, isCollapsed(new Set()));
+    expect(visible.some((row) => row.id === 3)).toBe(true);
+  });
+});
+
+describe('collapsibleRows.visibleRows — "(direct)" leaf', () => {
+  // A parent that also holds direct transactions: its "(direct)" leaf shares the
+  // parent's category id but is a leaf, and points back at the parent subtotal.
+  const withDirect: Row[] = [
+    r(1, null, true, 0), // Housing subtotal   -> key p:1
+    r(1, 1, false, 1), // Housing (direct)   -> key p:1, parentKey p:1
+    r(11, 1, false, 1), // Rent
+  ];
+
+  it("hides the (direct) leaf when its parent is collapsed", () => {
+    const visible = visibleRows(withDirect, acc, isCollapsed(new Set()));
+    // Only the Housing subtotal (a root) survives.
+    expect(visible).toHaveLength(1);
+    expect(visible[0].is_parent).toBe(true);
+  });
+
+  it("shows the (direct) leaf when its parent is expanded", () => {
+    const visible = visibleRows(withDirect, acc, isCollapsed(new Set(["p:1"])));
+    expect(visible).toHaveLength(3);
+  });
+
+  it("never treats the (direct) leaf as a collapsible group", () => {
+    // Both the subtotal and the (direct) leaf carry key p:1, but only the parent
+    // subtotal is collapsible — the leaf is not a parent.
+    expect(collapsibleKeys(withDirect, acc)).toEqual(["p:1"]);
+  });
+});
+
+describe("collapsibleRows.visibleRows — corrupt / cross-section chains", () => {
+  it("guards a cyclic parent_id with MAX_TREE_DEPTH (no infinite loop)", () => {
+    // A <-> B cycle, with a leaf hanging under A. Neither A nor B is collapsed, so
+    // the walk keeps climbing until the hop guard trips.
+    const cyclic: Row[] = [
+      r(100, 101, true, 0), // A, parent B
+      r(101, 100, true, 1), // B, parent A
+      r(1001, 100, false, 2), // leaf under A
+    ];
+    const visible = visibleRows(cyclic, acc, isCollapsed(new Set(["p:100", "p:101"])));
+    // Terminates and keeps the leaf visible (no collapsed ancestor was found).
+    expect(visible.some((row) => row.id === 1001)).toBe(true);
+    // Sanity: the guard is a finite, positive cap.
+    expect(MAX_TREE_DEPTH).toBeGreaterThan(3);
+  });
+
+  it("keeps a row whose ancestor is absent from the section (child of another type)", () => {
+    // Orphan points at id 999, which is not in these rows.
+    const orphaned: Row[] = [r(55, 999, false, 1)];
+    const visible = visibleRows(orphaned, acc, isCollapsed(new Set()));
+    // Missing ancestor ⇒ visible (better an orphan shown than a row hidden by a
+    // parent that lives in another section).
+    expect(ids(visible)).toEqual([55]);
   });
 });
 
 describe("collapsibleRows.collapsibleKeys", () => {
-  it("lists only top-level parent rows, in order", () => {
-    expect(collapsibleKeys(tree, acc)).toEqual(["housing", "salary"]);
+  it("lists EVERY parent, intermediates included, in encounter order", () => {
+    // Housing (p:1), Utilities (p:12, intermediate), Salary (p:2) — NOT Misc/leaves.
+    expect(collapsibleKeys(dfsTree, acc)).toEqual(["p:1", "p:12", "p:2"]);
   });
 
   it("returns [] when there is no hierarchy", () => {
-    const flat = [row("a", 0, false), row("b", 0, false)];
+    const flat = [r(1, null, false, 0), r(2, null, false, 0)];
     expect(collapsibleKeys(flat, acc)).toEqual([]);
   });
 });
 
+describe("collapsibleRows.isCollapsedFor — polarity", () => {
+  it("defaultExpanded=false: empty set ⇒ collapsed, a flipped key ⇒ expanded", () => {
+    expect(isCollapsedFor(new Set(), "p:1", false)).toBe(true);
+    expect(isCollapsedFor(new Set(["p:1"]), "p:1", false)).toBe(false);
+    expect(isCollapsedFor(new Set(["p:2"]), "p:1", false)).toBe(true);
+  });
+
+  it("defaultExpanded=true: empty set ⇒ expanded, a flipped key ⇒ collapsed", () => {
+    expect(isCollapsedFor(new Set(), "p:1", true)).toBe(false);
+    expect(isCollapsedFor(new Set(["p:1"]), "p:1", true)).toBe(true);
+    expect(isCollapsedFor(new Set(["p:2"]), "p:1", true)).toBe(false);
+  });
+});
+
 describe("collapsibleRows.parseStoredExpanded / serializeExpanded", () => {
-  it("treats absent storage as the collapsed default (empty set)", () => {
+  it("treats absent storage as the default state (empty set)", () => {
     expect(parseStoredExpanded(null).size).toBe(0);
     expect(parseStoredExpanded("").size).toBe(0);
   });
 
   it("parses a JSON string array back into a set", () => {
-    expect([...parseStoredExpanded('["housing","salary"]')].sort()).toEqual(["housing", "salary"]);
+    expect([...parseStoredExpanded('["p:1","p:2"]')].sort()).toEqual(["p:1", "p:2"]);
   });
 
   it("falls back to empty on corrupt or non-array JSON", () => {
@@ -110,7 +242,7 @@ describe("collapsibleRows.parseStoredExpanded / serializeExpanded", () => {
   });
 
   it("round-trips through serialize", () => {
-    const set = new Set(["a", "b"]);
-    expect([...parseStoredExpanded(serializeExpanded(set))].sort()).toEqual(["a", "b"]);
+    const set = new Set(["p:1", "p:12"]);
+    expect([...parseStoredExpanded(serializeExpanded(set))].sort()).toEqual(["p:1", "p:12"]);
   });
 });
diff --git a/src/utils/collapsibleRows.ts b/src/utils/collapsibleRows.ts
index 28dab25..ef61a76 100644
--- a/src/utils/collapsibleRows.ts
+++ b/src/utils/collapsibleRows.ts
@@ -1,71 +1,104 @@
 /**
- * Collapse/expand of top-level category groups in the hierarchical comparable
- * reports (real-vs-real Compare + Budget-vs-Actual) — issue #254.
+ * Collapse/expand of category groups in the hierarchical reports (real-vs-real
+ * Compare, Budget-vs-Actual, trends over time) — issue #254/#265, generalised to
+ * every hierarchy level in issue #288.
  *
  * Pure helpers only; the React state + persistence glue lives in the
  * `useCollapsibleGroups` hook.
  *
- * A "group" is a top-level parent row (depth 0, is_parent). Collapsing it keeps
- * its own subtotal row visible but hides its entire subtree (every following
- * depth ≥ 1 row until the next depth-0 row). Rows must arrive in depth-first
- * order — the order the compare/budget services already emit them in, and the
- * same order `reorderRows` relies on.
+ * Visibility is decided by an ANCESTOR WALK, not by row adjacency: a row is
+ * hidden iff *any* of its ancestors is collapsed. We climb `parentKeyOf` from a
+ * row until we reach a root (null), an ancestor outside this section (⇒ visible),
+ * or a collapsed ancestor (⇒ hidden). This is independent of the order rows
+ * arrive in — the fix for the v1 adjacency algorithm, which assumed a
+ * depth-first order the budget grid (level-ordered) does not emit.
  *
- * The accessors are passed in rather than read off fixed field names so each
- * table can supply the *exact* depth expression it renders with (CategoryDelta
- * uses `depth ?? 0`; BudgetVsActualRow derives a missing depth from
- * `parent_id`). Keeping the collapse depth and the indentation depth identical
- * guarantees the hidden rows are exactly the indented descendants.
+ * The accessors are supplied by each consumer so every table can key + climb the
+ * exact hierarchy it renders. Keys are prefixed `p:` so they are injective: a
+ * parent subtotal row and its own "(direct)" leaf share a category id but the
+ * leaf is never a parent, so only the subtotal is indexed — the leaf simply
+ * carries the parent's key via `parentKeyOf` and is hidden with it.
  */
 
+/**
+ * Cycle guard for the ancestor walk. The standard taxonomy is three levels deep;
+ * this generous finite cap only exists so a corrupt cyclic `parent_id` (DB
+ * corruption) can never loop forever. Any real chain terminates in a few hops.
+ */
+export const MAX_TREE_DEPTH = 64;
+
 /** How the collapse logic reads hierarchy position + identity off a row. */
 export interface CollapseAccessors<T> {
-  /** Stable per-group key (a category id, stringified). */
+  /** Stable per-parent key, injective across the section: `p:<categoryId>`. */
   keyOf: (row: T) => string;
-  /** Indentation depth; 0 = top-level. Must match the rendered indentation. */
-  depthOf: (row: T) => number;
+  /** Key of this row's parent (`p:<parent_id>`), or null at a root. */
+  parentKeyOf: (row: T) => string | null;
   /** True when the row is a group header / subtotal (has children). */
   isParent: (row: T) => boolean;
+  /** Indentation depth; 0 = top-level. Drives indentation + aria-level ONLY. */
+  depthOf: (row: T) => number;
 }
 
 /**
- * Keeps every row that is currently visible given which top-level groups are
- * collapsed. `isCollapsed` is consulted only for top-level parent rows; a
- * collapsed one keeps its own (subtotal) row and drops its whole subtree.
+ * Keeps every row that is currently visible given which groups are collapsed. A
+ * row is dropped iff any ancestor (walking `parentKeyOf`) is collapsed; a missing
+ * ancestor (parent lives in another section) leaves the row visible.
  */
 export function visibleRows<T>(
   rows: T[],
   acc: CollapseAccessors<T>,
   isCollapsed: (row: T) => boolean,
 ): T[] {
-  const out: T[] = [];
-  // While true we are inside a collapsed top-level parent's subtree and drop
-  // every deeper row until the next depth-0 row re-opens the flow.
-  let hidingSubtree = false;
-  for (const row of rows) {
-    if (acc.depthOf(row) === 0) {
-      out.push(row);
-      hidingSubtree = acc.isParent(row) && isCollapsed(row);
-    } else if (!hidingSubtree) {
-      out.push(row);
+  // Index ONLY parents: a "(direct)" leaf shares its parent's category id but is
+  // never a parent itself, so it never clobbers the subtotal it points at.
+  const parents = new Map<string, T>();
+  for (const r of rows) if (acc.isParent(r)) parents.set(acc.keyOf(r), r);
+
+  const hiddenByAncestor = (row: T): boolean => {
+    let key = acc.parentKeyOf(row);
+    let hops = 0;
+    while (key !== null && hops++ < MAX_TREE_DEPTH) {
+      const parent = parents.get(key);
+      if (parent === undefined) return false; // ancestor outside this section → visible
+      if (isCollapsed(parent)) return true;
+      key = acc.parentKeyOf(parent);
     }
-  }
-  return out;
+    return false;
+  };
+
+  return rows.filter((r) => !hiddenByAncestor(r));
 }
 
-/** Keys of every collapsible group (top-level parent rows), in encounter order. */
+/** Keys of every collapsible group (all parent rows, any depth), in encounter order. */
 export function collapsibleKeys<T>(rows: T[], acc: CollapseAccessors<T>): string[] {
   const keys: string[] = [];
   for (const row of rows) {
-    if (acc.depthOf(row) === 0 && acc.isParent(row)) keys.push(acc.keyOf(row));
+    if (acc.isParent(row)) keys.push(acc.keyOf(row));
   }
   return keys;
 }
 
 /**
- * Parses the persisted value into the set of *expanded* group keys. The report
- * default is "everything collapsed" (issue #254/#260), so an absent or corrupt
- * value yields an empty set — i.e. all groups collapsed on a first-ever visit.
+ * Polarity of the collapse state. The persisted Set holds the keys whose state
+ * DIFFERS from the default, which lets one hook serve both polarities without a
+ * seed:
+ *  - `defaultExpanded: false` (reports, budget) ⇒ Set = the *expanded* keys, so
+ *    an empty Set means everything collapsed (the reports' current behaviour).
+ *  - `defaultExpanded: true` (category trees) ⇒ Set = the *collapsed* keys, so an
+ *    empty Set means everything expanded.
+ */
+export function isCollapsedFor(
+  flipped: Set<string>,
+  key: string,
+  defaultExpanded: boolean,
+): boolean {
+  const isFlipped = flipped.has(key);
+  return defaultExpanded ? isFlipped : !isFlipped;
+}
+
+/**
+ * Parses the persisted value into the flipped-key set (see `isCollapsedFor`). An
+ * absent or corrupt value yields an empty set — i.e. the default collapse state.
  */
 export function parseStoredExpanded(raw: string | null): Set<string> {
   if (!raw) return new Set();
@@ -75,12 +108,12 @@ export function parseStoredExpanded(raw: string | null): Set<string> {
       return new Set(parsed.filter((k): k is string => typeof k === "string"));
     }
   } catch {
-    // Corrupt value: fall back to the collapsed default.
+    // Corrupt value: fall back to the default state.
   }
   return new Set();
 }
 
-/** Serialises the set of expanded group keys for persistence. */
-export function serializeExpanded(expanded: Set<string>): string {
-  return JSON.stringify([...expanded]);
+/** Serialises the flipped-key set for persistence. */
+export function serializeExpanded(flipped: Set<string>): string {
+  return JSON.stringify([...flipped]);
 }