diff --git a/VueApp/src/CMS/__tests__/content-block-edit-diff.test.ts b/VueApp/src/CMS/__tests__/content-block-edit-diff.test.ts
new file mode 100644
index 000000000..6d6418450
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/content-block-edit-diff.test.ts
@@ -0,0 +1,166 @@
+import ContentBlockEdit from "@/CMS/pages/ContentBlockEdit.vue"
+import { mountCms, flushPromises, createTestRouter } from "./test-utils"
+
+/**
+ * Diff additions to ContentBlockEdit: selecting a version only sets selectedHistory (it no longer
+ * auto-loads), the "Diff vs current" / "Load into editor" buttons are disabled until a version is
+ * selected, and diffAgainstCurrent POSTs the editor's CURRENT content to the diff endpoint, opens
+ * ContentDiffDialog with the returned HTML, and notifies + closes on failure. Mock ViperFetch.
+ */
+
+const mockGet = vi.fn<(...args: unknown[]) => unknown>()
+const mockPost = vi.fn<(...args: unknown[]) => unknown>()
+const mockPut = vi.fn<(...args: unknown[]) => unknown>()
+vi.mock("@/composables/ViperFetch", () => ({
+    useFetch: () => ({
+        get: (...args: unknown[]) => mockGet(...args),
+        post: (...args: unknown[]) => mockPost(...args),
+        put: (...args: unknown[]) => mockPut(...args),
+        createUrlSearchParams: (obj: Record<string, string | number | null | undefined>) => {
+            const params = new URLSearchParams()
+            for (const [k, v] of Object.entries(obj)) {
+                if (v !== null && v !== undefined) {
+                    params.append(k, v.toString())
+                }
+            }
+            return params
+        },
+    }),
+}))
+
+const BLOCK = {
+    contentBlockId: 7,
+    content: "<p>current editor content</p>",
+    title: "Welcome",
+    system: "Viper",
+    application: null,
+    page: null,
+    viperSectionPath: null,
+    blockOrder: 1,
+    friendlyName: "welcome",
+    allowPublicAccess: false,
+    modifiedOn: "2024-03-01T12:00:00",
+    modifiedBy: "editor",
+    deletedOn: null,
+    permissions: [],
+    files: [],
+}
+
+const HISTORY = [
+    { contentHistoryId: 91, modifiedOn: "2024-02-01T10:00:00", modifiedBy: "bob" },
+    { contentHistoryId: 92, modifiedOn: "2024-01-01T09:00:00", modifiedBy: "amy" },
+]
+
+function routeGet() {
+    mockGet.mockReset()
+    mockPost.mockReset()
+    mockGet.mockImplementation((...args: unknown[]) => {
+        const url = args[0] as string
+        if (url.includes("/section-paths")) {
+            return Promise.resolve({ success: true, result: [] })
+        }
+        if (url.includes("/history")) {
+            return Promise.resolve({ success: true, result: HISTORY })
+        }
+        // The single-block load (.../content/7).
+        return Promise.resolve({ success: true, result: { ...BLOCK } })
+    })
+}
+
+// QEditor relies on document.execCommand and rich-text DOM that happy-dom lacks; stub it with a
+// minimal v-model textarea so block.content still binds without exercising the real editor.
+const qEditorStub = {
+    name: "QEditor",
+    props: ["modelValue"],
+    emits: ["update:modelValue"],
+    methods: {
+        getContentEl() {
+            return null
+        },
+    },
+    template: `<textarea :value="modelValue" @input="$emit('update:modelValue', $event.target.value)" />`,
+}
+
+async function mountEdit() {
+    const router = createTestRouter()
+    await router.push({ name: "CmsContentBlockEdit", params: { id: "7" } })
+    await router.isReady()
+    const wrapper = mountCms(ContentBlockEdit, { global: { stubs: { QEditor: qEditorStub } } }, router)
+    await flushPromises()
+    await flushPromises()
+    return wrapper
+}
+
+function diffButton(wrapper: Awaited<ReturnType<typeof mountEdit>>) {
+    return wrapper.findAllComponents({ name: "QBtn" }).find((b) => b.text().includes("Diff vs current"))!
+}
+function loadButton(wrapper: Awaited<ReturnType<typeof mountEdit>>) {
+    return wrapper.findAllComponents({ name: "QBtn" }).find((b) => b.text().includes("Load into editor"))!
+}
+function historySelect(wrapper: Awaited<ReturnType<typeof mountEdit>>) {
+    // The version-history select is the one labeled "Select a previous version".
+    return wrapper.findAllComponents({ name: "QSelect" }).find((s) => s.props("label") === "Select a previous version")!
+}
+
+describe("ContentBlockEdit.vue - history selection gating", () => {
+    beforeEach(() => routeGet())
+
+    it("renders the diff/load buttons disabled until a version is selected", async () => {
+        const wrapper = await mountEdit()
+        expect(diffButton(wrapper).props("disable")).toBeTruthy()
+        expect(loadButton(wrapper).props("disable")).toBeTruthy()
+    })
+
+    it("selecting a version only sets selectedHistory and does not fetch that version", async () => {
+        const wrapper = await mountEdit()
+        const getCallsBefore = mockGet.mock.calls.length
+        historySelect(wrapper).vm.$emit("update:modelValue", HISTORY[0])
+        await flushPromises()
+        // No extra GET for the version content; the buttons just enable.
+        expect(mockGet.mock.calls.length).toBe(getCallsBefore)
+        expect(diffButton(wrapper).props("disable")).toBeFalsy()
+        expect(loadButton(wrapper).props("disable")).toBeFalsy()
+    })
+})
+
+describe("ContentBlockEdit.vue - diffAgainstCurrent", () => {
+    beforeEach(() => routeGet())
+
+    it("POSTs the current editor content to the diff endpoint and opens the dialog with the result", async () => {
+        mockPost.mockResolvedValue({
+            success: true,
+            result: { content: "<ins>new</ins>", hasComparison: true, hasChanges: true },
+        })
+        const wrapper = await mountEdit()
+        historySelect(wrapper).vm.$emit("update:modelValue", HISTORY[0])
+        await flushPromises()
+
+        await diffButton(wrapper).trigger("click")
+        await flushPromises()
+
+        expect(mockPost).toHaveBeenCalledOnce()
+        const [url, payload] = mockPost.mock.calls[0]!
+        expect(url).toContain("CMS/content/7/history/91/diff")
+        // The CURRENT editor content is posted (so unsaved edits are diffed).
+        expect(payload).toEqual({ content: "<p>current editor content</p>" })
+
+        const dialog = wrapper.findComponent({ name: "ContentDiffDialog" })
+        expect(dialog.props("modelValue")).toBeTruthy()
+        expect(dialog.props("diffHtml")).toContain("new")
+        expect(dialog.props("subtitle")).toContain("to your current editor content")
+    })
+
+    it("notifies and closes the diff dialog when the diff POST fails", async () => {
+        mockPost.mockResolvedValue({ success: false, errors: ["diff failed"] })
+        const wrapper = await mountEdit()
+        historySelect(wrapper).vm.$emit("update:modelValue", HISTORY[0])
+        await flushPromises()
+
+        await diffButton(wrapper).trigger("click")
+        await flushPromises()
+
+        const dialog = wrapper.findComponent({ name: "ContentDiffDialog" })
+        expect(dialog.props("modelValue")).toBeFalsy()
+        expect(document.body.textContent).toContain("diff failed")
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/content-block-history.test.ts b/VueApp/src/CMS/__tests__/content-block-history.test.ts
new file mode 100644
index 000000000..b14412f92
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/content-block-history.test.ts
@@ -0,0 +1,229 @@
+import ContentBlockHistory from "@/CMS/pages/ContentBlockHistory.vue"
+import { mountCms, flushPromises, flushRouter, createTestRouter } from "./test-utils"
+
+/**
+ * ContentBlockHistory is a logic-dense page: filters deep-link from route.query, onRequest builds
+ * the list query (contentBlockId/modifiedBy/from/to/search/page/perPage) and binds rowsNumber,
+ * syncFiltersToUrl reflects active filters back (omitting empties), clearBlockFilter drops the
+ * block chip and reloads, viewDiff fetches the GET diff endpoint and drives ContentDiffDialog
+ * with a comparison/original subtitle, and the route.query watcher's equality guard avoids a
+ * double-fetch on self-writes. DateRangeFilter is mounted real to exercise the binding end-to-end.
+ */
+
+const mockGet = vi.fn<(...args: unknown[]) => unknown>()
+vi.mock("@/composables/ViperFetch", () => ({
+    useFetch: () => ({
+        get: (...args: unknown[]) => mockGet(...args),
+        createUrlSearchParams: (obj: Record<string, string | number | null | undefined>) => {
+            const params = new URLSearchParams()
+            for (const [k, v] of Object.entries(obj)) {
+                if (v !== null && v !== undefined) {
+                    params.append(k, v.toString())
+                }
+            }
+            return params
+        },
+    }),
+}))
+
+const HISTORY_ROW = {
+    contentHistoryId: 55,
+    contentBlockId: 7,
+    title: "Welcome",
+    friendlyName: "welcome",
+    page: "home",
+    modifiedOn: "2024-03-01T12:00:00",
+    modifiedBy: "editor",
+    blockDeleted: false,
+}
+
+type DiffResult = {
+    content: string
+    hasComparison: boolean
+    hasChanges: boolean
+    oldModifiedOn: string | null
+    oldModifiedBy: string | null
+    newModifiedOn: string | null
+    newModifiedBy: string | null
+}
+
+function routeGet(opts: { rows?: unknown[]; total?: number; diff?: DiffResult | { fail: true } } = {}) {
+    const rows = opts.rows ?? [HISTORY_ROW]
+    mockGet.mockReset()
+    mockGet.mockImplementation((...args: unknown[]) => {
+        const url = args[0] as string
+        if (url.includes("/diff")) {
+            if (opts.diff && "fail" in opts.diff) {
+                return Promise.resolve({ success: false, errors: ["boom"] })
+            }
+            return Promise.resolve({ success: true, result: opts.diff })
+        }
+        return Promise.resolve({
+            success: true,
+            result: rows,
+            pagination: opts.total === undefined ? undefined : { totalRecords: opts.total },
+        })
+    })
+}
+
+function lastListUrl(): string {
+    return mockGet.mock.calls.map((c) => c[0] as string).findLast((u) => u.includes("CMS/content/history?")) ?? ""
+}
+
+async function mountPage(query: Record<string, string> = {}) {
+    const router = createTestRouter()
+    await router.push({ path: "/CMS/ManageContentBlocks/History", query })
+    await router.isReady()
+    const wrapper = mountCms(ContentBlockHistory, {}, router)
+    await flushPromises()
+    await flushPromises()
+    return { wrapper, router }
+}
+
+describe("ContentBlockHistory.vue - list request", () => {
+    beforeEach(() => routeGet({ total: 17 }))
+
+    it("requests page 1 with default perPage on mount and binds rowsNumber", async () => {
+        const { wrapper } = await mountPage()
+        const url = lastListUrl()
+        expect(url).toContain("page=1")
+        expect(url).toContain("perPage=50")
+        const pag = wrapper.findComponent({ name: "QTable" }).props("pagination") as { rowsNumber: number }
+        expect(pag.rowsNumber).toBe(17)
+        expect(wrapper.findComponent({ name: "QTable" }).props("rows")).toHaveLength(1)
+    })
+
+    it("initializes filters from route.query (deep-link) and reflects them in the request", async () => {
+        await mountPage({
+            contentBlockId: "7",
+            modifiedBy: "editor",
+            from: "2024-01-01",
+            to: "2024-02-01",
+            search: "welcome",
+        })
+        const url = lastListUrl()
+        expect(url).toContain("contentBlockId=7")
+        expect(url).toContain("modifiedBy=editor")
+        expect(url).toContain("from=2024-01-01")
+        expect(url).toContain("to=2024-02-01")
+        expect(url).toContain("search=welcome")
+    })
+
+    it("shows the single-block filter chip when contentBlockId is present", async () => {
+        const { wrapper } = await mountPage({ contentBlockId: "7" })
+        expect(wrapper.text()).toContain("Filtered to one block: 7")
+    })
+})
+
+describe("ContentBlockHistory.vue - filter to URL sync", () => {
+    beforeEach(() => routeGet({ total: 5 }))
+
+    it("syncFiltersToUrl writes only the active filters to the URL (empties omitted)", async () => {
+        const { wrapper, router } = await mountPage({ contentBlockId: "7" })
+        const modifiedByInput = wrapper.findAllComponents({ name: "QInput" })[0]!
+        modifiedByInput.vm.$emit("update:modelValue", "alice")
+        await flushRouter()
+        // The new filter reaches both the request and the URL.
+        expect(lastListUrl()).toContain("modifiedBy=alice")
+        expect(router.currentRoute.value.query.modifiedBy).toBe("alice")
+        expect(router.currentRoute.value.query.contentBlockId).toBe("7")
+        // Untouched empty filters are not serialized.
+        expect(router.currentRoute.value.query.search).toBeUndefined()
+        expect(router.currentRoute.value.query.from).toBeUndefined()
+    })
+
+    it("clearBlockFilter drops the chip and the contentBlockId param, then reloads", async () => {
+        const { wrapper, router } = await mountPage({ contentBlockId: "7" })
+        const before = mockGet.mock.calls.length
+        wrapper.findComponent({ name: "QChip" }).vm.$emit("remove")
+        await flushRouter()
+        expect(wrapper.text()).not.toContain("Filtered to one block")
+        expect(router.currentRoute.value.query.contentBlockId).toBeUndefined()
+        // A reload (new list request) happened.
+        expect(mockGet.mock.calls.length).toBeGreaterThan(before)
+        expect(lastListUrl()).not.toContain("contentBlockId=")
+    })
+
+    it("the route.query watcher's equality guard does not re-fetch on a self-write", async () => {
+        const { wrapper } = await mountPage()
+        const searchInput = wrapper.findAllComponents({ name: "QInput" }).at(-1)!
+        searchInput.vm.$emit("update:modelValue", "abc")
+        await flushPromises()
+        const callsAfterSearch = mockGet.mock.calls.length
+        // SyncFiltersToUrl (router.replace) updates the query; the watcher sees state already
+        // equal to filters and returns without a second fetch.
+        await flushPromises()
+        await flushPromises()
+        expect(mockGet.mock.calls.length).toBe(callsAfterSearch)
+    })
+})
+
+describe("ContentBlockHistory.vue - viewDiff", () => {
+    it("fetches the GET diff endpoint and shows the comparison subtitle for a non-original version", async () => {
+        routeGet({
+            diff: {
+                content: "<ins>added</ins>",
+                hasComparison: true,
+                hasChanges: true,
+                oldModifiedOn: "2024-02-01T10:00:00",
+                oldModifiedBy: "bob",
+                newModifiedOn: "2024-03-01T12:00:00",
+                newModifiedBy: "editor",
+            },
+        })
+        const { wrapper } = await mountPage()
+        await wrapper
+            .findAllComponents({ name: "QBtn" })
+            .find((b) => b.attributes("aria-label") === "Diff with previous version")!
+            .trigger("click")
+        await flushPromises()
+
+        // The diff endpoint is .../content/<blockId>/history/<historyId>/diff.
+        const diffCall = mockGet.mock.calls.map((c) => c[0] as string).find((u) => u.includes("/diff"))
+        expect(diffCall).toContain("CMS/content/7/history/55/diff")
+
+        const dialog = wrapper.findComponent({ name: "ContentDiffDialog" })
+        expect(dialog.props("hasComparison")).toBeTruthy()
+        expect(dialog.props("diffHtml")).toContain("added")
+        // DiffStamp builds "Changes from <old> to <new>".
+        expect(dialog.props("subtitle")).toContain("Changes from")
+        expect(dialog.props("subtitle")).toContain("by bob")
+        expect(dialog.props("subtitle")).toContain("by editor")
+    })
+
+    it("shows the original-version subtitle when the version has no comparison", async () => {
+        routeGet({
+            diff: {
+                content: "",
+                hasComparison: false,
+                hasChanges: false,
+                oldModifiedOn: null,
+                oldModifiedBy: null,
+                newModifiedOn: "2024-03-01T12:00:00",
+                newModifiedBy: "editor",
+            },
+        })
+        const { wrapper } = await mountPage()
+        await wrapper
+            .findAllComponents({ name: "QBtn" })
+            .find((b) => b.attributes("aria-label") === "Diff with previous version")!
+            .trigger("click")
+        await flushPromises()
+        const dialog = wrapper.findComponent({ name: "ContentDiffDialog" })
+        expect(dialog.props("hasComparison")).toBeFalsy()
+        expect(dialog.props("subtitle")).toContain("Original version")
+    })
+
+    it("notifies and closes the viewer when the diff request fails", async () => {
+        routeGet({ diff: { fail: true } })
+        const { wrapper } = await mountPage()
+        await wrapper
+            .findAllComponents({ name: "QBtn" })
+            .find((b) => b.attributes("aria-label") === "Diff with previous version")!
+            .trigger("click")
+        await flushPromises()
+        const dialog = wrapper.findComponent({ name: "ContentDiffDialog" })
+        expect(dialog.props("modelValue")).toBeFalsy()
+        expect(document.body.textContent).toContain("boom")
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/content-blocks.test.ts b/VueApp/src/CMS/__tests__/content-blocks.test.ts
new file mode 100644
index 000000000..65ef04ca1
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/content-blocks.test.ts
@@ -0,0 +1,144 @@
+import ContentBlocks from "@/CMS/pages/ContentBlocks.vue"
+import { mountCms, flushPromises, flushRouter, createTestRouter } from "./test-utils"
+
+/**
+ * Representative page filter-state test: filter inputs must drive the right query params on the
+ * list request, and returned rows must bind to the table. Mock ViperFetch; section-paths and
+ * block list both go through get().
+ */
+
+const mockGet = vi.fn<(...args: unknown[]) => unknown>()
+vi.mock("@/composables/ViperFetch", () => ({
+    useFetch: () => ({
+        get: (...args: unknown[]) => mockGet(...args),
+        del: vi.fn<(...args: unknown[]) => unknown>(),
+        post: vi.fn<(...args: unknown[]) => unknown>(),
+        createUrlSearchParams: (obj: Record<string, string | number | null | undefined>) => {
+            const params = new URLSearchParams()
+            for (const [k, v] of Object.entries(obj)) {
+                if (v !== null && v !== undefined) {
+                    params.append(k, v.toString())
+                }
+            }
+            return params
+        },
+    }),
+}))
+
+const BLOCK_ROW = {
+    contentBlockId: 1,
+    title: "Welcome",
+    friendlyName: "welcome",
+    system: "Viper",
+    viperSectionPath: null,
+    page: null,
+    blockOrder: 1,
+    allowPublicAccess: false,
+    deletedOn: null,
+    permissions: [],
+    modifiedOn: "2024-01-01T00:00:00",
+    modifiedBy: "u",
+}
+
+// The list endpoint is the one without "/section-paths"; route by URL.
+function routeGet(blockRows: unknown[] = [BLOCK_ROW]) {
+    mockGet.mockReset()
+    mockGet.mockImplementation((...args: unknown[]) => {
+        const url = args[0] as string
+        if (url.includes("/section-paths")) {
+            return Promise.resolve({ success: true, result: ["/a", "/b"] })
+        }
+        return Promise.resolve({ success: true, result: blockRows })
+    })
+}
+
+function lastListUrl(): string {
+    const listCalls = mockGet.mock.calls.map((c) => c[0] as string).filter((u) => !u.includes("/section-paths"))
+    return listCalls.at(-1) ?? ""
+}
+
+async function mountPage(query: Record<string, string> = {}) {
+    const router = createTestRouter()
+    await router.push({ path: "/CMS/ManageContentBlocks", query })
+    await router.isReady()
+    const wrapper = mountCms(ContentBlocks, {}, router)
+    await flushPromises()
+    await flushPromises()
+    return { wrapper, router }
+}
+
+describe("ContentBlocks.vue - filter-driven query params", () => {
+    beforeEach(() => routeGet())
+
+    it("requests with the default active status on mount and binds returned rows", async () => {
+        const { wrapper } = await mountPage()
+        expect(lastListUrl()).toContain("status=active")
+        // Returned row binds to the table.
+        expect(wrapper.findComponent({ name: "QTable" }).props("rows")).toHaveLength(1)
+        expect(wrapper.text()).toContain("Welcome")
+    })
+
+    it("includes the search term in the query when the search field changes", async () => {
+        const { wrapper } = await mountPage()
+        const searchInput = wrapper.findAllComponents({ name: "QInput" })[0]!
+        searchInput.vm.$emit("update:modelValue", "welcome")
+        await flushPromises()
+        expect(lastListUrl()).toContain("search=welcome")
+    })
+
+    it("adds isPublic=true only when the Public-only toggle is on", async () => {
+        const { wrapper } = await mountPage()
+        expect(lastListUrl()).not.toContain("isPublic")
+        const toggle = wrapper.findComponent({ name: "QToggle" })
+        toggle.vm.$emit("update:modelValue", true)
+        await flushPromises()
+        expect(lastListUrl()).toContain("isPublic=true")
+    })
+
+    it("sends the chosen status when the status select changes", async () => {
+        const { wrapper } = await mountPage()
+        const statusSelect = wrapper.findAllComponents({ name: "QSelect" })[0]!
+        statusSelect.vm.$emit("update:modelValue", "deleted")
+        await flushPromises()
+        expect(lastListUrl()).toContain("status=deleted")
+    })
+
+    it("binds an empty table when the list request fails", async () => {
+        mockGet.mockReset()
+        mockGet.mockImplementation((...args: unknown[]) => {
+            const url = args[0] as string
+            if (url.includes("/section-paths")) {
+                return Promise.resolve({ success: true, result: [] })
+            }
+            return Promise.resolve({ success: false, result: null })
+        })
+        const { wrapper } = await mountPage()
+        expect(wrapper.findComponent({ name: "QTable" }).props("rows")).toEqual([])
+    })
+})
+
+describe("ContentBlocks.vue - URL filter sync", () => {
+    beforeEach(() => routeGet())
+
+    it("initializes filters from the URL query (deep-link) and reflects them in the request", async () => {
+        await mountPage({ status: "deleted", system: "CTS", section: "courses", search: "welcome", public: "1" })
+        const url = lastListUrl()
+        expect(url).toContain("status=deleted")
+        expect(url).toContain("system=CTS")
+        expect(url).toContain("viperSectionPath=courses")
+        expect(url).toContain("search=welcome")
+        expect(url).toContain("isPublic=true")
+    })
+
+    it("writes only the active filters to the URL when a filter changes (defaults omitted)", async () => {
+        const { wrapper, router } = await mountPage()
+        const searchInput = wrapper.findAllComponents({ name: "QInput" })[0]!
+        searchInput.vm.$emit("update:modelValue", "welcome")
+        await flushRouter()
+        // The changed filter reaches the URL; the default active status and the off
+        // public toggle are omitted rather than serialized as defaults.
+        expect(router.currentRoute.value.query.search).toBe("welcome")
+        expect(router.currentRoute.value.query.status).toBeUndefined()
+        expect(router.currentRoute.value.query.public).toBeUndefined()
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/content-diff-dialog.test.ts b/VueApp/src/CMS/__tests__/content-diff-dialog.test.ts
new file mode 100644
index 000000000..e04baa832
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/content-diff-dialog.test.ts
@@ -0,0 +1,66 @@
+import ContentDiffDialog from "@/CMS/components/ContentDiffDialog.vue"
+import { mountCms, flushPromises } from "./test-utils"
+
+/**
+ * ContentDiffDialog is a prop-driven presentational wrapper, so this stays light: it emits
+ * update:modelValue on close, shows the added/removed legend only when there is a real
+ * comparison with changes (and not loading), and falls back to emptyMessage when there is
+ * no comparison. The dialog teleports, so assertions read document.body.
+ */
+
+function bodyText(): string {
+    return document.body.textContent ?? ""
+}
+
+function mountDialog(props: Record<string, unknown>) {
+    return mountCms(ContentDiffDialog, { props: { modelValue: true, ...props } })
+}
+
+describe("ContentDiffDialog.vue", () => {
+    beforeEach(() => {
+        document.body.innerHTML = ""
+    })
+
+    it("re-emits update:modelValue when the dialog requests close", async () => {
+        const wrapper = mountDialog({})
+        await flushPromises()
+        wrapper.findComponent({ name: "QDialog" }).vm.$emit("update:modelValue", false)
+        await flushPromises()
+        expect(wrapper.emitted("update:modelValue")?.at(-1)).toEqual([false])
+    })
+
+    it("shows the added/removed legend when there is a comparison with changes and not loading", async () => {
+        mountDialog({ hasComparison: true, hasChanges: true, loading: false, diffHtml: "<ins>x</ins>" })
+        await flushPromises()
+        expect(bodyText()).toContain("added")
+        expect(bodyText()).toContain("removed")
+    })
+
+    it("hides the legend while loading", async () => {
+        mountDialog({ hasComparison: true, hasChanges: true, loading: true })
+        await flushPromises()
+        expect(bodyText()).not.toContain("(newer)")
+    })
+
+    it("hides the legend and states identical when there are no changes", async () => {
+        mountDialog({ hasComparison: true, hasChanges: false })
+        await flushPromises()
+        expect(bodyText()).not.toContain("(newer)")
+        expect(bodyText()).toContain("These two versions are identical.")
+    })
+
+    it("falls back to the empty message when there is no comparison", async () => {
+        mountDialog({ hasComparison: false, emptyMessage: "Nothing to compare here." })
+        await flushPromises()
+        expect(bodyText()).toContain("Nothing to compare here.")
+        // No legend without a comparison.
+        expect(bodyText()).not.toContain("(newer)")
+    })
+
+    it("renders the provided subtitle and title", async () => {
+        mountDialog({ title: "Diff title", subtitle: "Changes from A to B" })
+        await flushPromises()
+        expect(bodyText()).toContain("Diff title")
+        expect(bodyText()).toContain("Changes from A to B")
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/date-range-filter.test.ts b/VueApp/src/CMS/__tests__/date-range-filter.test.ts
new file mode 100644
index 000000000..aae8722fa
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/date-range-filter.test.ts
@@ -0,0 +1,52 @@
+import DateRangeFilter from "@/CMS/components/DateRangeFilter.vue"
+import { mountCms } from "./test-utils"
+
+/**
+ * DateRangeFilter is a small shared component (FileAuditLog + ContentBlockHistory both
+ * use it). It exposes v-model:from / v-model:to and emits "change" whenever either input
+ * updates, so the parent can reload. Lock down the binding and the change emission.
+ */
+
+describe("DateRangeFilter.vue", () => {
+    it("renders From and To date inputs bound to the models", () => {
+        const wrapper = mountCms(DateRangeFilter, {
+            props: { from: "2024-01-01", to: "2024-02-01" },
+        })
+        const inputs = wrapper.findAll("input[type='date']")
+        expect(inputs).toHaveLength(2)
+        expect((inputs[0]!.element as HTMLInputElement).value).toBe("2024-01-01")
+        expect((inputs[1]!.element as HTMLInputElement).value).toBe("2024-02-01")
+    })
+
+    it("emits update:from and change when the From input changes", async () => {
+        const wrapper = mountCms(DateRangeFilter, {
+            props: { from: "", to: "" },
+        })
+        const fromInput = wrapper.findAll("input[type='date']")[0]!
+        await fromInput.setValue("2024-05-10")
+
+        expect(wrapper.emitted("update:from")?.at(-1)).toEqual(["2024-05-10"])
+        expect(wrapper.emitted("change")).toBeTruthy()
+    })
+
+    it("emits update:to and change when the To input changes", async () => {
+        const wrapper = mountCms(DateRangeFilter, {
+            props: { from: "", to: "" },
+        })
+        const toInput = wrapper.findAll("input[type='date']")[1]!
+        await toInput.setValue("2024-06-15")
+
+        expect(wrapper.emitted("update:to")?.at(-1)).toEqual(["2024-06-15"])
+        expect(wrapper.emitted("change")).toBeTruthy()
+    })
+
+    it("emits change separately for each input edit", async () => {
+        const wrapper = mountCms(DateRangeFilter, {
+            props: { from: "", to: "" },
+        })
+        const [fromInput, toInput] = wrapper.findAll("input[type='date']")
+        await fromInput!.setValue("2024-01-01")
+        await toInput!.setValue("2024-12-31")
+        expect(wrapper.emitted("change")).toHaveLength(2)
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/file-form-dialog.test.ts b/VueApp/src/CMS/__tests__/file-form-dialog.test.ts
new file mode 100644
index 000000000..0f197d0a4
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/file-form-dialog.test.ts
@@ -0,0 +1,197 @@
+import FileFormDialog from "@/CMS/components/FileFormDialog.vue"
+import type { CmsFile } from "@/CMS/types"
+import { mountCms, flushPromises } from "./test-utils"
+
+/**
+ * FileFormDialog covers add vs edit upload flows. Edit mode has no required file (replacing
+ * is optional) and no folder field; add mode requires both a file and a folder. New uploads
+ * first hit a check-name endpoint and prompt on conflict. These tests mock ViperFetch and
+ * stub the async selectors, then assert validation gating and the submitted FormData payload.
+ */
+
+const mockGet = vi.fn<(...args: unknown[]) => unknown>()
+const mockPostForm = vi.fn<(...args: unknown[]) => unknown>()
+const mockPutForm = vi.fn<(...args: unknown[]) => unknown>()
+vi.mock("@/composables/ViperFetch", () => ({
+    useFetch: () => ({
+        get: (...args: unknown[]) => mockGet(...args),
+        postForm: (...args: unknown[]) => mockPostForm(...args),
+        putForm: (...args: unknown[]) => mockPutForm(...args),
+        createUrlSearchParams: (obj: Record<string, string | number | null | undefined>) => {
+            const params = new URLSearchParams()
+            for (const [k, v] of Object.entries(obj)) {
+                if (v !== null && v !== undefined) {
+                    params.append(k, v.toString())
+                }
+            }
+            return params
+        },
+    }),
+}))
+
+// Stub the async selectors so they don't make their own fetches; their v-model still flows.
+const selectorStub = {
+    props: ["modelValue", "label"],
+    emits: ["update:modelValue"],
+    template: "<div class='selector-stub' />",
+}
+
+function existingFile(overrides: Partial<CmsFile> = {}): CmsFile {
+    return {
+        fileGuid: "guid-123",
+        fileName: "report.pdf",
+        folder: "Apps",
+        friendlyName: "report.pdf",
+        encrypted: false,
+        description: "A report",
+        allowPublicAccess: false,
+        oldUrl: "/old/report.pdf",
+        modifiedOn: "2024-01-01T00:00:00",
+        modifiedBy: "u",
+        deletedOn: null,
+        permissions: ["SVMSecure.CMS"],
+        people: [{ iamId: "iam1", name: "Person One" }],
+        url: "/files/guid-123",
+        friendlyUrl: "/Apps/report.pdf",
+        ...overrides,
+    }
+}
+
+function mountDialog(props: { modelValue: boolean; folders: string[]; file: CmsFile | null }) {
+    return mountCms(FileFormDialog, {
+        props,
+        global: {
+            stubs: { PermissionSelector: selectorStub, PersonSelector: selectorStub },
+        },
+    })
+}
+
+// QDialog teleports content to document.body, so query there.
+function bodyText(): string {
+    return document.body.textContent ?? ""
+}
+
+// QDialog teleports its DOM, but the component tree (and so findComponent) still includes the
+// teleported children. Trigger submit on the QForm's <form> via VTU so a real event is dispatched
+// (calling QForm.submit() directly passes an undefined event and trips .prevent).
+async function submitDialogForm(wrapper: ReturnType<typeof mountDialog>): Promise<void> {
+    await wrapper.findComponent({ name: "QForm" }).find("form").trigger("submit")
+}
+
+describe("FileFormDialog.vue - add vs edit mode", () => {
+    beforeEach(() => {
+        mockGet.mockReset()
+        mockPostForm.mockReset()
+        mockPutForm.mockReset()
+        document.body.innerHTML = ""
+    })
+
+    it("shows the Add File title and an Upload button in add mode", async () => {
+        mountDialog({ modelValue: true, folders: ["Apps"], file: null })
+        await flushPromises()
+        expect(bodyText()).toContain("Add File")
+        expect(bodyText()).toContain("Upload")
+    })
+
+    it("shows the Edit File title and the existing file link in edit mode", async () => {
+        mountDialog({ modelValue: true, folders: ["Apps"], file: existingFile() })
+        await flushPromises()
+        expect(bodyText()).toContain("Edit File")
+        expect(bodyText()).toContain("Save Changes")
+        const link = [...document.querySelectorAll("a")].find((a) => a.getAttribute("href") === "/Apps/report.pdf")
+        expect(link).toBeTruthy()
+    })
+
+    it("renders the folder select only in add mode (not edit)", async () => {
+        const add = mountDialog({ modelValue: true, folders: ["Apps", "Reports"], file: null })
+        await flushPromises()
+        expect(bodyText()).toContain("VIPER app (folder)")
+        add.unmount()
+        document.body.innerHTML = ""
+
+        mountDialog({ modelValue: true, folders: ["Apps"], file: existingFile() })
+        await flushPromises()
+        expect(bodyText()).not.toContain("VIPER app (folder)")
+    })
+
+    it("applies the accepted-extensions allow-list to the file input", async () => {
+        mountDialog({ modelValue: true, folders: ["Apps"], file: null })
+        await flushPromises()
+        const fileInput = document.querySelector("input[type='file']") as HTMLInputElement | null
+        expect(fileInput).toBeTruthy()
+        const accept = fileInput!.getAttribute("accept") ?? ""
+        expect(accept).toContain(".pdf")
+        expect(accept).toContain(".docx")
+        expect(accept).toContain(".zip")
+        // A dangerous extension that is NOT allowed should be absent.
+        expect(accept).not.toContain(".bat")
+    })
+})
+
+describe("FileFormDialog.vue - required-field enforcement (add mode)", () => {
+    beforeEach(() => {
+        mockGet.mockReset()
+        mockPostForm.mockReset()
+        mockPutForm.mockReset()
+        document.body.innerHTML = ""
+    })
+
+    it("does not call check-name or postForm when add-mode submit has no file/folder", async () => {
+        const wrapper = mountDialog({ modelValue: true, folders: ["Apps"], file: null })
+        await flushPromises()
+        // Submit the empty form: greedy validation blocks save(), and save() also early-returns
+        // because there is no upload/folder, so no network calls are made.
+        await submitDialogForm(wrapper)
+        await flushPromises()
+        expect(mockGet).not.toHaveBeenCalled()
+        expect(mockPostForm).not.toHaveBeenCalled()
+        // The validation-error handler surfaces a banner message.
+        expect(bodyText()).toContain("Please choose a file")
+    })
+})
+
+describe("FileFormDialog.vue - save payload", () => {
+    beforeEach(() => {
+        mockGet.mockReset()
+        mockPostForm.mockReset()
+        mockPutForm.mockReset()
+        document.body.innerHTML = ""
+    })
+
+    it("edit-mode save PUTs FormData to the file's guid URL and emits saved", async () => {
+        const file = existingFile({ description: "Updated desc" })
+        mockPutForm.mockResolvedValue({ success: true, result: file })
+        // The form is populated by the open watcher (modelValue false -> true), so open via a
+        // prop toggle rather than mounting already-open, which would leave the form empty.
+        const wrapper = mountDialog({ modelValue: false, folders: ["Apps"], file })
+        await wrapper.setProps({ modelValue: true })
+        await flushPromises()
+
+        await submitDialogForm(wrapper)
+        await flushPromises()
+
+        expect(mockPutForm).toHaveBeenCalledOnce()
+        const [url, body] = mockPutForm.mock.calls[0]!
+        expect(url).toContain("cms/files/guid-123")
+        expect(body).toBeInstanceOf(FormData)
+        // Edit mode carries description/flags but not folder.
+        expect((body as FormData).get("description")).toBe("Updated desc")
+        expect((body as FormData).has("folder")).toBeFalsy()
+        expect((body as FormData).get("allowPublicAccess")).toBe("false")
+        expect((body as FormData).get("encrypt")).toBe("false")
+        expect(wrapper.emitted("saved")).toBeTruthy()
+        expect(wrapper.emitted("update:modelValue")?.at(-1)).toEqual([false])
+    })
+
+    it("edit-mode save surfaces the server error on the form banner and does not emit saved", async () => {
+        mockPutForm.mockResolvedValue({ success: false, errors: ["Name already taken"] })
+        const wrapper = mountDialog({ modelValue: true, folders: ["Apps"], file: existingFile() })
+        await flushPromises()
+
+        await submitDialogForm(wrapper)
+        await flushPromises()
+
+        expect(bodyText()).toContain("Name already taken")
+        expect(wrapper.emitted("saved")).toBeFalsy()
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/files.test.ts b/VueApp/src/CMS/__tests__/files.test.ts
new file mode 100644
index 000000000..0f3818013
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/files.test.ts
@@ -0,0 +1,136 @@
+import Files from "@/CMS/pages/Files.vue"
+import { mountCms, flushPromises, createTestRouter } from "./test-utils"
+
+/**
+ * Files is a server-paged list. Its filters initialize from the URL (deep-link), onRequest builds
+ * the page/sort/filter query and binds rowsNumber from the response pagination. Mock ViperFetch
+ * and route requests by URL (folders / folder-counts / the paged list).
+ */
+
+const mockGet = vi.fn<(...args: unknown[]) => unknown>()
+vi.mock("@/composables/ViperFetch", () => ({
+    useFetch: () => ({
+        get: (...args: unknown[]) => mockGet(...args),
+        del: vi.fn<(...args: unknown[]) => unknown>(),
+        post: vi.fn<(...args: unknown[]) => unknown>(),
+        createUrlSearchParams: (obj: Record<string, string | number | null | undefined>) => {
+            const params = new URLSearchParams()
+            for (const [k, v] of Object.entries(obj)) {
+                if (v !== null && v !== undefined) {
+                    params.append(k, v.toString())
+                }
+            }
+            return params
+        },
+    }),
+}))
+
+const FILE_ROW = {
+    fileGuid: "g1",
+    fileName: "a.pdf",
+    folder: "Apps",
+    friendlyName: "a.pdf",
+    encrypted: false,
+    description: "",
+    allowPublicAccess: false,
+    oldUrl: null,
+    modifiedOn: "2024-01-01T00:00:00",
+    modifiedBy: "u",
+    deletedOn: null,
+    permissions: [],
+    people: [],
+    url: "/files/g1",
+    friendlyUrl: "/Apps/a.pdf",
+}
+
+// Returns the list endpoint URL (the bare "cms/files/?..." call, not folders/folder-counts).
+function lastListUrl(): string {
+    const listCalls = mockGet.mock.calls.map((c) => c[0] as string).filter((u) => u.includes("cms/files/?"))
+    return listCalls.at(-1) ?? ""
+}
+
+function routeGet(opts: { rows?: unknown[]; total?: number } = {}) {
+    const rows = opts.rows ?? [FILE_ROW]
+    mockGet.mockReset()
+    mockGet.mockImplementation((...args: unknown[]) => {
+        const url = args[0] as string
+        if (url.includes("folder-counts")) {
+            return Promise.resolve({ success: true, result: [{ folder: "Apps", count: 3 }] })
+        }
+        if (url.includes("folders")) {
+            return Promise.resolve({ success: true, result: ["Apps", "Reports"] })
+        }
+        // The paged list request.
+        return Promise.resolve({
+            success: true,
+            result: rows,
+            pagination: opts.total === undefined ? undefined : { totalRecords: opts.total },
+        })
+    })
+}
+
+async function mountPage(query: Record<string, string> = {}) {
+    const router = createTestRouter()
+    await router.push({ path: "/CMS/ManageFiles", query })
+    await router.isReady()
+    const wrapper = mountCms(Files, {}, router)
+    await flushPromises()
+    await flushPromises()
+    return wrapper
+}
+
+describe("Files.vue - query param construction", () => {
+    beforeEach(() => routeGet({ total: 42 }))
+
+    it("requests page 1 with default sort and status on mount, binding rowsNumber from pagination", async () => {
+        const wrapper = await mountPage()
+        const url = lastListUrl()
+        expect(url).toContain("page=1")
+        expect(url).toContain("perPage=50")
+        expect(url).toContain("sortBy=friendlyName")
+        expect(url).toContain("status=active")
+        expect(wrapper.findComponent({ name: "QTable" }).props("rows")).toHaveLength(1)
+        // RowsNumber is read off the QTable's bound pagination prop.
+        const pag = wrapper.findComponent({ name: "QTable" }).props("pagination") as { rowsNumber: number }
+        expect(pag.rowsNumber).toBe(42)
+    })
+
+    it("initializes filters from the URL query (deep-link) and reflects them in the request", async () => {
+        await mountPage({ search: "report", status: "deleted", encrypted: "1", public: "1", folder: "Reports" })
+        const url = lastListUrl()
+        expect(url).toContain("search=report")
+        expect(url).toContain("status=deleted")
+        expect(url).toContain("encrypted=true")
+        expect(url).toContain("isPublic=true")
+        expect(url).toContain("folder=Reports")
+    })
+
+    it("omits the folder param when folder is the All sentinel", async () => {
+        await mountPage()
+        expect(lastListUrl()).not.toContain("folder=")
+    })
+
+    it("falls back to result length for rowsNumber when no pagination is returned", async () => {
+        routeGet({ rows: [FILE_ROW, { ...FILE_ROW, fileGuid: "g2" }] })
+        const wrapper = await mountPage()
+        const pag = wrapper.findComponent({ name: "QTable" }).props("pagination") as { rowsNumber: number }
+        expect(pag.rowsNumber).toBe(2)
+    })
+})
+
+describe("Files.vue - onRequest pagination passthrough", () => {
+    beforeEach(() => routeGet({ total: 200 }))
+
+    it("uses the sort/descending/page from a table request", async () => {
+        const wrapper = await mountPage()
+        await wrapper.findComponent({ name: "QTable" }).vm.$emit("request", {
+            pagination: { page: 3, rowsPerPage: 25, sortBy: "modifiedOn", descending: true },
+        })
+        await flushPromises()
+        const url = lastListUrl()
+        expect(url).toContain("page=3")
+        expect(url).toContain("perPage=25")
+        expect(url).toContain("sortBy=modifiedOn")
+        expect(url).toContain("descending=true")
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/left-nav-menu-dialog.test.ts b/VueApp/src/CMS/__tests__/left-nav-menu-dialog.test.ts
new file mode 100644
index 000000000..88eb81f37
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/left-nav-menu-dialog.test.ts
@@ -0,0 +1,100 @@
+import LeftNavMenuDialog from "@/CMS/components/LeftNavMenuDialog.vue"
+import { mountCms, flushPromises } from "./test-utils"
+
+/**
+ * LeftNavMenuDialog adds a left-nav menu. The behaviors worth locking down: the menu-header
+ * field is required (greedy validation blocks save), opening the dialog resets to an empty
+ * form and captures the unsaved-changes baseline, and a successful POST emits created + closes.
+ */
+
+const mockPost = vi.fn<(...args: unknown[]) => unknown>()
+vi.mock("@/composables/ViperFetch", () => ({
+    useFetch: () => ({
+        post: (...args: unknown[]) => mockPost(...args),
+    }),
+}))
+
+function bodyText(): string {
+    return document.body.textContent ?? ""
+}
+
+// QDialog teleports its DOM, but the component tree (and so findComponent) still includes the
+// teleported children. Trigger submit on the QForm's <form> element via VTU so a real event is
+// dispatched (calling QForm.submit() directly passes an undefined event and trips .prevent).
+async function submitDialogForm(wrapper: ReturnType<typeof mountDialog>): Promise<void> {
+    await wrapper.findComponent({ name: "QForm" }).find("form").trigger("submit")
+}
+
+function mountDialog(modelValue = true) {
+    return mountCms(LeftNavMenuDialog, { props: { modelValue } })
+}
+
+describe("LeftNavMenuDialog.vue", () => {
+    beforeEach(() => {
+        mockPost.mockReset()
+        document.body.innerHTML = ""
+    })
+
+    it("renders the Add Left-Nav Menu title and Create button when open", async () => {
+        mountDialog(true)
+        await flushPromises()
+        expect(bodyText()).toContain("Add Left-Nav Menu")
+        expect(bodyText()).toContain("Create Menu")
+    })
+
+    it("blocks save and shows the validation banner when the menu header is blank", async () => {
+        const wrapper = mountDialog(true)
+        await flushPromises()
+        await submitDialogForm(wrapper)
+        await flushPromises()
+        expect(mockPost).not.toHaveBeenCalled()
+        expect(bodyText()).toContain("Please complete the required fields")
+    })
+
+    it("POSTs the menu and emits created + close on success", async () => {
+        mockPost.mockResolvedValue({ success: true, result: { leftNavMenuId: 42 } })
+        const wrapper = mountDialog(true)
+        await flushPromises()
+
+        // The menu-header field is the first QInput the settings fields render.
+        await wrapper.findComponent({ name: "QInput" }).setValue("Main Menu")
+        await flushPromises()
+
+        await submitDialogForm(wrapper)
+        await flushPromises()
+
+        expect(mockPost).toHaveBeenCalledOnce()
+        const [url, payload] = mockPost.mock.calls[0]!
+        expect(url).toContain("cms/left-navs")
+        expect(payload).toMatchObject({ menuHeaderText: "Main Menu", system: "Viper" })
+        // Blank optional fields are normalized to null.
+        expect((payload as Record<string, unknown>).page).toBeNull()
+        expect(wrapper.emitted("created")?.at(-1)).toEqual([42])
+        expect(wrapper.emitted("update:modelValue")?.at(-1)).toEqual([false])
+    })
+
+    it("surfaces the server error and keeps the dialog open when POST fails", async () => {
+        mockPost.mockResolvedValue({ success: false, errors: ["A menu with that name exists"] })
+        const wrapper = mountDialog(true)
+        await flushPromises()
+
+        await wrapper.findComponent({ name: "QInput" }).setValue("Dupe")
+        await flushPromises()
+
+        await submitDialogForm(wrapper)
+        await flushPromises()
+
+        expect(bodyText()).toContain("A menu with that name exists")
+        expect(wrapper.emitted("created")).toBeFalsy()
+    })
+
+    it("closes immediately (no guard prompt) when the form is unchanged", async () => {
+        const wrapper = mountDialog(true)
+        await flushPromises()
+        // Close with a pristine, empty form: confirmClose resolves true with no dialog.
+        await wrapper.findComponent({ name: "QBtn" }).trigger("click")
+        await flushPromises()
+        expect(wrapper.emitted("update:modelValue")?.at(-1)).toEqual([false])
+        expect(bodyText()).not.toContain("Unsaved Changes")
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/left-nav-menus.test.ts b/VueApp/src/CMS/__tests__/left-nav-menus.test.ts
new file mode 100644
index 000000000..70c6f3d65
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/left-nav-menus.test.ts
@@ -0,0 +1,93 @@
+import LeftNavMenus from "@/CMS/pages/LeftNavMenus.vue"
+import { mountCms, flushPromises, createTestRouter } from "./test-utils"
+
+/**
+ * LeftNavMenus list: filter inputs drive system/search query params, returned rows bind to the
+ * table, and the ?add=1 deep-link opens the add dialog on mount.
+ */
+
+const mockGet = vi.fn<(...args: unknown[]) => unknown>()
+vi.mock("@/composables/ViperFetch", () => ({
+    useFetch: () => ({
+        get: (...args: unknown[]) => mockGet(...args),
+        del: vi.fn<(...args: unknown[]) => unknown>(),
+        post: vi.fn<(...args: unknown[]) => unknown>(),
+        createUrlSearchParams: (obj: Record<string, string | number | null | undefined>) => {
+            const params = new URLSearchParams()
+            for (const [k, v] of Object.entries(obj)) {
+                if (v !== null && v !== undefined) {
+                    params.append(k, v.toString())
+                }
+            }
+            return params
+        },
+    }),
+}))
+
+const MENU_ROW = {
+    leftNavMenuId: 1,
+    menuHeaderText: "Main",
+    system: "Viper",
+    viperSectionPath: null,
+    page: null,
+    friendlyName: null,
+    items: [{ leftNavItemId: 1 }],
+    modifiedOn: "2024-01-01T00:00:00",
+    modifiedBy: "u",
+}
+
+function routeGet(rows: unknown[] = [MENU_ROW]) {
+    mockGet.mockReset()
+    mockGet.mockResolvedValue({ success: true, result: rows })
+}
+
+function lastUrl(): string {
+    return (mockGet.mock.calls.at(-1)?.[0] as string) ?? ""
+}
+
+async function mountPage(query: Record<string, string> = {}) {
+    const router = createTestRouter()
+    await router.push({ path: "/CMS/ManageLeftNav", query })
+    await router.isReady()
+    const wrapper = mountCms(LeftNavMenus, {}, router)
+    await flushPromises()
+    await flushPromises()
+    return wrapper
+}
+
+describe("LeftNavMenus.vue", () => {
+    beforeEach(() => routeGet())
+
+    it("loads menus on mount and binds the returned rows to the table", async () => {
+        const wrapper = await mountPage()
+        expect(mockGet).toHaveBeenCalled()
+        expect(wrapper.findComponent({ name: "QTable" }).props("rows")).toHaveLength(1)
+        expect(wrapper.text()).toContain("Main")
+    })
+
+    it("includes the search term in the query when the search field changes", async () => {
+        const wrapper = await mountPage()
+        const searchInput = wrapper.findAllComponents({ name: "QInput" })[0]!
+        searchInput.vm.$emit("update:modelValue", "main")
+        await flushPromises()
+        expect(lastUrl()).toContain("search=main")
+    })
+
+    it("includes the chosen system in the query", async () => {
+        const wrapper = await mountPage()
+        const systemSelect = wrapper.findAllComponents({ name: "QSelect" })[0]!
+        systemSelect.vm.$emit("update:modelValue", "Public")
+        await flushPromises()
+        expect(lastUrl()).toContain("system=Public")
+    })
+
+    it("opens the add dialog when ?add=1 is present on mount", async () => {
+        const wrapper = await mountPage({ add: "1" })
+        expect(wrapper.findComponent({ name: "LeftNavMenuDialog" }).props("modelValue")).toBeTruthy()
+    })
+
+    it("leaves the add dialog closed without ?add=1", async () => {
+        const wrapper = await mountPage()
+        expect(wrapper.findComponent({ name: "LeftNavMenuDialog" }).props("modelValue")).toBeFalsy()
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/link-collections.test.ts b/VueApp/src/CMS/__tests__/link-collections.test.ts
new file mode 100644
index 000000000..681fed2c5
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/link-collections.test.ts
@@ -0,0 +1,206 @@
+import LinkCollections from "@/CMS/components/LinkCollections.vue"
+import type { Link, LinkCollection } from "@/CMS/types"
+import { mountCms, flushPromises } from "./test-utils"
+
+/**
+ * LinkCollections is the most logic-dense CMS display component: it loads a collection and
+ * its links, derives tag-category filters, then filters (search across title/description/tags,
+ * case-insensitive; plus per-category tag select) and optionally groups links by a category.
+ * These tests mock ViperFetch to seed deterministic data and assert the filter/group output.
+ */
+
+const mockGet = vi.fn<(...args: unknown[]) => unknown>()
+vi.mock("@/composables/ViperFetch", () => ({
+    useFetch: () => ({
+        get: (...args: unknown[]) => mockGet(...args),
+        createUrlSearchParams: (obj: Record<string, string | number | null | undefined>) => {
+            const params = new URLSearchParams()
+            for (const [k, v] of Object.entries(obj)) {
+                if (v !== null && v !== undefined) {
+                    params.append(k, v.toString())
+                }
+            }
+            return params
+        },
+    }),
+}))
+
+const TYPE_CATEGORY_ID = 1
+const SUBJECT_CATEGORY_ID = 2
+
+const collection: LinkCollection = {
+    linkCollectionId: 7,
+    linkCollection: "Resources",
+    linkCollectionTagCategories: [
+        { linkCollectionTagCategoryId: TYPE_CATEGORY_ID, linkCollectionTagCategory: "Type", sortOrder: 1 },
+        { linkCollectionTagCategoryId: SUBJECT_CATEGORY_ID, linkCollectionTagCategory: "Subject", sortOrder: 2 },
+    ],
+}
+
+function tag(categoryId: number, value: string) {
+    return {
+        linkTagId: Math.floor(Math.random() * 100_000),
+        linkId: 0,
+        linkCollectionTagCategoryId: categoryId,
+        sortOrder: 1,
+        value,
+    }
+}
+
+const links: Link[] = [
+    {
+        linkId: 1,
+        url: "https://a.example.com",
+        title: "Anatomy Guide",
+        description: "Bones and muscles",
+        order: 1,
+        linkTags: [tag(TYPE_CATEGORY_ID, "PDF"), tag(SUBJECT_CATEGORY_ID, "Anatomy")],
+    },
+    {
+        linkId: 2,
+        url: "https://b.example.com",
+        title: "Pharmacology Notes",
+        description: "Drug interactions",
+        order: 2,
+        linkTags: [tag(TYPE_CATEGORY_ID, "Doc"), tag(SUBJECT_CATEGORY_ID, "Pharmacology")],
+    },
+    {
+        linkId: 3,
+        url: "https://c.example.com",
+        title: "Anatomy Atlas",
+        description: "Detailed plates",
+        order: 3,
+        linkTags: [tag(TYPE_CATEGORY_ID, "PDF"), tag(SUBJECT_CATEGORY_ID, "Anatomy")],
+    },
+]
+
+// First get() returns the collection wrapped in an array (the component reads result[0]);
+// the second returns the link list.
+function primeFetch(linkList: Link[] = links) {
+    mockGet.mockReset()
+    mockGet
+        .mockResolvedValueOnce({ success: true, result: [collection] })
+        .mockResolvedValueOnce({ success: true, result: linkList })
+}
+
+async function mountLoaded(props: { linkCollectionName: string; groupByTagCategory?: string | null }) {
+    const wrapper = mountCms(LinkCollections, { props })
+    await flushPromises()
+    await flushPromises()
+    return wrapper
+}
+
+function linkCardTitles(wrapper: ReturnType<typeof mountCms>): string[] {
+    return wrapper.findAllComponents({ name: "Link" }).map((c) => (c.props("link") as Link).title)
+}
+
+describe("LinkCollections.vue - loading", () => {
+    beforeEach(() => primeFetch())
+
+    it("requests the collection by name then loads its links", async () => {
+        await mountLoaded({ linkCollectionName: "Resources" })
+        expect(mockGet).toHaveBeenCalledTimes(2)
+        expect(mockGet.mock.calls[0]![0]).toContain("linkCollectionName=Resources")
+        expect(mockGet.mock.calls[1]![0]).toContain(`/${collection.linkCollectionId}/links`)
+    })
+
+    it("renders one Link card per loaded link when no filter is active", async () => {
+        const wrapper = await mountLoaded({ linkCollectionName: "Resources" })
+        expect(linkCardTitles(wrapper)).toHaveLength(3)
+    })
+})
+
+describe("LinkCollections.vue - search filter", () => {
+    beforeEach(() => primeFetch())
+
+    it("filters by title case-insensitively", async () => {
+        const wrapper = await mountLoaded({ linkCollectionName: "Resources" })
+        const vm = wrapper.vm as unknown as { search: string }
+        vm.search = "anatomy"
+        await flushPromises()
+        expect(linkCardTitles(wrapper).toSorted()).toEqual(["Anatomy Atlas", "Anatomy Guide"])
+    })
+
+    it("matches on description text", async () => {
+        const wrapper = await mountLoaded({ linkCollectionName: "Resources" })
+        const vm = wrapper.vm as unknown as { search: string }
+        vm.search = "interactions"
+        await flushPromises()
+        expect(linkCardTitles(wrapper)).toEqual(["Pharmacology Notes"])
+    })
+
+    it("matches on a tag value", async () => {
+        const wrapper = await mountLoaded({ linkCollectionName: "Resources" })
+        const vm = wrapper.vm as unknown as { search: string }
+        vm.search = "pharmacology"
+        await flushPromises()
+        // "Pharmacology" matches both the title and the Subject tag of link 2 only.
+        expect(linkCardTitles(wrapper)).toEqual(["Pharmacology Notes"])
+    })
+
+    it("shows the empty banner when nothing matches", async () => {
+        const wrapper = await mountLoaded({ linkCollectionName: "Resources" })
+        const vm = wrapper.vm as unknown as { search: string }
+        vm.search = "zzz-no-match"
+        await flushPromises()
+        expect(linkCardTitles(wrapper)).toHaveLength(0)
+        expect(wrapper.text()).toContain("No links found.")
+    })
+})
+
+describe("LinkCollections.vue - tag category filter", () => {
+    beforeEach(() => primeFetch())
+
+    it("filters links to those carrying the selected tag value", async () => {
+        const wrapper = await mountLoaded({ linkCollectionName: "Resources" })
+        const vm = wrapper.vm as unknown as {
+            tagFilters: { linkCollectionTagCategoryId: number; selected: string | null }[]
+        }
+        const subjectFilter = vm.tagFilters.find((t) => t.linkCollectionTagCategoryId === SUBJECT_CATEGORY_ID)!
+        subjectFilter.selected = "Anatomy"
+        await flushPromises()
+        expect(linkCardTitles(wrapper).toSorted()).toEqual(["Anatomy Atlas", "Anatomy Guide"])
+    })
+
+    it("builds de-duplicated, sorted options per category from the link tags", async () => {
+        const wrapper = await mountLoaded({ linkCollectionName: "Resources" })
+        const vm = wrapper.vm as unknown as {
+            tagFilters: { linkCollectionTagCategoryId: number; options: string[] }[]
+        }
+        const subject = vm.tagFilters.find((t) => t.linkCollectionTagCategoryId === SUBJECT_CATEGORY_ID)!
+        // Anatomy appears twice in the data but must be de-duplicated.
+        expect(subject.options).toEqual(["Anatomy", "Pharmacology"])
+    })
+})
+
+describe("LinkCollections.vue - group by tag category", () => {
+    beforeEach(() => primeFetch())
+
+    it("getInGroup returns only links whose group tag matches the group value", async () => {
+        const wrapper = await mountLoaded({ linkCollectionName: "Resources", groupByTagCategory: "Subject" })
+        const vm = wrapper.vm as unknown as {
+            getInGroup: (links: Link[], group: string) => Link[]
+            filteredLinks: Link[]
+        }
+        const anatomy = vm.getInGroup(vm.filteredLinks, "Anatomy").map((l) => l.title)
+        expect(anatomy.toSorted()).toEqual(["Anatomy Atlas", "Anatomy Guide"])
+        const pharm = vm.getInGroup(vm.filteredLinks, "Pharmacology").map((l) => l.title)
+        expect(pharm).toEqual(["Pharmacology Notes"])
+    })
+
+    it("getInGroup returns all links unchanged when no group category is set", async () => {
+        primeFetch()
+        const wrapper = await mountLoaded({ linkCollectionName: "Resources" })
+        const vm = wrapper.vm as unknown as {
+            getInGroup: (links: Link[], group: string) => Link[]
+            filteredLinks: Link[]
+        }
+        expect(vm.getInGroup(vm.filteredLinks, "anything")).toHaveLength(3)
+    })
+
+    it("computes the sorted set of group header values", async () => {
+        const wrapper = await mountLoaded({ linkCollectionName: "Resources", groupByTagCategory: "Subject" })
+        const vm = wrapper.vm as unknown as { groupByValues: string[] }
+        expect(vm.groupByValues).toEqual(["Anatomy", "Pharmacology"])
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/link.test.ts b/VueApp/src/CMS/__tests__/link.test.ts
new file mode 100644
index 000000000..cc8fd6c26
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/link.test.ts
@@ -0,0 +1,136 @@
+// oxlint-disable no-script-url -- a javascript: URL is the unsafe input under test here
+import LinkComponent from "@/CMS/components/Link.vue"
+import type { Link, LinkCollection } from "@/CMS/types"
+import { mountCms } from "./test-utils"
+
+/**
+ * Link.vue renders a single collection link. The two behaviors worth locking down are:
+ * unsafe URLs degrade to plain text (no href), and tag badges color-cycle through a
+ * fixed palette keyed by each tag category's 1-based sortOrder.
+ */
+
+function makeCollection(sortOrders: number[]): LinkCollection {
+    return {
+        linkCollectionId: 1,
+        linkCollection: "Resources",
+        linkCollectionTagCategories: sortOrders.map((sortOrder, i) => ({
+            linkCollectionTagCategoryId: i + 1,
+            linkCollectionTagCategory: `Category ${i + 1}`,
+            sortOrder,
+        })),
+    }
+}
+
+function makeLink(overrides: Partial<Link> = {}): Link {
+    return {
+        linkId: 10,
+        url: "https://example.com",
+        title: "Example",
+        description: "An example link",
+        order: 1,
+        linkTags: [],
+        ...overrides,
+    }
+}
+
+describe("Link.vue - URL safety", () => {
+    it("renders an anchor with the safe href for an http(s) URL", () => {
+        const wrapper = mountCms(LinkComponent, {
+            props: { link: makeLink({ url: "https://example.com/page" }), linkCollection: makeCollection([]) },
+        })
+        const anchor = wrapper.find("a")
+        expect(anchor.exists()).toBeTruthy()
+        expect(anchor.attributes("href")).toBe("https://example.com/page")
+        expect(anchor.attributes("target")).toBe("_blank")
+        expect(anchor.attributes("rel")).toBe("noopener noreferrer")
+    })
+
+    it("renders the title as plain text (no anchor) for a javascript: URL", () => {
+        const wrapper = mountCms(LinkComponent, {
+            props: {
+                link: makeLink({ url: "javascript:alert(1)", title: "Sketchy" }),
+                linkCollection: makeCollection([]),
+            },
+        })
+        expect(wrapper.find("a").exists()).toBeFalsy()
+        expect(wrapper.text()).toContain("Sketchy")
+    })
+
+    it("renders plain text for an empty URL (safeHref returns '#')", () => {
+        const wrapper = mountCms(LinkComponent, {
+            props: { link: makeLink({ url: "" }), linkCollection: makeCollection([]) },
+        })
+        expect(wrapper.find("a").exists()).toBeFalsy()
+    })
+})
+
+describe("Link.vue - tag badge color cycling", () => {
+    // The palette has 6 entries; the component maps sortOrder n -> index (n-1) % 6.
+    // sortOrder 1 -> warning/dark, 2 -> secondary/white, 7 -> wraps back to warning/dark.
+    function mountWithTag(categorySortOrder: number) {
+        const categoryId = 1
+        const collection: LinkCollection = {
+            linkCollectionId: 1,
+            linkCollection: "Resources",
+            linkCollectionTagCategories: [
+                {
+                    linkCollectionTagCategoryId: categoryId,
+                    linkCollectionTagCategory: "Cat",
+                    sortOrder: categorySortOrder,
+                },
+            ],
+        }
+        const link = makeLink({
+            linkTags: [
+                { linkTagId: 1, linkId: 10, linkCollectionTagCategoryId: categoryId, sortOrder: 1, value: "TagValue" },
+            ],
+        })
+        return mountCms(LinkComponent, { props: { link, linkCollection: collection } })
+    }
+
+    it("uses the first palette entry (warning) for sortOrder 1", () => {
+        const wrapper = mountWithTag(1)
+        const badge = wrapper.findComponent({ name: "QBadge" })
+        expect(badge.exists()).toBeTruthy()
+        expect(badge.props("color")).toBe("warning")
+        expect(badge.props("textColor")).toBe("dark")
+        expect(badge.text()).toContain("TagValue")
+    })
+
+    it("uses the second palette entry (secondary) for sortOrder 2", () => {
+        const badge = mountWithTag(2).findComponent({ name: "QBadge" })
+        expect(badge.props("color")).toBe("secondary")
+        expect(badge.props("textColor")).toBe("white")
+    })
+
+    it("wraps modulo the palette length so sortOrder 7 matches sortOrder 1", () => {
+        const badge = mountWithTag(7).findComponent({ name: "QBadge" })
+        expect(badge.props("color")).toBe("warning")
+        expect(badge.props("textColor")).toBe("dark")
+    })
+
+    it("falls back to the first entry for a non-positive sortOrder", () => {
+        const badge = mountWithTag(0).findComponent({ name: "QBadge" })
+        expect(badge.props("color")).toBe("warning")
+    })
+
+    it("only renders badges for tags whose category matches the collection category", () => {
+        const collection: LinkCollection = {
+            linkCollectionId: 1,
+            linkCollection: "Resources",
+            linkCollectionTagCategories: [
+                { linkCollectionTagCategoryId: 1, linkCollectionTagCategory: "Cat1", sortOrder: 1 },
+            ],
+        }
+        const link = makeLink({
+            linkTags: [
+                { linkTagId: 1, linkId: 10, linkCollectionTagCategoryId: 1, sortOrder: 1, value: "Shown" },
+                { linkTagId: 2, linkId: 10, linkCollectionTagCategoryId: 99, sortOrder: 1, value: "Hidden" },
+            ],
+        })
+        const wrapper = mountCms(LinkComponent, { props: { link, linkCollection: collection } })
+        const badges = wrapper.findAllComponents({ name: "QBadge" })
+        expect(badges).toHaveLength(1)
+        expect(badges[0]!.text()).toContain("Shown")
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/modified-stamp.test.ts b/VueApp/src/CMS/__tests__/modified-stamp.test.ts
new file mode 100644
index 000000000..2057abda5
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/modified-stamp.test.ts
@@ -0,0 +1,60 @@
+import ModifiedStamp from "@/CMS/components/ModifiedStamp.vue"
+import { mountCms } from "./test-utils"
+
+/**
+ * ModifiedStamp shows a "MM/DD/YY by <user>" stamp. It renders a <q-td> in table mode
+ * (cellProps given) or a plain <span> in card/grid mode (row given), sharing one date
+ * format. A blank modifiedOn must produce no date text.
+ */
+
+describe("ModifiedStamp.vue", () => {
+    it("formats modifiedOn as MM/DD/YY (en-US 2-digit)", () => {
+        // Card mode (row prop) and table mode share the same `formatted` computed; assert the
+        // format via the plainly-rendered span so we don't depend on QTable's slot internals.
+        const wrapper = mountCms(ModifiedStamp, {
+            props: { row: { modifiedOn: "2024-03-09T12:00:00", modifiedBy: "jdoe" } },
+        })
+        expect(wrapper.text()).toContain("03/09/24")
+        expect(wrapper.text()).toContain("jdoe")
+    })
+
+    it("renders a q-td when given cellProps (table mode)", () => {
+        const wrapper = mountCms(ModifiedStamp, {
+            props: { cellProps: { row: { modifiedOn: "2024-03-09T12:00:00", modifiedBy: "jdoe" } } },
+        })
+        expect(wrapper.findComponent({ name: "QTd" }).exists()).toBeTruthy()
+    })
+
+    it("renders a plain span (no q-td) when given a row directly (card mode)", () => {
+        const wrapper = mountCms(ModifiedStamp, {
+            props: { row: { modifiedOn: "2024-03-09T12:00:00", modifiedBy: "asmith" } },
+        })
+        expect(wrapper.findComponent({ name: "QTd" }).exists()).toBeFalsy()
+        expect(wrapper.find("span").exists()).toBeTruthy()
+        expect(wrapper.text()).toContain("03/09/24")
+        expect(wrapper.text()).toContain("asmith")
+    })
+
+    it("renders no date text when modifiedOn is empty", () => {
+        const wrapper = mountCms(ModifiedStamp, {
+            props: { row: { modifiedOn: "", modifiedBy: "nobody" } },
+        })
+        expect(wrapper.text().trim()).toBe("nobody")
+        // No slashes from a formatted date.
+        expect(wrapper.text()).not.toContain("/")
+    })
+
+    it("chooses the q-td (cellProps) branch when both cellProps and row are supplied", () => {
+        // The template's v-if is on cellProps, so supplying both renders the q-td branch (and
+        // the stamp computed prefers cellProps.row), never the plain-span row branch.
+        const wrapper = mountCms(ModifiedStamp, {
+            props: {
+                cellProps: { row: { modifiedOn: "2024-03-09T12:00:00", modifiedBy: "fromCell" } },
+                row: { modifiedOn: "2020-01-01T00:00:00", modifiedBy: "fromRow" },
+            },
+        })
+        expect(wrapper.findComponent({ name: "QTd" }).exists()).toBeTruthy()
+        // The span-only fallback branch must not render alongside the q-td.
+        expect(wrapper.text()).not.toContain("fromRow")
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/permission-selector.test.ts b/VueApp/src/CMS/__tests__/permission-selector.test.ts
new file mode 100644
index 000000000..85d5702a5
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/permission-selector.test.ts
@@ -0,0 +1,86 @@
+import PermissionSelector from "@/CMS/components/PermissionSelector.vue"
+import { mountCms, flushPromises } from "./test-utils"
+
+/**
+ * PermissionSelector lazily loads the full permission list on first filter, then filters it
+ * client-side (case-insensitive substring). Subsequent filters must not re-fetch. Driving the
+ * QSelect's filter() method exercises the component's @filter handler with a real done callback.
+ */
+
+const mockGet = vi.fn<(...args: unknown[]) => unknown>()
+vi.mock("@/composables/ViperFetch", () => ({
+    useFetch: () => ({
+        get: (...args: unknown[]) => mockGet(...args),
+    }),
+}))
+
+const ALL_PERMISSIONS = ["SVMSecure.CMS", "SVMSecure.CMS.Files", "SVMSecure.Effort", "CTS.Manage"]
+
+function mountSelector(modelValue: string[] = []) {
+    return mountCms(PermissionSelector, { props: { modelValue } })
+}
+
+// Quasar's @filter handler is (val, update, abort); the component only uses (val, update), so
+// runUpdate (which runs the setter synchronously, as Quasar would) is all we need to drive it.
+const runUpdate = (fn: () => void) => fn()
+
+// Invoke the component's @filter handler directly via the QSelect's "filter" event.
+async function filter(wrapper: ReturnType<typeof mountSelector>, value: string) {
+    wrapper.findComponent({ name: "QSelect" }).vm.$emit("filter", value, runUpdate)
+    await flushPromises()
+    await flushPromises()
+}
+
+function currentOptions(wrapper: ReturnType<typeof mountSelector>): string[] {
+    return (wrapper.findComponent({ name: "QSelect" }).props("options") as string[]) ?? []
+}
+
+describe("PermissionSelector.vue", () => {
+    beforeEach(() => {
+        mockGet.mockReset()
+        mockGet.mockResolvedValue({ success: true, result: ALL_PERMISSIONS })
+    })
+
+    it("does not fetch permissions until the first filter", () => {
+        mountSelector()
+        expect(mockGet).not.toHaveBeenCalled()
+    })
+
+    it("lazy-loads the permission list on first filter and shows all for an empty needle", async () => {
+        const wrapper = mountSelector()
+        await filter(wrapper, "")
+        expect(mockGet).toHaveBeenCalledOnce()
+        expect(mockGet.mock.calls[0]![0]).toContain("cms/options/permissions")
+        expect(currentOptions(wrapper)).toEqual(ALL_PERMISSIONS)
+    })
+
+    it("filters case-insensitively by substring", async () => {
+        const wrapper = mountSelector()
+        await filter(wrapper, "cms")
+        expect(currentOptions(wrapper)).toEqual(["SVMSecure.CMS", "SVMSecure.CMS.Files"])
+    })
+
+    it("does not re-fetch on a second filter (list is cached after first load)", async () => {
+        const wrapper = mountSelector()
+        await filter(wrapper, "cms")
+        await filter(wrapper, "effort")
+        expect(mockGet).toHaveBeenCalledOnce()
+        expect(currentOptions(wrapper)).toEqual(["SVMSecure.Effort"])
+    })
+
+    it("emits the selected permissions array on update", async () => {
+        const wrapper = mountSelector(["SVMSecure.CMS"])
+        const select = wrapper.findComponent({ name: "QSelect" })
+        select.vm.$emit("update:modelValue", ["SVMSecure.CMS", "SVMSecure.Effort"])
+        await flushPromises()
+        expect(wrapper.emitted("update:modelValue")?.at(-1)).toEqual([["SVMSecure.CMS", "SVMSecure.Effort"]])
+    })
+
+    it("coerces a null clear to an empty array on update", async () => {
+        const wrapper = mountSelector(["SVMSecure.CMS"])
+        const select = wrapper.findComponent({ name: "QSelect" })
+        select.vm.$emit("update:modelValue", null)
+        await flushPromises()
+        expect(wrapper.emitted("update:modelValue")?.at(-1)).toEqual([[]])
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/person-selector.test.ts b/VueApp/src/CMS/__tests__/person-selector.test.ts
new file mode 100644
index 000000000..a85557750
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/person-selector.test.ts
@@ -0,0 +1,98 @@
+import PersonSelector from "@/CMS/components/PersonSelector.vue"
+import type { CmsPersonOption } from "@/CMS/types"
+import { mountCms, flushPromises } from "./test-utils"
+
+/**
+ * PersonSelector searches people server-side, but only once the query reaches 2+ characters
+ * (shorter queries clear options without a request). An out-of-order guard (searchSeq) drops
+ * stale responses. These tests drive the QSelect filter() and assert the min-chars gate and
+ * the request query param.
+ */
+
+const mockGet = vi.fn<(...args: unknown[]) => unknown>()
+vi.mock("@/composables/ViperFetch", () => ({
+    useFetch: () => ({
+        get: (...args: unknown[]) => mockGet(...args),
+        createUrlSearchParams: (obj: Record<string, string | number | null | undefined>) => {
+            const params = new URLSearchParams()
+            for (const [k, v] of Object.entries(obj)) {
+                if (v !== null && v !== undefined) {
+                    params.append(k, v.toString())
+                }
+            }
+            return params
+        },
+    }),
+}))
+
+const PEOPLE: CmsPersonOption[] = [
+    { iamId: "iam1", name: "Jane Doe", loginId: "jdoe", mailId: "jdoe@x.com" },
+    { iamId: "iam2", name: "John Smith", loginId: "jsmith", mailId: "jsmith@x.com" },
+]
+
+function mountSelector(modelValue: { iamId: string; name: string | null }[] = []) {
+    return mountCms(PersonSelector, { props: { modelValue } })
+}
+
+// Quasar's @filter handler is (val, update, abort); the component only uses (val, update), so
+// runUpdate (which runs the setter synchronously) is all we need to drive it.
+const runUpdate = (fn: () => void) => fn()
+
+async function filter(wrapper: ReturnType<typeof mountSelector>, value: string) {
+    wrapper.findComponent({ name: "QSelect" }).vm.$emit("filter", value, runUpdate)
+    await flushPromises()
+    await flushPromises()
+}
+
+function currentOptions(wrapper: ReturnType<typeof mountSelector>): CmsPersonOption[] {
+    return (wrapper.findComponent({ name: "QSelect" }).props("options") as CmsPersonOption[]) ?? []
+}
+
+describe("PersonSelector.vue", () => {
+    beforeEach(() => {
+        mockGet.mockReset()
+        mockGet.mockResolvedValue({ success: true, result: PEOPLE })
+    })
+
+    it("does not search for a single-character query", async () => {
+        const wrapper = mountSelector()
+        await filter(wrapper, "j")
+        expect(mockGet).not.toHaveBeenCalled()
+        expect(currentOptions(wrapper)).toEqual([])
+    })
+
+    it("does not search for a whitespace-padded query under 2 chars", async () => {
+        const wrapper = mountSelector()
+        await filter(wrapper, " a ")
+        expect(mockGet).not.toHaveBeenCalled()
+    })
+
+    it("searches once the query reaches 2 characters, passing a trimmed search param", async () => {
+        const wrapper = mountSelector()
+        await filter(wrapper, "  ja  ")
+        expect(mockGet).toHaveBeenCalledOnce()
+        const url = mockGet.mock.calls[0]![0] as string
+        expect(url).toContain("cms/options/people")
+        expect(url).toContain("search=ja")
+        expect(currentOptions(wrapper)).toEqual(PEOPLE)
+    })
+
+    it("clears options when the search fails", async () => {
+        mockGet.mockResolvedValue({ success: false, result: null })
+        const wrapper = mountSelector()
+        await filter(wrapper, "jane")
+        expect(currentOptions(wrapper)).toEqual([])
+    })
+
+    it("emits the selected people array on update and coerces null to []", async () => {
+        const wrapper = mountSelector()
+        const select = wrapper.findComponent({ name: "QSelect" })
+        select.vm.$emit("update:modelValue", [{ iamId: "iam1", name: "Jane Doe" }])
+        await flushPromises()
+        expect(wrapper.emitted("update:modelValue")?.at(-1)).toEqual([[{ iamId: "iam1", name: "Jane Doe" }]])
+
+        select.vm.$emit("update:modelValue", null)
+        await flushPromises()
+        expect(wrapper.emitted("update:modelValue")?.at(-1)).toEqual([[]])
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/recent-activity.test.ts b/VueApp/src/CMS/__tests__/recent-activity.test.ts
new file mode 100644
index 000000000..45f088a5a
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/recent-activity.test.ts
@@ -0,0 +1,146 @@
+import RecentActivity from "@/CMS/components/RecentActivity.vue"
+import { mountCms, flushPromises } from "./test-utils"
+
+/**
+ * RecentActivity merges up to three sources (content blocks, files, left-nav menus), each
+ * gated by a prop, then sorts the merged items by modifiedOn (desc) and caps at MAX_ITEMS (8).
+ * It uses Promise.allSettled, so a single source failing must NOT mark the panel failed;
+ * only an all-reject set does. typeLabel is shown per item.
+ */
+
+const mockGet = vi.fn<(...args: unknown[]) => unknown>()
+vi.mock("@/composables/ViperFetch", () => ({
+    useFetch: () => ({
+        get: (...args: unknown[]) => mockGet(...args),
+        createUrlSearchParams: (obj: Record<string, string | number | null | undefined>) => {
+            const params = new URLSearchParams()
+            for (const [k, v] of Object.entries(obj)) {
+                if (v !== null && v !== undefined) {
+                    params.append(k, v.toString())
+                }
+            }
+            return params
+        },
+    }),
+}))
+
+function block(id: number, modifiedOn: string, title = `Block ${id}`) {
+    return { contentBlockId: id, title, friendlyName: null, modifiedOn, modifiedBy: "editor" }
+}
+function file(guid: string, modifiedOn: string, friendlyName = `File ${guid}`) {
+    return { fileGuid: guid, friendlyName, modifiedOn, modifiedBy: "uploader" }
+}
+function leftNav(id: number, modifiedOn: string, menuHeaderText = `Menu ${id}`) {
+    return { leftNavMenuId: id, menuHeaderText, friendlyName: null, modifiedOn, modifiedBy: "navadmin" }
+}
+
+// Routes requests to the right canned response based on the URL the component builds.
+function routeGet(handlers: { blocks?: unknown; files?: unknown; leftNavs?: unknown }) {
+    mockGet.mockReset()
+    mockGet.mockImplementation((...args: unknown[]) => {
+        const url = args[0] as string
+        if (url.includes("CMS/content")) {
+            return Promise.resolve(handlers.blocks)
+        }
+        if (url.includes("cms/files")) {
+            return Promise.resolve(handlers.files)
+        }
+        if (url.includes("cms/left-navs")) {
+            return Promise.resolve(handlers.leftNavs)
+        }
+        return Promise.resolve({ success: false, result: [] })
+    })
+}
+
+async function mountActivity(props: Record<string, boolean>) {
+    const wrapper = mountCms(RecentActivity, { props })
+    await flushPromises()
+    await flushPromises()
+    return wrapper
+}
+
+describe("RecentActivity.vue - source gating", () => {
+    it("loads no sources and shows the empty message when all flags are off", async () => {
+        routeGet({})
+        const wrapper = await mountActivity({})
+        expect(mockGet).not.toHaveBeenCalled()
+        expect(wrapper.text()).toContain("Nothing edited recently.")
+    })
+
+    it("loads only blocks when showBlocks is set", async () => {
+        routeGet({ blocks: { success: true, result: [block(1, "2024-01-01T00:00:00")] } })
+        await mountActivity({ showBlocks: true })
+        expect(mockGet).toHaveBeenCalledOnce()
+        expect(mockGet.mock.calls[0]![0]).toContain("CMS/content")
+    })
+
+    it("loads all three sources when every flag is set", async () => {
+        routeGet({
+            blocks: { success: true, result: [block(1, "2024-01-03T00:00:00")] },
+            files: { success: true, result: [file("g1", "2024-01-02T00:00:00")] },
+            leftNavs: { success: true, result: [leftNav(1, "2024-01-01T00:00:00")] },
+        })
+        await mountActivity({ showBlocks: true, showFiles: true, showLeftNavs: true })
+        expect(mockGet).toHaveBeenCalledTimes(3)
+    })
+})
+
+describe("RecentActivity.vue - merge, sort, cap", () => {
+    it("merges sources and sorts by modifiedOn descending", async () => {
+        routeGet({
+            blocks: { success: true, result: [block(1, "2024-01-01T00:00:00", "Old block")] },
+            files: { success: true, result: [file("g1", "2024-03-01T00:00:00", "New file")] },
+            leftNavs: { success: true, result: [leftNav(1, "2024-02-01T00:00:00", "Mid menu")] },
+        })
+        const wrapper = await mountActivity({ showBlocks: true, showFiles: true, showLeftNavs: true })
+        const labels = wrapper.findAll(".q-item__label").map((n) => n.text())
+        const newFileIdx = labels.findIndex((t) => t.includes("New file"))
+        const midMenuIdx = labels.findIndex((t) => t.includes("Mid menu"))
+        const oldBlockIdx = labels.findIndex((t) => t.includes("Old block"))
+        expect(newFileIdx).toBeLessThan(midMenuIdx)
+        expect(midMenuIdx).toBeLessThan(oldBlockIdx)
+    })
+
+    it("caps the merged list at MAX_ITEMS (8)", async () => {
+        // Five blocks + five files = 10 candidates after each source's own per-source cap.
+        const fiveBlocks = Array.from({ length: 5 }, (_, i) => block(i + 1, `2024-01-0${i + 1}T00:00:00`))
+        const fiveFiles = Array.from({ length: 5 }, (_, i) => file(`g${i}`, `2024-02-0${i + 1}T00:00:00`))
+        routeGet({
+            blocks: { success: true, result: fiveBlocks },
+            files: { success: true, result: fiveFiles },
+        })
+        const wrapper = await mountActivity({ showBlocks: true, showFiles: true })
+        expect(wrapper.findAllComponents({ name: "QItem" })).toHaveLength(8)
+    })
+
+    it("renders the typeLabel for each item", async () => {
+        routeGet({
+            blocks: { success: true, result: [block(1, "2024-01-01T00:00:00")] },
+            files: { success: true, result: [file("g1", "2024-01-02T00:00:00")] },
+        })
+        const wrapper = await mountActivity({ showBlocks: true, showFiles: true })
+        expect(wrapper.text()).toContain("Content block")
+        expect(wrapper.text()).toContain("File")
+    })
+})
+
+describe("RecentActivity.vue - partial failure semantics", () => {
+    it("does NOT mark failed when one source rejects but another succeeds", async () => {
+        routeGet({
+            blocks: { success: false, result: [] }, // LoadBlocks throws on !success
+            files: { success: true, result: [file("g1", "2024-01-02T00:00:00")] },
+        })
+        const wrapper = await mountActivity({ showBlocks: true, showFiles: true })
+        expect(wrapper.text()).not.toContain("Couldn't load recent activity.")
+        expect(wrapper.findAllComponents({ name: "QItem" })).toHaveLength(1)
+    })
+
+    it("marks failed only when ALL active sources reject", async () => {
+        routeGet({
+            blocks: { success: false, result: [] },
+            files: { success: false, result: [] },
+        })
+        const wrapper = await mountActivity({ showBlocks: true, showFiles: true })
+        expect(wrapper.text()).toContain("Couldn't load recent activity.")
+    })
+})
diff --git a/VueApp/src/CMS/__tests__/test-utils.ts b/VueApp/src/CMS/__tests__/test-utils.ts
new file mode 100644
index 000000000..697f62ba2
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/test-utils.ts
@@ -0,0 +1,82 @@
+import { mount } from "@vue/test-utils"
+import type { ComponentMountingOptions } from "@vue/test-utils"
+import { createRouter, createWebHistory } from "vue-router"
+import type { Router, RouteRecordRaw } from "vue-router"
+import { Quasar, Notify, Dialog } from "quasar"
+import { nextTick } from "vue"
+
+/**
+ * Shared test utilities for CMS component/page tests.
+ *
+ * CMS has no Pinia store (state is local to each component), so these helpers
+ * only need a Quasar plugin set, a test router, and an "apiURL" provide value
+ * that mirrors what cms.ts injects at runtime.
+ */
+
+// Components build request URLs as inject("apiURL") + "cms/...". Tests assert against
+// this prefix, so keep it stable and obvious.
+const TEST_API_URL = "/api/"
+
+// Route table mirroring the real CMS route names/paths (src/CMS/router/routes.ts) so
+// router-link :to and programmatic navigation resolve exactly as they do in production.
+const stub = { template: "<div />" }
+const CMS_ROUTES: RouteRecordRaw[] = [
+    { path: "/", name: "CmsHome", component: stub },
+    { path: "/CMS/ManageContentBlocks", name: "CmsContentBlocks", component: stub },
+    { path: "/CMS/ManageContentBlocks/History", name: "CmsContentBlockHistory", component: stub },
+    { path: "/CMS/ManageContentBlocks/Edit/:id?", name: "CmsContentBlockEdit", component: stub },
+    { path: "/CMS/ManageFiles", name: "CmsFiles", component: stub },
+    { path: "/CMS/ManageFiles/Audit", name: "CmsFileAudit", component: stub },
+    { path: "/CMS/ManageFiles/Import", name: "CmsFileImport", component: stub },
+    { path: "/CMS/ManageFiles/BulkEncrypt", name: "CmsBulkEncrypt", component: stub },
+    { path: "/CMS/ManageLeftNav", name: "CmsLeftNavMenus", component: stub },
+    { path: "/CMS/ManageLeftNav/Edit/:id?", name: "CmsLeftNavEdit", component: stub },
+]
+
+function createTestRouter(): Router {
+    return createRouter({
+        history: createWebHistory(),
+        routes: CMS_ROUTES,
+    })
+}
+
+// Generic mount wrapper: registers Quasar (with Notify + Dialog so components that call
+// $q.notify / $q.dialog don't blow up), a router, and the apiURL provide.
+function mountCms<T>(component: T, options: ComponentMountingOptions<T> = {}, router?: Router) {
+    const testRouter = router ?? createTestRouter()
+    const { global: globalOptions = {}, ...rest } = options as Record<string, unknown> & {
+        global?: Record<string, unknown>
+    }
+    return mount(
+        component as never,
+        {
+            ...rest,
+            global: {
+                plugins: [[Quasar, { plugins: { Notify, Dialog } }], testRouter],
+                provide: { apiURL: TEST_API_URL },
+                ...globalOptions,
+            },
+        } as ComponentMountingOptions<T>,
+    )
+}
+
+// Flush microtasks so awaited fetch mocks and the DOM both settle before assertions.
+async function flushPromises(): Promise<void> {
+    await Promise.resolve()
+    await nextTick()
+    await Promise.resolve()
+}
+
+// Router replace/push navigation resolves over several microtask turns; run enough flush
+// cycles (recursively, to avoid an await-in-loop) for the URL query and any query-watcher
+// reactions to settle before asserting on router.currentRoute.
+async function flushRouter(cycles = 10): Promise<void> {
+    if (cycles <= 0) {
+        return
+    }
+    await flushPromises()
+    await nextTick()
+    await flushRouter(cycles - 1)
+}
+
+export { createTestRouter, mountCms, flushPromises, flushRouter }
diff --git a/VueApp/src/CMS/__tests__/url.test.ts b/VueApp/src/CMS/__tests__/url.test.ts
new file mode 100644
index 000000000..dea379c5c
--- /dev/null
+++ b/VueApp/src/CMS/__tests__/url.test.ts
@@ -0,0 +1,107 @@
+// oxlint-disable no-script-url -- this suite exists to prove javascript: URLs are blocked, so the literals are intentional
+import { isSafeUrl, safeHref } from "@/CMS/utils/url"
+
+/**
+ * Exhaustive coverage of the CMS URL safety helpers. These guard every user-supplied
+ * link rendered as an href, so the allowed/blocked scheme split and the null/empty
+ * asymmetry are the security-critical contract.
+ */
+
+describe("CMS url safety - isSafeUrl", () => {
+    describe("allowed schemes pass", () => {
+        it.each([
+            ["http", "http://example.com/page"],
+            ["https", "https://example.com/page"],
+            ["mailto", "mailto:person@example.com"],
+            ["tel", "tel:+15555551234"],
+        ])("treats %s as safe", (_scheme, url) => {
+            expect(isSafeUrl(url)).toBeTruthy()
+        })
+
+        it("is case-insensitive about the scheme (URL normalizes it)", () => {
+            expect(isSafeUrl("HTTPS://example.com")).toBeTruthy()
+            expect(isSafeUrl("MailTo:person@example.com")).toBeTruthy()
+        })
+    })
+
+    describe("dangerous schemes are blocked", () => {
+        it.each([
+            ["javascript", "javascript:alert(1)"],
+            ["data", "data:text/html,<script>alert(1)</script>"],
+            ["file", "file:///etc/passwd"],
+            ["vbscript", "vbscript:msgbox(1)"],
+        ])("rejects %s: URLs", (_scheme, url) => {
+            expect(isSafeUrl(url)).toBeFalsy()
+        })
+
+        it("blocks a javascript: URL regardless of casing/whitespace padding", () => {
+            expect(isSafeUrl("  JavaScript:alert(1)  ")).toBeFalsy()
+        })
+    })
+
+    describe("null / empty / whitespace are treated as safe (asymmetry with safeHref)", () => {
+        // IsSafeUrl returns true for absent values: an empty link is not a dangerous link,
+        // so it controls the "render as text vs link" choice. safeHref still returns "#"
+        // for the same inputs because there is no usable destination.
+        it.each([
+            ["null", null],
+            ["undefined", undefined],
+            ["empty string", ""],
+            ["whitespace only", "   "],
+        ])("returns true for %s", (_label, value) => {
+            expect(isSafeUrl(value)).toBeTruthy()
+        })
+    })
+
+    describe("malformed URLs are rejected", () => {
+        it.each([
+            ["scheme with no host", "http://"],
+            ["colons only", "::::"],
+            ["bare word", "not a url"],
+            ["protocol-relative (no scheme for URL())", "//example.com/foo"],
+        ])("returns false for %s", (_label, url) => {
+            expect(isSafeUrl(url)).toBeFalsy()
+        })
+    })
+})
+
+describe("CMS url safety - safeHref", () => {
+    it("returns the original URL unchanged for allowed schemes", () => {
+        expect(safeHref("https://example.com/a?b=c#d")).toBe("https://example.com/a?b=c#d")
+        expect(safeHref("mailto:person@example.com")).toBe("mailto:person@example.com")
+        expect(safeHref("tel:+15555551234")).toBe("tel:+15555551234")
+    })
+
+    it("preserves surrounding text but the original (untrimmed) string is returned", () => {
+        // Trimming is only used for the safety check; the returned value is the normalized
+        // (trimmed) form for valid URLs.
+        expect(safeHref("  https://example.com  ")).toBe("https://example.com")
+    })
+
+    it.each([
+        ["javascript", "javascript:alert(1)"],
+        ["data", "data:text/html,x"],
+        ["file", "file:///etc/passwd"],
+        ["vbscript", "vbscript:msgbox(1)"],
+    ])("returns '#' for blocked %s scheme", (_scheme, url) => {
+        expect(safeHref(url)).toBe("#")
+    })
+
+    it.each([
+        ["null", null],
+        ["undefined", undefined],
+        ["empty string", ""],
+        ["whitespace only", "   "],
+    ])("returns '#' for %s (asymmetry: isSafeUrl says true here)", (_label, value) => {
+        expect(safeHref(value)).toBe("#")
+        expect(isSafeUrl(value)).toBeTruthy()
+    })
+
+    it.each([
+        ["scheme with no host", "http://"],
+        ["colons only", "::::"],
+        ["bare word", "not a url"],
+    ])("returns '#' for malformed input %s", (_label, url) => {
+        expect(safeHref(url)).toBe("#")
+    })
+})
diff --git a/VueApp/src/CMS/components/ContentDiffDialog.vue b/VueApp/src/CMS/components/ContentDiffDialog.vue
new file mode 100644
index 000000000..b803d3cb2
--- /dev/null
+++ b/VueApp/src/CMS/components/ContentDiffDialog.vue
@@ -0,0 +1,159 @@
+<template>
+    <q-dialog
+        :model-value="modelValue"
+        aria-labelledby="content-diff-title"
+        @update:model-value="emit('update:modelValue', $event)"
+    >
+        <q-card class="dialog-card-lg">
+            <q-card-section class="row items-center q-pb-none">
+                <div
+                    id="content-diff-title"
+                    class="text-h6"
+                >
+                    {{ title }}
+                </div>
+                <q-space />
+                <q-btn
+                    v-close-popup
+                    flat
+                    round
+                    dense
+                    icon="close"
+                    aria-label="Close"
+                />
+            </q-card-section>
+
+            <!-- Direction (old vs new) is the most important thing to read, so it sits at body
+                 contrast, not as a muted caption. -->
+            <q-card-section
+                v-if="subtitle"
+                class="text-body2 q-pb-none"
+            >
+                {{ subtitle }}
+            </q-card-section>
+
+            <!-- Legend only when there are real changes to read; it ties each color to a version. -->
+            <q-card-section
+                v-if="hasComparison && hasChanges && !loading"
+                class="row items-center q-gutter-sm q-pb-none text-caption"
+            >
+                <span class="cms-diff-legend"><ins class="diffins">added</ins> (newer)</span>
+                <span class="cms-diff-legend"><del class="diffdel">removed</del> (older)</span>
+            </q-card-section>
+
+            <q-separator class="q-mt-sm" />
+
+            <q-card-section
+                v-if="loading"
+                class="diff-body"
+            >
+                <div
+                    class="row items-center"
+                    role="status"
+                >
+                    <q-spinner color="primary" />
+                    <span class="sr-only">Loading diff</span>
+                </div>
+            </q-card-section>
+
+            <!-- Identical versions: state it plainly, no body (there is nothing to diff). -->
+            <q-card-section
+                v-else-if="hasComparison && !hasChanges"
+                class="text-body2 text-grey-8"
+                role="status"
+            >
+                These two versions are identical.
+            </q-card-section>
+
+            <template v-else>
+                <q-card-section
+                    v-if="!hasComparison"
+                    class="text-body2 text-grey-8"
+                    role="status"
+                >
+                    {{ emptyMessage }}
+                </q-card-section>
+                <q-card-section class="scroll diff-body">
+                    <!-- diffHtml is re-sanitized server-side after diffing (SanitizeDiff), keeping only ins/del markers -->
+                    <!-- eslint-disable vue/no-v-html -->
+                    <div
+                        v-html="diffHtml"
+                        class="content-block cms-diff"
+                    ></div>
+                    <!-- eslint-enable vue/no-v-html -->
+                </q-card-section>
+            </template>
+        </q-card>
+    </q-dialog>
+</template>
+
+<script setup lang="ts">
+withDefaults(
+    defineProps<{
+        modelValue: boolean
+        loading?: boolean
+        title?: string
+        subtitle?: string
+        diffHtml?: string
+        hasComparison?: boolean
+        hasChanges?: boolean
+        emptyMessage?: string
+    }>(),
+    {
+        loading: false,
+        title: "Content differences",
+        subtitle: "",
+        diffHtml: "",
+        hasComparison: true,
+        hasChanges: true,
+        emptyMessage: "This is the original version, so there is nothing to compare it against.",
+    },
+)
+
+const emit = defineEmits<{ "update:modelValue": [value: boolean] }>()
+</script>
+
+<style scoped>
+.diff-body {
+    max-height: 60vh;
+}
+
+/* htmldiff.net wraps changes in ins/del with diffins/diffdel/diffmod classes. Underline for
+   additions and strikethrough for deletions carry the meaning alongside the tint, so the diff
+   stays legible without relying on color. Ink text (--q-dark) on these light tints clears WCAG AA. */
+.cms-diff :deep(ins.diffins),
+.cms-diff :deep(ins.diffmod),
+.cms-diff-legend ins {
+    background-color: #d7efdb;
+    color: var(--q-dark);
+    text-decoration: underline;
+}
+
+.cms-diff :deep(del.diffdel),
+.cms-diff :deep(del.diffmod),
+.cms-diff-legend del {
+    background-color: #f6d9dc;
+    color: var(--q-dark);
+    text-decoration: line-through;
+}
+
+.cms-diff :deep(ins.diffins img),
+.cms-diff :deep(ins.diffmod img) {
+    outline: 2px solid var(--q-positive);
+}
+
+.cms-diff :deep(del.diffdel img),
+.cms-diff :deep(del.diffmod img) {
+    outline: 2px solid var(--q-negative);
+}
+
+/* Keep arbitrary historical content (wide tables, large images) inside the dialog. */
+.cms-diff :deep(img) {
+    max-width: 100%;
+    height: auto;
+}
+
+.cms-diff :deep(table) {
+    max-width: 100%;
+}
+</style>
diff --git a/VueApp/src/CMS/components/DateRangeFilter.vue b/VueApp/src/CMS/components/DateRangeFilter.vue
new file mode 100644
index 000000000..3acf4b6d7
--- /dev/null
+++ b/VueApp/src/CMS/components/DateRangeFilter.vue
@@ -0,0 +1,33 @@
+<template>
+    <div class="col-12 col-sm-3 col-lg-2">
+        <q-input
+            v-model="from"
+            dense
+            outlined
+            clearable
+            label="From"
+            type="date"
+            stack-label
+            @update:model-value="emit('change')"
+        />
+    </div>
+    <div class="col-12 col-sm-3 col-lg-2">
+        <q-input
+            v-model="to"
+            dense
+            outlined
+            clearable
+            label="To"
+            type="date"
+            stack-label
+            @update:model-value="emit('change')"
+        />
+    </div>
+</template>
+
+<script setup lang="ts">
+// Shared From/To date-range inputs for the CMS audit/history list pages.
+const from = defineModel<string>("from", { required: true })
+const to = defineModel<string>("to", { required: true })
+const emit = defineEmits<{ change: [] }>()
+</script>
diff --git a/VueApp/src/CMS/components/FileFormDialog.vue b/VueApp/src/CMS/components/FileFormDialog.vue
index 68bba5c8b..5a9c42e23 100644
--- a/VueApp/src/CMS/components/FileFormDialog.vue
+++ b/VueApp/src/CMS/components/FileFormDialog.vue
@@ -7,7 +7,7 @@
         @hide="resetForm"
         @keydown.escape="handleClose"
     >
-        <q-card style="width: 600px; max-width: 95vw">
+        <q-card class="dialog-card-md">
             <q-card-section class="row items-center q-pb-none">
                 <div
                     id="file-dialog-title"
@@ -158,7 +158,7 @@
                 persistent
                 aria-labelledby="conflict-dialog-title"
             >
-                <q-card style="width: 480px; max-width: 95vw">
+                <q-card class="dialog-card-sm">
                     <q-card-section class="row items-center q-pb-none">
                         <div
                             id="conflict-dialog-title"
diff --git a/VueApp/src/CMS/components/LeftNavMenuDialog.vue b/VueApp/src/CMS/components/LeftNavMenuDialog.vue
index f7e434a18..40832979c 100644
--- a/VueApp/src/CMS/components/LeftNavMenuDialog.vue
+++ b/VueApp/src/CMS/components/LeftNavMenuDialog.vue
@@ -6,7 +6,7 @@
         @update:model-value="emit('update:modelValue', $event)"
         @keydown.escape="handleClose"
     >
-        <q-card style="width: 480px; max-width: 95vw">
+        <q-card class="dialog-card-sm">
             <q-card-section class="row items-center q-pb-none">
                 <div
                     id="add-menu-title"
diff --git a/VueApp/src/CMS/components/Link.vue b/VueApp/src/CMS/components/Link.vue
index ed1d07765..b03cae42e 100644
--- a/VueApp/src/CMS/components/Link.vue
+++ b/VueApp/src/CMS/components/Link.vue
@@ -1,15 +1,8 @@
 <template>
     <q-card
         :bordered="true"
-        :clickable="isSafe"
-        v-ripple="isSafe"
-        :class="['link-card', isSafe ? 'cursor-pointer q-hoverable' : '']"
-        @click="isSafe && openWebReports(props.link.url)"
+        class="link-card"
     >
-        <span
-            v-if="isSafe"
-            class="q-focus-helper"
-        ></span>
         <q-card-section class="q-py-sm">
             <div class="text-h3">
                 <a
@@ -53,7 +46,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, watch } from "vue"
+import { computed } from "vue"
 import type { Link, LinkCollection } from "@/CMS/types"
 import { safeHref } from "@/CMS/utils/url"
 const props = defineProps<{
@@ -79,14 +72,6 @@ function getTagStyle(order: number) {
     const idx = order >= 1 ? (order - 1) % TAG_STYLES.length : 0
     return TAG_STYLES[idx]!
 }
-
-function openWebReports(url: string) {
-    const href = safeHref(url)
-    if (href === "#") return
-    window.open(href, "_blank", "noopener,noreferrer")?.focus()
-}
-
-watch(props, () => {}, { deep: true })
 </script>
 
 <style scoped>
diff --git a/VueApp/src/CMS/components/LinkCollections.vue b/VueApp/src/CMS/components/LinkCollections.vue
index f743fe941..22c79326f 100644
--- a/VueApp/src/CMS/components/LinkCollections.vue
+++ b/VueApp/src/CMS/components/LinkCollections.vue
@@ -30,6 +30,7 @@
                         label="Search"
                         stack-label
                         clearable
+                        debounce="300"
                         class="col-12 col-sm-6 col-md-3 col-lg-2"
                     >
                         <template #append>
diff --git a/VueApp/src/CMS/components/ListCard.vue b/VueApp/src/CMS/components/ListCard.vue
new file mode 100644
index 000000000..9eb5a0508
--- /dev/null
+++ b/VueApp/src/CMS/components/ListCard.vue
@@ -0,0 +1,23 @@
+<template>
+    <div class="col-12 q-pa-xs">
+        <q-card
+            flat
+            bordered
+            class="list-card"
+        >
+            <q-card-section class="q-gutter-y-xs">
+                <slot name="header" />
+                <slot />
+            </q-card-section>
+            <template v-if="$slots.actions">
+                <q-separator />
+                <q-card-actions align="right">
+                    <slot name="actions" />
+                </q-card-actions>
+            </template>
+        </q-card>
+    </div>
+</template>
+
+<!-- Card shell for QTable grid (card) mode: a header region, stacked fields, and a
+     right-aligned actions row. Pairs with ListCardField for the label/value rows. -->
diff --git a/VueApp/src/CMS/components/ListCardField.vue b/VueApp/src/CMS/components/ListCardField.vue
new file mode 100644
index 000000000..8045dee4a
--- /dev/null
+++ b/VueApp/src/CMS/components/ListCardField.vue
@@ -0,0 +1,14 @@
+<template>
+    <div class="list-card-field">
+        <span class="list-card-label">{{ label }}</span>
+        <div class="list-card-value">
+            <slot>{{ value }}</slot>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+// One label/value row inside a ListCard. Pass a plain value via the prop, or richer
+// content (chips, links, a stamp) via the default slot.
+defineProps<{ label: string; value?: string | number | null }>()
+</script>
diff --git a/VueApp/src/CMS/components/ModifiedStamp.vue b/VueApp/src/CMS/components/ModifiedStamp.vue
index bfee1971f..7a8414ecd 100644
--- a/VueApp/src/CMS/components/ModifiedStamp.vue
+++ b/VueApp/src/CMS/components/ModifiedStamp.vue
@@ -1,22 +1,39 @@
 <template>
-    <q-td :props="cellProps">
+    <q-td
+        v-if="cellProps"
+        :props="cellProps"
+    >
         {{ formatted }}
-        <span class="text-grey-7">{{ cellProps.row.modifiedBy }}</span>
+        <span class="text-grey-7">{{ stamp.modifiedBy }}</span>
     </q-td>
+    <span v-else>
+        {{ formatted }}
+        <span class="text-grey-7">{{ stamp.modifiedBy }}</span>
+    </span>
 </template>
 
 <script setup lang="ts">
 import { computed } from "vue"
 
+type ModifiedRow = { modifiedOn: string; modifiedBy: string }
+
+// Renders a <q-td> when given table cell props, or a plain inline span when given a
+// row directly (QTable card/grid mode on small screens), so both layouts share one
+// date format.
 const props = defineProps<{
-    cellProps: { row: { modifiedOn: string; modifiedBy: string } }
+    cellProps?: { row: ModifiedRow }
+    row?: ModifiedRow
 }>()
 
+const stamp = computed<ModifiedRow>(() => props.cellProps?.row ?? props.row ?? { modifiedOn: "", modifiedBy: "" })
+
 const formatted = computed(() =>
-    new Date(props.cellProps.row.modifiedOn).toLocaleDateString("en-US", {
-        year: "2-digit",
-        month: "2-digit",
-        day: "2-digit",
-    }),
+    stamp.value.modifiedOn
+        ? new Date(stamp.value.modifiedOn).toLocaleDateString("en-US", {
+              year: "2-digit",
+              month: "2-digit",
+              day: "2-digit",
+          })
+        : "",
 )
 </script>
diff --git a/VueApp/src/CMS/components/RecentActivity.vue b/VueApp/src/CMS/components/RecentActivity.vue
index 596166bc1..c25ec97df 100644
--- a/VueApp/src/CMS/components/RecentActivity.vue
+++ b/VueApp/src/CMS/components/RecentActivity.vue
@@ -40,6 +40,7 @@
                 <q-item-section side>
                     <q-icon
                         :name="item.icon"
+                        :aria-label="item.typeLabel"
                         color="secondary"
                         size="sm"
                     />
@@ -50,7 +51,8 @@
                         caption
                         :title="formatFullDate(item.modifiedOn)"
                     >
-                        {{ formatTimeAgo(new Date(item.modifiedOn)) }} by {{ item.modifiedBy }}
+                        {{ item.typeLabel }} &middot; {{ formatTimeAgo(new Date(item.modifiedOn)) }} by
+                        {{ item.modifiedBy }}
                     </q-item-label>
                 </q-item-section>
             </q-item>
@@ -62,19 +64,25 @@
 import { inject, onMounted, ref } from "vue"
 import { formatTimeAgo } from "@vueuse/core"
 import { useFetch } from "@/composables/ViperFetch"
-import type { CmsContentBlock, CmsFile } from "@/CMS/types/"
+import type { CmsContentBlock, CmsFile, CmsLeftNavMenu } from "@/CMS/types/"
 
 const MAX_ITEMS = 8
 const PER_SOURCE = 5
 
-const { showBlocks = false, showFiles = false } = defineProps<{
+const {
+    showBlocks = false,
+    showFiles = false,
+    showLeftNavs = false,
+} = defineProps<{
     showBlocks?: boolean
     showFiles?: boolean
+    showLeftNavs?: boolean
 }>()
 
 type ActivityItem = {
     key: string
     icon: string
+    typeLabel: string
     label: string
     to: { name: string; params?: Record<string, string | number>; query?: Record<string, string> }
     modifiedOn: string
@@ -101,6 +109,7 @@ async function loadBlocks(): Promise<ActivityItem[]> {
         .map((b) => ({
             key: "block-" + b.contentBlockId,
             icon: "article",
+            typeLabel: "Content block",
             label: b.title || b.friendlyName || "(untitled)",
             to: { name: "CmsContentBlockEdit", params: { id: b.contentBlockId } },
             modifiedOn: b.modifiedOn,
@@ -120,7 +129,8 @@ async function loadFiles(): Promise<ActivityItem[]> {
     if (!res.success) throw new Error("files")
     return ((res.result ?? []) as CmsFile[]).map((f) => ({
         key: "file-" + f.fileGuid,
-        icon: "folder",
+        icon: "description",
+        typeLabel: "File",
         label: f.friendlyName,
         to: { name: "CmsFiles", query: { search: f.friendlyName } },
         modifiedOn: f.modifiedOn,
@@ -128,8 +138,30 @@ async function loadFiles(): Promise<ActivityItem[]> {
     }))
 }
 
+async function loadLeftNavs(): Promise<ActivityItem[]> {
+    // The left-nav list endpoint returns all menus unsorted, so sort by modifiedOn here.
+    const res = await get(apiURL + "cms/left-navs")
+    if (!res.success) throw new Error("leftNavs")
+    return [...((res.result ?? []) as CmsLeftNavMenu[])]
+        .sort((a, b) => new Date(b.modifiedOn).getTime() - new Date(a.modifiedOn).getTime())
+        .slice(0, PER_SOURCE)
+        .map((m) => ({
+            key: "leftnav-" + m.leftNavMenuId,
+            icon: "menu",
+            typeLabel: "Left-nav menu",
+            label: m.menuHeaderText || m.friendlyName || "(untitled)",
+            to: { name: "CmsLeftNavEdit", params: { id: m.leftNavMenuId } },
+            modifiedOn: m.modifiedOn,
+            modifiedBy: m.modifiedBy,
+        }))
+}
+
 async function loadActivity() {
-    const sources = [...(showBlocks ? [loadBlocks()] : []), ...(showFiles ? [loadFiles()] : [])]
+    const sources = [
+        ...(showBlocks ? [loadBlocks()] : []),
+        ...(showFiles ? [loadFiles()] : []),
+        ...(showLeftNavs ? [loadLeftNavs()] : []),
+    ]
     const results = await Promise.allSettled(sources)
     const loaded = results.filter((r) => r.status === "fulfilled").flatMap((r) => r.value)
     failed.value = sources.length > 0 && results.every((r) => r.status === "rejected")
diff --git a/VueApp/src/CMS/pages/BulkEncrypt.vue b/VueApp/src/CMS/pages/BulkEncrypt.vue
index 5e339061d..4c04030bf 100644
--- a/VueApp/src/CMS/pages/BulkEncrypt.vue
+++ b/VueApp/src/CMS/pages/BulkEncrypt.vue
@@ -70,6 +70,7 @@
             :loading="loading"
             v-model:pagination="pagination"
             :rows-per-page-options="[25, 50, 100, 250]"
+            :grid="$q.screen.lt.sm"
             dense
             flat
             bordered
@@ -78,6 +79,28 @@
             <template #body-cell-modifiedOn="cellProps">
                 <ModifiedStamp :cell-props="cellProps" />
             </template>
+
+            <template #item="itemProps">
+                <ListCard>
+                    <template #header>
+                        <div class="row items-center no-wrap q-gutter-x-sm">
+                            <q-checkbox
+                                v-model="itemProps.selected"
+                                :aria-label="`Select ${itemProps.row.friendlyName}`"
+                            />
+                            <span class="text-weight-medium">{{ itemProps.row.friendlyName }}</span>
+                        </div>
+                    </template>
+
+                    <ListCardField
+                        label="VIPER app"
+                        :value="itemProps.row.folder"
+                    />
+                    <ListCardField label="Modified">
+                        <ModifiedStamp :row="itemProps.row" />
+                    </ListCardField>
+                </ListCard>
+            </template>
         </q-table>
 
         <template v-if="results.length">
@@ -119,6 +142,8 @@ import { inflect } from "inflection"
 import { useQuasar, type QTableProps } from "quasar"
 import { useFetch } from "@/composables/ViperFetch"
 import BreadcrumbHeading from "@/components/BreadcrumbHeading.vue"
+import ListCard from "@/CMS/components/ListCard.vue"
+import ListCardField from "@/CMS/components/ListCardField.vue"
 import ModifiedStamp from "@/CMS/components/ModifiedStamp.vue"
 import type { CmsFile } from "@/CMS/types/"
 
diff --git a/VueApp/src/CMS/pages/CmsHome.vue b/VueApp/src/CMS/pages/CmsHome.vue
index 1eb9d2204..f0d2a4d70 100644
--- a/VueApp/src/CMS/pages/CmsHome.vue
+++ b/VueApp/src/CMS/pages/CmsHome.vue
@@ -51,6 +51,7 @@
                 <RecentActivity
                     :show-blocks="canManageBlocks"
                     :show-files="canManageFiles"
+                    :show-left-navs="canManageNav"
                 />
             </div>
         </div>
@@ -105,6 +106,11 @@ const sections: Section[] = [
                 permissions: ["SVMSecure.CMS.ManageContentBlocks"],
             },
             { label: "Add Content Block", to: { name: "CmsContentBlockEdit" } },
+            {
+                label: "Edit History",
+                to: { name: "CmsContentBlockHistory" },
+                permissions: ["SVMSecure.CMS.ManageContentBlocks"],
+            },
         ],
     },
     {
@@ -132,7 +138,8 @@ const visibleSections = computed(() =>
 )
 const canManageBlocks = computed(() => userStore.userInfo.permissions.includes("SVMSecure.CMS.ManageContentBlocks"))
 const canManageFiles = computed(() => userStore.userInfo.permissions.includes("SVMSecure.CMS.AllFiles"))
-const showRecentActivity = computed(() => canManageBlocks.value || canManageFiles.value)
+const canManageNav = computed(() => userStore.userInfo.permissions.includes("SVMSecure.CMS.ManageNavigation"))
+const showRecentActivity = computed(() => canManageBlocks.value || canManageFiles.value || canManageNav.value)
 </script>
 
 <style scoped>
diff --git a/VueApp/src/CMS/pages/ContentBlockEdit.vue b/VueApp/src/CMS/pages/ContentBlockEdit.vue
index a1c87a011..a3c523503 100644
--- a/VueApp/src/CMS/pages/ContentBlockEdit.vue
+++ b/VueApp/src/CMS/pages/ContentBlockEdit.vue
@@ -43,8 +43,14 @@
                         hide-bottom-space
                     />
 
-                    <div class="text-subtitle2 q-mb-xs">Content</div>
+                    <div
+                        id="content-editor-label"
+                        class="text-subtitle2 q-mb-xs"
+                    >
+                        Content
+                    </div>
                     <q-editor
+                        ref="contentEditorRef"
                         v-model="block.content"
                         min-height="20rem"
                         :toolbar="editorToolbar"
@@ -63,10 +69,35 @@
                                 options-dense
                                 outlined
                                 clearable
-                                label="Load a previous version"
+                                label="Select a previous version"
                                 :options="history"
                                 :option-label="historyLabel"
-                                @update:model-value="loadHistoryVersion"
+                            />
+                        </div>
+                        <div class="col-auto">
+                            <q-btn
+                                dense
+                                flat
+                                no-caps
+                                size="sm"
+                                color="secondary"
+                                icon="compare_arrows"
+                                label="Diff vs current"
+                                :disable="!selectedHistory"
+                                @click="diffAgainstCurrent"
+                            />
+                        </div>
+                        <div class="col-auto">
+                            <q-btn
+                                dense
+                                flat
+                                no-caps
+                                size="sm"
+                                color="primary"
+                                icon="history"
+                                label="Load into editor"
+                                :disable="!selectedHistory"
+                                @click="loadHistoryVersion"
                             />
                         </div>
                         <div
@@ -78,7 +109,7 @@
                                 dense
                                 square
                             >
-                                Viewing an old version — Save to restore it
+                                Viewing an old version, save to restore it
                             </q-chip>
                         </div>
                     </div>
@@ -99,8 +130,10 @@
                                 options-dense
                                 outlined
                                 label="System"
+                                class="required-field"
                                 :options="['Viper', 'Public']"
                                 :rules="[(v: string | null) => !!v || 'System is required']"
+                                aria-required="true"
                                 hide-bottom-space
                                 @update:model-value="onSystemChange"
                             />
@@ -257,6 +290,15 @@
                 />
             </div>
         </q-form>
+
+        <ContentDiffDialog
+            v-model="diffViewer.open"
+            :loading="diffViewer.loading"
+            :title="diffViewer.title"
+            :subtitle="diffViewer.subtitle"
+            :diff-html="diffViewer.content"
+            :has-changes="diffViewer.hasChanges"
+        />
     </div>
 </template>
 
@@ -269,7 +311,14 @@ import { useUnsavedChanges } from "@/composables/use-unsaved-changes"
 import BreadcrumbHeading from "@/components/BreadcrumbHeading.vue"
 import PermissionSelector from "@/CMS/components/PermissionSelector.vue"
 import StatusBanner from "@/components/StatusBanner.vue"
-import type { CmsContentBlock, CmsContentBlockFile, CmsContentHistoryItem, CmsFile } from "@/CMS/types/"
+import ContentDiffDialog from "@/CMS/components/ContentDiffDialog.vue"
+import type {
+    CmsContentBlock,
+    CmsContentBlockFile,
+    CmsContentHistoryDiff,
+    CmsContentHistoryItem,
+    CmsFile,
+} from "@/CMS/types/"
 
 const apiURL = inject("apiURL") + "CMS/content"
 const filesApiURL = inject("apiURL") + "cms/files/"
@@ -282,6 +331,7 @@ const blockId = computed(() => (route.params.id ? Number(route.params.id) : null
 const isNew = computed(() => blockId.value === null)
 
 const formRef = ref()
+const contentEditorRef = ref()
 const saving = ref(false)
 const formError = ref("")
 
@@ -375,6 +425,43 @@ async function loadHistoryVersion() {
     }
 }
 
+const diffViewer = ref({
+    open: false,
+    loading: false,
+    title: "",
+    subtitle: "",
+    content: "",
+    hasChanges: true,
+})
+
+// Compare the editor's current content (the "new" side) against the selected historical version
+// (the "old" side). The current content is posted because it may include unsaved edits.
+async function diffAgainstCurrent() {
+    if (!selectedHistory.value) return
+    diffViewer.value = {
+        open: true,
+        loading: true,
+        title: "Current editor content vs previous version",
+        subtitle: "",
+        content: "",
+        hasChanges: true,
+    }
+    const res = await post(
+        apiURL + "/" + blockId.value + "/history/" + selectedHistory.value.contentHistoryId + "/diff",
+        { content: block.value.content },
+    )
+    if (res.success) {
+        const diff = res.result as CmsContentHistoryDiff
+        diffViewer.value.content = diff.content
+        diffViewer.value.hasChanges = diff.hasChanges
+        diffViewer.value.subtitle = `Changes from ${historyLabel(selectedHistory.value)} to your current editor content`
+    } else {
+        $q.notify({ type: "negative", message: res.errors?.[0] ?? "Failed to build the diff" })
+        diffViewer.value.open = false
+    }
+    diffViewer.value.loading = false
+}
+
 async function searchFiles(val: string, update: (fn: () => void) => void) {
     if (val.trim().length < 2) {
         update(() => {
@@ -500,6 +587,9 @@ async function restoreBlock() {
 }
 
 onMounted(() => {
+    // QEditor renders the focusable contenteditable as an inner element, so its accessible
+    // name has to be set there rather than on the wrapper the "Content" label sits beside.
+    contentEditorRef.value?.getContentEl()?.setAttribute("aria-labelledby", "content-editor-label")
     loadSectionPaths()
     loadBlock()
     // loadBlock sets the baseline for an existing block after it loads; a brand-new form's
diff --git a/VueApp/src/CMS/pages/ContentBlockHistory.vue b/VueApp/src/CMS/pages/ContentBlockHistory.vue
new file mode 100644
index 000000000..7edf1ba78
--- /dev/null
+++ b/VueApp/src/CMS/pages/ContentBlockHistory.vue
@@ -0,0 +1,378 @@
+<template>
+    <div class="q-pa-md">
+        <BreadcrumbHeading
+            label="Edit History"
+            parent-label="Manage Content Blocks"
+            :parent-to="{ name: 'CmsContentBlocks' }"
+        />
+
+        <p class="text-body2 text-grey-8 q-mb-md">
+            Every saved edit keeps the version it replaced. This lists those past versions across all content blocks.
+            The current version of each block is on its edit page.
+        </p>
+
+        <div class="row q-col-gutter-md q-mb-sm">
+            <div class="col-12 col-sm-3 col-lg-2">
+                <q-input
+                    v-model="filters.modifiedBy"
+                    dense
+                    outlined
+                    clearable
+                    debounce="400"
+                    label="Modified By"
+                    @update:model-value="reload"
+                />
+            </div>
+            <DateRangeFilter
+                v-model:from="filters.from"
+                v-model:to="filters.to"
+                @change="reload"
+            />
+            <div class="col-12 col-sm-4 col-lg-3">
+                <q-input
+                    v-model="filters.search"
+                    dense
+                    outlined
+                    clearable
+                    debounce="400"
+                    label="Search block title or page"
+                    @update:model-value="reload"
+                >
+                    <template #prepend>
+                        <q-icon name="search" />
+                    </template>
+                </q-input>
+            </div>
+        </div>
+
+        <div
+            v-if="contentBlockId"
+            class="q-mb-sm"
+        >
+            <q-chip
+                removable
+                dense
+                color="primary"
+                text-color="white"
+                @remove="clearBlockFilter"
+            >
+                Filtered to one block: {{ contentBlockId }}
+            </q-chip>
+        </div>
+
+        <q-table
+            :rows="entries"
+            :columns="columns"
+            row-key="contentHistoryId"
+            :loading="loading"
+            v-model:pagination="pagination"
+            :rows-per-page-options="[25, 50, 100, 250]"
+            :grid="$q.screen.lt.sm"
+            dense
+            flat
+            bordered
+            @request="onRequest"
+        >
+            <template #body-cell-modifiedOn="cellProps">
+                <q-td :props="cellProps">
+                    {{
+                        cellProps.row.modifiedOn
+                            ? formatDateTime(cellProps.row.modifiedOn, { dateStyle: "short", timeStyle: "short" })
+                            : ""
+                    }}
+                </q-td>
+            </template>
+            <template #body-cell-block="cellProps">
+                <q-td :props="cellProps">
+                    <router-link :to="{ name: 'CmsContentBlockEdit', params: { id: cellProps.row.contentBlockId } }">
+                        {{ blockLabel(cellProps.row) }}
+                    </router-link>
+                    <q-badge
+                        v-if="cellProps.row.blockDeleted"
+                        color="negative"
+                        class="q-ml-sm"
+                        label="deleted"
+                    />
+                    <div
+                        v-if="cellProps.row.page"
+                        class="text-caption text-grey-7"
+                    >
+                        {{ cellProps.row.page }}
+                    </div>
+                </q-td>
+            </template>
+            <template #body-cell-actions="cellProps">
+                <q-td :props="cellProps">
+                    <q-btn
+                        dense
+                        flat
+                        no-caps
+                        size="sm"
+                        color="secondary"
+                        icon="compare_arrows"
+                        class="diff-action-btn"
+                        aria-label="Diff with previous version"
+                        @click="viewDiff(cellProps.row)"
+                    >
+                        <q-tooltip>Diff with previous version</q-tooltip>
+                    </q-btn>
+                </q-td>
+            </template>
+
+            <template #item="{ row }">
+                <ListCard>
+                    <template #header>
+                        <div class="row items-center no-wrap q-gutter-x-xs">
+                            <router-link
+                                class="text-weight-medium"
+                                :to="{ name: 'CmsContentBlockEdit', params: { id: row.contentBlockId } }"
+                            >
+                                {{ blockLabel(row) }}
+                            </router-link>
+                            <q-badge
+                                v-if="row.blockDeleted"
+                                color="negative"
+                                label="deleted"
+                            />
+                        </div>
+                        <div
+                            v-if="row.page"
+                            class="text-caption text-grey-7"
+                        >
+                            {{ row.page }}
+                        </div>
+                    </template>
+
+                    <ListCardField label="Date">
+                        {{
+                            row.modifiedOn
+                                ? formatDateTime(row.modifiedOn, { dateStyle: "short", timeStyle: "short" })
+                                : ""
+                        }}
+                    </ListCardField>
+                    <ListCardField
+                        label="Modified By"
+                        :value="row.modifiedBy"
+                    />
+
+                    <template #actions>
+                        <q-btn
+                            dense
+                            flat
+                            no-caps
+                            size="sm"
+                            color="secondary"
+                            icon="compare_arrows"
+                            label="Diff"
+                            class="diff-action-btn"
+                            aria-label="Diff with previous version"
+                            @click="viewDiff(row)"
+                        />
+                    </template>
+                </ListCard>
+            </template>
+        </q-table>
+
+        <ContentDiffDialog
+            v-model="viewer.open"
+            :loading="viewer.loading"
+            :title="viewer.title"
+            :subtitle="viewer.subtitle"
+            :diff-html="viewer.content"
+            :has-comparison="viewer.hasComparison"
+            :has-changes="viewer.hasChanges"
+        />
+    </div>
+</template>
+
+<script setup lang="ts">
+import { inject, onMounted, ref, watch } from "vue"
+import { useRoute, useRouter } from "vue-router"
+import { useQuasar, type QTableProps } from "quasar"
+import { useFetch } from "@/composables/ViperFetch"
+import { useDateFunctions } from "@/composables/DateFunctions"
+import BreadcrumbHeading from "@/components/BreadcrumbHeading.vue"
+import DateRangeFilter from "@/CMS/components/DateRangeFilter.vue"
+import ContentDiffDialog from "@/CMS/components/ContentDiffDialog.vue"
+import ListCard from "@/CMS/components/ListCard.vue"
+import ListCardField from "@/CMS/components/ListCardField.vue"
+import type { CmsContentHistoryAudit, CmsContentHistoryDiff } from "@/CMS/types/"
+
+const apiBase = inject("apiURL")
+const listUrl = apiBase + "CMS/content/history"
+const $q = useQuasar()
+const route = useRoute()
+const router = useRouter()
+const { get, createUrlSearchParams } = useFetch()
+const { formatDateTime } = useDateFunctions()
+
+const entries = ref<CmsContentHistoryAudit[]>([])
+const loading = ref(false)
+const contentBlockId = ref<string | null>((route.query.contentBlockId as string) || null)
+
+// Filters initialize from the URL so filtered views can be shared/deep-linked.
+const filters = ref({
+    modifiedBy: typeof route.query.modifiedBy === "string" ? route.query.modifiedBy : "",
+    from: typeof route.query.from === "string" ? route.query.from : "",
+    to: typeof route.query.to === "string" ? route.query.to : "",
+    search: typeof route.query.search === "string" ? route.query.search : "",
+})
+
+// Reflect the active filters back into the URL (empty values are omitted).
+function syncFiltersToUrl() {
+    void router.replace({
+        query: {
+            contentBlockId: contentBlockId.value || undefined,
+            modifiedBy: filters.value.modifiedBy || undefined,
+            from: filters.value.from || undefined,
+            to: filters.value.to || undefined,
+            search: filters.value.search || undefined,
+        },
+    })
+}
+
+const pagination = ref({
+    sortBy: "modifiedOn",
+    descending: true,
+    page: 1,
+    rowsPerPage: 50,
+    rowsNumber: 0,
+})
+
+const columns: QTableProps["columns"] = [
+    { name: "modifiedOn", label: "Date", field: "modifiedOn", align: "left" },
+    { name: "modifiedBy", label: "Modified By", field: "modifiedBy", align: "left" },
+    { name: "block", label: "Block", field: "title", align: "left" },
+    { name: "actions", label: "Actions", field: "contentHistoryId", align: "center" },
+]
+
+function blockLabel(row: CmsContentHistoryAudit): string {
+    return row.title || row.friendlyName || "(untitled)"
+}
+
+type TableRequestPagination = {
+    sortBy: string
+    descending: boolean
+    page: number
+    rowsPerPage: number
+    rowsNumber?: number
+}
+
+async function onRequest(requestProps: { pagination: TableRequestPagination }) {
+    const { page, rowsPerPage } = requestProps.pagination
+    loading.value = true
+    const params = createUrlSearchParams({
+        contentBlockId: contentBlockId.value,
+        modifiedBy: filters.value.modifiedBy || null,
+        from: filters.value.from || null,
+        to: filters.value.to || null,
+        search: filters.value.search || null,
+        page,
+        perPage: rowsPerPage,
+    })
+    const res = await get(listUrl + "?" + params)
+    if (res.success) {
+        entries.value = res.result
+        pagination.value.rowsNumber = res.pagination?.totalRecords ?? res.result.length
+        pagination.value.page = page
+        pagination.value.rowsPerPage = rowsPerPage
+    } else {
+        $q.notify({ type: "negative", message: res.errors?.[0] ?? "Failed to load edit history" })
+    }
+    loading.value = false
+}
+
+function reload() {
+    syncFiltersToUrl()
+    void onRequest({ pagination: { ...pagination.value, page: 1 } })
+}
+
+function clearBlockFilter() {
+    contentBlockId.value = null
+    reload()
+}
+
+const viewer = ref({
+    open: false,
+    loading: false,
+    title: "",
+    subtitle: "",
+    content: "",
+    hasComparison: true,
+    hasChanges: true,
+})
+
+function diffStamp(on: string | null, by: string | null): string {
+    return (
+        (on ? formatDateTime(on, { dateStyle: "short", timeStyle: "short" }) : "unknown date") + (by ? ` by ${by}` : "")
+    )
+}
+
+async function viewDiff(row: CmsContentHistoryAudit) {
+    viewer.value = {
+        open: true,
+        loading: true,
+        title: blockLabel(row),
+        subtitle: "",
+        content: "",
+        hasComparison: true,
+        hasChanges: true,
+    }
+    const res = await get(apiBase + "CMS/content/" + row.contentBlockId + "/history/" + row.contentHistoryId + "/diff")
+    if (res.success) {
+        const diff = res.result as CmsContentHistoryDiff
+        viewer.value.content = diff.content
+        viewer.value.hasComparison = diff.hasComparison
+        viewer.value.hasChanges = diff.hasChanges
+        viewer.value.subtitle = diff.hasComparison
+            ? `Changes from ${diffStamp(diff.oldModifiedOn, diff.oldModifiedBy)} to ${diffStamp(diff.newModifiedOn, diff.newModifiedBy)}`
+            : `Original version, ${diffStamp(diff.newModifiedOn, diff.newModifiedBy)}`
+    } else {
+        $q.notify({ type: "negative", message: res.errors?.[0] ?? "Failed to load this version" })
+        viewer.value.open = false
+    }
+    viewer.value.loading = false
+}
+
+// Re-sync filters from the URL when in-app navigation reuses this view with a different
+// query (e.g. a per-block ?contentBlockId deep-link). The equality guard skips our own
+// syncFiltersToUrl write so it doesn't double-fetch.
+watch(
+    () => route.query,
+    (query) => {
+        const nextBlock = typeof query.contentBlockId === "string" ? query.contentBlockId : null
+        const next = {
+            modifiedBy: typeof query.modifiedBy === "string" ? query.modifiedBy : "",
+            from: typeof query.from === "string" ? query.from : "",
+            to: typeof query.to === "string" ? query.to : "",
+            search: typeof query.search === "string" ? query.search : "",
+        }
+        const f = filters.value
+        if (
+            nextBlock === contentBlockId.value &&
+            next.modifiedBy === f.modifiedBy &&
+            next.from === f.from &&
+            next.to === f.to &&
+            next.search === f.search
+        ) {
+            return
+        }
+        contentBlockId.value = nextBlock
+        filters.value = next
+        void onRequest({ pagination: { ...pagination.value, page: 1 } })
+    },
+)
+
+onMounted(reload)
+</script>
+
+<style scoped>
+/* The diff action is icon-only and its tooltip label is unavailable on touch, so give it a
+   44px touch target on coarse pointers. Mouse/trackpad keep the dense table-action size. */
+@media (pointer: coarse) {
+    .diff-action-btn {
+        min-width: 44px;
+        min-height: 44px;
+    }
+}
+</style>
diff --git a/VueApp/src/CMS/pages/ContentBlocks.vue b/VueApp/src/CMS/pages/ContentBlocks.vue
index 557055115..e9bce085e 100644
--- a/VueApp/src/CMS/pages/ContentBlocks.vue
+++ b/VueApp/src/CMS/pages/ContentBlocks.vue
@@ -23,7 +23,7 @@
                     map-options
                     label="Status"
                     :options="statusOptions"
-                    @update:model-value="loadBlocks"
+                    @update:model-value="reload"
                 />
             </div>
             <div class="col-12 col-sm-3 col-lg-2">
@@ -35,7 +35,7 @@
                     map-options
                     label="System"
                     :options="systemOptions"
-                    @update:model-value="loadBlocks"
+                    @update:model-value="reload"
                 />
             </div>
             <div class="col-12 col-sm-3 col-lg-2">
@@ -46,7 +46,7 @@
                     clearable
                     label="VIPER section"
                     :options="sectionPaths"
-                    @update:model-value="loadBlocks"
+                    @update:model-value="reload"
                 />
             </div>
             <div class="col-12 col-sm-3 col-lg-3">
@@ -56,7 +56,7 @@
                     clearable
                     debounce="400"
                     label="Search title, name, page, or content"
-                    @update:model-value="loadBlocks"
+                    @update:model-value="reload"
                 >
                     <template #prepend>
                         <q-icon name="search" />
@@ -68,7 +68,7 @@
                     v-model="filters.publicOnly"
                     dense
                     label="Public only"
-                    @update:model-value="loadBlocks"
+                    @update:model-value="reload"
                 />
             </div>
         </div>
@@ -80,6 +80,7 @@
             :loading="loading"
             :pagination="{ rowsPerPage: 50, sortBy: 'title' }"
             :rows-per-page-options="[25, 50, 100, 0]"
+            :grid="$q.screen.lt.sm"
             dense
             flat
             bordered
@@ -133,22 +134,98 @@
                     />
                 </q-td>
             </template>
+
+            <template #item="{ row }">
+                <ListCard>
+                    <template #header>
+                        <div class="row items-center no-wrap q-gutter-x-xs">
+                            <router-link
+                                class="text-weight-medium"
+                                :to="{ name: 'CmsContentBlockEdit', params: { id: row.contentBlockId } }"
+                            >
+                                {{ row.title || "(untitled)" }}
+                            </router-link>
+                            <StatusIcon
+                                v-if="row.allowPublicAccess"
+                                icon="public"
+                                color="positive"
+                                label="Public access"
+                            />
+                            <StatusIcon
+                                v-if="row.deletedOn"
+                                icon="delete_outline"
+                                color="negative"
+                                label="Deleted"
+                            />
+                        </div>
+                        <div
+                            v-if="row.friendlyName"
+                            class="text-caption text-grey-7"
+                        >
+                            {{ row.friendlyName }}
+                        </div>
+                    </template>
+
+                    <ListCardField
+                        label="System"
+                        :value="row.system"
+                    />
+                    <ListCardField
+                        v-if="row.viperSectionPath"
+                        label="VIPER section"
+                        :value="row.viperSectionPath"
+                    />
+                    <ListCardField
+                        v-if="row.page"
+                        label="Page"
+                        :value="row.page"
+                    />
+                    <ListCardField
+                        label="Order"
+                        :value="row.blockOrder"
+                    />
+                    <ListCardField label="Access">
+                        <PermissionChips :permissions="row.permissions" />
+                    </ListCardField>
+                    <ListCardField label="Modified">
+                        <ModifiedStamp :row="row" />
+                    </ListCardField>
+
+                    <template #actions>
+                        <EditButton
+                            entity-name="content block"
+                            :to="{ name: 'CmsContentBlockEdit', params: { id: row.contentBlockId } }"
+                        />
+                        <DeleteRestoreButtons
+                            :deleted="!!row.deletedOn"
+                            entity-name="content block"
+                            @delete="deleteBlock(row)"
+                            @restore="restoreBlock(row)"
+                        />
+                    </template>
+                </ListCard>
+            </template>
         </q-table>
     </div>
 </template>
 
 <script setup lang="ts">
-import { inject, onMounted, ref } from "vue"
+import { inject, onMounted, ref, watch } from "vue"
+import { useRoute, useRouter } from "vue-router"
 import { useQuasar, type QTableProps } from "quasar"
 import { useFetch } from "@/composables/ViperFetch"
 import DeleteRestoreButtons from "@/CMS/components/DeleteRestoreButtons.vue"
 import EditButton from "@/CMS/components/EditButton.vue"
+import ListCard from "@/CMS/components/ListCard.vue"
+import ListCardField from "@/CMS/components/ListCardField.vue"
 import ModifiedStamp from "@/CMS/components/ModifiedStamp.vue"
 import PermissionChips from "@/CMS/components/PermissionChips.vue"
 import StatusIcon from "@/CMS/components/StatusIcon.vue"
 import type { CmsContentBlock } from "@/CMS/types/"
 
 const apiURL = inject("apiURL") + "CMS/content"
+const route = useRoute()
+const router = useRouter()
 const $q = useQuasar()
 const { get, del, post, createUrlSearchParams } = useFetch()
 
@@ -156,14 +233,30 @@ const blocks = ref<CmsContentBlock[]>([])
 const sectionPaths = ref<string[]>([])
 const loading = ref(false)
 
+// Filters initialize from the URL so views can be shared/deep-linked, matching
+// the Files list and audit trail.
 const filters = ref({
-    status: "active",
-    system: null as string | null,
-    viperSectionPath: null as string | null,
-    search: "",
-    publicOnly: false,
+    status: typeof route.query.status === "string" ? route.query.status : "active",
+    system: typeof route.query.system === "string" ? route.query.system : null,
+    viperSectionPath: typeof route.query.section === "string" ? route.query.section : null,
+    search: typeof route.query.search === "string" ? route.query.search : "",
+    publicOnly: route.query.public === "1",
 })
 
+// Reflect the active filters back into the URL (defaults are omitted).
+function syncFiltersToUrl() {
+    void router.replace({
+        query: {
+            ...route.query,
+            status: filters.value.status !== "active" ? filters.value.status : undefined,
+            system: filters.value.system || undefined,
+            section: filters.value.viperSectionPath || undefined,
+            search: filters.value.search || undefined,
+            public: filters.value.publicOnly ? "1" : undefined,
+        },
+    })
+}
+
 const statusOptions = [
     { label: "Active", value: "active" },
     { label: "Deleted", value: "deleted" },
@@ -201,6 +294,13 @@ async function loadBlocks() {
     loading.value = false
 }
 
+// Filter changes both reload the list and update the URL; the route watcher
+// guards against re-fetching on our own URL write.
+function reload() {
+    syncFiltersToUrl()
+    loadBlocks()
+}
+
 async function loadSectionPaths() {
     const res = await get(apiURL + "/section-paths")
     sectionPaths.value = res.success ? res.result : []
@@ -239,6 +339,34 @@ async function restoreBlock(block: CmsContentBlock) {
     loadBlocks()
 }
 
+// Re-sync filters when in-app navigation reuses this view with a different query
+// (e.g. a hub deep-link or re-clicked nav link). The equality guard skips our own
+// syncFiltersToUrl write, which would otherwise trigger a redundant fetch.
+watch(
+    () => route.query,
+    (query) => {
+        const next = {
+            status: typeof query.status === "string" ? query.status : "active",
+            system: typeof query.system === "string" ? query.system : null,
+            viperSectionPath: typeof query.section === "string" ? query.section : null,
+            search: typeof query.search === "string" ? query.search : "",
+            publicOnly: query.public === "1",
+        }
+        const f = filters.value
+        if (
+            next.status === f.status &&
+            next.system === f.system &&
+            next.viperSectionPath === f.viperSectionPath &&
+            next.search === f.search &&
+            next.publicOnly === f.publicOnly
+        ) {
+            return
+        }
+        filters.value = next
+        loadBlocks()
+    },
+)
+
 onMounted(() => {
     loadSectionPaths()
     loadBlocks()
diff --git a/VueApp/src/CMS/pages/FileAuditLog.vue b/VueApp/src/CMS/pages/FileAuditLog.vue
index 65bfbbf03..bb740b3a6 100644
--- a/VueApp/src/CMS/pages/FileAuditLog.vue
+++ b/VueApp/src/CMS/pages/FileAuditLog.vue
@@ -12,6 +12,7 @@
                     v-model="filters.action"
                     dense
                     options-dense
+                    outlined
                     clearable
                     label="Action"
                     :options="actionOptions"
@@ -22,38 +23,26 @@
                 <q-input
                     v-model="filters.loginId"
                     dense
+                    outlined
                     clearable
                     debounce="400"
                     label="Login ID"
                     @update:model-value="reload"
                 />
             </div>
-            <div class="col-12 col-sm-3 col-lg-2">
-                <q-input
-                    v-model="filters.from"
-                    dense
-                    clearable
-                    label="From"
-                    type="date"
-                    stack-label
-                    @update:model-value="reload"
-                />
-            </div>
-            <div class="col-12 col-sm-3 col-lg-2">
-                <q-input
-                    v-model="filters.to"
-                    dense
-                    clearable
-                    label="To"
-                    type="date"
-                    stack-label
-                    @update:model-value="reload"
-                />
-            </div>
+            <DateRangeFilter
+                v-model:from="filters.from"
+                v-model:to="filters.to"
+                @change="reload"
+            />
+        </div>
+
+        <div class="row q-mb-sm">
             <div class="col-12 col-sm-4 col-lg-3">
                 <q-input
                     v-model="filters.search"
                     dense
+                    outlined
                     clearable
                     debounce="400"
                     label="Search path or detail"
@@ -88,6 +77,7 @@
             :loading="loading"
             v-model:pagination="pagination"
             :rows-per-page-options="[25, 50, 100, 250]"
+            :grid="$q.screen.lt.sm"
             dense
             flat
             bordered
@@ -113,6 +103,36 @@
                     </span>
                 </q-td>
             </template>
+
+            <template #item="{ row }">
+                <ListCard>
+                    <template #header>
+                        <div class="row items-center q-gutter-x-sm">
+                            <StatusBadge :color="getActionColor(row.action)">
+                                {{ row.action }}
+                            </StatusBadge>
+                            <span class="text-caption text-grey-7">
+                                {{ formatDateTime(row.timestamp, { dateStyle: "short", timeStyle: "short" }) }}
+                            </span>
+                        </div>
+                    </template>
+
+                    <ListCardField
+                        label="Modified By"
+                        :value="row.loginid"
+                    />
+                    <ListCardField
+                        v-if="row.filePath"
+                        label="File"
+                        :value="row.filePath"
+                    />
+                    <ListCardField
+                        v-if="row.detail"
+                        label="Detail"
+                        :value="row.detail"
+                    />
+                </ListCard>
+            </template>
         </q-table>
     </div>
 </template>
@@ -125,6 +145,9 @@ import { useFetch } from "@/composables/ViperFetch"
 import { useDateFunctions } from "@/composables/DateFunctions"
 import BreadcrumbHeading from "@/components/BreadcrumbHeading.vue"
 import StatusBadge from "@/components/StatusBadge.vue"
+import ListCard from "@/CMS/components/ListCard.vue"
+import ListCardField from "@/CMS/components/ListCardField.vue"
+import DateRangeFilter from "@/CMS/components/DateRangeFilter.vue"
 import type { CmsFileAudit } from "@/CMS/types/"
 
 const apiURL = inject("apiURL") + "cms/files/audit"
diff --git a/VueApp/src/CMS/pages/Files.vue b/VueApp/src/CMS/pages/Files.vue
index e2900b27a..576186e35 100644
--- a/VueApp/src/CMS/pages/Files.vue
+++ b/VueApp/src/CMS/pages/Files.vue
@@ -103,6 +103,7 @@
             :loading="loading"
             v-model:pagination="pagination"
             :rows-per-page-options="[25, 50, 100, 250]"
+            :grid="$q.screen.lt.sm"
             dense
             flat
             bordered
@@ -183,6 +184,81 @@
                     />
                 </q-td>
             </template>
+
+            <template #item="{ row }">
+                <ListCard>
+                    <template #header>
+                        <div class="row items-center no-wrap q-gutter-x-xs">
+                            <a
+                                :href="row.friendlyUrl"
+                                target="_blank"
+                                rel="noopener"
+                            >
+                                {{ row.friendlyName }}
+                                <span class="sr-only">(opens in new window)</span>
+                            </a>
+                            <StatusIcon
+                                v-if="row.encrypted"
+                                icon="lock"
+                                color="warning"
+                                label="Encrypted"
+                            />
+                            <StatusIcon
+                                v-if="row.allowPublicAccess"
+                                icon="public"
+                                color="positive"
+                                label="Public access"
+                            />
+                            <StatusIcon
+                                v-if="row.deletedOn"
+                                icon="delete_outline"
+                                color="negative"
+                                :label="`Deleted ${formatDate(row.deletedOn)}`"
+                            />
+                        </div>
+                    </template>
+
+                    <ListCardField
+                        label="VIPER app"
+                        :value="row.folder"
+                    />
+                    <ListCardField label="Access">
+                        <PermissionChips
+                            :permissions="row.permissions"
+                            :people-count="row.people.length"
+                        />
+                    </ListCardField>
+                    <ListCardField
+                        v-if="row.oldUrl"
+                        label="Old URL"
+                    >
+                        <a
+                            :href="oldUrlHref(row.oldUrl)"
+                            target="_blank"
+                            rel="noopener"
+                        >
+                            {{ row.oldUrl }}
+                            <span class="sr-only">(opens in new window)</span>
+                        </a>
+                    </ListCardField>
+                    <ListCardField label="Modified">
+                        <ModifiedStamp :row="row" />
+                    </ListCardField>
+
+                    <template #actions>
+                        <EditButton
+                            entity-name="file"
+                            @click="openEditDialog(row)"
+                        />
+                        <DeleteRestoreButtons
+                            :deleted="!!row.deletedOn"
+                            entity-name="file"
+                            @delete="deleteFile(row)"
+                            @restore="restoreFile(row)"
+                        />
+                    </template>
+                </ListCard>
+            </template>
         </q-table>
 
         <FileFormDialog
@@ -202,6 +278,8 @@ import { useFetch } from "@/composables/ViperFetch"
 import FileFormDialog from "@/CMS/components/FileFormDialog.vue"
 import DeleteRestoreButtons from "@/CMS/components/DeleteRestoreButtons.vue"
 import EditButton from "@/CMS/components/EditButton.vue"
+import ListCard from "@/CMS/components/ListCard.vue"
+import ListCardField from "@/CMS/components/ListCardField.vue"
 import ModifiedStamp from "@/CMS/components/ModifiedStamp.vue"
 import PermissionChips from "@/CMS/components/PermissionChips.vue"
 import StatusIcon from "@/CMS/components/StatusIcon.vue"
diff --git a/VueApp/src/CMS/pages/LeftNavEdit.vue b/VueApp/src/CMS/pages/LeftNavEdit.vue
index 3d2076068..7e7eb2a44 100644
--- a/VueApp/src/CMS/pages/LeftNavEdit.vue
+++ b/VueApp/src/CMS/pages/LeftNavEdit.vue
@@ -31,22 +31,34 @@
                                 {{ menuFormError }}
                             </StatusBanner>
 
-                            <q-btn
-                                type="submit"
-                                color="primary"
-                                :label="isNew ? 'Create Menu' : 'Save Menu Settings'"
-                                dense
-                                no-caps
-                                :loading="savingMenu"
-                            >
-                                <template #loading>
-                                    <q-spinner
-                                        size="1em"
-                                        class="q-mr-sm"
+                            <div class="row items-center q-gutter-sm">
+                                <q-btn
+                                    type="submit"
+                                    color="primary"
+                                    :label="isNew ? 'Create Menu' : 'Save Menu Settings'"
+                                    dense
+                                    no-caps
+                                    :loading="savingMenu"
+                                >
+                                    <template #loading>
+                                        <q-spinner
+                                            size="1em"
+                                            class="q-mr-sm"
+                                        />
+                                        {{ isNew ? "Create Menu" : "Save Menu Settings" }}
+                                    </template>
+                                </q-btn>
+                                <span
+                                    v-if="!isNew && menuDirty"
+                                    class="unsaved-hint text-warning"
+                                >
+                                    <q-icon
+                                        name="edit"
+                                        size="1rem"
                                     />
-                                    {{ isNew ? "Create Menu" : "Save Menu Settings" }}
-                                </template>
-                            </q-btn>
+                                    Unsaved changes
+                                </span>
+                            </div>
                         </q-form>
                     </q-card-section>
                 </q-card>
@@ -65,116 +77,88 @@
                             <h2 class="text-h6 q-my-none">Menu Items</h2>
                             <q-space />
                             <q-btn
-                                flat
                                 dense
                                 no-caps
                                 color="positive"
                                 icon="add"
                                 label="Add Header"
+                                class="q-pr-md"
                                 @click="addItem(true)"
                             />
                             <q-btn
-                                flat
                                 dense
                                 no-caps
                                 color="positive"
                                 icon="add"
                                 label="Add Link"
-                                class="q-ml-sm"
+                                class="q-ml-sm q-pr-md"
                                 @click="addItem(false)"
                             />
                         </div>
 
-                        <VueDraggable
+                        <SortableList
                             v-model="items"
-                            :animation="200"
-                            handle=".handle"
+                            item-key="key"
+                            class="menu-items"
+                            move-up-label="Move item up"
+                            move-down-label="Move item down"
+                            :row-class="itemRowClass"
+                            :announce="announceItem"
+                            @reorder="onItemsReorder"
                         >
-                            <div
-                                v-for="(item, index) in items"
-                                :key="item.key"
-                                :class="['nav-item row items-start q-col-gutter-sm', { 'is-header': item.isHeader }]"
-                            >
-                                <div class="col-auto flex items-center">
-                                    <q-icon
-                                        class="handle q-mt-sm"
-                                        name="drag_handle"
-                                    >
-                                        <q-tooltip>Drag to reorder</q-tooltip>
-                                    </q-icon>
-                                </div>
-                                <div class="col-3">
-                                    <q-input
-                                        v-model="item.menuItemText"
-                                        dense
-                                        outlined
-                                        :label="item.isHeader ? 'Header text' : 'Link text'"
-                                    />
-                                </div>
-                                <div class="col">
-                                    <q-input
-                                        v-if="!item.isHeader"
-                                        v-model="item.url"
-                                        dense
-                                        outlined
-                                        label="URL"
-                                    />
-                                    <div
-                                        v-else
-                                        class="text-grey-7 q-mt-sm text-caption"
-                                    >
-                                        Section header
+                            <template #row="{ item }">
+                                <div class="menu-item-fields">
+                                    <div class="menu-item-fields__text">
+                                        <q-input
+                                            v-model="item.menuItemText"
+                                            dense
+                                            outlined
+                                            :label="item.isHeader ? 'Header text' : 'Link text'"
+                                        />
+                                    </div>
+                                    <div class="menu-item-fields__url">
+                                        <q-input
+                                            v-if="!item.isHeader"
+                                            v-model="item.url"
+                                            dense
+                                            outlined
+                                            label="URL"
+                                        />
+                                        <div
+                                            v-else
+                                            class="text-grey-7 q-mt-sm text-caption"
+                                        >
+                                            Section header
+                                        </div>
+                                    </div>
+                                    <div class="menu-item-fields__perms">
+                                        <PermissionSelector
+                                            v-model="item.permissions"
+                                            label="Visible to"
+                                        />
                                     </div>
                                 </div>
-                                <div class="col-3">
-                                    <PermissionSelector
-                                        v-model="item.permissions"
-                                        label="Visible to"
-                                    />
-                                </div>
-                                <div class="col-auto">
-                                    <q-btn
-                                        dense
-                                        flat
-                                        no-caps
-                                        size="sm"
-                                        color="secondary"
-                                        icon="arrow_upward"
-                                        aria-label="Move item up"
-                                        :disable="index === 0"
-                                        @click="moveItem(index, -1)"
-                                    />
-                                    <q-btn
-                                        dense
-                                        flat
-                                        no-caps
-                                        size="sm"
-                                        color="secondary"
-                                        icon="arrow_downward"
-                                        aria-label="Move item down"
-                                        :disable="index === items.length - 1"
-                                        @click="moveItem(index, 1)"
-                                    />
-                                    <q-btn
-                                        dense
-                                        flat
-                                        no-caps
-                                        size="sm"
-                                        color="negative"
-                                        icon="delete"
-                                        aria-label="Remove item"
-                                        @click="removeItem(index)"
-                                    />
-                                </div>
-                            </div>
-                        </VueDraggable>
-
-                        <div
-                            v-if="!items.length"
-                            class="text-grey-7 q-my-md"
-                        >
-                            No items yet — add a header or link above.
-                        </div>
+                            </template>
+
+                            <template #actions="{ index }">
+                                <q-btn
+                                    dense
+                                    flat
+                                    no-caps
+                                    size="sm"
+                                    color="negative"
+                                    icon="delete"
+                                    aria-label="Remove item"
+                                    @click="removeItem(index)"
+                                >
+                                    <q-tooltip>Remove item</q-tooltip>
+                                </q-btn>
+                            </template>
+
+                            <template #empty>
+                                <div class="text-grey-7 q-my-md">No items yet — add a header or link above.</div>
+                            </template>
+                        </SortableList>
 
                         <StatusBanner
                             v-if="itemsError"
@@ -184,7 +168,7 @@
                             {{ itemsError }}
                         </StatusBanner>
 
-                        <div class="q-mt-md">
+                        <div class="q-mt-md row items-center">
                             <q-btn
                                 color="primary"
                                 label="Save Items"
@@ -203,12 +187,23 @@
                             </q-btn>
                             <q-btn
                                 flat
-                                label="Revert"
+                                label="Discard Item Changes"
                                 dense
                                 no-caps
                                 class="q-ml-sm"
+                                :disable="!itemsDirty"
                                 @click="revertItems"
                             />
+                            <span
+                                v-if="itemsDirty"
+                                class="unsaved-hint text-warning q-ml-md"
+                            >
+                                <q-icon
+                                    name="edit"
+                                    size="1rem"
+                                />
+                                Unsaved changes
+                            </span>
                         </div>
                     </q-card-section>
                 </q-card>
@@ -221,10 +216,10 @@
 import { computed, inject, onMounted, ref, watch } from "vue"
 import { useRoute, useRouter, onBeforeRouteLeave } from "vue-router"
 import { useQuasar } from "quasar"
-import { VueDraggable } from "vue-draggable-plus"
 import { useFetch } from "@/composables/ViperFetch"
 import { useUnsavedChanges } from "@/composables/use-unsaved-changes"
 import BreadcrumbHeading from "@/components/BreadcrumbHeading.vue"
+import SortableList from "@/components/SortableList.vue"
 import LeftNavMenuSettingsFields from "@/CMS/components/LeftNavMenuSettingsFields.vue"
 import PermissionSelector from "@/CMS/components/PermissionSelector.vue"
 import StatusBanner from "@/components/StatusBanner.vue"
@@ -266,12 +261,47 @@ const items = ref<EditableItem[]>([])
 let savedMenu: CmsLeftNavMenu | null = null
 let nextKey = -1
 
-// Dirty tracking spans both the menu settings and the items list, so unsaved edits in
-// either half prompt before navigating away (matching the Effort forms' guard).
-const formSnapshot = computed(() => ({ menu: menu.value, items: items.value }))
-const { setInitialState, resetDirtyState, confirmClose } = useUnsavedChanges(formSnapshot)
+// The settings form and the items list save independently, so track them separately:
+// saving one must not clear the other's unsaved flag, and each section shows its own
+// unsaved indicator.
+const {
+    isDirty: menuDirty,
+    setInitialState: setMenuBaseline,
+    resetDirtyState: resetMenuDirty,
+} = useUnsavedChanges(menu)
+const {
+    isDirty: itemsDirty,
+    setInitialState: setItemsBaseline,
+    resetDirtyState: resetItemsDirty,
+} = useUnsavedChanges(items)
+const hasUnsavedChanges = computed(() => menuDirty.value || itemsDirty.value)
+
+function captureBaselines() {
+    setMenuBaseline()
+    setItemsBaseline()
+}
+
+onBeforeRouteLeave(async () => {
+    if (!hasUnsavedChanges.value) {
+        return true
+    }
+    return await confirmLeave()
+})
 
-onBeforeRouteLeave(async () => await confirmClose())
+function confirmLeave(): Promise<boolean> {
+    return new Promise((resolve) => {
+        $q.dialog({
+            title: "Unsaved Changes",
+            message: "This menu has unsaved changes. Leave without saving?",
+            cancel: { label: "Keep Editing", flat: true },
+            ok: { label: "Leave", color: "negative", unelevated: true },
+            persistent: true,
+        })
+            .onOk(() => resolve(true))
+            .onCancel(() => resolve(false))
+            .onDismiss(() => resolve(false))
+    })
+}
 
 function toEditableItems(source: CmsLeftNavMenu): EditableItem[] {
     return source.items.map((i) => ({
@@ -301,7 +331,7 @@ async function loadMenu() {
         friendlyName: res.result.friendlyName,
     }
     items.value = toEditableItems(res.result)
-    setInitialState()
+    captureBaselines()
 }
 
 // The q-form focuses the first invalid field on a failed submit; this surfaces a matching
@@ -331,7 +361,7 @@ async function saveMenu() {
         return
     }
     $q.notify({ type: "positive", message: isNew.value ? "Menu created — now add items" : "Menu settings saved" })
-    resetDirtyState()
+    resetMenuDirty()
     if (isNew.value) {
         // the menuId watch loads the created menu once the route changes
         void router.push({ name: "CmsLeftNavEdit", params: { id: res.result.leftNavMenuId } })
@@ -353,11 +383,20 @@ function removeItem(index: number) {
     items.value.splice(index, 1)
 }
 
-function moveItem(index: number, direction: -1 | 1) {
-    const newIndex = index + direction
-    if (newIndex < 0 || newIndex >= items.value.length) return
-    const [item] = items.value.splice(index, 1)
-    items.value.splice(newIndex, 0, item!)
+function itemRowClass(item: EditableItem) {
+    return { "menu-item--header": item.isHeader }
+}
+
+function announceItem(item: EditableItem, newIndex: number, total: number) {
+    const kind = item.isHeader ? "header" : "link"
+    const name = item.menuItemText?.trim() || "item"
+    return `Moved ${kind} ${name} to position ${newIndex + 1} of ${total}`
+}
+
+// Reorder is staged here (commits on Save Items), so the toast stays neutral; `group`
+// collapses rapid nudges into one. The "Unsaved changes" indicator signals it needs saving.
+function onItemsReorder() {
+    $q.notify({ type: "info", message: "Order updated", group: "leftnav-order", timeout: 1500 })
 }
 
 async function saveItems() {
@@ -386,14 +425,14 @@ async function saveItems() {
     $q.notify({ type: "positive", message: "Items saved" })
     savedMenu = res.result
     items.value = toEditableItems(res.result)
-    resetDirtyState()
+    resetItemsDirty()
 }
 
 function revertItems() {
     if (savedMenu) {
         items.value = toEditableItems(savedMenu)
         itemsError.value = ""
-        $q.notify({ type: "info", message: "Items reverted to last saved state" })
+        $q.notify({ type: "info", message: "Item changes discarded" })
     }
 }
 
@@ -413,7 +452,7 @@ watch(menuId, (id) => {
         savedMenu = null
         menuFormError.value = ""
         itemsError.value = ""
-        setInitialState()
+        captureBaselines()
     } else {
         void loadMenu()
     }
@@ -423,28 +462,88 @@ onMounted(() => {
     loadMenu()
     // loadMenu sets the baseline for an existing menu; a brand-new form's baseline is empty.
     if (isNew.value) {
-        setInitialState()
+        captureBaselines()
     }
 })
 </script>
 
 <style scoped>
-.nav-item {
-    border: 1px solid #e5e7eb;
-    border-radius: 6px;
-    margin-bottom: 8px;
-    padding: 8px;
+.unsaved-hint {
+    display: inline-flex;
+    align-items: center;
+    gap: 4px;
+    font-size: 0.8125rem;
+    font-weight: 500;
+}
+
+/* The row's available width (not the viewport) decides whether the three fields fit:
+   in the two-column layout the Menu Items column can be narrow even on a wide screen.
+   Query the row body so the fields stack until there's genuinely room for a row. */
+.menu-items :deep(.sortable-row__body) {
+    container-type: inline-size;
+}
+
+.menu-item-fields {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
 }
 
-.nav-item.is-header {
-    background: #f5f7fb;
+@container (min-width: 30rem) {
+    .menu-item-fields {
+        flex-direction: row;
+        align-items: flex-start;
+        gap: 12px;
+    }
+
+    .menu-item-fields__text {
+        flex: 1 1 0;
+        min-width: 0;
+    }
+
+    .menu-item-fields__url {
+        flex: 1.3 1 0;
+        min-width: 0;
+    }
+
+    .menu-item-fields__perms {
+        flex: 1.2 1 0;
+        min-width: 0;
+    }
+}
+
+/* Match the Link Collections rows exactly: tinted cards on small/medium screens,
+   borderless grouped rows in the panel on desktop. Header rows keep a distinct tint. */
+.menu-items :deep(.sortable-row) {
+    border: 1px solid var(--ucdavis-black-10);
+    border-radius: 8px;
+    padding: 12px;
+    background: var(--surface-tint-raised);
 }
 
-.handle {
-    cursor: grab;
+.menu-items :deep(.sortable-row.menu-item--header) {
+    background: var(--surface-tint);
 }
 
-.handle:active {
-    cursor: grabbing;
+@media (width >= 1024px) {
+    .menu-items :deep(.sortable-list__items) {
+        gap: 0;
+    }
+
+    .menu-items :deep(.sortable-row) {
+        border: none;
+        border-bottom: 1px solid var(--ucdavis-black-10);
+        border-radius: 0;
+        padding: 12px 8px;
+        background: transparent;
+    }
+
+    .menu-items :deep(.sortable-row:last-child) {
+        border-bottom: none;
+    }
+
+    .menu-items :deep(.sortable-row.menu-item--header) {
+        background: var(--surface-tint);
+    }
 }
 </style>
diff --git a/VueApp/src/CMS/pages/LeftNavMenus.vue b/VueApp/src/CMS/pages/LeftNavMenus.vue
index 0c796918a..2f7e21ff5 100644
--- a/VueApp/src/CMS/pages/LeftNavMenus.vue
+++ b/VueApp/src/CMS/pages/LeftNavMenus.vue
@@ -49,6 +49,7 @@
             :loading="loading"
             :pagination="{ rowsPerPage: 50, sortBy: 'menuHeaderText' }"
             :rows-per-page-options="[25, 50, 100, 0]"
+            :grid="$q.screen.lt.sm"
             dense
             flat
             bordered
@@ -89,6 +90,65 @@
                     </q-btn>
                 </q-td>
             </template>
+
+            <template #item="{ row }">
+                <ListCard>
+                    <template #header>
+                        <router-link
+                            class="text-weight-medium"
+                            :to="{ name: 'CmsLeftNavEdit', params: { id: row.leftNavMenuId } }"
+                        >
+                            {{ row.menuHeaderText || "(untitled)" }}
+                        </router-link>
+                    </template>
+
+                    <ListCardField
+                        label="System"
+                        :value="row.system"
+                    />
+                    <ListCardField
+                        v-if="row.viperSectionPath"
+                        label="VIPER section"
+                        :value="row.viperSectionPath"
+                    />
+                    <ListCardField
+                        v-if="row.page"
+                        label="Page"
+                        :value="row.page"
+                    />
+                    <ListCardField
+                        v-if="row.friendlyName"
+                        label="Friendly name"
+                        :value="row.friendlyName"
+                    />
+                    <ListCardField
+                        label="Items"
+                        :value="row.items.length"
+                    />
+                    <ListCardField label="Modified">
+                        <ModifiedStamp :row="row" />
+                    </ListCardField>
+
+                    <template #actions>
+                        <EditButton
+                            entity-name="menu"
+                            :to="{ name: 'CmsLeftNavEdit', params: { id: row.leftNavMenuId } }"
+                        />
+                        <q-btn
+                            dense
+                            flat
+                            no-caps
+                            size="sm"
+                            color="negative"
+                            icon="delete"
+                            aria-label="Delete menu"
+                            @click="deleteMenu(row)"
+                        >
+                            <q-tooltip>Delete</q-tooltip>
+                        </q-btn>
+                    </template>
+                </ListCard>
+            </template>
         </q-table>
 
         <LeftNavMenuDialog
@@ -105,6 +165,8 @@ import { useQuasar, type QTableProps } from "quasar"
 import { useFetch } from "@/composables/ViperFetch"
 import EditButton from "@/CMS/components/EditButton.vue"
 import LeftNavMenuDialog from "@/CMS/components/LeftNavMenuDialog.vue"
+import ListCard from "@/CMS/components/ListCard.vue"
+import ListCardField from "@/CMS/components/ListCardField.vue"
 import ModifiedStamp from "@/CMS/components/ModifiedStamp.vue"
 import type { CmsLeftNavMenu } from "@/CMS/types/"
 
diff --git a/VueApp/src/CMS/pages/ManageLinkCollections.vue b/VueApp/src/CMS/pages/ManageLinkCollections.vue
index df335063c..9d2bdbf6c 100644
--- a/VueApp/src/CMS/pages/ManageLinkCollections.vue
+++ b/VueApp/src/CMS/pages/ManageLinkCollections.vue
@@ -105,76 +105,36 @@
                         />
                     </div>
 
-                    <VueDraggable
+                    <SortableList
                         v-model="draftTags"
-                        :animation="200"
-                        handle=".handle"
-                        class="list-group"
-                        @end="onDragEnd"
+                        item-key="linkCollectionTagCategoryId"
+                        class="q-mt-sm"
+                        move-up-label="Move tag up"
+                        move-down-label="Move tag down"
+                        :announce="announceTag"
                     >
-                        <div
-                            v-for="(element, index) in draftTags"
-                            :key="element.linkCollectionTagCategoryId"
-                            :class="[
-                                'row items-center q-col-gutter-sm',
-                                { 'just-moved': justMovedTagId === element.linkCollectionTagCategoryId },
-                            ]"
-                        >
-                            <div class="col-auto">
-                                <q-icon
-                                    class="handle"
-                                    name="drag_handle"
-                                >
-                                    <q-tooltip>Drag to reorder</q-tooltip>
-                                </q-icon>
-                            </div>
-                            <div class="col">
-                                <q-input
-                                    dense
-                                    readonly
-                                    v-model="element.linkCollectionTagCategory"
-                                />
-                            </div>
-                            <div class="col-auto">
-                                <q-btn
-                                    dense
-                                    flat
-                                    no-caps
-                                    size="sm"
-                                    color="secondary"
-                                    icon="arrow_upward"
-                                    aria-label="Move tag up"
-                                    :disable="index === 0"
-                                    @click="moveTag(index, -1)"
-                                >
-                                    <q-tooltip>Move up</q-tooltip>
-                                </q-btn>
-                                <q-btn
-                                    dense
-                                    flat
-                                    no-caps
-                                    size="sm"
-                                    color="secondary"
-                                    icon="arrow_downward"
-                                    aria-label="Move tag down"
-                                    :disable="index === draftTags.length - 1"
-                                    @click="moveTag(index, 1)"
-                                >
-                                    <q-tooltip>Move down</q-tooltip>
-                                </q-btn>
-                                <q-btn
-                                    flat
-                                    label="Delete"
-                                    dense
-                                    no-caps
-                                    color="negative"
-                                    class="q-ml-lg q-pr-md"
-                                    icon="delete"
-                                    @click="deleteTag(element.linkCollectionTagCategoryId)"
-                                />
-                            </div>
-                        </div>
-                    </VueDraggable>
+                        <template #row="{ item }">
+                            <q-input
+                                dense
+                                readonly
+                                v-model="item.linkCollectionTagCategory"
+                            />
+                        </template>
+                        <template #actions="{ item }">
+                            <q-btn
+                                dense
+                                flat
+                                no-caps
+                                size="sm"
+                                color="negative"
+                                icon="delete"
+                                aria-label="Delete tag category"
+                                @click="deleteTag(item.linkCollectionTagCategoryId)"
+                            >
+                                <q-tooltip>Delete</q-tooltip>
+                            </q-btn>
+                        </template>
+                    </SortableList>
                 </q-card-section>
 
                 <q-card-actions
@@ -211,7 +171,7 @@
                 label="Add Link"
                 @click="showLinkDialog = true"
                 no-caps
-                class="q-mt-sm"
+                class="q-mt-sm q-pr-md"
             />
             <q-dialog
                 v-model="showLinkDialog"
@@ -341,119 +301,93 @@
                 id="allLinks"
                 class="q-mt-md"
             >
-                <div class="row link-row header items-center q-col-gutter-sm desktop-only link-grid">
-                    <div class="col-12 col-md-auto">Actions</div>
-                    <div class="col-12 col-md-3 col-lg-2">URL</div>
-                    <div class="col-12 col-md-3 col-lg-2">Title</div>
-                    <div class="col-12 col-md-6 col-lg-4">Description</div>
-                    <div class="col-12 col-lg-3">Tags</div>
-                </div>
-                <VueDraggable
+                <SortableList
                     v-model="links"
-                    :animation="200"
-                    handle=".handle"
-                    @end="linkOrder"
+                    item-key="linkId"
+                    class="links-list"
+                    move-up-label="Move link up"
+                    move-down-label="Move link down"
+                    :announce="announceLink"
+                    @reorder="linkOrder"
                 >
-                    <div
-                        v-for="(element, index) in links"
-                        :key="element.linkId"
-                        :class="[
-                            'row link-row items-start q-col-gutter-sm link-card link-grid',
-                            { 'just-moved': justMovedLinkId === element.linkId },
-                        ]"
-                    >
-                        <div class="col-12 col-md-auto link-actions q-gutter-xs">
-                            <div class="action-buttons">
-                                <q-icon
-                                    class="handle"
-                                    name="drag_handle"
-                                >
-                                    <q-tooltip>Drag to reorder</q-tooltip>
-                                </q-icon>
-                                <q-btn
-                                    dense
-                                    no-caps
-                                    size="sm"
-                                    color="secondary"
-                                    icon="edit"
-                                    aria-label="Edit link"
-                                    @click="clickLink(element)"
-                                >
-                                    <q-tooltip>Edit</q-tooltip>
-                                </q-btn>
-                                <q-btn
-                                    dense
-                                    flat
-                                    no-caps
-                                    size="sm"
-                                    color="secondary"
-                                    icon="arrow_upward"
-                                    aria-label="Move link up"
-                                    :disable="index === 0"
-                                    @click="moveLink(index, -1)"
-                                >
-                                    <q-tooltip>Move up</q-tooltip>
-                                </q-btn>
-                                <q-btn
-                                    dense
-                                    flat
-                                    no-caps
-                                    size="sm"
-                                    color="secondary"
-                                    icon="arrow_downward"
-                                    aria-label="Move link down"
-                                    :disable="index === links.length - 1"
-                                    @click="moveLink(index, 1)"
-                                >
-                                    <q-tooltip>Move down</q-tooltip>
-                                </q-btn>
-                            </div>
-                        </div>
-                        <div class="col-12 col-md-3 col-lg-2 link-field url-field">
-                            <div class="field-label">URL</div>
-                            <div class="link-url">{{ element.url }}</div>
-                        </div>
-                        <div class="col-12 col-md-3 col-lg-2 link-field title-field">
-                            <div class="field-label">Title</div>
-                            <div>{{ element.title }}</div>
+                    <template #header>
+                        <div class="link-grid">
+                            <div>URL</div>
+                            <div>Title</div>
+                            <div>Description</div>
+                            <div>Tags</div>
                         </div>
-                        <div class="col-12 col-md-6 col-lg-4 link-field desc-field">
-                            <div class="field-label">Description</div>
-                            <div>{{ element.description }}</div>
-                        </div>
-                        <div class="col-12 col-lg-3 tag-field">
-                            <template
-                                v-for="tag in collectionTags"
-                                :key="tag.linkCollectionTagCategoryId"
-                            >
-                                <div
-                                    v-if="element.tags !== undefined"
-                                    class="row tag-row q-col-gutter-xs"
+                    </template>
+
+                    <template #row="{ item }">
+                        <div class="link-grid">
+                            <div class="link-field url-field">
+                                <div class="field-label">URL</div>
+                                <div class="link-url">{{ item.url }}</div>
+                            </div>
+                            <div class="link-field title-field">
+                                <div class="field-label">Title</div>
+                                <div>{{ item.title }}</div>
+                            </div>
+                            <div class="link-field desc-field">
+                                <div class="field-label">Description</div>
+                                <div>{{ item.description }}</div>
+                            </div>
+                            <div class="link-field tag-field">
+                                <template
+                                    v-for="tag in collectionTags"
+                                    :key="tag.linkCollectionTagCategoryId"
                                 >
-                                    <div class="tag-row-inner">
-                                        <div class="field-label">{{ tag.linkCollectionTagCategory }}</div>
-                                        <div class="tag-chips">
-                                            <q-chip
-                                                dense
-                                                square
-                                                color="primary"
-                                                text-color="white"
-                                                v-for="t in getTagsForCategory(
-                                                    element,
-                                                    tag.linkCollectionTagCategoryId,
-                                                )"
-                                                :key="tag.linkCollectionTagCategoryId.toString() + ' ' + t.toString()"
-                                                class="q-mr-xs q-mb-xs"
-                                            >
-                                                {{ t }}
-                                            </q-chip>
+                                    <div
+                                        v-if="item.tags !== undefined"
+                                        class="tag-row"
+                                    >
+                                        <div class="tag-row-inner">
+                                            <div class="field-label">{{ tag.linkCollectionTagCategory }}</div>
+                                            <div class="tag-chips">
+                                                <q-chip
+                                                    dense
+                                                    square
+                                                    color="primary"
+                                                    text-color="white"
+                                                    v-for="t in getTagsForCategory(
+                                                        item,
+                                                        tag.linkCollectionTagCategoryId,
+                                                    )"
+                                                    :key="
+                                                        tag.linkCollectionTagCategoryId.toString() + ' ' + t.toString()
+                                                    "
+                                                    class="q-mr-xs q-mb-xs"
+                                                >
+                                                    {{ t }}
+                                                </q-chip>
+                                            </div>
                                         </div>
                                     </div>
-                                </div>
-                            </template>
+                                </template>
+                            </div>
                         </div>
-                    </div>
-                </VueDraggable>
+                    </template>
+
+                    <template #actions="{ item }">
+                        <EditButton
+                            entity-name="link"
+                            @click="clickLink(item)"
+                        />
+                        <q-btn
+                            dense
+                            flat
+                            no-caps
+                            size="sm"
+                            color="negative"
+                            icon="delete"
+                            aria-label="Delete link"
+                            @click="deleteLinkRow(item)"
+                        >
+                            <q-tooltip>Delete</q-tooltip>
+                        </q-btn>
+                    </template>
+                </SortableList>
             </div>
         </template>
     </div>
@@ -463,10 +397,11 @@
 import { ref, inject, watch } from "vue"
 import { useQuasar } from "quasar"
 import type { Ref } from "vue"
-import { VueDraggable } from "vue-draggable-plus"
 import type { LinkCollection, Link, LinkCollectionTagCategory, LinkWithTags } from "@/CMS/types/"
 import { useFetch } from "@/composables/ViperFetch"
 import { useUnsavedChanges } from "@/composables/use-unsaved-changes"
+import EditButton from "@/CMS/components/EditButton.vue"
+import SortableList from "@/components/SortableList.vue"
 import StatusBanner from "@/components/StatusBanner.vue"
 import { isSafeUrl } from "@/CMS/utils/url"
 
@@ -503,8 +438,13 @@ watch(showLinkDialog, (open) => {
     }
 })
 
-const justMovedLinkId: Ref<number | null> = ref(null)
-const justMovedTagId: Ref<number | null> = ref(null)
+function announceLink(item: LinkWithTags, newIndex: number, total: number) {
+    return `Moved ${item.title || "link"} to position ${newIndex + 1} of ${total}`
+}
+
+function announceTag(item: LinkCollectionTagCategory, newIndex: number, total: number) {
+    return `Moved tag ${item.linkCollectionTagCategory} to position ${newIndex + 1} of ${total}`
+}
 
 //collections
 async function loadCollections(preferredId?: number | null) {
@@ -769,6 +709,25 @@ async function deleteLink() {
     loadLinks()
 }
 
+// Row-level delete (the dialog keeps its own Delete for the link being edited).
+async function deleteLinkRow(li: LinkWithTags) {
+    const confirmed = await confirmAction(
+        "Delete Link",
+        `This will permanently remove "${li.title}". Continue?`,
+        "Delete Link",
+        "negative",
+    )
+    if (!confirmed) return
+    const { del } = useFetch()
+    const res = await del(apiURL + collectionId.value + "/links/" + li.linkId)
+    if (!res.success) {
+        $q.notify({ type: "negative", message: "Failed to delete link" })
+        return
+    }
+    $q.notify({ type: "positive", message: "Link deleted" })
+    loadLinks()
+}
+
 async function confirmAction(title: string, message: string, okLabel: string, okColor = "primary") {
     return await new Promise<boolean>((resolve) => {
         $q.dialog({
@@ -798,21 +757,10 @@ async function linkOrder() {
     if (!res.success) {
         $q.notify({ type: "negative", message: "Failed to save link order" })
         await loadLinks()
+        return
     }
-}
-
-function moveLink(index: number, direction: -1 | 1) {
-    const newIndex = index + direction
-    if (newIndex < 0 || newIndex >= links.value.length) return
-    const item = links.value[index]
-    if (item === undefined) return
-    links.value.splice(index, 1)
-    links.value.splice(newIndex, 0, item)
-    justMovedLinkId.value = item.linkId
-    setTimeout(() => {
-        if (justMovedLinkId.value === item.linkId) justMovedLinkId.value = null
-    }, 600)
-    void linkOrder()
+    // Reorder persists immediately; confirm it. `group` collapses rapid nudges into one toast.
+    $q.notify({ type: "positive", message: "Order saved", group: "link-order", timeout: 1500 })
 }
 
 //tags
@@ -846,23 +794,6 @@ function deleteTag(tagId: number) {
     draftTags.value.splice(idx, 1)
 }
 
-function onDragEnd() {
-    // No-op: draft reorders commit on Save.
-}
-
-function moveTag(index: number, direction: -1 | 1) {
-    const newIndex = index + direction
-    if (newIndex < 0 || newIndex >= draftTags.value.length) return
-    const item = draftTags.value[index]
-    if (item === undefined) return
-    draftTags.value.splice(index, 1)
-    draftTags.value.splice(newIndex, 0, item)
-    justMovedTagId.value = item.linkCollectionTagCategoryId
-    setTimeout(() => {
-        if (justMovedTagId.value === item.linkCollectionTagCategoryId) justMovedTagId.value = null
-    }, 600)
-}
-
 watch(collectionId, () => {
     loadLinks()
     loadTags()
@@ -879,42 +810,18 @@ loadCollections()
 }
 
 #allLinks {
-    background: #fff;
+    background: var(--surface);
+    border: 1px solid var(--ucdavis-black-10);
     border-radius: 6px;
-    box-shadow: 0 1px 3px rgb(0 0 0 / 8%);
-}
-
-#allLinks .link-row {
-    border-bottom: 1px solid silver;
-    margin-bottom: 4px;
     padding: 8px 12px;
-    align-items: flex-start;
-    border-radius: 6px;
-}
-
-#allLinks .link-row.header {
-    font-weight: bold;
-    background: #f5f7fb;
-    color: var(--q-primary);
-    border-radius: 6px;
-    text-align: left;
 }
 
-#allLinks .link-row.header > div {
-    text-align: left;
-}
-
-#allLinks .link-url {
+.link-url {
     white-space: normal;
     word-break: break-word;
     overflow-wrap: anywhere;
 }
 
-.tag-label {
-    color: var(--q-primary);
-    white-space: nowrap;
-}
-
 .tag-row-inner {
     display: flex;
     flex-direction: column;
@@ -932,37 +839,40 @@ loadCollections()
     max-width: 100%;
 }
 
-.mobile-only {
-    display: block;
-    color: var(--q-primary);
+.field-label {
     font-weight: 600;
-    width: 100%;
+    color: var(--q-primary);
+    margin-bottom: 0;
 }
 
-.link-actions {
-    display: flex;
-    align-items: center;
+.link-field {
+    word-break: break-word;
+    min-width: 0;
 }
 
-.action-buttons {
-    display: inline-flex;
-    flex-wrap: wrap;
-    align-items: center;
-    gap: 6px;
+.tag-row {
+    margin-bottom: 4px;
 }
 
-.handle {
-    cursor: grab;
+/* The column header only reads as one once the fields line up in a grid (desktop). */
+.links-list :deep(.sortable-row--header) {
+    display: none;
+    font-weight: bold;
+    color: var(--q-primary);
 }
 
-.handle:active {
-    cursor: grabbing;
+/* Card-per-row on small and medium screens. */
+.links-list :deep(.sortable-row) {
+    border: 1px solid var(--ucdavis-black-10);
+    border-radius: 8px;
+    padding: 12px;
+    background: var(--surface-tint-raised);
 }
 
-@media screen and (prefers-reduced-motion: reduce) {
-    .reorder-move {
-        transition: none;
-    }
+/* Four actions here (up/down/edit/delete) at touch size; widen the gutter so the
+   header columns still line up with the rows. */
+.links-list :deep(.sortable-row__controls) {
+    min-width: 10rem;
 }
 
 .required-field :deep(.q-field__label)::after {
@@ -1005,153 +915,49 @@ loadCollections()
     font-weight: 500;
 }
 
-@keyframes just-moved-flash {
-    0% {
-        background-color: var(--q-secondary);
-    }
-
-    100% {
-        background-color: transparent;
-    }
-}
-
-@media screen and (prefers-reduced-motion: reduce) {
-    .just-moved {
-        animation: none;
-    }
-}
-
-.just-moved {
-    animation: just-moved-flash 0.6s ease-out;
-}
-
-.desktop-only {
-    display: none;
-}
-
-.desktop-only-inline {
-    display: none;
-}
-
-.field-label {
-    font-weight: 600;
-    color: var(--q-primary);
-    margin-bottom: 0;
-}
-
-.link-field {
-    word-break: break-word;
-    min-width: 0;
-}
-
-.link-card {
-    border: 1px solid #e5e7eb;
-    border-radius: 8px;
-    margin-bottom: 12px;
-    background: #fafbff;
-    padding: 12px 12px 8px;
-}
-
-.desktop-only .tag-chips {
-    justify-content: flex-start;
-}
-
-@media (width <= 1023px) {
-    #allLinks .link-row {
-        border-radius: 6px;
-        border-color: #e6e8ef;
-        padding: 12px 12px 8px;
-    }
-
-    .link-actions {
-        margin-bottom: 6px;
-    }
-
-    .tag-row {
-        margin-bottom: 4px;
-    }
-}
-
 @media (width >= 1024px) {
-    .desktop-only {
-        display: flex;
-    }
-
-    .desktop-only-inline {
-        display: inline;
-    }
-
-    .mobile-only {
-        display: none;
-    }
-
-    .link-row.link-grid {
+    /* Tabular layout: four aligned columns, labels in the header row instead of per field. */
+    .link-grid {
         display: grid;
-        grid-template-columns: 70px 2.5fr 1.2fr 2.5fr 1.5fr;
+        grid-template-columns: 2.5fr 1.2fr 2.5fr 1.5fr;
         column-gap: 12px;
-        align-items: stretch;
+        align-items: start;
     }
 
-    .link-row.link-grid > div {
-        justify-self: stretch;
-        width: 100%;
-        min-width: 0;
+    .links-list :deep(.sortable-row--header) {
+        display: flex;
     }
 
-    .link-row.header {
-        align-items: center;
+    .links-list :deep(.sortable-list__items) {
+        gap: 0;
     }
 
-    .link-card {
+    .links-list :deep(.sortable-row) {
         border: none;
-        background: transparent;
-        margin-bottom: 0;
+        border-bottom: 1px solid var(--ucdavis-black-10);
+        border-radius: 0;
         padding: 8px 0;
+        background: transparent;
     }
 
-    .url-field .link-url {
-        max-width: 100%;
-        white-space: normal;
-        word-break: break-word;
-        overflow-wrap: anywhere;
-    }
-
-    .title-field {
-        min-width: 140px;
-    }
-
-    .desc-field {
-        min-width: 200px;
-    }
-
-    .url-field {
-        min-width: 360px;
-    }
-
-    .tag-field {
-        overflow-wrap: anywhere;
-        max-width: 100%;
-        min-width: 0;
-        word-break: break-word;
-    }
-
-    .field-label {
-        display: none;
+    /* The visual column header is aria-hidden, so keep the URL/Title/Description labels
+       in the a11y tree (visually hidden) instead of display:none, so screen readers
+       still announce which value is which. Tag-category labels stay visible. */
+    .link-field:not(.tag-field) .field-label {
+        position: absolute;
+        width: 1px;
+        height: 1px;
+        overflow: hidden;
+        clip-path: inset(50%);
+        white-space: nowrap;
     }
 
     .tag-field .field-label {
         display: block;
     }
 
-    .link-actions {
-        flex-direction: row;
-        gap: 6px;
-        margin-bottom: 0;
-    }
-
     .tag-row {
         margin-bottom: 6px;
-        align-items: flex-start;
     }
 }
 </style>
diff --git a/VueApp/src/CMS/router/routes.ts b/VueApp/src/CMS/router/routes.ts
index c1d55eebc..e07154132 100644
--- a/VueApp/src/CMS/router/routes.ts
+++ b/VueApp/src/CMS/router/routes.ts
@@ -53,6 +53,12 @@ const routes = [
         meta: { layout: ViperLayout, permissions: ["SVMSecure.CMS.ManageContentBlocks"] },
         component: () => import("@/CMS/pages/ContentBlocks.vue"),
     },
+    {
+        path: "/CMS/ManageContentBlocks/History",
+        name: "CmsContentBlockHistory",
+        meta: { layout: ViperLayout, permissions: ["SVMSecure.CMS.ManageContentBlocks"] },
+        component: () => import("@/CMS/pages/ContentBlockHistory.vue"),
+    },
     {
         path: "/CMS/ManageContentBlocks/Edit/:id?",
         name: "CmsContentBlockEdit",
diff --git a/VueApp/src/CMS/types/index.ts b/VueApp/src/CMS/types/index.ts
index 48cf8746a..844c57bf4 100644
--- a/VueApp/src/CMS/types/index.ts
+++ b/VueApp/src/CMS/types/index.ts
@@ -64,6 +64,16 @@ type CmsContentHistoryItem = {
     modifiedBy: string | null
 }
 
+type CmsContentHistoryDiff = {
+    content: string
+    hasComparison: boolean
+    hasChanges: boolean
+    oldModifiedOn: string | null
+    oldModifiedBy: string | null
+    newModifiedOn: string | null
+    newModifiedBy: string | null
+}
+
 type CmsLeftNavMenu = {
     leftNavMenuId: number
     menuHeaderText: string | null
@@ -98,6 +108,17 @@ type CmsFileAudit = {
     clientData: string | null
 }
 
+type CmsContentHistoryAudit = {
+    contentHistoryId: number
+    contentBlockId: number
+    title: string | null
+    friendlyName: string | null
+    page: string | null
+    modifiedOn: string | null
+    modifiedBy: string | null
+    blockDeleted: boolean
+}
+
 type LinkCollection = {
     linkCollectionId: number
     linkCollection: string
@@ -153,6 +174,8 @@ export type {
     CmsFilePerson,
     CmsPersonOption,
     CmsFileAudit,
+    CmsContentHistoryAudit,
+    CmsContentHistoryDiff,
     LinkCollection,
     LinkCollectionTagCategory,
     Link,
diff --git a/VueApp/src/Effort/pages/AuditList.vue b/VueApp/src/Effort/pages/AuditList.vue
index 7574edd91..5468746f9 100644
--- a/VueApp/src/Effort/pages/AuditList.vue
+++ b/VueApp/src/Effort/pages/AuditList.vue
@@ -9,7 +9,7 @@
             label="Filters"
             header-class="bg-grey-2 lt-md"
             :header-style="$q.screen.gt.sm ? 'display: none' : ''"
-            class="q-mb-md"
+            class="q-mb-sm"
         >
             <q-card flat>
                 <q-card-section :class="$q.screen.gt.sm ? 'q-pa-none' : ''">
@@ -77,15 +77,6 @@
                                 @filter="filterInstructors"
                             />
                         </div>
-                        <div :class="$q.screen.gt.sm ? 'col-12 col-md-6 col-lg-3' : 'col-12'">
-                            <q-input
-                                v-model="filter.searchText"
-                                label="Search Changes"
-                                dense
-                                outlined
-                                clearable
-                            />
-                        </div>
                         <div :class="$q.screen.gt.sm ? 'col-12 col-md-6 col-lg-3' : 'col-6'">
                             <q-input
                                 v-model="filter.dateFrom"
@@ -133,21 +124,36 @@
                             />
                         </div>
                     </div>
-                    <div class="row q-mt-sm">
-                        <div class="col-12 text-right">
-                            <q-btn
-                                label="Clear Filters"
-                                color="secondary"
-                                dense
-                                flat
-                                @click="clearFilter"
-                            />
-                        </div>
-                    </div>
                 </q-card-section>
             </q-card>
         </q-expansion-item>
 
+        <!-- Search box and clear-filters on their own row above the table, matching the CMS audit trail -->
+        <div class="row items-center q-mb-sm">
+            <div class="col-12 col-sm-4 col-lg-3">
+                <q-input
+                    v-model="filter.searchText"
+                    label="Search changes"
+                    dense
+                    outlined
+                    clearable
+                    hide-bottom-space
+                >
+                    <template #prepend>
+                        <q-icon name="search" />
+                    </template>
+                </q-input>
+            </div>
+            <q-space />
+            <q-btn
+                label="Clear Filters"
+                color="secondary"
+                dense
+                flat
+                @click="clearFilter"
+            />
+        </div>
+
         <!-- Results Table - Desktop view (lg and up) -->
         <q-table
             v-if="$q.screen.gt.md"
diff --git a/VueApp/src/components/SortableList.vue b/VueApp/src/components/SortableList.vue
new file mode 100644
index 000000000..f7134a4e5
--- /dev/null
+++ b/VueApp/src/components/SortableList.vue
@@ -0,0 +1,346 @@
+<template>
+    <div
+        ref="listEl"
+        class="sortable-list"
+    >
+        <div
+            v-if="$slots.header"
+            class="sortable-row sortable-row--header"
+            aria-hidden="true"
+        >
+            <span class="sortable-row__handle" />
+            <div class="sortable-row__body">
+                <slot name="header" />
+            </div>
+            <div class="sortable-row__controls" />
+        </div>
+
+        <VueDraggable
+            v-model="model"
+            :animation="200"
+            :disabled="disabled"
+            handle=".sortable-row__handle"
+            ghost-class="sortable-row--ghost"
+            class="sortable-list__items"
+            @end="onDragEnd"
+        >
+            <div
+                v-for="(item, index) in model"
+                :key="keyOf(item)"
+                class="sortable-row"
+                :class="[rowClass?.(item, index), { 'sortable-row--moved': keyOf(item) === justMovedKey }]"
+            >
+                <span
+                    class="sortable-row__handle"
+                    :class="{ 'sortable-row__handle--disabled': disabled }"
+                    aria-hidden="true"
+                >
+                    <q-icon name="drag_handle" />
+                    <q-tooltip v-if="!disabled">{{ handleLabel }}</q-tooltip>
+                </span>
+
+                <div class="sortable-row__body">
+                    <slot
+                        name="row"
+                        :item="item"
+                        :index="index"
+                    />
+                </div>
+
+                <div class="sortable-row__controls">
+                    <q-btn
+                        dense
+                        flat
+                        no-caps
+                        size="sm"
+                        color="secondary"
+                        icon="arrow_upward"
+                        :aria-label="moveUpLabel"
+                        :disable="index === 0"
+                        @click="onMoveUp(index)"
+                    >
+                        <q-tooltip>{{ moveUpLabel }}</q-tooltip>
+                    </q-btn>
+                    <q-btn
+                        dense
+                        flat
+                        no-caps
+                        size="sm"
+                        color="secondary"
+                        icon="arrow_downward"
+                        :aria-label="moveDownLabel"
+                        :disable="index === model.length - 1"
+                        @click="onMoveDown(index)"
+                    >
+                        <q-tooltip>{{ moveDownLabel }}</q-tooltip>
+                    </q-btn>
+                    <slot
+                        name="actions"
+                        :item="item"
+                        :index="index"
+                    />
+                </div>
+            </div>
+        </VueDraggable>
+
+        <slot
+            v-if="model.length === 0"
+            name="empty"
+        />
+
+        <!-- Screen readers hear the result of every reorder; the drag handle is a
+             mouse/touch affordance, so non-visual users rely on the move buttons + this. -->
+        <div
+            class="sr-only"
+            role="status"
+            aria-live="polite"
+        >
+            {{ announcement }}
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts" generic="T extends Record<string, any>">
+import { nextTick, ref } from "vue"
+import { usePreferredReducedMotion } from "@vueuse/core"
+import { VueDraggable } from "vue-draggable-plus"
+import { useReorder, type ReorderKey } from "@/composables/use-reorder"
+
+const model = defineModel<T[]>({ required: true })
+
+const {
+    itemKey,
+    disabled = false,
+    handleLabel = "Drag to reorder",
+    moveUpLabel = "Move up",
+    moveDownLabel = "Move down",
+    rowClass = undefined,
+    announce = undefined,
+} = defineProps<{
+    /** Field name or getter for each item's stable, unique key. */
+    itemKey: keyof T | ((item: T) => ReorderKey)
+    disabled?: boolean
+    handleLabel?: string
+    moveUpLabel?: string
+    moveDownLabel?: string
+    /** Extra class(es) per row, e.g. to tint a section header. */
+    rowClass?: (item: T, index: number) => unknown
+    /** Builds the screen-reader announcement after a move. */
+    announce?: (item: T, newIndex: number, total: number) => string
+}>()
+
+const emit = defineEmits<{
+    reorder: [item: T, newIndex: number, oldIndex: number]
+}>()
+
+defineSlots<{
+    /** Optional column-header row, aligned to the row bodies below. */
+    header?: () => unknown
+    /** Per-row content. */
+    row: (props: { item: T; index: number }) => unknown
+    /** Per-row actions (edit, delete) placed after the move buttons. */
+    actions?: (props: { item: T; index: number }) => unknown
+    /** Shown in place of the list when it is empty. */
+    empty?: () => unknown
+}>()
+
+function keyOf(item: T): ReorderKey {
+    return typeof itemKey === "function" ? itemKey(item) : (item[itemKey] as ReorderKey)
+}
+
+const announcement = ref("")
+function announceMove(item: T, newIndex: number) {
+    const text = announce
+        ? announce(item, newIndex, model.value.length)
+        : `Moved to position ${newIndex + 1} of ${model.value.length}`
+    // Clear first so an identical message (e.g. nudged back to the same spot) re-announces.
+    announcement.value = ""
+    void nextTick(() => {
+        announcement.value = text
+    })
+}
+
+const { justMovedKey, moveUp, moveDown, commitDrag } = useReorder<T>(model, {
+    getKey: keyOf,
+    onReorder: (item, newIndex, oldIndex) => {
+        announceMove(item, newIndex)
+        emit("reorder", item, newIndex, oldIndex)
+    },
+})
+
+function onDragEnd(evt: { oldIndex?: number; newIndex?: number }) {
+    if (evt.oldIndex === undefined || evt.newIndex === undefined) {
+        return
+    }
+    commitDrag(evt.oldIndex, evt.newIndex)
+}
+
+// Drag reorders animate via SortableJS (:animation); button reorders jump instantly,
+// so FLIP them — capture positions, reorder, then slide each moved row from where it
+// was to where it landed. Makes the change easy to follow without watching closely.
+const listEl = ref<HTMLElement>()
+const reducedMotion = usePreferredReducedMotion()
+const SLIDE_MS = 300
+
+function rowElements(): HTMLElement[] {
+    const container = listEl.value?.querySelector(".sortable-list__items")
+    return container ? (Array.from(container.children) as HTMLElement[]) : []
+}
+
+function animateReorder(reorder: () => void) {
+    if (reducedMotion.value === "reduce") {
+        reorder()
+        return
+    }
+    const startTops = new Map(rowElements().map((el) => [el, el.getBoundingClientRect().top]))
+    reorder()
+    void nextTick(() => {
+        for (const el of rowElements()) {
+            const startTop = startTops.get(el)
+            if (startTop === undefined) {
+                continue
+            }
+            const delta = startTop - el.getBoundingClientRect().top
+            if (delta === 0) {
+                continue
+            }
+            el.style.transition = "none"
+            el.style.transform = `translateY(${delta}px)`
+            requestAnimationFrame(() => {
+                el.style.transition = `transform ${SLIDE_MS}ms cubic-bezier(0.22, 1, 0.36, 1)`
+                el.style.transform = ""
+            })
+            el.addEventListener(
+                "transitionend",
+                () => {
+                    el.style.transition = ""
+                    el.style.transform = ""
+                },
+                { once: true },
+            )
+        }
+    })
+}
+
+function onMoveUp(index: number) {
+    animateReorder(() => moveUp(index))
+}
+
+function onMoveDown(index: number) {
+    animateReorder(() => moveDown(index))
+}
+</script>
+
+<style scoped>
+.sortable-list__items {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+}
+
+.sortable-row {
+    display: flex;
+    align-items: flex-start;
+    gap: 0.5rem;
+    border-radius: 6px;
+}
+
+.sortable-row--header {
+    align-items: center;
+}
+
+.sortable-row__handle {
+    flex: 0 0 auto;
+    width: 1.75rem;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    padding-top: 0.375rem;
+    color: var(--ucdavis-black-60, #666);
+    cursor: grab;
+}
+
+.sortable-row--header .sortable-row__handle {
+    padding-top: 0;
+}
+
+.sortable-row__handle:active {
+    cursor: grabbing;
+}
+
+.sortable-row__handle--disabled {
+    visibility: hidden;
+}
+
+.sortable-row__body {
+    flex: 1 1 auto;
+    min-width: 0;
+}
+
+.sortable-row__controls {
+    flex: 0 0 auto;
+    min-width: 7.5rem;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    gap: 0.25rem;
+    padding-top: 0.125rem;
+}
+
+/* Comfortable touch targets for the reorder + row-action buttons (up/down and any
+   edit/delete in the actions slot). 23px dense buttons miss the 24px minimum. */
+.sortable-row__controls :deep(.q-btn) {
+    min-width: 2.25rem;
+    min-height: 2.25rem;
+}
+
+.sortable-row--header .sortable-row__controls {
+    padding-top: 0;
+}
+
+.sortable-row--ghost {
+    opacity: 0.5;
+    background: var(--surface-tint, #f5f7fb);
+}
+
+/* "Just moved" cue: a brand-blue tint and ring that fade out. It is a colour/shadow
+   fade (no movement), so it also plays under reduced motion — where the slide is
+   skipped — keeping a clear signal that something changed. */
+@keyframes sortable-row-flash {
+    0% {
+        background-color: var(--ucdavis-blue-10, #cdd6e0);
+        box-shadow: inset 0 0 0 0.125rem var(--q-primary);
+    }
+
+    100% {
+        background-color: transparent;
+        box-shadow: inset 0 0 0 0.125rem transparent;
+    }
+}
+
+.sortable-row--moved {
+    animation: sortable-row-flash 1s ease-out;
+}
+
+/* On phones the row becomes a stacked card: handle + controls share a top bar,
+   the body drops to its own full-width line below. */
+@media (width <= 599px) {
+    .sortable-row {
+        flex-wrap: wrap;
+    }
+
+    .sortable-row__handle {
+        order: 1;
+    }
+
+    .sortable-row__controls {
+        order: 2;
+        margin-left: auto;
+    }
+
+    .sortable-row__body {
+        order: 3;
+        flex: 1 1 100%;
+    }
+}
+</style>
diff --git a/VueApp/src/components/__tests__/sortable-list.test.ts b/VueApp/src/components/__tests__/sortable-list.test.ts
new file mode 100644
index 000000000..126a95b84
--- /dev/null
+++ b/VueApp/src/components/__tests__/sortable-list.test.ts
@@ -0,0 +1,139 @@
+import { mount } from "@vue/test-utils"
+import { Quasar } from "quasar"
+import { h, nextTick, ref } from "vue"
+import SortableList from "@/components/SortableList.vue"
+
+/**
+ * SortableList owns the shared reorder shell: drag handle, move buttons, the screen-reader
+ * announcement, and the row/header/actions/empty slots. The drag itself comes from
+ * vue-draggable (SortableJS), which needs real pointer events, so it's stubbed to a
+ * passthrough here; the button-move path (which is what these tests drive) runs through
+ * useReorder directly and is fully exercised.
+ */
+vi.mock("vue-draggable-plus", () => ({
+    VueDraggable: { name: "VueDraggable", template: "<div><slot /></div>" },
+}))
+
+type Item = { id: number; label: string }
+
+function mountList(initial: Item[], extraProps: Record<string, unknown> = {}) {
+    const model = ref(initial)
+    const wrapper = mount(SortableList, {
+        props: {
+            modelValue: model.value,
+            itemKey: "id",
+            "onUpdate:modelValue": (v) => {
+                model.value = v as Item[]
+            },
+            ...extraProps,
+        },
+        global: { plugins: [[Quasar, {}]] },
+        slots: {
+            row: (params) => h("span", { class: "row-label" }, params.item.label),
+            actions: (params) => h("button", { class: "del" }, `del ${params.item.id}`),
+            empty: () => h("div", { class: "empty" }, "Nothing here yet"),
+            header: () => h("div", { class: "hdr" }, "Label"),
+        },
+    })
+    return { wrapper, model }
+}
+
+const rowText = (wrapper: ReturnType<typeof mountList>["wrapper"]) => wrapper.findAll(".row-label").map((n) => n.text())
+
+const threeItems = (): Item[] => [
+    { id: 1, label: "Alpha" },
+    { id: 2, label: "Bravo" },
+    { id: 3, label: "Charlie" },
+]
+
+describe("SortableList - rendering", () => {
+    it("renders one row per item through the row slot", () => {
+        const { wrapper } = mountList(threeItems())
+        expect(rowText(wrapper)).toEqual(["Alpha", "Bravo", "Charlie"])
+    })
+
+    it("renders the actions slot per row", () => {
+        const { wrapper } = mountList(threeItems())
+        expect(wrapper.findAll(".del")).toHaveLength(3)
+    })
+
+    it("renders the header slot", () => {
+        const { wrapper } = mountList(threeItems())
+        expect(wrapper.find(".hdr").exists()).toBeTruthy()
+    })
+
+    it("shows the empty slot only when the list is empty", () => {
+        const { wrapper: full } = mountList(threeItems())
+        expect(full.find(".empty").exists()).toBeFalsy()
+
+        const { wrapper: empty } = mountList([])
+        expect(empty.find(".empty").exists()).toBeTruthy()
+    })
+})
+
+describe("SortableList - move buttons", () => {
+    it("disables Move up on the first row and Move down on the last", () => {
+        const { wrapper } = mountList(threeItems())
+        const ups = wrapper.findAll('[aria-label="Move up"]')
+        const downs = wrapper.findAll('[aria-label="Move down"]')
+        expect(ups[0]!.attributes("disabled")).toBeDefined()
+        expect(ups[1]!.attributes("disabled")).toBeUndefined()
+        expect(downs[2]!.attributes("disabled")).toBeDefined()
+        expect(downs[1]!.attributes("disabled")).toBeUndefined()
+    })
+
+    it("moving a row down reorders the list and emits reorder", async () => {
+        const { wrapper } = mountList(threeItems())
+        await wrapper.findAll('[aria-label="Move down"]')[0]!.trigger("click")
+
+        expect(rowText(wrapper)).toEqual(["Bravo", "Alpha", "Charlie"])
+        const events = wrapper.emitted("reorder")
+        expect(events).toHaveLength(1)
+        expect(events![0]).toEqual([{ id: 1, label: "Alpha" }, 1, 0])
+    })
+
+    it("moving a row up reorders the list", async () => {
+        const { wrapper } = mountList(threeItems())
+        await wrapper.findAll('[aria-label="Move up"]')[2]!.trigger("click")
+        expect(rowText(wrapper)).toEqual(["Alpha", "Charlie", "Bravo"])
+    })
+
+    it("uses custom move-button labels when provided", () => {
+        const { wrapper } = mountList(threeItems(), {
+            moveUpLabel: "Move link up",
+            moveDownLabel: "Move link down",
+        })
+        expect(wrapper.find('[aria-label="Move link up"]').exists()).toBeTruthy()
+        expect(wrapper.find('[aria-label="Move link down"]').exists()).toBeTruthy()
+    })
+})
+
+describe("SortableList - accessibility", () => {
+    it("announces the move in a polite live region", async () => {
+        const { wrapper } = mountList(threeItems())
+        await wrapper.findAll('[aria-label="Move down"]')[0]!.trigger("click")
+        await nextTick()
+        await nextTick()
+
+        const live = wrapper.find('[role="status"]')
+        expect(live.attributes("aria-live")).toBe("polite")
+        expect(live.text()).toBe("Moved to position 2 of 3")
+    })
+
+    it("uses a custom announce builder when provided", async () => {
+        const { wrapper } = mountList(threeItems(), {
+            announce: (item: Item, newIndex: number, total: number) => `${item.label} is now ${newIndex + 1}/${total}`,
+        })
+        await wrapper.findAll('[aria-label="Move down"]')[0]!.trigger("click")
+        await nextTick()
+        await nextTick()
+        expect(wrapper.find('[role="status"]').text()).toBe("Alpha is now 2/3")
+    })
+
+    it("hides the drag handle from assistive tech (move buttons are the a11y path)", () => {
+        const { wrapper } = mountList(threeItems())
+        // The header's handle is a layout spacer; the per-row handles are the real affordance.
+        const handle = wrapper.find(".sortable-list__items .sortable-row__handle")
+        expect(handle.attributes("aria-hidden")).toBe("true")
+    })
+})
diff --git a/VueApp/src/composables/__tests__/use-reorder.test.ts b/VueApp/src/composables/__tests__/use-reorder.test.ts
new file mode 100644
index 000000000..c3aadbb02
--- /dev/null
+++ b/VueApp/src/composables/__tests__/use-reorder.test.ts
@@ -0,0 +1,128 @@
+import { ref } from "vue"
+import { useReorder } from "@/composables/use-reorder"
+
+/**
+ * Unit tests for useReorder: the array move math and the transient "just moved" highlight
+ * shared by every sortable list, exercised without a DOM the way SortableList drives it
+ * (button moves) and the way vue-draggable drives it (commitDrag after a drop).
+ */
+
+type Item = { id: number; name: string }
+type ReorderCallback = (item: Item, newIndex: number, oldIndex: number) => void
+
+function makeList(): Item[] {
+    return [
+        { id: 1, name: "a" },
+        { id: 2, name: "b" },
+        { id: 3, name: "c" },
+    ]
+}
+
+const ids = (list: Item[]) => list.map((i) => i.id)
+
+describe("useReorder - move math", () => {
+    it("moveDown swaps an item with its successor", () => {
+        const list = ref(makeList())
+        const { moveDown } = useReorder(list, { getKey: (i) => i.id })
+        expect(moveDown(0)).toBeTruthy()
+        expect(ids(list.value)).toEqual([2, 1, 3])
+    })
+
+    it("moveUp swaps an item with its predecessor", () => {
+        const list = ref(makeList())
+        const { moveUp } = useReorder(list, { getKey: (i) => i.id })
+        expect(moveUp(2)).toBeTruthy()
+        expect(ids(list.value)).toEqual([1, 3, 2])
+    })
+
+    it("ignores moveUp on the first item and moveDown on the last", () => {
+        const list = ref(makeList())
+        const { moveUp, moveDown } = useReorder(list, { getKey: (i) => i.id })
+        expect(moveUp(0)).toBeFalsy()
+        expect(moveDown(2)).toBeFalsy()
+        expect(ids(list.value)).toEqual([1, 2, 3])
+    })
+
+    it("ignores out-of-range indices", () => {
+        const list = ref(makeList())
+        const { moveUp, moveDown } = useReorder(list, { getKey: (i) => i.id })
+        expect(moveDown(5)).toBeFalsy()
+        expect(moveUp(-1)).toBeFalsy()
+        expect(ids(list.value)).toEqual([1, 2, 3])
+    })
+
+    it("mutates the same array reference so a parent v-model stays in sync", () => {
+        const list = ref(makeList())
+        const original = list.value
+        const { moveDown } = useReorder(list, { getKey: (i) => i.id })
+        moveDown(0)
+        expect(list.value).toBe(original)
+    })
+})
+
+describe("useReorder - onReorder callback", () => {
+    it("fires with the moved item and its new/old indices", () => {
+        const list = ref(makeList())
+        const onReorder = vi.fn<ReorderCallback>()
+        const { moveDown } = useReorder(list, { getKey: (i) => i.id, onReorder })
+        moveDown(0)
+        expect(onReorder).toHaveBeenCalledExactlyOnceWith({ id: 1, name: "a" }, 1, 0)
+    })
+
+    it("does not fire on a no-op move", () => {
+        const list = ref(makeList())
+        const onReorder = vi.fn<ReorderCallback>()
+        const { moveUp } = useReorder(list, { getKey: (i) => i.id, onReorder })
+        moveUp(0)
+        expect(onReorder).not.toHaveBeenCalled()
+    })
+
+    it("commitDrag fires for the dropped row and skips a same-slot drop", () => {
+        const list = ref(makeList())
+        const onReorder = vi.fn<ReorderCallback>()
+        const { commitDrag } = useReorder(list, { getKey: (i) => i.id, onReorder })
+
+        // After a drop, vue-draggable has already reordered the array; here item 1
+        // was dragged from index 0 to index 2.
+        list.value = [
+            { id: 2, name: "b" },
+            { id: 3, name: "c" },
+            { id: 1, name: "a" },
+        ]
+        commitDrag(0, 2)
+        expect(onReorder).toHaveBeenCalledWith({ id: 1, name: "a" }, 2, 0)
+
+        onReorder.mockClear()
+        commitDrag(1, 1)
+        expect(onReorder).not.toHaveBeenCalled()
+    })
+})
+
+describe("useReorder - flash highlight", () => {
+    beforeEach(() => vi.useFakeTimers())
+    afterEach(() => vi.useRealTimers())
+
+    it("marks the moved item, then clears it after flashMs", () => {
+        const list = ref(makeList())
+        const { moveDown, justMovedKey } = useReorder(list, { getKey: (i) => i.id, flashMs: 600 })
+        moveDown(0)
+        expect(justMovedKey.value).toBe(1)
+        vi.advanceTimersByTime(599)
+        expect(justMovedKey.value).toBe(1)
+        vi.advanceTimersByTime(1)
+        expect(justMovedKey.value).toBeNull()
+    })
+
+    it("a second move resets the clear timer", () => {
+        const list = ref(makeList())
+        const { moveDown, justMovedKey } = useReorder(list, { getKey: (i) => i.id, flashMs: 600 })
+        moveDown(0) // [2,1,3] flashes id 1
+        vi.advanceTimersByTime(400)
+        moveDown(1) // [2,3,1] flashes id 1 again, timer reset
+        expect(justMovedKey.value).toBe(1)
+        vi.advanceTimersByTime(400) // 800 since first flash but only 400 since second
+        expect(justMovedKey.value).toBe(1)
+        vi.advanceTimersByTime(200)
+        expect(justMovedKey.value).toBeNull()
+    })
+})
diff --git a/VueApp/src/composables/use-reorder.ts b/VueApp/src/composables/use-reorder.ts
new file mode 100644
index 000000000..ed98a6a00
--- /dev/null
+++ b/VueApp/src/composables/use-reorder.ts
@@ -0,0 +1,91 @@
+import type { Ref } from "vue"
+import { ref } from "vue"
+
+type ReorderKey = string | number
+
+const DEFAULT_FLASH_MS = 600
+
+interface UseReorderOptions<T> {
+    /** Stable, unique key for an item. Drives the post-move highlight. */
+    getKey: (item: T) => ReorderKey
+    /**
+     * Called after any committed reorder (button move or drag drop), with the moved
+     * item and its new/old indices. Use it to persist order immediately; omit it for
+     * lists that batch their order into an explicit save. Fire-and-forget: an async
+     * handler runs unawaited, so it owns its own error handling.
+     */
+    onReorder?: (item: T, newIndex: number, oldIndex: number) => void
+    /** Highlight duration in ms; keep in sync with the CSS flash animation. */
+    flashMs?: number
+}
+
+/**
+ * Reorder logic shared by every sortable list in the app: the up/down move math
+ * and the transient "just moved" highlight. The list is mutated in place so it
+ * stays the same array reference a parent `v-model` and vue-draggable both bind to.
+ *
+ * Pairs with SortableList.vue, which owns the drag wiring, controls, and a11y;
+ * exposed on its own so the move behaviour can be unit-tested without a DOM.
+ */
+function useReorder<T>(list: Ref<T[]>, options: UseReorderOptions<T>) {
+    const { getKey, onReorder, flashMs = DEFAULT_FLASH_MS } = options
+
+    const justMovedKey = ref<ReorderKey | null>(null)
+    // A generation counter supersedes earlier flash timers instead of clearing them, so
+    // a rapid second move's highlight wins without tracking a mutable timer handle.
+    let flashGeneration = 0
+
+    function flash(key: ReorderKey) {
+        justMovedKey.value = key
+        const generation = (flashGeneration += 1)
+        setTimeout(() => {
+            if (flashGeneration === generation && justMovedKey.value === key) {
+                justMovedKey.value = null
+            }
+        }, flashMs)
+    }
+
+    function move(from: number, to: number): boolean {
+        const items = list.value
+        if (from === to || from < 0 || to < 0 || from >= items.length || to >= items.length) {
+            return false
+        }
+        const item = items[from]
+        if (item === undefined) {
+            return false
+        }
+        items.splice(from, 1)
+        items.splice(to, 0, item)
+        flash(getKey(item))
+        onReorder?.(item, to, from)
+        return true
+    }
+
+    function moveUp(index: number): boolean {
+        return move(index, index - 1)
+    }
+
+    function moveDown(index: number): boolean {
+        return move(index, index + 1)
+    }
+
+    /**
+     * Finish a vue-draggable drag: the bound array is already reordered by the time
+     * its `end` event fires, so only flash the dropped row and fire `onReorder`.
+     */
+    function commitDrag(oldIndex: number, newIndex: number) {
+        if (oldIndex === newIndex) {
+            return
+        }
+        const item = list.value[newIndex]
+        if (item === undefined) {
+            return
+        }
+        flash(getKey(item))
+        onReorder?.(item, newIndex, oldIndex)
+    }
+
+    return { justMovedKey, move, moveUp, moveDown, commitDrag }
+}
+
+export { useReorder, type ReorderKey }
diff --git a/VueApp/src/styles/base.css b/VueApp/src/styles/base.css
index 5e7a35132..7ede7daaf 100644
--- a/VueApp/src/styles/base.css
+++ b/VueApp/src/styles/base.css
@@ -368,6 +368,44 @@ header .q-avatar {
     width: 31px !important;
 }
 
+/* QTable card (grid) mode field rows — used when dense list tables collapse to
+   stacked cards on small screens. Label column is fixed-width so values align. */
+.list-card-field {
+    display: flex;
+    gap: 0.75rem;
+    align-items: baseline;
+    padding: 0.125rem 0;
+}
+
+.list-card-label {
+    flex: 0 0 7rem;
+    font-weight: 600;
+    color: var(--ucdavis-black-70);
+}
+
+.list-card-value {
+    min-width: 0;
+    overflow-wrap: anywhere;
+}
+
+/* Dialog card widths — replaces inline width styles on q-card inside q-dialog.
+   A fixed width with a 95vw cap keeps modals comfortable on desktop and off
+   the screen edges on small viewports. */
+.dialog-card-sm {
+    width: 480px;
+    max-width: 95vw;
+}
+
+.dialog-card-md {
+    width: 600px;
+    max-width: 95vw;
+}
+
+.dialog-card-lg {
+    width: 900px;
+    max-width: 95vw;
+}
+
 /* Skip to content link — visible on focus for keyboard users */
 .skip-to-content {
     position: absolute;
@@ -410,6 +448,16 @@ header .q-avatar {
     min-height: 24px;
 }
 
+/* On touch devices, give the CMS card-mode action buttons the 44px comfort
+   target (WCAG 2.5.5); pointer devices keep the dense default. Scoped to the
+   list cards so it doesn't reflow every dense table app-wide. */
+@media (pointer: coarse) {
+    .list-card .q-card__actions .q-btn {
+        min-width: 44px;
+        min-height: 44px;
+    }
+}
+
 /* Quasar palette AA contrast overrides (!important required to override Quasar's !important).
    Kept in sync with web/wwwroot/css/site.css so Razor and SPA render the same color. */
 .text-grey {
diff --git a/VueApp/src/styles/colors.css b/VueApp/src/styles/colors.css
index 79b090f2a..dd34f1b8c 100644
--- a/VueApp/src/styles/colors.css
+++ b/VueApp/src/styles/colors.css
@@ -45,6 +45,13 @@
     /* UC Davis Secondary Palette (used as accents, never dominant) */
     --ucdavis-arboretum: #00c4b3;
     --ucdavis-cabernet: #481268;
+
+    /* Neutral surface tokens — blue-tinted near-whites with no equivalent in the
+       brand ramp (its lightest blue, --ucdavis-blue-10 #cdd6e0, is far too dark
+       for a panel fill). Borders use the existing --ucdavis-black-10 directly. */
+    --surface: #ffffff;
+    --surface-tint: #f5f7fb;
+    --surface-tint-raised: #fafbff;
 }
 
 /* Background utility classes — UC Davis palette */
diff --git a/test/CMS/CMSContentControllerTests.cs b/test/CMS/CMSContentControllerTests.cs
new file mode 100644
index 000000000..4633b0d29
--- /dev/null
+++ b/test/CMS/CMSContentControllerTests.cs
@@ -0,0 +1,426 @@
+using Microsoft.AspNetCore.Http;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.Infrastructure;
+using Microsoft.AspNetCore.Mvc.ModelBinding;
+using Microsoft.EntityFrameworkCore;
+using Microsoft.Extensions.DependencyInjection;
+using NSubstitute;
+using NSubstitute.ReturnsExtensions;
+using NSubstitute.ExceptionExtensions;
+using Viper.Areas.CMS.Constants;
+using Viper.Areas.CMS.Controllers;
+using Viper.Areas.CMS.Models;
+using Viper.Areas.CMS.Models.DTOs;
+using Viper.Areas.CMS.Services;
+using Viper.Classes.SQLContext;
+using Viper.Models;
+using Viper.Models.AAUD;
+using Viper.Services;
+
+namespace Viper.test.CMS;
+
+/// <summary>
+/// Controller wiring tests for CMSContentController: the action layer delegates to
+/// ICmsContentBlockService and maps results to status codes (404 on null, 409 on
+/// concurrency, 400 on validation). The new history-list and version-diff endpoints
+/// are covered for passthrough and 404-on-null only; the query/diff logic itself lives
+/// in CmsContentBlockServiceTests. Permanent delete is admin-gated.
+/// </summary>
+public sealed class CMSContentControllerTests : IDisposable
+{
+    private readonly ICmsContentBlockService _blockService;
+    private readonly IUserHelper _userHelper;
+    private readonly VIPERContext _context;
+    private readonly RAPSContext _rapsContext;
+    private readonly IHtmlSanitizerService _sanitizer;
+    private readonly CMSContentController _controller;
+
+    public CMSContentControllerTests()
+    {
+        _blockService = Substitute.For<ICmsContentBlockService>();
+        _userHelper = Substitute.For<IUserHelper>();
+        _sanitizer = Substitute.For<IHtmlSanitizerService>();
+        _context = new VIPERContext(new DbContextOptionsBuilder<VIPERContext>()
+            .UseInMemoryDatabase("VIPER_" + Guid.NewGuid()).Options);
+        _rapsContext = new RAPSContext(new DbContextOptionsBuilder<RAPSContext>()
+            .UseInMemoryDatabase("RAPS_" + Guid.NewGuid()).Options);
+
+        _controller = new CMSContentController(_context, _rapsContext, _sanitizer, _blockService, _userHelper);
+        SetupControllerContext();
+    }
+
+    public void Dispose()
+    {
+        _context.Dispose();
+        _rapsContext.Dispose();
+    }
+
+    private void SetupControllerContext()
+    {
+        // ValidationProblem(string) resolves ProblemDetailsFactory from RequestServices, so a
+        // stub is registered; otherwise the call throws before producing the ObjectResult.
+        var services = new ServiceCollection();
+        services.AddSingleton<ProblemDetailsFactory, StubProblemDetailsFactory>();
+        _controller.ControllerContext = new ControllerContext
+        {
+            HttpContext = new DefaultHttpContext { RequestServices = services.BuildServiceProvider() }
+        };
+    }
+
+    private sealed class StubProblemDetailsFactory : ProblemDetailsFactory
+    {
+        public override ProblemDetails CreateProblemDetails(HttpContext httpContext, int? statusCode = null,
+            string? title = null, string? type = null, string? detail = null, string? instance = null)
+            => new() { Status = statusCode, Title = title, Detail = detail };
+
+        public override ValidationProblemDetails CreateValidationProblemDetails(HttpContext httpContext,
+            ModelStateDictionary modelStateDictionary, int? statusCode = null, string? title = null,
+            string? type = null, string? detail = null, string? instance = null)
+            => new(modelStateDictionary) { Status = statusCode, Title = title, Detail = detail };
+    }
+
+    private static ContentBlockDto Block(int id = 1) => new()
+    {
+        ContentBlockId = id,
+        Title = "Block",
+        System = "Viper",
+        Content = "<p>x</p>"
+    };
+
+    private static CMSBlockAddEdit Request(int id = 1) => new()
+    {
+        ContentBlockId = id,
+        Title = "Block",
+        System = "Viper",
+        Content = "<p>x</p>",
+        AllowPublicAccess = false,
+        LastModifiedOn = DateTime.Now
+    };
+
+    #region List / Get
+
+    [Fact]
+    public async Task GetContentBlocks_PassesFiltersThrough()
+    {
+        var blocks = new List<ContentBlockDto> { Block() };
+        _blockService.GetContentBlocksAsync("deleted", "Viper", "cats", "search", true, Arg.Any<CancellationToken>())
+            .Returns(blocks);
+
+        var result = await _controller.GetContentBlocks("deleted", "Viper", "cats", "search", true, TestContext.Current.CancellationToken);
+
+        Assert.Same(blocks, result.Value);
+        await _blockService.Received(1).GetContentBlocksAsync("deleted", "Viper", "cats", "search", true,
+            Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task GetContentBlock_ReturnsBlock_WhenFound()
+    {
+        _blockService.GetContentBlockAsync(5, Arg.Any<CancellationToken>()).Returns(Block(5));
+
+        var result = await _controller.GetContentBlock(5, TestContext.Current.CancellationToken);
+
+        Assert.NotNull(result.Value);
+        Assert.Equal(5, result.Value!.ContentBlockId);
+    }
+
+    [Fact]
+    public async Task GetContentBlock_ReturnsNotFound_WhenMissing()
+    {
+        _blockService.GetContentBlockAsync(999, Arg.Any<CancellationToken>()).ReturnsNull();
+
+        var result = await _controller.GetContentBlock(999, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    #endregion
+
+    #region Create
+
+    [Fact]
+    public async Task CreateContentBlock_ReturnsBadRequest_WhenTitleAndSystemMissing()
+    {
+        var request = new CMSBlockAddEdit { ContentBlockId = 0, AllowPublicAccess = false, Content = "x", Title = "", System = "" };
+
+        var result = await _controller.CreateContentBlock(request, TestContext.Current.CancellationToken);
+
+        var badRequest = Assert.IsType<BadRequestObjectResult>(result.Result);
+        Assert.Contains("Title is required", badRequest.Value?.ToString());
+        Assert.Contains("System is required", badRequest.Value?.ToString());
+        await _blockService.DidNotReceive().CreateContentBlockAsync(Arg.Any<CMSBlockAddEdit>(), Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task CreateContentBlock_ReturnsBlock_OnSuccess()
+    {
+        var request = Request(0);
+        _blockService.CreateContentBlockAsync(request, Arg.Any<CancellationToken>()).Returns(Block(7));
+
+        var result = await _controller.CreateContentBlock(request, TestContext.Current.CancellationToken);
+
+        Assert.NotNull(result.Value);
+        Assert.Equal(7, result.Value!.ContentBlockId);
+    }
+
+    [Fact]
+    public async Task CreateContentBlock_ReturnsValidationProblem_OnArgumentException()
+    {
+        var request = Request(0);
+        _blockService.CreateContentBlockAsync(request, Arg.Any<CancellationToken>())
+            .Throws(new ArgumentException("Friendly name already in use"));
+
+        var result = await _controller.CreateContentBlock(request, TestContext.Current.CancellationToken);
+
+        Assert.IsType<ObjectResult>(result.Result);
+        var problem = (ObjectResult)result.Result!;
+        Assert.IsType<ValidationProblemDetails>(problem.Value);
+    }
+
+    #endregion
+
+    #region Update
+
+    [Fact]
+    public async Task UpdateContentBlock_ReturnsBadRequest_WhenRouteIdMismatch()
+    {
+        var request = Request(2);
+
+        var result = await _controller.UpdateContentBlock(1, request, TestContext.Current.CancellationToken);
+
+        Assert.IsType<BadRequestResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task UpdateContentBlock_ReturnsBlock_OnSuccess()
+    {
+        var request = Request(3);
+        _blockService.UpdateContentBlockAsync(3, request, Arg.Any<CancellationToken>()).Returns(Block(3));
+
+        var result = await _controller.UpdateContentBlock(3, request, TestContext.Current.CancellationToken);
+
+        Assert.NotNull(result.Value);
+        Assert.Equal(3, result.Value!.ContentBlockId);
+    }
+
+    [Fact]
+    public async Task UpdateContentBlock_ReturnsNotFound_WhenServiceReturnsNull()
+    {
+        var request = Request(3);
+        _blockService.UpdateContentBlockAsync(3, request, Arg.Any<CancellationToken>()).ReturnsNull();
+
+        var result = await _controller.UpdateContentBlock(3, request, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task UpdateContentBlock_ReturnsConflict_OnConcurrencyException()
+    {
+        var request = Request(3);
+        _blockService.UpdateContentBlockAsync(3, request, Arg.Any<CancellationToken>())
+            .Throws(new CmsConcurrencyException("stale"));
+
+        var result = await _controller.UpdateContentBlock(3, request, TestContext.Current.CancellationToken);
+
+        Assert.IsType<ConflictObjectResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task UpdateContentOnly_ReturnsBlock_OnSuccess()
+    {
+        var update = new ContentOnlyUpdate { Content = "<p>quick</p>", LastModifiedOn = DateTime.Now };
+        _blockService.UpdateContentOnlyAsync(4, update.Content, update.LastModifiedOn, Arg.Any<CancellationToken>())
+            .Returns(Block(4));
+
+        var result = await _controller.UpdateContentOnly(4, update, TestContext.Current.CancellationToken);
+
+        Assert.NotNull(result.Value);
+        await _blockService.Received(1).UpdateContentOnlyAsync(4, update.Content, update.LastModifiedOn,
+            Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task UpdateContentOnly_ReturnsConflict_OnConcurrencyException()
+    {
+        var update = new ContentOnlyUpdate { Content = "<p>quick</p>", LastModifiedOn = DateTime.Now };
+        _blockService.UpdateContentOnlyAsync(4, update.Content, update.LastModifiedOn, Arg.Any<CancellationToken>())
+            .Throws(new CmsConcurrencyException("stale"));
+
+        var result = await _controller.UpdateContentOnly(4, update, TestContext.Current.CancellationToken);
+
+        Assert.IsType<ConflictObjectResult>(result.Result);
+    }
+
+    #endregion
+
+    #region History list + version + diff
+
+    [Fact]
+    public async Task GetHistory_PassesBlockIdThrough()
+    {
+        var history = new List<ContentHistoryListItemDto> { new() { ContentHistoryId = 1 } };
+        _blockService.GetHistoryAsync(5, Arg.Any<CancellationToken>()).Returns(history);
+
+        var result = await _controller.GetHistory(5, TestContext.Current.CancellationToken);
+
+        Assert.Same(history, result.Value);
+    }
+
+    [Fact]
+    public async Task GetHistoryVersion_ReturnsNotFound_WhenMissing()
+    {
+        _blockService.GetHistoryVersionAsync(5, 12, Arg.Any<CancellationToken>()).ReturnsNull();
+
+        var result = await _controller.GetHistoryVersion(5, 12, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task GetHistoryEntries_PassesFilterAndPaginationThrough_AndSetsTotal()
+    {
+        var entries = new List<ContentHistoryAuditDto> { new() { ContentHistoryId = 1 } };
+        _blockService.GetHistoryEntriesAsync(Arg.Any<CmsContentHistoryFilter>(), 2, 25, Arg.Any<CancellationToken>())
+            .Returns(entries);
+        _blockService.GetHistoryEntryCountAsync(Arg.Any<CmsContentHistoryFilter>(), Arg.Any<CancellationToken>())
+            .Returns(99);
+        var pagination = new ApiPagination { Page = 2, PerPage = 25 };
+        var from = new DateTime(2026, 1, 1, 0, 0, 0, DateTimeKind.Local);
+        var to = new DateTime(2026, 2, 1, 0, 0, 0, DateTimeKind.Local);
+
+        var result = await _controller.GetHistoryEntries(7, "editorX", from, to, "needle", pagination, TestContext.Current.CancellationToken);
+
+        Assert.Same(entries, result.Value);
+        Assert.Equal(99, pagination.TotalRecords);
+        await _blockService.Received(1).GetHistoryEntriesAsync(
+            Arg.Is<CmsContentHistoryFilter>(f =>
+                f.ContentBlockId == 7 && f.ModifiedBy == "editorX" && f.From == from && f.To == to && f.Search == "needle"),
+            2, 25, Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task GetHistoryEntries_DefaultsPageAndPerPage_AndSkipsCount_WhenNoPagination()
+    {
+        _blockService.GetHistoryEntriesAsync(Arg.Any<CmsContentHistoryFilter>(), 1, 50, Arg.Any<CancellationToken>())
+            .Returns(new List<ContentHistoryAuditDto>());
+
+        await _controller.GetHistoryEntries(null, null, null, null, null, null, TestContext.Current.CancellationToken);
+
+        await _blockService.Received(1).GetHistoryEntriesAsync(Arg.Any<CmsContentHistoryFilter>(), 1, 50,
+            Arg.Any<CancellationToken>());
+        await _blockService.DidNotReceive().GetHistoryEntryCountAsync(Arg.Any<CmsContentHistoryFilter>(),
+            Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task GetHistoryVersionDiff_PassesThrough_AndReturnsDto()
+    {
+        var diff = new ContentHistoryDiffDto { HasComparison = true, Content = "<ins>x</ins>" };
+        _blockService.GetHistoryVersionDiffAsync(5, 12, Arg.Any<CancellationToken>()).Returns(diff);
+
+        var result = await _controller.GetHistoryVersionDiff(5, 12, TestContext.Current.CancellationToken);
+
+        Assert.Same(diff, result.Value);
+        await _blockService.Received(1).GetHistoryVersionDiffAsync(5, 12, Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task GetHistoryVersionDiff_ReturnsNotFound_WhenNull()
+    {
+        _blockService.GetHistoryVersionDiffAsync(5, 12, Arg.Any<CancellationToken>()).ReturnsNull();
+
+        var result = await _controller.GetHistoryVersionDiff(5, 12, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task DiffAgainstHistoryVersion_PassesPostedContentThrough_AndReturnsDto()
+    {
+        var diff = new ContentHistoryDiffDto { HasComparison = true, Content = "<ins>draft</ins>" };
+        _blockService.DiffContentAgainstHistoryAsync(5, 12, "<p>draft</p>", Arg.Any<CancellationToken>()).Returns(diff);
+        var request = new DiffAgainstHistoryRequest { Content = "<p>draft</p>" };
+
+        var result = await _controller.DiffAgainstHistoryVersion(5, 12, request, TestContext.Current.CancellationToken);
+
+        Assert.Same(diff, result.Value);
+        await _blockService.Received(1).DiffContentAgainstHistoryAsync(5, 12, "<p>draft</p>",
+            Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task DiffAgainstHistoryVersion_ReturnsNotFound_WhenNull()
+    {
+        _blockService.DiffContentAgainstHistoryAsync(5, 12, Arg.Any<string>(), Arg.Any<CancellationToken>()).ReturnsNull();
+
+        var result = await _controller.DiffAgainstHistoryVersion(5, 12, new DiffAgainstHistoryRequest { Content = "x" }, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    #endregion
+
+    #region Restore / Delete
+
+    [Fact]
+    public async Task RestoreContentBlock_ReturnsNoContent_WhenRestored()
+    {
+        _blockService.RestoreAsync(5, Arg.Any<CancellationToken>()).Returns(true);
+
+        var result = await _controller.RestoreContentBlock(5, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NoContentResult>(result);
+    }
+
+    [Fact]
+    public async Task RestoreContentBlock_ReturnsNotFound_WhenMissing()
+    {
+        _blockService.RestoreAsync(5, Arg.Any<CancellationToken>()).Returns(false);
+
+        var result = await _controller.RestoreContentBlock(5, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result);
+    }
+
+    [Fact]
+    public async Task DeleteContentBlock_SoftDelete_ReturnsNoContent()
+    {
+        _blockService.SoftDeleteAsync(5, Arg.Any<CancellationToken>()).Returns(true);
+
+        var result = await _controller.DeleteContentBlock(5, permanent: false, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NoContentResult>(result);
+        await _blockService.DidNotReceive().PermanentlyDeleteAsync(Arg.Any<int>(), Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task DeleteContentBlock_PermanentWithoutAdmin_ReturnsForbidden()
+    {
+        var user = new AaudUser { AaudUserId = 1, LoginId = "user" };
+        _userHelper.GetCurrentUser().Returns(user);
+        _userHelper.HasPermission(_rapsContext, user, CmsPermissions.Admin).Returns(false);
+
+        var result = await _controller.DeleteContentBlock(5, permanent: true, TestContext.Current.CancellationToken);
+
+        var objectResult = Assert.IsType<ObjectResult>(result);
+        Assert.Equal(StatusCodes.Status403Forbidden, objectResult.StatusCode);
+        await _blockService.DidNotReceive().PermanentlyDeleteAsync(Arg.Any<int>(), Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task DeleteContentBlock_PermanentAsAdmin_ReturnsNoContent()
+    {
+        var user = new AaudUser { AaudUserId = 1, LoginId = "admin" };
+        _userHelper.GetCurrentUser().Returns(user);
+        _userHelper.HasPermission(_rapsContext, user, CmsPermissions.Admin).Returns(true);
+        _blockService.PermanentlyDeleteAsync(5, Arg.Any<CancellationToken>()).Returns(true);
+
+        var result = await _controller.DeleteContentBlock(5, permanent: true, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NoContentResult>(result);
+        await _blockService.Received(1).PermanentlyDeleteAsync(5, Arg.Any<CancellationToken>());
+    }
+
+    #endregion
+}
diff --git a/test/CMS/CMSContentPermissionTests.cs b/test/CMS/CMSContentPermissionTests.cs
new file mode 100644
index 000000000..93d429609
--- /dev/null
+++ b/test/CMS/CMSContentPermissionTests.cs
@@ -0,0 +1,178 @@
+using Microsoft.EntityFrameworkCore;
+using NSubstitute;
+using Viper.Areas.CMS.Constants;
+using Viper.Classes.SQLContext;
+using Viper.Models.AAUD;
+using Viper.Models.RAPS;
+using Viper.Models.VIPER;
+using Viper.Services;
+using DataCms = Viper.Areas.CMS.Data.CMS;
+
+namespace Viper.test.CMS;
+
+/// <summary>
+/// Tests for Data.CMS.GetContentBlocksAllowed, the public-display permission gate behind the
+/// CMS content endpoint (content/fn/{friendlyName}). A public block is served to anyone; a
+/// restricted block is withheld unless the viewer is a CMS admin, the block has no permissions
+/// and the viewer is logged in, or the viewer holds one of the block's permissions. Permission
+/// scenarios are driven by mocking IUserHelper.
+/// </summary>
+public sealed class CMSContentPermissionTests : IDisposable
+{
+    private readonly VIPERContext _context;
+    private readonly RAPSContext _rapsContext;
+    private readonly IHtmlSanitizerService _sanitizer;
+    private readonly IUserHelper _userHelper;
+    private readonly DataCms _cms;
+
+    public CMSContentPermissionTests()
+    {
+        _context = new VIPERContext(new DbContextOptionsBuilder<VIPERContext>()
+            .UseInMemoryDatabase("VIPER_" + Guid.NewGuid()).Options);
+        _rapsContext = new RAPSContext(new DbContextOptionsBuilder<RAPSContext>()
+            .UseInMemoryDatabase("RAPS_" + Guid.NewGuid()).Options);
+        _sanitizer = Substitute.For<IHtmlSanitizerService>();
+        _sanitizer.Sanitize(Arg.Any<string>()).Returns(c => c.ArgAt<string>(0));
+        _userHelper = Substitute.For<IUserHelper>();
+
+        _cms = new DataCms(_context, _rapsContext, _sanitizer) { UserHelper = _userHelper };
+    }
+
+    public void Dispose()
+    {
+        _context.Dispose();
+        _rapsContext.Dispose();
+    }
+
+    private async Task<ContentBlock> SeedBlockAsync(bool allowPublic, params string[] permissions)
+    {
+        var block = new ContentBlock
+        {
+            Content = "<p>secret</p>",
+            Title = "Block",
+            System = "Viper",
+            FriendlyName = "block-" + Guid.NewGuid().ToString("N")[..8],
+            AllowPublicAccess = allowPublic,
+            ModifiedOn = DateTime.Now,
+            ModifiedBy = "author"
+        };
+        foreach (var permission in permissions)
+        {
+            block.ContentBlockToPermissions.Add(new ContentBlockToPermission { Permission = permission });
+        }
+        _context.ContentBlocks.Add(block);
+        await _context.SaveChangesAsync(TestContext.Current.CancellationToken);
+        return block;
+    }
+
+    private static AaudUser User() => new() { AaudUserId = 1, LoginId = "viewer", MothraId = "m1" };
+
+    private void GrantPermissions(AaudUser user, params string[] permissions)
+    {
+        _userHelper.GetAllPermissions(_rapsContext, user)
+            .Returns(permissions.Select(p => new TblPermission { Permission = p }).ToList());
+    }
+
+    [Fact]
+    public async Task PublicBlock_ReturnedToAnonymousUser()
+    {
+        var block = await SeedBlockAsync(allowPublic: true);
+        _userHelper.GetCurrentUser().Returns((AaudUser?)null);
+
+        var result = _cms.GetContentBlocksAllowed(null, block.FriendlyName, null, null, null, null, null, 1)?.ToList();
+
+        Assert.NotNull(result);
+        Assert.Single(result!);
+        Assert.Equal(block.ContentBlockId, result![0].ContentBlockId);
+    }
+
+    [Fact]
+    public async Task RestrictedBlock_WithheldFromUnprivilegedUser()
+    {
+        var block = await SeedBlockAsync(allowPublic: false, "SVMSecure.CATS");
+        var user = User();
+        _userHelper.GetCurrentUser().Returns(user);
+        _userHelper.HasPermission(_rapsContext, user, CmsPermissions.ManageContentBlocks).Returns(false);
+        _userHelper.HasPermission(_rapsContext, user, "SVMSecure").Returns(true);
+        // User holds an unrelated permission, not the block's required one.
+        GrantPermissions(user, "SVMSecure.Other");
+
+        var result = _cms.GetContentBlocksAllowed(null, block.FriendlyName, null, null, null, null, null, 1)?.ToList();
+
+        Assert.NotNull(result);
+        Assert.Empty(result!);
+    }
+
+    [Fact]
+    public async Task RestrictedBlock_ReturnedWhenUserHoldsBlockPermission()
+    {
+        var block = await SeedBlockAsync(allowPublic: false, "SVMSecure.CATS");
+        var user = User();
+        _userHelper.GetCurrentUser().Returns(user);
+        _userHelper.HasPermission(_rapsContext, user, CmsPermissions.ManageContentBlocks).Returns(false);
+        GrantPermissions(user, "SVMSecure.CATS");
+
+        var result = _cms.GetContentBlocksAllowed(null, block.FriendlyName, null, null, null, null, null, 1)?.ToList();
+
+        Assert.NotNull(result);
+        Assert.Single(result!);
+    }
+
+    [Fact]
+    public async Task RestrictedBlock_PermissionMatchIsCaseInsensitive()
+    {
+        var block = await SeedBlockAsync(allowPublic: false, "SVMSecure.CATS");
+        var user = User();
+        _userHelper.GetCurrentUser().Returns(user);
+        _userHelper.HasPermission(_rapsContext, user, CmsPermissions.ManageContentBlocks).Returns(false);
+        GrantPermissions(user, "svmsecure.cats");
+
+        var result = _cms.GetContentBlocksAllowed(null, block.FriendlyName, null, null, null, null, null, 1)?.ToList();
+
+        Assert.NotNull(result);
+        Assert.Single(result!);
+    }
+
+    [Fact]
+    public async Task CmsAdmin_SeesRestrictedBlock()
+    {
+        var block = await SeedBlockAsync(allowPublic: false, "SVMSecure.CATS");
+        var user = User();
+        _userHelper.GetCurrentUser().Returns(user);
+        // CMS admin override short-circuits before any block-permission match.
+        _userHelper.HasPermission(_rapsContext, user, CmsPermissions.ManageContentBlocks).Returns(true);
+
+        var result = _cms.GetContentBlocksAllowed(null, block.FriendlyName, null, null, null, null, null, 1)?.ToList();
+
+        Assert.NotNull(result);
+        Assert.Single(result!);
+    }
+
+    [Fact]
+    public async Task NoPermissionBlock_ReturnedToAnyLoggedInUser()
+    {
+        // A block with no permissions is visible to any authenticated VIPER user (has "SVMSecure").
+        var block = await SeedBlockAsync(allowPublic: false);
+        var user = User();
+        _userHelper.GetCurrentUser().Returns(user);
+        _userHelper.HasPermission(_rapsContext, user, CmsPermissions.ManageContentBlocks).Returns(false);
+        _userHelper.HasPermission(_rapsContext, user, "SVMSecure").Returns(true);
+
+        var result = _cms.GetContentBlocksAllowed(null, block.FriendlyName, null, null, null, null, null, 1)?.ToList();
+
+        Assert.NotNull(result);
+        Assert.Single(result!);
+    }
+
+    [Fact]
+    public async Task RestrictedBlock_WithheldFromAnonymousUser()
+    {
+        var block = await SeedBlockAsync(allowPublic: false, "SVMSecure.CATS");
+        _userHelper.GetCurrentUser().Returns((AaudUser?)null);
+
+        var result = _cms.GetContentBlocksAllowed(null, block.FriendlyName, null, null, null, null, null, 1)?.ToList();
+
+        Assert.NotNull(result);
+        Assert.Empty(result!);
+    }
+}
diff --git a/test/CMS/CMSFilesControllerTests.cs b/test/CMS/CMSFilesControllerTests.cs
new file mode 100644
index 000000000..eaac78e9a
--- /dev/null
+++ b/test/CMS/CMSFilesControllerTests.cs
@@ -0,0 +1,380 @@
+using Microsoft.AspNetCore.Http;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.EntityFrameworkCore;
+using Microsoft.Extensions.DependencyInjection;
+using Microsoft.Extensions.Logging;
+using NSubstitute;
+using NSubstitute.ReturnsExtensions;
+using NSubstitute.ExceptionExtensions;
+using Viper.Areas.CMS.Constants;
+using Viper.Areas.CMS.Controllers;
+using Viper.Areas.CMS.Models.DTOs;
+using Viper.Areas.CMS.Services;
+using Viper.Classes.SQLContext;
+using Viper.Models;
+using Viper.Models.AAUD;
+
+namespace Viper.test.CMS;
+
+/// <summary>
+/// Controller wiring tests for CMSFilesController: list/paging passthrough, get/upload/update
+/// delete/restore status mapping (404 on null, 400 on bad input/conflict), import + preview +
+/// bulk-encrypt empty-input guards, and admin-only permanent delete. The service behavior is
+/// covered separately in CmsFileServiceTests / CmsFileImportServiceTests.
+/// </summary>
+public sealed class CMSFilesControllerTests : IDisposable
+{
+    private readonly ICmsFileService _fileService;
+    private readonly ICmsFileStorageService _storage;
+    private readonly ICmsFileAuditService _auditService;
+    private readonly ICmsFileImportService _importService;
+    private readonly RAPSContext _rapsContext;
+    private readonly IUserHelper _userHelper;
+    private readonly CMSFilesController _controller;
+
+    public CMSFilesControllerTests()
+    {
+        _fileService = Substitute.For<ICmsFileService>();
+        _storage = Substitute.For<ICmsFileStorageService>();
+        _auditService = Substitute.For<ICmsFileAuditService>();
+        _importService = Substitute.For<ICmsFileImportService>();
+        _rapsContext = new RAPSContext(new DbContextOptionsBuilder<RAPSContext>()
+            .UseInMemoryDatabase("RAPS_" + Guid.NewGuid()).Options);
+        _userHelper = Substitute.For<IUserHelper>();
+
+        _controller = new CMSFilesController(_fileService, _storage, _auditService, _importService, _rapsContext,
+            Substitute.For<ILogger<CMSFilesController>>(), _userHelper);
+        SetupControllerContext();
+    }
+
+    public void Dispose() => _rapsContext.Dispose();
+
+    private void SetupControllerContext()
+    {
+        var serviceProvider = new ServiceCollection().BuildServiceProvider();
+        _controller.ControllerContext = new ControllerContext
+        {
+            HttpContext = new DefaultHttpContext { RequestServices = serviceProvider }
+        };
+    }
+
+    private static CmsFileDto File(Guid? guid = null) => new()
+    {
+        FileGuid = guid ?? Guid.NewGuid(),
+        FileName = "report.pdf",
+        FriendlyName = "cats-report.pdf",
+        Folder = "cats"
+    };
+
+    private static IFormFile MakeFormFile(string fileName = "report.pdf", long length = 3)
+    {
+        var stream = new MemoryStream(new byte[length]);
+        return new FormFile(stream, 0, length, "file", fileName);
+    }
+
+    #region List
+
+    [Fact]
+    public async Task GetFiles_PassesFiltersAndPaginationThrough_AndSetsTotal()
+    {
+        var files = new List<CmsFileDto> { File() };
+        _fileService.GetFilesAsync("cats", "deleted", "budget", true, false, 2, 25, "modifiedOn", true,
+            Arg.Any<CancellationToken>()).Returns((files, 42));
+        var pagination = new ApiPagination { Page = 2, PerPage = 25 };
+
+        var result = await _controller.GetFiles("cats", "budget", true, false, pagination, "deleted", "modifiedOn", true, TestContext.Current.CancellationToken);
+
+        Assert.Same(files, result.Value);
+        Assert.Equal(42, pagination.TotalRecords);
+        await _fileService.Received(1).GetFilesAsync("cats", "deleted", "budget", true, false, 2, 25, "modifiedOn", true,
+            Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task GetFiles_DefaultsPageAndPerPage_WhenNoPagination()
+    {
+        _fileService.GetFilesAsync(null, "active", null, null, null, 1, 50, "friendlyName", false,
+            Arg.Any<CancellationToken>()).Returns((new List<CmsFileDto>(), 0));
+
+        await _controller.GetFiles(null, null, null, null, null, ct: TestContext.Current.CancellationToken);
+
+        await _fileService.Received(1).GetFilesAsync(null, "active", null, null, null, 1, 50, "friendlyName", false,
+            Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task GetFolders_DiskListByDefault_FilterListWhenIncludeData()
+    {
+        _storage.GetTopLevelFolders().Returns(new List<string> { "cats" });
+        _storage.GetFilterFoldersAsync(Arg.Any<CancellationToken>()).Returns(new List<string> { "cats", "legacy" });
+
+        var disk = await _controller.GetFolders(includeData: false, TestContext.Current.CancellationToken);
+        var filter = await _controller.GetFolders(includeData: true, TestContext.Current.CancellationToken);
+
+        Assert.Equal(new List<string> { "cats" }, disk.Value);
+        Assert.Equal(new List<string> { "cats", "legacy" }, filter.Value);
+    }
+
+    [Fact]
+    public async Task GetAudit_PassesFilterAndPaginationThrough_AndSetsTotal()
+    {
+        _auditService.GetAuditEntriesAsync(Arg.Any<CmsFileAuditFilter>(), 3, 10, Arg.Any<CancellationToken>())
+            .Returns(new List<Viper.Models.VIPER.FileAudit>());
+        _auditService.GetAuditEntryCountAsync(Arg.Any<CmsFileAuditFilter>(), Arg.Any<CancellationToken>()).Returns(5);
+        var fileGuid = Guid.NewGuid();
+        var pagination = new ApiPagination { Page = 3, PerPage = 10 };
+
+        await _controller.GetAudit(fileGuid, "AccessFile", "loginX", null, null, "needle", pagination, TestContext.Current.CancellationToken);
+
+        Assert.Equal(5, pagination.TotalRecords);
+        await _auditService.Received(1).GetAuditEntriesAsync(
+            Arg.Is<CmsFileAuditFilter>(f =>
+                f.FileGuid == fileGuid && f.Action == "AccessFile" && f.LoginId == "loginX" && f.Search == "needle"),
+            3, 10, Arg.Any<CancellationToken>());
+    }
+
+    #endregion
+
+    #region Get / CheckName
+
+    [Fact]
+    public async Task GetFile_ReturnsFile_WhenFound()
+    {
+        var guid = Guid.NewGuid();
+        _fileService.GetFileAsync(guid, Arg.Any<CancellationToken>()).Returns(File(guid));
+
+        var result = await _controller.GetFile(guid, TestContext.Current.CancellationToken);
+
+        Assert.NotNull(result.Value);
+        Assert.Equal(guid, result.Value!.FileGuid);
+    }
+
+    [Fact]
+    public async Task GetFile_ReturnsNotFound_WhenMissing()
+    {
+        _fileService.GetFileAsync(Arg.Any<Guid>(), Arg.Any<CancellationToken>()).ReturnsNull();
+
+        var result = await _controller.GetFile(Guid.NewGuid(), TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task CheckName_ReturnsBadRequest_OnArgumentException()
+    {
+        _fileService.CheckNameAsync("nope", "report.pdf", Arg.Any<CancellationToken>())
+            .Throws(new ArgumentException("Invalid folder."));
+
+        var result = await _controller.CheckName("nope", "report.pdf", TestContext.Current.CancellationToken);
+
+        Assert.IsType<BadRequestObjectResult>(result.Result);
+    }
+
+    #endregion
+
+    #region Upload / Update
+
+    [Fact]
+    public async Task UploadFile_ReturnsBadRequest_WhenNoFile()
+    {
+        var result = await _controller.UploadFile(new CmsFileCreateRequest { Folder = "cats" }, null, TestContext.Current.CancellationToken);
+
+        Assert.IsType<BadRequestObjectResult>(result.Result);
+        await _fileService.DidNotReceive().CreateFileAsync(Arg.Any<CmsFileCreateRequest>(), Arg.Any<IFormFile>(),
+            Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task UploadFile_ReturnsFile_OnSuccess()
+    {
+        var request = new CmsFileCreateRequest { Folder = "cats" };
+        var dto = File();
+        _fileService.CreateFileAsync(request, Arg.Any<IFormFile>(), Arg.Any<CancellationToken>()).Returns(dto);
+
+        var result = await _controller.UploadFile(request, MakeFormFile(), TestContext.Current.CancellationToken);
+
+        Assert.Same(dto, result.Value);
+    }
+
+    [Fact]
+    public async Task UploadFile_ReturnsBadRequest_OnConflict()
+    {
+        var request = new CmsFileCreateRequest { Folder = "cats" };
+        _fileService.CreateFileAsync(request, Arg.Any<IFormFile>(), Arg.Any<CancellationToken>())
+            .Throws(new InvalidOperationException("A file with that name already exists."));
+
+        var result = await _controller.UploadFile(request, MakeFormFile(), TestContext.Current.CancellationToken);
+
+        Assert.IsType<BadRequestObjectResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task UpdateFile_ReturnsNotFound_WhenServiceReturnsNull()
+    {
+        var guid = Guid.NewGuid();
+        var request = new CmsFileUpdateRequest { Description = "x" };
+        _fileService.UpdateFileAsync(guid, request, Arg.Any<IFormFile?>(), Arg.Any<CancellationToken>()).ReturnsNull();
+
+        var result = await _controller.UpdateFile(guid, request, null, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task UpdateFile_ReturnsBadRequest_OnArgumentException()
+    {
+        var guid = Guid.NewGuid();
+        var request = new CmsFileUpdateRequest { Description = "x" };
+        _fileService.UpdateFileAsync(guid, request, Arg.Any<IFormFile?>(), Arg.Any<CancellationToken>())
+            .Throws(new ArgumentException("Replacement must keep the same extension."));
+
+        var result = await _controller.UpdateFile(guid, request, MakeFormFile("x.png"), TestContext.Current.CancellationToken);
+
+        Assert.IsType<BadRequestObjectResult>(result.Result);
+    }
+
+    #endregion
+
+    #region Delete / Restore
+
+    [Fact]
+    public async Task DeleteFile_SoftDelete_ReturnsNoContent()
+    {
+        var guid = Guid.NewGuid();
+        _fileService.SoftDeleteFileAsync(guid, Arg.Any<CancellationToken>()).Returns(true);
+
+        var result = await _controller.DeleteFile(guid, permanent: false, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NoContentResult>(result);
+    }
+
+    [Fact]
+    public async Task DeleteFile_SoftDelete_ReturnsNotFound_WhenMissing()
+    {
+        _fileService.SoftDeleteFileAsync(Arg.Any<Guid>(), Arg.Any<CancellationToken>()).Returns(false);
+
+        var result = await _controller.DeleteFile(Guid.NewGuid(), permanent: false, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result);
+    }
+
+    [Fact]
+    public async Task DeleteFile_PermanentWithoutAdmin_ReturnsForbidden()
+    {
+        var user = new AaudUser { AaudUserId = 1, LoginId = "user" };
+        _userHelper.GetCurrentUser().Returns(user);
+        _userHelper.HasPermission(_rapsContext, user, CmsPermissions.Admin).Returns(false);
+
+        var result = await _controller.DeleteFile(Guid.NewGuid(), permanent: true, TestContext.Current.CancellationToken);
+
+        var objectResult = Assert.IsType<ObjectResult>(result);
+        Assert.Equal(StatusCodes.Status403Forbidden, objectResult.StatusCode);
+        await _fileService.DidNotReceive().PermanentlyDeleteFileAsync(Arg.Any<Guid>(), Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task DeleteFile_PermanentAsAdmin_ReturnsNoContent()
+    {
+        var guid = Guid.NewGuid();
+        var user = new AaudUser { AaudUserId = 1, LoginId = "admin" };
+        _userHelper.GetCurrentUser().Returns(user);
+        _userHelper.HasPermission(_rapsContext, user, CmsPermissions.Admin).Returns(true);
+        _fileService.PermanentlyDeleteFileAsync(guid, Arg.Any<CancellationToken>()).Returns(true);
+
+        var result = await _controller.DeleteFile(guid, permanent: true, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NoContentResult>(result);
+        await _fileService.Received(1).PermanentlyDeleteFileAsync(guid, Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task RestoreFile_ReturnsNoContent_WhenRestored()
+    {
+        var guid = Guid.NewGuid();
+        _fileService.RestoreFileAsync(guid, Arg.Any<CancellationToken>()).Returns(true);
+
+        var result = await _controller.RestoreFile(guid, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NoContentResult>(result);
+    }
+
+    #endregion
+
+    #region Import / Preview / Bulk-encrypt
+
+    [Fact]
+    public async Task ImportFiles_ReturnsBadRequest_WhenNoPaths()
+    {
+        var result = await _controller.ImportFiles(new CmsFileImportRequest { Folder = "cats" }, TestContext.Current.CancellationToken);
+
+        Assert.IsType<BadRequestObjectResult>(result.Result);
+        await _importService.DidNotReceive().ImportFilesAsync(Arg.Any<CmsFileImportRequest>(), Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task ImportFiles_PassesRequestThrough_OnSuccess()
+    {
+        var request = new CmsFileImportRequest { Folder = "cats", FilePaths = new List<string> { "legacy/a.pdf" } };
+        var results = new List<CmsFileImportResult> { new() { FilePath = "legacy/a.pdf", Success = true } };
+        _importService.ImportFilesAsync(request, Arg.Any<CancellationToken>()).Returns(results);
+
+        var result = await _controller.ImportFiles(request, TestContext.Current.CancellationToken);
+
+        Assert.Same(results, result.Value);
+    }
+
+    [Fact]
+    public async Task ImportFiles_ReturnsBadRequest_OnInvalidOperation()
+    {
+        var request = new CmsFileImportRequest { Folder = "cats", FilePaths = new List<string> { "legacy/a.pdf" } };
+        _importService.ImportFilesAsync(request, Arg.Any<CancellationToken>())
+            .Throws(new InvalidOperationException("Legacy webroot not configured."));
+
+        var result = await _controller.ImportFiles(request, TestContext.Current.CancellationToken);
+
+        Assert.IsType<BadRequestObjectResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task PreviewImport_ReturnsBadRequest_WhenNoPaths()
+    {
+        var result = await _controller.PreviewImport(new CmsFileImportRequest { Folder = "cats" }, TestContext.Current.CancellationToken);
+
+        Assert.IsType<BadRequestObjectResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task PreviewImport_PassesRequestThrough()
+    {
+        var request = new CmsFileImportRequest { Folder = "cats", FilePaths = new List<string> { "legacy/a.pdf" } };
+        var preview = new List<CmsFileImportPreviewResult> { new() { FilePath = "legacy/a.pdf", CanImport = true } };
+        _importService.PreviewImportAsync(request, Arg.Any<CancellationToken>()).Returns(preview);
+
+        var result = await _controller.PreviewImport(request, TestContext.Current.CancellationToken);
+
+        Assert.Same(preview, result.Value);
+    }
+
+    [Fact]
+    public async Task BulkEncrypt_ReturnsBadRequest_WhenNoGuids()
+    {
+        var result = await _controller.BulkEncrypt(new List<Guid>(), TestContext.Current.CancellationToken);
+
+        Assert.IsType<BadRequestObjectResult>(result.Result);
+        await _importService.DidNotReceive().BulkEncryptAsync(Arg.Any<List<Guid>>(), Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task BulkEncrypt_PassesGuidsThrough()
+    {
+        var guids = new List<Guid> { Guid.NewGuid() };
+        var results = new List<CmsBulkEncryptResult> { new() { FileGuid = guids[0], Success = true } };
+        _importService.BulkEncryptAsync(guids, Arg.Any<CancellationToken>()).Returns(results);
+
+        var result = await _controller.BulkEncrypt(guids, TestContext.Current.CancellationToken);
+
+        Assert.Same(results, result.Value);
+    }
+
+    #endregion
+}
diff --git a/test/CMS/CMSLeftNavControllerTests.cs b/test/CMS/CMSLeftNavControllerTests.cs
new file mode 100644
index 000000000..a39e4eaeb
--- /dev/null
+++ b/test/CMS/CMSLeftNavControllerTests.cs
@@ -0,0 +1,185 @@
+using Microsoft.AspNetCore.Http;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.Extensions.DependencyInjection;
+using NSubstitute;
+using NSubstitute.ReturnsExtensions;
+using Viper.Areas.CMS.Controllers;
+using Viper.Areas.CMS.Models.DTOs;
+using Viper.Areas.CMS.Services;
+
+namespace Viper.test.CMS;
+
+/// <summary>
+/// Controller wiring tests for CMSLeftNavController: menu CRUD status mapping, the
+/// duplicate-item-id guard on the batch item save, and cascade delete. The batch save/reorder
+/// semantics themselves are covered in the CmsLeftNavService tests.
+/// </summary>
+public sealed class CMSLeftNavControllerTests
+{
+    private readonly ICmsLeftNavService _leftNavService;
+    private readonly CMSLeftNavController _controller;
+
+    public CMSLeftNavControllerTests()
+    {
+        _leftNavService = Substitute.For<ICmsLeftNavService>();
+        _controller = new CMSLeftNavController(_leftNavService);
+
+        var serviceProvider = new ServiceCollection().BuildServiceProvider();
+        _controller.ControllerContext = new ControllerContext
+        {
+            HttpContext = new DefaultHttpContext { RequestServices = serviceProvider }
+        };
+    }
+
+    private static LeftNavMenuDto Menu(int id = 1) => new() { LeftNavMenuId = id, MenuHeaderText = "Cats", System = "Viper" };
+
+    #region Get
+
+    [Fact]
+    public async Task GetMenus_PassesFiltersThrough()
+    {
+        var menus = new List<LeftNavMenuDto> { Menu() };
+        _leftNavService.GetMenusAsync("Viper", "cats", "search", Arg.Any<CancellationToken>()).Returns(menus);
+
+        var result = await _controller.GetMenus("Viper", "cats", "search", TestContext.Current.CancellationToken);
+
+        Assert.Same(menus, result.Value);
+        await _leftNavService.Received(1).GetMenusAsync("Viper", "cats", "search", Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task GetMenu_ReturnsMenu_WhenFound()
+    {
+        _leftNavService.GetMenuAsync(5, Arg.Any<CancellationToken>()).Returns(Menu(5));
+
+        var result = await _controller.GetMenu(5, TestContext.Current.CancellationToken);
+
+        Assert.NotNull(result.Value);
+        Assert.Equal(5, result.Value!.LeftNavMenuId);
+    }
+
+    [Fact]
+    public async Task GetMenu_ReturnsNotFound_WhenMissing()
+    {
+        _leftNavService.GetMenuAsync(999, Arg.Any<CancellationToken>()).ReturnsNull();
+
+        var result = await _controller.GetMenu(999, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    #endregion
+
+    #region Create / Update
+
+    [Fact]
+    public async Task CreateMenu_ReturnsCreatedAtAction()
+    {
+        var request = new LeftNavMenuAddEdit { MenuHeaderText = "Cats", System = "Viper" };
+        _leftNavService.CreateMenuAsync(request, Arg.Any<CancellationToken>()).Returns(Menu(8));
+
+        var result = await _controller.CreateMenu(request, TestContext.Current.CancellationToken);
+
+        var created = Assert.IsType<CreatedAtActionResult>(result.Result);
+        Assert.Equal(nameof(CMSLeftNavController.GetMenu), created.ActionName);
+        var dto = Assert.IsType<LeftNavMenuDto>(created.Value);
+        Assert.Equal(8, dto.LeftNavMenuId);
+    }
+
+    [Fact]
+    public async Task UpdateMenu_ReturnsMenu_OnSuccess()
+    {
+        var request = new LeftNavMenuAddEdit { MenuHeaderText = "Cats", System = "Viper" };
+        _leftNavService.UpdateMenuAsync(5, request, Arg.Any<CancellationToken>()).Returns(Menu(5));
+
+        var result = await _controller.UpdateMenu(5, request, TestContext.Current.CancellationToken);
+
+        Assert.NotNull(result.Value);
+        Assert.Equal(5, result.Value!.LeftNavMenuId);
+    }
+
+    [Fact]
+    public async Task UpdateMenu_ReturnsNotFound_WhenMissing()
+    {
+        var request = new LeftNavMenuAddEdit { MenuHeaderText = "Cats", System = "Viper" };
+        _leftNavService.UpdateMenuAsync(5, request, Arg.Any<CancellationToken>()).ReturnsNull();
+
+        var result = await _controller.UpdateMenu(5, request, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    #endregion
+
+    #region SaveItems
+
+    [Fact]
+    public async Task SaveItems_ReturnsBadRequest_OnDuplicateItemIds()
+    {
+        var items = new List<LeftNavItemEdit>
+        {
+            new() { LeftNavItemId = 2, MenuItemText = "A" },
+            new() { LeftNavItemId = 2, MenuItemText = "B" }
+        };
+
+        var result = await _controller.SaveItems(5, items, TestContext.Current.CancellationToken);
+
+        var badRequest = Assert.IsType<BadRequestObjectResult>(result.Result);
+        Assert.Contains("Duplicate item ids", badRequest.Value?.ToString());
+        await _leftNavService.DidNotReceive().SaveItemsAsync(Arg.Any<int>(), Arg.Any<List<LeftNavItemEdit>>(),
+            Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task SaveItems_AllowsMultipleNewItems_WithZeroIds()
+    {
+        var items = new List<LeftNavItemEdit>
+        {
+            new() { LeftNavItemId = 0, MenuItemText = "New 1" },
+            new() { LeftNavItemId = 0, MenuItemText = "New 2" }
+        };
+        _leftNavService.SaveItemsAsync(5, items, Arg.Any<CancellationToken>()).Returns(Menu(5));
+
+        var result = await _controller.SaveItems(5, items, TestContext.Current.CancellationToken);
+
+        Assert.NotNull(result.Value);
+        await _leftNavService.Received(1).SaveItemsAsync(5, items, Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task SaveItems_ReturnsNotFound_WhenMenuMissing()
+    {
+        var items = new List<LeftNavItemEdit> { new() { LeftNavItemId = 0, MenuItemText = "A" } };
+        _leftNavService.SaveItemsAsync(5, items, Arg.Any<CancellationToken>()).ReturnsNull();
+
+        var result = await _controller.SaveItems(5, items, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    #endregion
+
+    #region Delete
+
+    [Fact]
+    public async Task DeleteMenu_ReturnsNoContent_WhenDeleted()
+    {
+        _leftNavService.DeleteMenuAsync(5, Arg.Any<CancellationToken>()).Returns(true);
+
+        var result = await _controller.DeleteMenu(5, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NoContentResult>(result);
+    }
+
+    [Fact]
+    public async Task DeleteMenu_ReturnsNotFound_WhenMissing()
+    {
+        _leftNavService.DeleteMenuAsync(5, Arg.Any<CancellationToken>()).Returns(false);
+
+        var result = await _controller.DeleteMenu(5, TestContext.Current.CancellationToken);
+
+        Assert.IsType<NotFoundResult>(result);
+    }
+
+    #endregion
+}
diff --git a/test/CMS/CMSLinkCollectionControllerTests.cs b/test/CMS/CMSLinkCollectionControllerTests.cs
new file mode 100644
index 000000000..4078516fa
--- /dev/null
+++ b/test/CMS/CMSLinkCollectionControllerTests.cs
@@ -0,0 +1,364 @@
+using Areas.CMS.Models;
+using Areas.CMS.Models.DTOs;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.EntityFrameworkCore;
+using Viper.Areas.CMS.Controllers;
+using Viper.Classes.SQLContext;
+
+namespace Viper.test.CMS;
+
+/// <summary>
+/// Tests for CMSLinkCollectionController, which holds its EF logic directly (no service layer).
+/// Covers collection CRUD with duplicate-name rejection and tag-category create/reorder/delete,
+/// using a fresh EF in-memory VIPERContext per test.
+/// </summary>
+public sealed class CMSLinkCollectionControllerTests : IDisposable
+{
+    private readonly VIPERContext _context;
+    private readonly CMSLinkCollectionController _controller;
+
+    public CMSLinkCollectionControllerTests()
+    {
+        _context = new VIPERContext(new DbContextOptionsBuilder<VIPERContext>()
+            .UseInMemoryDatabase("VIPER_" + Guid.NewGuid()).Options);
+        _controller = new CMSLinkCollectionController(_context);
+    }
+
+    public void Dispose() => _context.Dispose();
+
+    private async Task<LinkCollection> SeedCollectionAsync(string name = "Resources")
+    {
+        var collection = new LinkCollection { LinkCollectionName = name };
+        _context.LinkCollections.Add(collection);
+        await _context.SaveChangesAsync(TestContext.Current.CancellationToken);
+        return collection;
+    }
+
+    private async Task<LinkCollectionTagCategory> SeedTagCategoryAsync(int collectionId, string name, int sortOrder)
+    {
+        var category = new LinkCollectionTagCategory
+        {
+            LinkCollectionId = collectionId,
+            LinkCollectionTagCategoryName = name,
+            SortOrder = sortOrder
+        };
+        _context.LinkCollectionTagCategories.Add(category);
+        await _context.SaveChangesAsync(TestContext.Current.CancellationToken);
+        return category;
+    }
+
+    #region Collections
+
+    [Fact]
+    public async Task GetLinkCollections_ReturnsOrderedWithTagCategories()
+    {
+        var beta = await SeedCollectionAsync("Beta");
+        await SeedCollectionAsync("Alpha");
+        await SeedTagCategoryAsync(beta.LinkCollectionId, "Region", 2);
+        await SeedTagCategoryAsync(beta.LinkCollectionId, "Topic", 1);
+
+        var result = await _controller.GetLinkCollections();
+
+        var ok = Assert.IsType<OkObjectResult>(result.Result);
+        var collections = Assert.IsAssignableFrom<IEnumerable<LinkCollectionDto>>(ok.Value).ToList();
+        // Collections are ordered by name at the top level.
+        Assert.Equal(new[] { "Alpha", "Beta" }, collections.Select(c => c.LinkCollection));
+        var betaDto = collections.Single(c => c.LinkCollection == "Beta");
+        // Both nested tag categories are projected with their SortOrder (the in-memory provider
+        // does not honor the filtered-include OrderBy, so assert membership, not sequence).
+        Assert.Equal(new[] { "Region", "Topic" },
+            betaDto.LinkCollectionTagCategories.Select(tc => tc.LinkCollectionTagCategory).OrderBy(n => n));
+        Assert.Equal(1, betaDto.LinkCollectionTagCategories.Single(tc => tc.LinkCollectionTagCategory == "Topic").SortOrder);
+    }
+
+    [Fact]
+    public async Task PostLinkCollection_CreatesCollection()
+    {
+        var result = await _controller.PostLinkCollection(new CreateLinkCollectionDto { LinkCollection = "New" });
+
+        Assert.IsType<CreatedAtActionResult>(result.Result);
+        Assert.True(await _context.LinkCollections.AnyAsync(lc => lc.LinkCollectionName == "New",
+            TestContext.Current.CancellationToken));
+    }
+
+    [Fact]
+    public async Task PostLinkCollection_RejectsDuplicateName()
+    {
+        await SeedCollectionAsync("Resources");
+
+        var result = await _controller.PostLinkCollection(new CreateLinkCollectionDto { LinkCollection = "Resources" });
+
+        var badRequest = Assert.IsType<BadRequestObjectResult>(result.Result);
+        Assert.Contains("already exists", badRequest.Value?.ToString());
+        Assert.Single(await _context.LinkCollections.ToListAsync(TestContext.Current.CancellationToken));
+    }
+
+    [Fact]
+    public async Task PutLinkCollection_RenamesCollection()
+    {
+        var collection = await SeedCollectionAsync("Old Name");
+
+        var result = await _controller.PutLinkCollection(collection.LinkCollectionId,
+            new CreateLinkCollectionDto { LinkCollection = "New Name" });
+
+        Assert.IsType<OkObjectResult>(result);
+        var saved = await _context.LinkCollections.FindAsync(
+            new object[] { collection.LinkCollectionId }, TestContext.Current.CancellationToken);
+        Assert.Equal("New Name", saved!.LinkCollectionName);
+    }
+
+    [Fact]
+    public async Task PutLinkCollection_ReturnsNotFound_WhenMissing()
+    {
+        var result = await _controller.PutLinkCollection(999, new CreateLinkCollectionDto { LinkCollection = "X" });
+
+        Assert.IsType<NotFoundResult>(result);
+    }
+
+    [Fact]
+    public async Task PutLinkCollection_RejectsRenameToExistingName()
+    {
+        await SeedCollectionAsync("Taken");
+        var collection = await SeedCollectionAsync("Mine");
+
+        var result = await _controller.PutLinkCollection(collection.LinkCollectionId,
+            new CreateLinkCollectionDto { LinkCollection = "Taken" });
+
+        Assert.IsType<BadRequestObjectResult>(result);
+    }
+
+    [Fact]
+    public async Task DeleteLinkCollection_RemovesCollection()
+    {
+        var collection = await SeedCollectionAsync();
+
+        var result = await _controller.DeleteLinkCollection(collection.LinkCollectionId);
+
+        Assert.IsType<NoContentResult>(result);
+        Assert.Empty(await _context.LinkCollections.ToListAsync(TestContext.Current.CancellationToken));
+    }
+
+    [Fact]
+    public async Task DeleteLinkCollection_RemovesLinksTagsAndCategories()
+    {
+        // A collection with a tag category, a link, and a link tag must delete cleanly.
+        // The DB FKs are not ON DELETE CASCADE, so the controller clears dependents first.
+        var collection = await SeedCollectionAsync();
+        var category = await SeedTagCategoryAsync(collection.LinkCollectionId, "Topic", 1);
+        var link = new Link
+        {
+            LinkCollectionId = collection.LinkCollectionId,
+            Url = "https://example.com",
+            Title = "Example",
+            SortOrder = 1
+        };
+        _context.Links.Add(link);
+        await _context.SaveChangesAsync(TestContext.Current.CancellationToken);
+        _context.LinkTags.Add(new LinkTag
+        {
+            LinkId = link.LinkId,
+            LinkCollectionTagCategoryId = category.LinkCollectionTagCategoryId,
+            SortOrder = 1,
+            Value = "alpha"
+        });
+        await _context.SaveChangesAsync(TestContext.Current.CancellationToken);
+
+        var result = await _controller.DeleteLinkCollection(collection.LinkCollectionId);
+
+        Assert.IsType<NoContentResult>(result);
+        Assert.Empty(await _context.LinkCollections.ToListAsync(TestContext.Current.CancellationToken));
+        Assert.Empty(await _context.Links.ToListAsync(TestContext.Current.CancellationToken));
+        Assert.Empty(await _context.LinkCollectionTagCategories.ToListAsync(TestContext.Current.CancellationToken));
+        Assert.Empty(await _context.LinkTags.ToListAsync(TestContext.Current.CancellationToken));
+    }
+
+    [Fact]
+    public async Task DeleteLinkCollection_ReturnsNotFound_WhenMissing()
+    {
+        var result = await _controller.DeleteLinkCollection(999);
+
+        Assert.IsType<NotFoundResult>(result);
+    }
+
+    #endregion
+
+    #region Tag categories
+
+    [Fact]
+    public async Task GetLinkCollectionTagCategories_ReturnsOrdered()
+    {
+        var collection = await SeedCollectionAsync();
+        await SeedTagCategoryAsync(collection.LinkCollectionId, "Second", 2);
+        await SeedTagCategoryAsync(collection.LinkCollectionId, "First", 1);
+
+        var result = await _controller.GetLinkCollectionTagCategories(collection.LinkCollectionId);
+
+        var ok = Assert.IsType<OkObjectResult>(result.Result);
+        var categories = Assert.IsAssignableFrom<IEnumerable<LinkCollectionTagCategoryDto>>(ok.Value).ToList();
+        Assert.Equal(new[] { "First", "Second" }, categories.Select(c => c.LinkCollectionTagCategory));
+    }
+
+    [Fact]
+    public async Task GetLinkCollectionTagCategories_ReturnsNotFound_WhenCollectionMissing()
+    {
+        var result = await _controller.GetLinkCollectionTagCategories(999);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task CreateLinkCollectionTagCategory_AddsCategory()
+    {
+        var collection = await SeedCollectionAsync();
+        var dto = new CreateLinkCollectionTagCategoryDto
+        {
+            LinkCollectionId = collection.LinkCollectionId,
+            LinkCollectionTagCategory = "Topic",
+            SortOrder = 1
+        };
+
+        var result = await _controller.CreateLinkCollectionTagCategory(collection.LinkCollectionId, dto);
+
+        var created = Assert.IsType<CreatedAtActionResult>(result.Result);
+        var saved = await _context.LinkCollectionTagCategories.SingleAsync(TestContext.Current.CancellationToken);
+        Assert.Equal("Topic", saved.LinkCollectionTagCategoryName);
+        Assert.Equal(collection.LinkCollectionId, saved.LinkCollectionId);
+
+        // The response must carry the generated id so the client can reorder the
+        // new category (otherwise the follow-up tag-order PUT fails validation).
+        var returned = Assert.IsType<LinkCollectionTagCategoryDto>(created.Value);
+        Assert.Equal(saved.LinkCollectionTagCategoryId, returned.LinkCollectionTagCategoryId);
+        Assert.NotEqual(0, returned.LinkCollectionTagCategoryId);
+    }
+
+    [Fact]
+    public async Task CreateLinkCollectionTagCategory_ReturnsNotFound_WhenCollectionMissing()
+    {
+        var dto = new CreateLinkCollectionTagCategoryDto
+        {
+            LinkCollectionId = 999,
+            LinkCollectionTagCategory = "Topic",
+            SortOrder = 1
+        };
+
+        var result = await _controller.CreateLinkCollectionTagCategory(999, dto);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task CreateLinkCollectionTagCategory_RejectsRouteBodyMismatch()
+    {
+        var collection = await SeedCollectionAsync();
+        var dto = new CreateLinkCollectionTagCategoryDto
+        {
+            // Body claims a different collection than the route.
+            LinkCollectionId = collection.LinkCollectionId + 1,
+            LinkCollectionTagCategory = "Topic",
+            SortOrder = 1
+        };
+
+        var result = await _controller.CreateLinkCollectionTagCategory(collection.LinkCollectionId, dto);
+
+        Assert.IsType<BadRequestObjectResult>(result.Result);
+        Assert.Empty(await _context.LinkCollectionTagCategories.ToListAsync(TestContext.Current.CancellationToken));
+    }
+
+    [Fact]
+    public async Task CreateLinkCollectionTagCategory_RejectsDuplicateNameInCollection()
+    {
+        var collection = await SeedCollectionAsync();
+        await SeedTagCategoryAsync(collection.LinkCollectionId, "Topic", 1);
+        var dto = new CreateLinkCollectionTagCategoryDto
+        {
+            LinkCollectionId = collection.LinkCollectionId,
+            LinkCollectionTagCategory = "Topic",
+            SortOrder = 2
+        };
+
+        var result = await _controller.CreateLinkCollectionTagCategory(collection.LinkCollectionId, dto);
+
+        Assert.IsType<BadRequestObjectResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task UpdateLinkCollectionTagCategoryOrder_ReassignsSortOrder()
+    {
+        var collection = await SeedCollectionAsync();
+        var first = await SeedTagCategoryAsync(collection.LinkCollectionId, "First", 1);
+        var second = await SeedTagCategoryAsync(collection.LinkCollectionId, "Second", 2);
+        var updates = new List<UpdateLinkCollectionTagCategoryOrderDto>
+        {
+            new() { LinkCollectionTagCategoryId = first.LinkCollectionTagCategoryId, SortOrder = 2 },
+            new() { LinkCollectionTagCategoryId = second.LinkCollectionTagCategoryId, SortOrder = 1 }
+        };
+
+        var result = await _controller.UpdateLinkCollectionTagCategoryOrder(collection.LinkCollectionId, updates);
+
+        Assert.IsType<NoContentResult>(result);
+        Assert.Equal(2, (await _context.LinkCollectionTagCategories.FindAsync(
+            new object[] { first.LinkCollectionTagCategoryId }, TestContext.Current.CancellationToken))!.SortOrder);
+        Assert.Equal(1, (await _context.LinkCollectionTagCategories.FindAsync(
+            new object[] { second.LinkCollectionTagCategoryId }, TestContext.Current.CancellationToken))!.SortOrder);
+    }
+
+    [Fact]
+    public async Task UpdateLinkCollectionTagCategoryOrder_RejectsCountMismatch()
+    {
+        var collection = await SeedCollectionAsync();
+        await SeedTagCategoryAsync(collection.LinkCollectionId, "First", 1);
+        await SeedTagCategoryAsync(collection.LinkCollectionId, "Second", 2);
+        var updates = new List<UpdateLinkCollectionTagCategoryOrderDto>
+        {
+            new() { LinkCollectionTagCategoryId = 1, SortOrder = 1 }
+        };
+
+        var result = await _controller.UpdateLinkCollectionTagCategoryOrder(collection.LinkCollectionId, updates);
+
+        Assert.IsType<BadRequestObjectResult>(result);
+    }
+
+    [Fact]
+    public async Task UpdateLinkCollectionTagCategoryOrder_RejectsUnknownCategoryId()
+    {
+        // Count matches, but one submitted id does not belong to the collection.
+        // The lookup must not throw (500); it returns a controlled BadRequest.
+        var collection = await SeedCollectionAsync();
+        var first = await SeedTagCategoryAsync(collection.LinkCollectionId, "First", 1);
+        await SeedTagCategoryAsync(collection.LinkCollectionId, "Second", 2);
+        var updates = new List<UpdateLinkCollectionTagCategoryOrderDto>
+        {
+            new() { LinkCollectionTagCategoryId = first.LinkCollectionTagCategoryId, SortOrder = 1 },
+            new() { LinkCollectionTagCategoryId = 999999, SortOrder = 2 }
+        };
+
+        var result = await _controller.UpdateLinkCollectionTagCategoryOrder(collection.LinkCollectionId, updates);
+
+        Assert.IsType<BadRequestObjectResult>(result);
+    }
+
+    [Fact]
+    public async Task DeleteLinkCollectionTagCategory_RemovesCategory()
+    {
+        var collection = await SeedCollectionAsync();
+        var category = await SeedTagCategoryAsync(collection.LinkCollectionId, "Topic", 1);
+
+        var result = await _controller.DeleteLinkCollectionTagCategory(collection.LinkCollectionId,
+            category.LinkCollectionTagCategoryId);
+
+        Assert.IsType<NoContentResult>(result);
+        Assert.Empty(await _context.LinkCollectionTagCategories.ToListAsync(TestContext.Current.CancellationToken));
+    }
+
+    [Fact]
+    public async Task DeleteLinkCollectionTagCategory_ReturnsNotFound_WhenCategoryMissing()
+    {
+        var collection = await SeedCollectionAsync();
+
+        var result = await _controller.DeleteLinkCollectionTagCategory(collection.LinkCollectionId, 999);
+
+        Assert.IsType<NotFoundResult>(result);
+    }
+
+    #endregion
+}
diff --git a/test/CMS/CMSLinkCollectionLinksTests.cs b/test/CMS/CMSLinkCollectionLinksTests.cs
new file mode 100644
index 000000000..79afa9d7b
--- /dev/null
+++ b/test/CMS/CMSLinkCollectionLinksTests.cs
@@ -0,0 +1,369 @@
+using Areas.CMS.Models;
+using Areas.CMS.Models.DTOs;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.EntityFrameworkCore;
+using Microsoft.EntityFrameworkCore.Diagnostics;
+using Viper.Areas.CMS.Controllers;
+using Viper.Classes.SQLContext;
+
+namespace Viper.test.CMS;
+
+/// <summary>
+/// Tests for CMSLinkCollectionLinks, which holds its EF logic directly (no service layer).
+/// Covers link CRUD, grouped-by-tag-category listing, link reordering, and the batch
+/// link-tag save (remove-and-recreate). A fresh EF in-memory VIPERContext is used per test;
+/// the in-memory provider's transaction warning is ignored so SaveLinkTags' transaction runs.
+/// </summary>
+public sealed class CMSLinkCollectionLinksTests : IDisposable
+{
+    private readonly VIPERContext _context;
+    private readonly CMSLinkCollectionLinks _controller;
+
+    public CMSLinkCollectionLinksTests()
+    {
+        _context = new VIPERContext(new DbContextOptionsBuilder<VIPERContext>()
+            .UseInMemoryDatabase("VIPER_" + Guid.NewGuid())
+            .ConfigureWarnings(w => w.Ignore(InMemoryEventId.TransactionIgnoredWarning))
+            .Options);
+        _controller = new CMSLinkCollectionLinks(_context);
+    }
+
+    public void Dispose() => _context.Dispose();
+
+    private async Task<LinkCollection> SeedCollectionAsync(string name = "Resources")
+    {
+        var collection = new LinkCollection { LinkCollectionName = name };
+        _context.LinkCollections.Add(collection);
+        await _context.SaveChangesAsync(TestContext.Current.CancellationToken);
+        return collection;
+    }
+
+    private async Task<Link> SeedLinkAsync(int collectionId, string title, int sortOrder)
+    {
+        var link = new Link
+        {
+            LinkCollectionId = collectionId,
+            Url = "https://example.com/" + title,
+            Title = title,
+            SortOrder = sortOrder
+        };
+        _context.Links.Add(link);
+        await _context.SaveChangesAsync(TestContext.Current.CancellationToken);
+        return link;
+    }
+
+    private async Task<LinkCollectionTagCategory> SeedTagCategoryAsync(int collectionId, string name, int sortOrder)
+    {
+        var category = new LinkCollectionTagCategory
+        {
+            LinkCollectionId = collectionId,
+            LinkCollectionTagCategoryName = name,
+            SortOrder = sortOrder
+        };
+        _context.LinkCollectionTagCategories.Add(category);
+        await _context.SaveChangesAsync(TestContext.Current.CancellationToken);
+        return category;
+    }
+
+    private async Task SeedLinkTagAsync(int linkId, int categoryId, string value, int sortOrder)
+    {
+        _context.LinkTags.Add(new LinkTag
+        {
+            LinkId = linkId,
+            LinkCollectionTagCategoryId = categoryId,
+            Value = value,
+            SortOrder = sortOrder
+        });
+        await _context.SaveChangesAsync(TestContext.Current.CancellationToken);
+    }
+
+    #region GetLinks
+
+    [Fact]
+    public async Task GetLinks_ReturnsLinksOrderedBySortOrder()
+    {
+        var collection = await SeedCollectionAsync();
+        await SeedLinkAsync(collection.LinkCollectionId, "Second", 2);
+        await SeedLinkAsync(collection.LinkCollectionId, "First", 1);
+
+        var result = await _controller.GetLinks(collection.LinkCollectionId);
+
+        var ok = Assert.IsType<OkObjectResult>(result.Result);
+        var links = Assert.IsAssignableFrom<IEnumerable<LinkDto>>(ok.Value).ToList();
+        Assert.Equal(new[] { "First", "Second" }, links.Select(l => l.Title));
+    }
+
+    [Fact]
+    public async Task GetLinks_ReturnsNotFound_WhenCollectionMissing()
+    {
+        var result = await _controller.GetLinks(999);
+
+        Assert.IsType<NotFoundResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task GetLinks_GroupByTagCategory_GroupsLinksSharingATagValue()
+    {
+        var collection = await SeedCollectionAsync();
+        var category = await SeedTagCategoryAsync(collection.LinkCollectionId, "Region", 1);
+        // Two links share the value "Coast"; one has "Inland". Grouping by the category emits
+        // each distinct value's links together, so the two "Coast" links must be adjacent.
+        var first = await SeedLinkAsync(collection.LinkCollectionId, "First", 1);
+        var inland = await SeedLinkAsync(collection.LinkCollectionId, "Inland", 2);
+        var third = await SeedLinkAsync(collection.LinkCollectionId, "Third", 3);
+        await SeedLinkTagAsync(first.LinkId, category.LinkCollectionTagCategoryId, "Coast", 1);
+        await SeedLinkTagAsync(inland.LinkId, category.LinkCollectionTagCategoryId, "Inland", 1);
+        await SeedLinkTagAsync(third.LinkId, category.LinkCollectionTagCategoryId, "Coast", 1);
+
+        var result = await _controller.GetLinks(collection.LinkCollectionId, groupByTagCategory: "region");
+
+        var ok = Assert.IsType<OkObjectResult>(result.Result);
+        var titles = Assert.IsAssignableFrom<IEnumerable<LinkDto>>(ok.Value).Select(l => l.Title).ToList();
+        Assert.Equal(3, titles.Count);
+        Assert.Equal(new[] { "First", "Inland", "Third" }, titles.OrderBy(t => t));
+        // The two "Coast" links group together regardless of their SortOrder.
+        Assert.Equal(1, Math.Abs(titles.IndexOf("First") - titles.IndexOf("Third")));
+    }
+
+    [Fact]
+    public async Task GetLinks_GroupByUnknownTagCategory_ReturnsBadRequest()
+    {
+        var collection = await SeedCollectionAsync();
+        await SeedLinkAsync(collection.LinkCollectionId, "A", 1);
+
+        var result = await _controller.GetLinks(collection.LinkCollectionId, groupByTagCategory: "missing");
+
+        Assert.IsType<BadRequestObjectResult>(result.Result);
+    }
+
+    #endregion
+
+    #region Link CRUD
+
+    [Fact]
+    public async Task PostLink_CreatesLink()
+    {
+        var collection = await SeedCollectionAsync();
+        var dto = new CreateLinkDto
+        {
+            LinkCollectionId = collection.LinkCollectionId,
+            Url = "https://example.com",
+            Title = "Example",
+            SortOrder = 1
+        };
+
+        var result = await _controller.PostLink(collection.LinkCollectionId, dto);
+
+        Assert.IsType<CreatedAtActionResult>(result.Result);
+        Assert.Single(await _context.Links.ToListAsync(TestContext.Current.CancellationToken));
+    }
+
+    [Fact]
+    public async Task PostLink_ReturnsBadRequest_WhenCollectionIdMismatch()
+    {
+        var collection = await SeedCollectionAsync();
+        var dto = new CreateLinkDto
+        {
+            LinkCollectionId = collection.LinkCollectionId + 1,
+            Url = "https://example.com",
+            Title = "Example",
+            SortOrder = 1
+        };
+
+        var result = await _controller.PostLink(collection.LinkCollectionId, dto);
+
+        Assert.IsType<BadRequestResult>(result.Result);
+    }
+
+    [Fact]
+    public async Task PutLink_UpdatesLink()
+    {
+        var collection = await SeedCollectionAsync();
+        var link = await SeedLinkAsync(collection.LinkCollectionId, "Old", 1);
+        var dto = new CreateLinkDto
+        {
+            LinkCollectionId = collection.LinkCollectionId,
+            Url = "https://example.com/new",
+            Title = "New",
+            SortOrder = 5
+        };
+
+        var result = await _controller.PutLink(link.LinkId, collection.LinkCollectionId, dto);
+
+        Assert.IsType<NoContentResult>(result);
+        var saved = await _context.Links.FindAsync(new object[] { link.LinkId }, TestContext.Current.CancellationToken);
+        Assert.Equal("New", saved!.Title);
+        Assert.Equal(5, saved.SortOrder);
+    }
+
+    [Fact]
+    public async Task PutLink_ReturnsNotFound_WhenLinkMissing()
+    {
+        var collection = await SeedCollectionAsync();
+        var dto = new CreateLinkDto
+        {
+            LinkCollectionId = collection.LinkCollectionId,
+            Url = "https://example.com",
+            Title = "X",
+            SortOrder = 1
+        };
+
+        var result = await _controller.PutLink(999, collection.LinkCollectionId, dto);
+
+        Assert.IsType<NotFoundResult>(result);
+    }
+
+    [Fact]
+    public async Task PutLink_ReturnsBadRequest_WhenCollectionMismatch()
+    {
+        var collection = await SeedCollectionAsync();
+        var link = await SeedLinkAsync(collection.LinkCollectionId, "Old", 1);
+        var dto = new CreateLinkDto
+        {
+            LinkCollectionId = collection.LinkCollectionId + 1,
+            Url = "https://example.com",
+            Title = "X",
+            SortOrder = 1
+        };
+
+        var result = await _controller.PutLink(link.LinkId, collection.LinkCollectionId + 1, dto);
+
+        Assert.IsType<BadRequestResult>(result);
+    }
+
+    [Fact]
+    public async Task DeleteLink_RemovesLinkAndTags()
+    {
+        var collection = await SeedCollectionAsync();
+        var category = await SeedTagCategoryAsync(collection.LinkCollectionId, "Region", 1);
+        var link = await SeedLinkAsync(collection.LinkCollectionId, "ToDelete", 1);
+        await SeedLinkTagAsync(link.LinkId, category.LinkCollectionTagCategoryId, "West", 1);
+
+        var result = await _controller.DeleteLink(collection.LinkCollectionId, link.LinkId);
+
+        Assert.IsType<NoContentResult>(result);
+        Assert.Empty(await _context.Links.ToListAsync(TestContext.Current.CancellationToken));
+        Assert.Empty(await _context.LinkTags.ToListAsync(TestContext.Current.CancellationToken));
+    }
+
+    [Fact]
+    public async Task DeleteLink_ReturnsBadRequest_WhenCollectionMismatch()
+    {
+        var collection = await SeedCollectionAsync();
+        var link = await SeedLinkAsync(collection.LinkCollectionId, "X", 1);
+
+        var result = await _controller.DeleteLink(collection.LinkCollectionId + 1, link.LinkId);
+
+        Assert.IsType<BadRequestResult>(result);
+        Assert.Single(await _context.Links.ToListAsync(TestContext.Current.CancellationToken));
+    }
+
+    #endregion
+
+    #region Reorder
+
+    [Fact]
+    public async Task UpdateLinkOrder_ReassignsSortOrder()
+    {
+        var collection = await SeedCollectionAsync();
+        var first = await SeedLinkAsync(collection.LinkCollectionId, "First", 1);
+        var second = await SeedLinkAsync(collection.LinkCollectionId, "Second", 2);
+        var updates = new List<UpdateLinkOrderDto>
+        {
+            new() { LinkId = first.LinkId, SortOrder = 2 },
+            new() { LinkId = second.LinkId, SortOrder = 1 }
+        };
+
+        var result = await _controller.UpdateLinkOrder(collection.LinkCollectionId, updates);
+
+        Assert.IsType<NoContentResult>(result);
+        Assert.Equal(2, (await _context.Links.FindAsync(
+            new object[] { first.LinkId }, TestContext.Current.CancellationToken))!.SortOrder);
+        Assert.Equal(1, (await _context.Links.FindAsync(
+            new object[] { second.LinkId }, TestContext.Current.CancellationToken))!.SortOrder);
+    }
+
+    [Fact]
+    public async Task UpdateLinkOrder_ReturnsNotFound_WhenCollectionMissing()
+    {
+        var result = await _controller.UpdateLinkOrder(999, new List<UpdateLinkOrderDto>());
+
+        Assert.IsType<NotFoundResult>(result);
+    }
+
+    [Fact]
+    public async Task UpdateLinkOrder_RejectsCountMismatch()
+    {
+        var collection = await SeedCollectionAsync();
+        await SeedLinkAsync(collection.LinkCollectionId, "First", 1);
+        await SeedLinkAsync(collection.LinkCollectionId, "Second", 2);
+        var updates = new List<UpdateLinkOrderDto> { new() { LinkId = 1, SortOrder = 1 } };
+
+        var result = await _controller.UpdateLinkOrder(collection.LinkCollectionId, updates);
+
+        Assert.IsType<BadRequestObjectResult>(result);
+    }
+
+    #endregion
+
+    #region SaveLinkTags
+
+    [Fact]
+    public async Task SaveLinkTags_ReplacesTagsFromCommaSeparatedValues()
+    {
+        var collection = await SeedCollectionAsync();
+        var category = await SeedTagCategoryAsync(collection.LinkCollectionId, "Region", 1);
+        var link = await SeedLinkAsync(collection.LinkCollectionId, "Link", 1);
+        await SeedLinkTagAsync(link.LinkId, category.LinkCollectionTagCategoryId, "Stale", 1);
+        var tagValues = new Dictionary<int, string>
+        {
+            { category.LinkCollectionTagCategoryId, "West,East" }
+        };
+
+        var result = await _controller.SaveLinkTags(link.LinkId, collection.LinkCollectionId, tagValues);
+
+        Assert.IsType<NoContentResult>(result);
+        var tags = await _context.LinkTags.Where(lt => lt.LinkId == link.LinkId)
+            .ToListAsync(TestContext.Current.CancellationToken);
+        Assert.Equal(2, tags.Count);
+        Assert.DoesNotContain(tags, t => t.Value == "Stale");
+        Assert.Contains(tags, t => t.Value == "West");
+        Assert.Contains(tags, t => t.Value == "East");
+    }
+
+    [Fact]
+    public async Task SaveLinkTags_ReturnsNotFound_WhenLinkMissing()
+    {
+        var collection = await SeedCollectionAsync();
+
+        var result = await _controller.SaveLinkTags(999, collection.LinkCollectionId, new Dictionary<int, string>());
+
+        Assert.IsType<NotFoundResult>(result);
+    }
+
+    [Fact]
+    public async Task SaveLinkTags_ReturnsBadRequest_WhenCollectionMismatch()
+    {
+        var collection = await SeedCollectionAsync();
+        var link = await SeedLinkAsync(collection.LinkCollectionId, "Link", 1);
+
+        var result = await _controller.SaveLinkTags(link.LinkId, collection.LinkCollectionId + 1,
+            new Dictionary<int, string>());
+
+        Assert.IsType<BadRequestResult>(result);
+    }
+
+    [Fact]
+    public async Task SaveLinkTags_ReturnsBadRequest_WhenTagCategoryNotInCollection()
+    {
+        var collection = await SeedCollectionAsync();
+        var link = await SeedLinkAsync(collection.LinkCollectionId, "Link", 1);
+        var tagValues = new Dictionary<int, string> { { 9999, "West" } };
+
+        var result = await _controller.SaveLinkTags(link.LinkId, collection.LinkCollectionId, tagValues);
+
+        Assert.IsType<BadRequestObjectResult>(result);
+    }
+
+    #endregion
+}
diff --git a/test/CMS/CMSUserPhotoControllerTests.cs b/test/CMS/CMSUserPhotoControllerTests.cs
new file mode 100644
index 000000000..8435c55cc
--- /dev/null
+++ b/test/CMS/CMSUserPhotoControllerTests.cs
@@ -0,0 +1,82 @@
+using Microsoft.AspNetCore.Http;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.Extensions.DependencyInjection;
+using NSubstitute;
+using Viper.Areas.CMS.Controllers;
+using Viper.Areas.CMS.Services;
+
+namespace Viper.test.CMS;
+
+/// <summary>
+/// Controller wiring tests for CMSUserPhotoController: each by-id-type endpoint forwards only
+/// its identifier (and the altPhoto flag) to ICmsUserPhotoService and returns the bytes as an
+/// image/jpeg file response with a private cache header.
+/// </summary>
+public sealed class CMSUserPhotoControllerTests
+{
+    private readonly ICmsUserPhotoService _photoService;
+    private readonly CMSUserPhotoController _controller;
+
+    public CMSUserPhotoControllerTests()
+    {
+        _photoService = Substitute.For<ICmsUserPhotoService>();
+        _controller = new CMSUserPhotoController(_photoService);
+
+        var serviceProvider = new ServiceCollection().BuildServiceProvider();
+        _controller.ControllerContext = new ControllerContext
+        {
+            HttpContext = new DefaultHttpContext { RequestServices = serviceProvider }
+        };
+    }
+
+    [Fact]
+    public async Task GetByMailId_ForwardsMailIdOnly()
+    {
+        var bytes = new byte[] { 1, 2, 3 };
+        _photoService.GetUserPhotoAsync("mail@example.com", null, null, false, Arg.Any<CancellationToken>())
+            .Returns(bytes);
+
+        var result = await _controller.GetByMailId("mail@example.com", ct: TestContext.Current.CancellationToken);
+
+        var file = Assert.IsType<FileContentResult>(result);
+        Assert.Equal("image/jpeg", file.ContentType);
+        Assert.Equal(bytes, file.FileContents);
+        await _photoService.Received(1).GetUserPhotoAsync("mail@example.com", null, null, false,
+            Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task GetByLoginId_ForwardsLoginIdAndAltPhotoFlag()
+    {
+        _photoService.GetUserPhotoAsync(null, "loginX", null, true, Arg.Any<CancellationToken>())
+            .Returns(new byte[] { 9 });
+
+        var result = await _controller.GetByLoginId("loginX", altPhoto: true, TestContext.Current.CancellationToken);
+
+        Assert.IsType<FileContentResult>(result);
+        await _photoService.Received(1).GetUserPhotoAsync(null, "loginX", null, true, Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task GetByIamId_ForwardsIamIdOnly()
+    {
+        _photoService.GetUserPhotoAsync(null, null, "1000123", false, Arg.Any<CancellationToken>())
+            .Returns(new byte[] { 7 });
+
+        var result = await _controller.GetByIamId("1000123", ct: TestContext.Current.CancellationToken);
+
+        Assert.IsType<FileContentResult>(result);
+        await _photoService.Received(1).GetUserPhotoAsync(null, null, "1000123", false, Arg.Any<CancellationToken>());
+    }
+
+    [Fact]
+    public async Task ServePhoto_SetsPrivateCacheHeader()
+    {
+        _photoService.GetUserPhotoAsync(Arg.Any<string?>(), Arg.Any<string?>(), Arg.Any<string?>(), Arg.Any<bool>(),
+            Arg.Any<CancellationToken>()).Returns(new byte[] { 1 });
+
+        await _controller.GetByMailId("mail@example.com", ct: TestContext.Current.CancellationToken);
+
+        Assert.Contains("private", _controller.Response.Headers.CacheControl.ToString());
+    }
+}
diff --git a/test/CMS/CmsContentBlockServiceTests.cs b/test/CMS/CmsContentBlockServiceTests.cs
index a198dd185..e28268142 100644
--- a/test/CMS/CmsContentBlockServiceTests.cs
+++ b/test/CMS/CmsContentBlockServiceTests.cs
@@ -26,6 +26,8 @@ public CmsContentBlockServiceTests()
             .UseInMemoryDatabase("VIPER_" + Guid.NewGuid()).Options);
         _sanitizer = Substitute.For<IHtmlSanitizerService>();
         _sanitizer.Sanitize(Arg.Any<string>()).Returns(callInfo => callInfo.ArgAt<string>(0));
+        // Pass-through so diff tests assert on the real htmldiff.net markers, not a sanitized copy.
+        _sanitizer.SanitizeDiff(Arg.Any<string>()).Returns(callInfo => callInfo.ArgAt<string>(0));
         _userHelper = Substitute.For<IUserHelper>();
 
         _service = new CmsContentBlockService(_context, _sanitizer, _userHelper);
@@ -323,4 +325,197 @@ public async Task History_ListAndVersionRetrieval()
     }
 
     #endregion
+
+    #region Cross-block edit history
+
+    private async Task<ContentBlock> SeedBlockWithHistoryAsync(string title, string page, bool deleted,
+        params (string author, DateTime when)[] versions)
+    {
+        var block = await SeedBlockAsync(b =>
+        {
+            b.Title = title;
+            b.Page = page;
+            b.DeletedOn = deleted ? DateTime.Now : null;
+            foreach (var (author, when) in versions)
+            {
+                b.ContentHistories.Add(new ContentHistory
+                {
+                    ContentBlockContent = $"<p>{author}@{when:o}</p>",
+                    ModifiedOn = when,
+                    ModifiedBy = author
+                });
+            }
+        });
+        return block;
+    }
+
+    [Fact]
+    public async Task GetHistoryEntries_ReturnsAcrossBlocks_NewestFirst_WithBlockInfo()
+    {
+        var now = DateTime.Now;
+        await SeedBlockWithHistoryAsync("Alpha", "home", deleted: false,
+            ("editorX", now.AddDays(-3)), ("editorY", now.AddDays(-1)));
+        await SeedBlockWithHistoryAsync("Beta", "about", deleted: true,
+            ("editorX", now.AddDays(-2)));
+
+        var entries = await _service.GetHistoryEntriesAsync(new CmsContentHistoryFilter(), 1, 50,
+            TestContext.Current.CancellationToken);
+
+        Assert.Equal(3, entries.Count);
+        // Newest first: editorY@-1 (Alpha), editorX@-2 (Beta), editorX@-3 (Alpha).
+        Assert.Equal("editorY", entries[0].ModifiedBy);
+        Assert.Equal("Alpha", entries[0].Title);
+        Assert.Equal("home", entries[0].Page);
+        Assert.False(entries[0].BlockDeleted);
+        Assert.Equal("Beta", entries[1].Title);
+        Assert.True(entries[1].BlockDeleted);
+    }
+
+    [Fact]
+    public async Task GetHistoryEntries_FiltersByEditorBlockSearchAndDate()
+    {
+        var now = DateTime.Now;
+        var alpha = await SeedBlockWithHistoryAsync("Alpha", "home", deleted: false,
+            ("editorX", now.AddDays(-3)), ("editorY", now.AddDays(-1)));
+        await SeedBlockWithHistoryAsync("Beta", "about", deleted: false,
+            ("editorX", now.AddDays(-2)));
+
+        var byEditor = await _service.GetHistoryEntriesAsync(new CmsContentHistoryFilter { ModifiedBy = "editorX" },
+            1, 50, TestContext.Current.CancellationToken);
+        Assert.Equal(2, byEditor.Count);
+        Assert.All(byEditor, e => Assert.Equal("editorX", e.ModifiedBy));
+
+        var byBlock = await _service.GetHistoryEntriesAsync(new CmsContentHistoryFilter { ContentBlockId = alpha.ContentBlockId },
+            1, 50, TestContext.Current.CancellationToken);
+        Assert.Equal(2, byBlock.Count);
+        Assert.All(byBlock, e => Assert.Equal(alpha.ContentBlockId, e.ContentBlockId));
+
+        var bySearch = await _service.GetHistoryEntriesAsync(new CmsContentHistoryFilter { Search = "Beta" },
+            1, 50, TestContext.Current.CancellationToken);
+        Assert.Single(bySearch);
+        Assert.Equal("Beta", bySearch[0].Title);
+
+        // To is inclusive through end of the given day; From excludes older rows.
+        var byDate = await _service.GetHistoryEntriesAsync(
+            new CmsContentHistoryFilter { From = now.AddDays(-2).Date, To = now.Date },
+            1, 50, TestContext.Current.CancellationToken);
+        Assert.DoesNotContain(byDate, e => e.ModifiedOn < now.AddDays(-2).Date);
+    }
+
+    [Fact]
+    public async Task GetHistoryEntries_PaginatesAndCounts()
+    {
+        var now = DateTime.Now;
+        await SeedBlockWithHistoryAsync("Alpha", "home", deleted: false,
+            ("a", now.AddDays(-3)), ("b", now.AddDays(-2)), ("c", now.AddDays(-1)));
+
+        var filter = new CmsContentHistoryFilter();
+        var firstPage = await _service.GetHistoryEntriesAsync(filter, 1, 2, TestContext.Current.CancellationToken);
+        var secondPage = await _service.GetHistoryEntriesAsync(filter, 2, 2, TestContext.Current.CancellationToken);
+        var total = await _service.GetHistoryEntryCountAsync(filter, TestContext.Current.CancellationToken);
+
+        Assert.Equal(2, firstPage.Count);
+        Assert.Single(secondPage);
+        Assert.Equal(3, total);
+    }
+
+    #endregion
+
+    #region Version diff
+
+    [Fact]
+    public async Task GetHistoryVersionDiff_AgainstPreviousVersion_MarksChangesAndReSanitizes()
+    {
+        var block = await SeedBlockAsync();
+        await _service.UpdateContentOnlyAsync(block.ContentBlockId, "<p>v2</p>", block.ModifiedOn, TestContext.Current.CancellationToken);
+        await _service.UpdateContentOnlyAsync(block.ContentBlockId, "<p>v3</p>", block.ModifiedOn, TestContext.Current.CancellationToken);
+
+        // History newest-first is [v2, original]; v2 has a predecessor (original) to diff against.
+        var history = await _service.GetHistoryAsync(block.ContentBlockId, TestContext.Current.CancellationToken);
+        var v2 = history[0];
+
+        var diff = await _service.GetHistoryVersionDiffAsync(block.ContentBlockId, v2.ContentHistoryId,
+            TestContext.Current.CancellationToken);
+
+        Assert.NotNull(diff);
+        Assert.True(diff!.HasComparison);
+        Assert.True(diff.HasChanges);
+        Assert.Equal("originalAuthor", diff.OldModifiedBy);
+        Assert.Contains("<ins", diff.Content);
+        Assert.Contains("<del", diff.Content);
+        Assert.Contains("v2", diff.Content);
+        // The merged diff is re-sanitized (not the raw library output) before it leaves the service.
+        _sanitizer.Received().SanitizeDiff(Arg.Any<string>());
+    }
+
+    [Fact]
+    public async Task GetHistoryVersionDiff_OriginalVersion_HasNoComparison()
+    {
+        var block = await SeedBlockAsync();
+        await _service.UpdateContentOnlyAsync(block.ContentBlockId, "<p>v2</p>", block.ModifiedOn, TestContext.Current.CancellationToken);
+
+        var history = await _service.GetHistoryAsync(block.ContentBlockId, TestContext.Current.CancellationToken);
+        var original = history[^1];
+
+        var diff = await _service.GetHistoryVersionDiffAsync(block.ContentBlockId, original.ContentHistoryId,
+            TestContext.Current.CancellationToken);
+
+        Assert.NotNull(diff);
+        Assert.False(diff!.HasComparison);
+        Assert.Equal("<p>original</p>", diff.Content);
+        Assert.DoesNotContain("<ins", diff.Content);
+    }
+
+    [Fact]
+    public async Task GetHistoryVersionDiff_UnknownVersion_ReturnsNull()
+    {
+        var block = await SeedBlockAsync();
+
+        var diff = await _service.GetHistoryVersionDiffAsync(block.ContentBlockId, 999999,
+            TestContext.Current.CancellationToken);
+
+        Assert.Null(diff);
+    }
+
+    [Fact]
+    public async Task DiffContentAgainstHistory_ComparesDraftToSelectedVersion()
+    {
+        var block = await SeedBlockAsync();
+        await _service.UpdateContentOnlyAsync(block.ContentBlockId, "<p>v2</p>", block.ModifiedOn, TestContext.Current.CancellationToken);
+
+        var history = await _service.GetHistoryAsync(block.ContentBlockId, TestContext.Current.CancellationToken);
+        var original = history[^1];
+
+        var diff = await _service.DiffContentAgainstHistoryAsync(block.ContentBlockId, original.ContentHistoryId,
+            "<p>current draft</p>", TestContext.Current.CancellationToken);
+
+        Assert.NotNull(diff);
+        Assert.True(diff!.HasComparison);
+        Assert.True(diff.HasChanges);
+        Assert.Equal("originalAuthor", diff.OldModifiedBy);
+        Assert.Contains("<ins", diff.Content);
+        Assert.Contains("current draft", diff.Content);
+    }
+
+    [Fact]
+    public async Task DiffContentAgainstHistory_IdenticalContent_ReportsNoChanges()
+    {
+        var block = await SeedBlockAsync();
+        await _service.UpdateContentOnlyAsync(block.ContentBlockId, "<p>v2</p>", block.ModifiedOn, TestContext.Current.CancellationToken);
+
+        var history = await _service.GetHistoryAsync(block.ContentBlockId, TestContext.Current.CancellationToken);
+        var original = history[^1]; // holds "<p>original</p>"
+
+        // Current draft is byte-identical to the selected version: htmldiff emits no ins/del.
+        var diff = await _service.DiffContentAgainstHistoryAsync(block.ContentBlockId, original.ContentHistoryId,
+            "<p>original</p>", TestContext.Current.CancellationToken);
+
+        Assert.NotNull(diff);
+        Assert.True(diff!.HasComparison);
+        Assert.False(diff.HasChanges);
+        Assert.DoesNotContain("<ins", diff.Content);
+        Assert.DoesNotContain("<del", diff.Content);
+    }
+
+    #endregion
 }
diff --git a/test/CMS/CmsLeftNavDisplayTests.cs b/test/CMS/CmsLeftNavDisplayTests.cs
new file mode 100644
index 000000000..e2262d48e
--- /dev/null
+++ b/test/CMS/CmsLeftNavDisplayTests.cs
@@ -0,0 +1,97 @@
+using Microsoft.EntityFrameworkCore;
+using NSubstitute;
+using Viper.Classes.SQLContext;
+using Viper.Models.AAUD;
+using Viper.Models.VIPER;
+using DataLeftNav = Viper.Areas.CMS.Data.LeftNavMenu;
+
+namespace Viper.test.CMS;
+
+/// <summary>
+/// Tests for Data.LeftNavMenu.GetLeftNavMenus display-time permission filtering (legacy CMS
+/// left-nav parity): an item with no permissions is visible to any logged-in user, an item is
+/// shown when the user holds any one of its permissions and hidden otherwise, and filtering is
+/// bypassed for management callers. Permission scenarios are driven by mocking IUserHelper.
+/// </summary>
+public sealed class CmsLeftNavDisplayTests : IDisposable
+{
+    private readonly VIPERContext _context;
+    private readonly RAPSContext _rapsContext;
+    private readonly IUserHelper _userHelper;
+
+    public CmsLeftNavDisplayTests()
+    {
+        _context = new VIPERContext(new DbContextOptionsBuilder<VIPERContext>()
+            .UseInMemoryDatabase("VIPER_" + Guid.NewGuid()).Options);
+        _rapsContext = new RAPSContext(new DbContextOptionsBuilder<RAPSContext>()
+            .UseInMemoryDatabase("RAPS_" + Guid.NewGuid()).Options);
+        _userHelper = Substitute.For<IUserHelper>();
+    }
+
+    public void Dispose()
+    {
+        _context.Dispose();
+        _rapsContext.Dispose();
+    }
+
+    private async Task<string> SeedMixedMenuAsync()
+    {
+        var friendlyName = "display-menu-" + Guid.NewGuid().ToString("N")[..8];
+        var menu = new LeftNavMenu
+        {
+            MenuHeaderText = "Display Menu",
+            System = "Viper",
+            FriendlyName = friendlyName,
+            ModifiedOn = DateTime.Now,
+            ModifiedBy = "test"
+        };
+        menu.LeftNavItems.Add(Item("Public", 1));                          // no permissions
+        menu.LeftNavItems.Add(Item("Allowed", 2, "SVMSecure.Allowed"));    // user holds this
+        menu.LeftNavItems.Add(Item("Forbidden", 3, "SVMSecure.Forbidden")); // user lacks this
+        _context.LeftNavMenus.Add(menu);
+        await _context.SaveChangesAsync(TestContext.Current.CancellationToken);
+        return friendlyName;
+    }
+
+    private static LeftNavItem Item(string text, int order, params string[] permissions)
+    {
+        var item = new LeftNavItem { MenuItemText = text, IsHeader = false, Url = "/" + text, DisplayOrder = order };
+        foreach (var p in permissions)
+        {
+            item.LeftNavItemToPermissions.Add(new LeftNavItemToPermission { Permission = p });
+        }
+        return item;
+    }
+
+    [Fact]
+    public async Task GetLeftNavMenus_HidesItemsTheUserLacksPermissionFor()
+    {
+        var friendlyName = await SeedMixedMenuAsync();
+        var user = new AaudUser { AaudUserId = 1, LoginId = "viewer" };
+        _userHelper.GetCurrentUser().Returns(user);
+        _userHelper.HasPermission(Arg.Any<RAPSContext?>(), Arg.Any<AaudUser?>(), "SVMSecure.Allowed").Returns(true);
+        // HasPermission for "SVMSecure.Forbidden" defaults to false.
+
+        var menus = new DataLeftNav(_context, _rapsContext, _userHelper)
+            .GetLeftNavMenus(friendlyName: friendlyName);
+
+        var items = Assert.Single(menus!).MenuItems!;
+        // No-permission item and the held-permission item are visible; the unheld one is hidden.
+        // (Assert membership, not sequence — the in-memory provider does not honor the include OrderBy.)
+        Assert.Equal(new[] { "Allowed", "Public" }, items.Select(i => i.MenuItemText).OrderBy(t => t));
+    }
+
+    [Fact]
+    public async Task GetLeftNavMenus_ReturnsAllItems_WhenFilteringDisabled()
+    {
+        var friendlyName = await SeedMixedMenuAsync();
+        _userHelper.GetCurrentUser().Returns(new AaudUser { AaudUserId = 1, LoginId = "viewer" });
+        // HasPermission would return false for every permission, but management callers bypass filtering.
+
+        var menus = new DataLeftNav(_context, _rapsContext, _userHelper)
+            .GetLeftNavMenus(friendlyName: friendlyName, filterItemsByPermissions: false);
+
+        var items = Assert.Single(menus!).MenuItems!;
+        Assert.Equal(new[] { "Allowed", "Forbidden", "Public" }, items.Select(i => i.MenuItemText).OrderBy(t => t));
+    }
+}
diff --git a/test/Classes/Utilities/DateRangeHelperTests.cs b/test/Classes/Utilities/DateRangeHelperTests.cs
new file mode 100644
index 000000000..84642c81c
--- /dev/null
+++ b/test/Classes/Utilities/DateRangeHelperTests.cs
@@ -0,0 +1,34 @@
+using Viper.Classes.Utilities;
+
+namespace Viper.test.Classes.Utilities;
+
+/// <summary>
+/// Tests for DateRangeHelper.ExclusiveUpperBound, the shared "To" filter bound used by both
+/// the CMS file-audit and content-history date filters. A date-only value is inclusive through
+/// the end of that day (the next midnight is returned, to compare with &lt;); any value that
+/// carries a time of day, even a single tick past midnight, is returned unchanged.
+/// </summary>
+public class DateRangeHelperTests
+{
+    [Fact]
+    public void ExclusiveUpperBound_DateOnly_AdvancesOneDay()
+    {
+        var to = new DateTime(2026, 6, 15, 0, 0, 0, DateTimeKind.Local);
+
+        var result = DateRangeHelper.ExclusiveUpperBound(to);
+
+        Assert.Equal(new DateTime(2026, 6, 16, 0, 0, 0, DateTimeKind.Local), result);
+    }
+
+    [Fact]
+    public void ExclusiveUpperBound_WithTimeComponent_ReturnedUnchanged()
+    {
+        // A single tick past midnight already counts as carrying a time of day, so the bound is
+        // used as-is. This pins the non-obvious "to.Date == to" midnight check in the helper.
+        var to = new DateTime(2026, 6, 15, 0, 0, 0, DateTimeKind.Local).AddTicks(1);
+
+        var result = DateRangeHelper.ExclusiveUpperBound(to);
+
+        Assert.Equal(to, result);
+    }
+}
diff --git a/test/Services/HtmlSanitizerServiceTests.cs b/test/Services/HtmlSanitizerServiceTests.cs
index 3b7802fa1..bb34d3489 100644
--- a/test/Services/HtmlSanitizerServiceTests.cs
+++ b/test/Services/HtmlSanitizerServiceTests.cs
@@ -220,4 +220,51 @@ public void Preserves_realworld_inline_styles(string input, params string[] must
             Assert.Contains(token, output, StringComparison.OrdinalIgnoreCase);
         }
     }
+
+    // === SanitizeDiff — the diff-specific variant adds <ins>/<del> to the allowlist, but its
+    // output is rendered with v-html on the content-block diff pages, so it must keep the same
+    // XSS guarantees as the base sanitizer. These lock that down. ===
+
+    [Theory]
+    [InlineData("<ins class=\"diffins\"><script>alert(1)</script>added</ins>")]
+    [InlineData("<del class=\"diffdel\"><img src=\"x\" onerror=\"alert(1)\" alt=\"x\"></del>")]
+    [InlineData("<ins class=\"diffmod\"><a href=\"javascript:alert(1)\">x</a></ins>")]
+    public void SanitizeDiff_strips_xss_payloads_inside_change_markers(string input)
+    {
+        var output = _sanitizer.SanitizeDiff(input);
+        Assert.DoesNotContain("<script", output, StringComparison.OrdinalIgnoreCase);
+        Assert.DoesNotContain("alert(1)", output);
+        Assert.DoesNotContain("onerror", output, StringComparison.OrdinalIgnoreCase);
+        Assert.DoesNotContain("javascript:", output, StringComparison.OrdinalIgnoreCase);
+    }
+
+    [Fact]
+    public void SanitizeDiff_strips_data_uri_in_img_src()
+    {
+        var input = "<ins class=\"diffins\"><img src=\"data:image/svg+xml;base64,PHN2Zw==\" alt=\"x\"></ins>";
+        var output = _sanitizer.SanitizeDiff(input);
+        Assert.DoesNotContain("data:", output);
+    }
+
+    [Theory]
+    [InlineData("<ins class=\"diffins\">added</ins>", "<ins", "diffins")]
+    [InlineData("<del class=\"diffdel\">removed</del>", "<del", "diffdel")]
+    [InlineData("<ins class=\"diffmod\">changed</ins>", "<ins", "diffmod")]
+    public void SanitizeDiff_preserves_change_markers_and_classes(string input, string tagFragment, string className)
+    {
+        var output = _sanitizer.SanitizeDiff(input);
+        Assert.Contains(tagFragment, output, StringComparison.OrdinalIgnoreCase);
+        Assert.Contains(className, output);
+    }
+
+    [Theory]
+    [InlineData("<ins>added</ins>", "<ins")]
+    [InlineData("<del>removed</del>", "<del")]
+    public void Sanitize_strips_diff_markers_that_SanitizeDiff_keeps(string input, string tagFragment)
+    {
+        // The base content sanitizer does not allow <ins>/<del>; only the diff variant does.
+        // This proves the two policies genuinely differ rather than sharing one allowlist.
+        var output = _sanitizer.Sanitize(input);
+        Assert.DoesNotContain(tagFragment, output, StringComparison.OrdinalIgnoreCase);
+    }
 }
diff --git a/web/Areas/CMS/Controllers/CMSContentController.cs b/web/Areas/CMS/Controllers/CMSContentController.cs
index e2229941c..490f39547 100644
--- a/web/Areas/CMS/Controllers/CMSContentController.cs
+++ b/web/Areas/CMS/Controllers/CMSContentController.cs
@@ -5,6 +5,7 @@
 using Viper.Areas.CMS.Services;
 using Viper.Classes;
 using Viper.Classes.SQLContext;
+using Viper.Models;
 using Viper.Models.VIPER;
 using Viper.Services;
 using Web.Authorization;
@@ -71,8 +72,10 @@ public async Task<ActionResult<ContentBlockDto>> GetContentBlock(int contentBloc
         [HttpGet("fn/{friendlyName}")]
         public ActionResult<ContentBlock?> GetContentBlockByFn(string friendlyName)
         {
+            // status: 1 = active only. A public display endpoint must never serve soft-deleted
+            // blocks (passing null would include DeletedOn != null rows).
             var blocks = new Data.CMS(_context, _rapsContext, _sanitizerService)
-                .GetContentBlocksAllowed(null, friendlyName, null, null, null, null, null, null)?.ToList();
+                .GetContentBlocksAllowed(null, friendlyName, null, null, null, null, null, 1)?.ToList();
             if (blocks == null || blocks.Count == 0)
             {
                 return NotFound();
@@ -103,6 +106,67 @@ public async Task<ActionResult<ContentHistoryDto>> GetHistoryVersion(int content
             return version;
         }
 
+        //GET: content/5/history/12/diff — rendered diff of this version against the previous version
+        [HttpGet("{contentBlockId:int}/history/{contentHistoryId:int}/diff")]
+        [Permission(Allow = CmsPermissions.ManageContentBlocks)]
+        public async Task<ActionResult<ContentHistoryDiffDto>> GetHistoryVersionDiff(int contentBlockId, int contentHistoryId,
+            CancellationToken ct = default)
+        {
+            var diff = await _blockService.GetHistoryVersionDiffAsync(contentBlockId, contentHistoryId, ct);
+            if (diff == null)
+            {
+                return NotFound();
+            }
+            return diff;
+        }
+
+        //POST: content/5/history/12/diff — rendered diff of a posted draft against this version.
+        //POST (not GET) because the editor's current content rides in the body.
+        [HttpPost("{contentBlockId:int}/history/{contentHistoryId:int}/diff")]
+        [Permission(Allow = CmsPermissions.ManageContentBlocks)]
+        public async Task<ActionResult<ContentHistoryDiffDto>> DiffAgainstHistoryVersion(int contentBlockId, int contentHistoryId,
+            DiffAgainstHistoryRequest request, CancellationToken ct = default)
+        {
+            var diff = await _blockService.DiffContentAgainstHistoryAsync(contentBlockId, contentHistoryId, request.Content, ct);
+            if (diff == null)
+            {
+                return NotFound();
+            }
+            return diff;
+        }
+
+        //GET: content/history — cross-block edit-history viewer (the literal segment does not
+        //collide with the int-constrained {contentBlockId}/history route).
+        [HttpGet("history")]
+        [Permission(Allow = CmsPermissions.ManageContentBlocks)]
+        [ApiPagination(DefaultPerPage = 50, MaxPerPage = 500)]
+        public async Task<ActionResult<List<ContentHistoryAuditDto>>> GetHistoryEntries(
+            int? contentBlockId,
+            string? modifiedBy,
+            DateTime? from,
+            DateTime? to,
+            string? search,
+            ApiPagination? pagination,
+            CancellationToken ct = default)
+        {
+            var filter = new CmsContentHistoryFilter
+            {
+                ContentBlockId = contentBlockId,
+                ModifiedBy = modifiedBy,
+                From = from,
+                To = to,
+                Search = search
+            };
+            var page = pagination?.Page ?? 1;
+            var perPage = pagination?.PerPage ?? 50;
+            var entries = await _blockService.GetHistoryEntriesAsync(filter, page, perPage, ct);
+            if (pagination != null)
+            {
+                pagination.TotalRecords = await _blockService.GetHistoryEntryCountAsync(filter, ct);
+            }
+            return entries;
+        }
+
         //POST: content
         [HttpPost]
         [Permission(Allow = CmsPermissions.CreateContentBlock + "," + CmsPermissions.ManageContentBlocks)]
@@ -190,7 +254,7 @@ public async Task<ActionResult<ContentBlockDto>> UpdateContentOnly(int contentBl
         [Permission(Allow = CmsPermissions.ManageContentBlocks)]
         public async Task<IActionResult> RestoreContentBlock(int contentBlockId, CancellationToken ct = default)
         {
-            return await _blockService.RestoreAsync(contentBlockId, ct) ? Ok() : NotFound();
+            return await _blockService.RestoreAsync(contentBlockId, ct) ? NoContent() : NotFound();
         }
 
         //DELETE: content/5?permanent=true|false
@@ -231,4 +295,9 @@ public class ContentOnlyUpdate
         public string Content { get; set; } = string.Empty;
         public DateTime? LastModifiedOn { get; set; }
     }
+
+    public class DiffAgainstHistoryRequest
+    {
+        public string Content { get; set; } = string.Empty;
+    }
 }
diff --git a/web/Areas/CMS/Controllers/CMSFilesController.cs b/web/Areas/CMS/Controllers/CMSFilesController.cs
index e2425f593..0c23a4ed7 100644
--- a/web/Areas/CMS/Controllers/CMSFilesController.cs
+++ b/web/Areas/CMS/Controllers/CMSFilesController.cs
@@ -219,7 +219,7 @@ public async Task<IActionResult> DeleteFile(Guid fileGuid, bool permanent = fals
         [HttpPost("{fileGuid:guid}/restore")]
         public async Task<IActionResult> RestoreFile(Guid fileGuid, CancellationToken ct = default)
         {
-            return await _fileService.RestoreFileAsync(fileGuid, ct) ? Ok() : NotFound();
+            return await _fileService.RestoreFileAsync(fileGuid, ct) ? NoContent() : NotFound();
         }
 
         // POST /api/cms/files/import — move files from the legacy VIPER webroot into the store
diff --git a/web/Areas/CMS/Controllers/CMSLinkCollectionController.cs b/web/Areas/CMS/Controllers/CMSLinkCollectionController.cs
index edfb0696c..0dfe939c2 100644
--- a/web/Areas/CMS/Controllers/CMSLinkCollectionController.cs
+++ b/web/Areas/CMS/Controllers/CMSLinkCollectionController.cs
@@ -2,6 +2,7 @@
 using Areas.CMS.Models.DTOs;
 using Microsoft.AspNetCore.Mvc;
 using Microsoft.EntityFrameworkCore;
+using Viper.Areas.CMS.Constants;
 using Viper.Classes;
 using Viper.Classes.SQLContext;
 using Web.Authorization;
@@ -31,19 +32,13 @@ public async Task<ActionResult<IEnumerable<LinkCollectionDto>>> GetLinkCollectio
             {
                 LinkCollectionId = lc.LinkCollectionId,
                 LinkCollection = lc.LinkCollectionName,
-                LinkCollectionTagCategories = lc.LinkCollectionTagCategories.Select(tc => new LinkCollectionTagCategoryDto
-                {
-                    LinkCollectionTagCategoryId = tc.LinkCollectionTagCategoryId,
-                    LinkCollectionId = tc.LinkCollectionId,
-                    LinkCollectionTagCategory = tc.LinkCollectionTagCategoryName,
-                    SortOrder = tc.SortOrder
-                }).ToList()
+                LinkCollectionTagCategories = lc.LinkCollectionTagCategories.Select(ToTagCategoryDto).ToList()
             });
 
             return Ok(result);
         }
 
-        [Permission(Allow = "SVMSecure.CMS.ManageContentBlocks")]
+        [Permission(Allow = CmsPermissions.ManageContentBlocks)]
         [HttpPost]
         public async Task<ActionResult<LinkCollectionDto>> PostLinkCollection(CreateLinkCollectionDto createDto)
         {
@@ -68,10 +63,10 @@ public async Task<ActionResult<LinkCollectionDto>> PostLinkCollection(CreateLink
                 LinkCollectionTagCategories = new List<LinkCollectionTagCategoryDto>()
             };
 
-            return CreatedAtAction(nameof(linkCollection), new { id = linkCollection.LinkCollectionId }, result);
+            return CreatedAtAction(nameof(GetLinkCollections), new { linkCollectionName = linkCollection.LinkCollectionName }, result);
         }
 
-        [Permission(Allow = "SVMSecure.CMS.ManageContentBlocks")]
+        [Permission(Allow = CmsPermissions.ManageContentBlocks)]
         [HttpPut("{id}")]
         public async Task<IActionResult> PutLinkCollection(int id, CreateLinkCollectionDto updateDto)
         {
@@ -94,7 +89,7 @@ public async Task<IActionResult> PutLinkCollection(int id, CreateLinkCollectionD
             return Ok(updateDto);
         }
 
-        [Permission(Allow = "SVMSecure.CMS.ManageContentBlocks")]
+        [Permission(Allow = CmsPermissions.ManageContentBlocks)]
         [HttpDelete("{id}")]
         public async Task<IActionResult> DeleteLinkCollection(int id)
         {
@@ -104,6 +99,17 @@ public async Task<IActionResult> DeleteLinkCollection(int id)
                 return NotFound();
             }
 
+            // FK constraints are not ON DELETE CASCADE, so remove dependents before
+            // the collection. Queuing all removals into a single SaveChanges keeps it
+            // atomic. Order: link tags -> links -> tag categories -> collection.
+            var collectionLinkIds = _context.Links
+                .Where(l => l.LinkCollectionId == id)
+                .Select(l => l.LinkId);
+            _context.LinkTags.RemoveRange(
+                _context.LinkTags.Where(lt => collectionLinkIds.Contains(lt.LinkId)));
+            _context.Links.RemoveRange(_context.Links.Where(l => l.LinkCollectionId == id));
+            _context.LinkCollectionTagCategories.RemoveRange(
+                _context.LinkCollectionTagCategories.Where(tc => tc.LinkCollectionId == id));
             _context.LinkCollections.Remove(linkCollection);
             await _context.SaveChangesAsync();
 
@@ -124,28 +130,25 @@ public async Task<ActionResult<IEnumerable<LinkCollectionTagCategoryDto>>> GetLi
                 .OrderBy(lc => lc.SortOrder)
                 .ToListAsync();
 
-            var results = categories
-                .Select(c => new LinkCollectionTagCategoryDto
-                {
-                    LinkCollectionTagCategoryId = c.LinkCollectionTagCategoryId,
-                    LinkCollectionId = c.LinkCollectionId,
-                    LinkCollectionTagCategory = c.LinkCollectionTagCategoryName,
-                    SortOrder = c.SortOrder
-                })
-                .ToList();
+            var results = categories.Select(ToTagCategoryDto).ToList();
 
             return Ok(results);
         }
 
-        [Permission(Allow = "SVMSecure.CMS.ManageContentBlocks")]
+        [Permission(Allow = CmsPermissions.ManageContentBlocks)]
         [HttpPost("{collectionId}/tags")]
-        public async Task<ActionResult<CreateLinkCollectionTagCategoryDto>> CreateLinkCollectionTagCategory(int collectionId, CreateLinkCollectionTagCategoryDto createLinkTagCategoryDto)
+        public async Task<ActionResult<LinkCollectionTagCategoryDto>> CreateLinkCollectionTagCategory(int collectionId, CreateLinkCollectionTagCategoryDto createLinkTagCategoryDto)
         {
             if (!await _context.LinkCollections.AnyAsync(lc => lc.LinkCollectionId == collectionId))
             {
                 return NotFound();
             }
 
+            if (createLinkTagCategoryDto.LinkCollectionId != collectionId)
+            {
+                return BadRequest("Collection ID in route does not match the request body.");
+            }
+
             if (await _context.LinkCollectionTagCategories
                 .AnyAsync(tc => tc.LinkCollectionTagCategoryName == createLinkTagCategoryDto.LinkCollectionTagCategory
                     && tc.LinkCollectionId == collectionId))
@@ -161,10 +164,13 @@ public async Task<ActionResult<CreateLinkCollectionTagCategoryDto>> CreateLinkCo
             };
             _context.LinkCollectionTagCategories.Add(tagCategory);
             await _context.SaveChangesAsync();
-            return CreatedAtAction(nameof(tagCategory), new { id = tagCategory.LinkCollectionTagCategoryId }, createLinkTagCategoryDto);
+
+            // Return the saved DTO so the client receives the generated id. The follow-up
+            // tag-order PUT needs that id to address the newly created category.
+            return CreatedAtAction(nameof(GetLinkCollectionTagCategories), new { collectionId }, ToTagCategoryDto(tagCategory));
         }
 
-        [Permission(Allow = "SVMSecure.CMS.ManageContentBlocks")]
+        [Permission(Allow = CmsPermissions.ManageContentBlocks)]
         [HttpPut("{collectionId}/tags/order")]
         public async Task<IActionResult> UpdateLinkCollectionTagCategoryOrder(int collectionId, List<UpdateLinkCollectionTagCategoryOrderDto> updateDto)
         {
@@ -184,7 +190,11 @@ public async Task<IActionResult> UpdateLinkCollectionTagCategoryOrder(int collec
 
             foreach (var dto in updateDto)
             {
-                var tagCategory = tagCategories.First(tc => tc.LinkCollectionTagCategoryId == dto.LinkCollectionTagCategoryId);
+                var tagCategory = tagCategories.FirstOrDefault(tc => tc.LinkCollectionTagCategoryId == dto.LinkCollectionTagCategoryId);
+                if (tagCategory == null)
+                {
+                    return BadRequest($"Tag category with ID {dto.LinkCollectionTagCategoryId} not found in this collection.");
+                }
                 tagCategory.SortOrder = dto.SortOrder;
             }
 
@@ -192,7 +202,7 @@ public async Task<IActionResult> UpdateLinkCollectionTagCategoryOrder(int collec
             return NoContent();
         }
 
-        [Permission(Allow = "SVMSecure.CMS.ManageContentBlocks")]
+        [Permission(Allow = CmsPermissions.ManageContentBlocks)]
         [HttpDelete("{collectionId}/tags/{tagCategoryId}")]
         public async Task<IActionResult> DeleteLinkCollectionTagCategory(int collectionId, int tagCategoryId)
         {
@@ -210,5 +220,13 @@ public async Task<IActionResult> DeleteLinkCollectionTagCategory(int collectionI
             await _context.SaveChangesAsync();
             return NoContent();
         }
+
+        private static LinkCollectionTagCategoryDto ToTagCategoryDto(LinkCollectionTagCategory tagCategory) => new()
+        {
+            LinkCollectionTagCategoryId = tagCategory.LinkCollectionTagCategoryId,
+            LinkCollectionId = tagCategory.LinkCollectionId,
+            LinkCollectionTagCategory = tagCategory.LinkCollectionTagCategoryName,
+            SortOrder = tagCategory.SortOrder
+        };
     }
 }
diff --git a/web/Areas/CMS/Controllers/CMSLinkCollectionLinks.cs b/web/Areas/CMS/Controllers/CMSLinkCollectionLinks.cs
index f4ec728e9..f7d6987a4 100644
--- a/web/Areas/CMS/Controllers/CMSLinkCollectionLinks.cs
+++ b/web/Areas/CMS/Controllers/CMSLinkCollectionLinks.cs
@@ -117,7 +117,7 @@ public async Task<ActionResult<LinkDto>> PostLink(int collectionId, CreateLinkDt
             _context.Links.Add(link);
             await _context.SaveChangesAsync();
 
-            return CreatedAtAction(nameof(link), new { id = link.LinkId }, new LinkDto
+            return CreatedAtAction(nameof(GetLinks), new { collectionId }, new LinkDto
             {
                 LinkId = link.LinkId,
                 LinkCollectionId = link.LinkCollectionId,
diff --git a/web/Areas/CMS/Data/LeftNavMenu.cs b/web/Areas/CMS/Data/LeftNavMenu.cs
index 3273645f1..5381c6d3f 100644
--- a/web/Areas/CMS/Data/LeftNavMenu.cs
+++ b/web/Areas/CMS/Data/LeftNavMenu.cs
@@ -8,14 +8,13 @@ public class LeftNavMenu
     {
         private readonly VIPERContext? _viperContext;
         private readonly RAPSContext? _rapsContext;
+        private readonly IUserHelper _userHelper;
 
-        public IUserHelper UserHelper { get; private set; }
-
-        public LeftNavMenu(VIPERContext viperContext, RAPSContext rapsContext)
+        public LeftNavMenu(VIPERContext viperContext, RAPSContext rapsContext, IUserHelper? userHelper = null)
         {
             this._viperContext = viperContext;
             this._rapsContext = rapsContext;
-            UserHelper = new UserHelper();
+            _userHelper = userHelper ?? new UserHelper();
         }
 
         /// <summary>
@@ -46,7 +45,7 @@ public LeftNavMenu(VIPERContext viperContext, RAPSContext rapsContext)
                 return null;
             }
 
-            var currentUser = UserHelper.GetCurrentUser();
+            var currentUser = _userHelper.GetCurrentUser();
             List<NavMenu> cmsMenus = new();
             foreach (var m in menus)
             {
@@ -55,7 +54,7 @@ public LeftNavMenu(VIPERContext viperContext, RAPSContext rapsContext)
                 List<NavMenuItem> items = m.LeftNavItems
                     .Where(item => !filterItemsByPermissions
                         || item.LeftNavItemToPermissions.Count == 0
-                        || item.LeftNavItemToPermissions.Any(p => UserHelper.HasPermission(_rapsContext, currentUser, p.Permission)))
+                        || item.LeftNavItemToPermissions.Any(p => _userHelper.HasPermission(_rapsContext, currentUser, p.Permission)))
                     .Select(item => new NavMenuItem(item))
                     .ToList();
                 cmsMenus.Add(new(m.MenuHeaderText, items));
diff --git a/web/Areas/CMS/Models/DTOs/ContentBlockDto.cs b/web/Areas/CMS/Models/DTOs/ContentBlockDto.cs
index c48e6fec1..efa49df76 100644
--- a/web/Areas/CMS/Models/DTOs/ContentBlockDto.cs
+++ b/web/Areas/CMS/Models/DTOs/ContentBlockDto.cs
@@ -37,4 +37,40 @@ public class ContentHistoryDto : ContentHistoryListItemDto
     {
         public string Content { get; set; } = string.Empty;
     }
+
+    /// <summary>
+    /// A rendered HTML diff between two versions of a content block. Content holds the merged
+    /// markup with htmldiff.net's ins/del (diffins/diffdel/diffmod) markers. The Old/New stamps
+    /// describe each side so the viewer can label the comparison direction. HasComparison is false
+    /// when there is no other version to compare against (e.g. the original version); Content then
+    /// holds the version's own markup with no diff markers.
+    /// </summary>
+    public class ContentHistoryDiffDto
+    {
+        public string Content { get; set; } = string.Empty;
+        public bool HasComparison { get; set; }
+        // False when the two compared versions are identical (the diff carries no ins/del markers),
+        // so the viewer can say "identical" instead of showing an unchanged body that looks broken.
+        public bool HasChanges { get; set; }
+        public DateTime? OldModifiedOn { get; set; }
+        public string? OldModifiedBy { get; set; }
+        public DateTime? NewModifiedOn { get; set; }
+        public string? NewModifiedBy { get; set; }
+    }
+
+    /// <summary>
+    /// A single cross-block edit-history entry: a superseded content version with the block
+    /// it belongs to. Used by the content-block edit-history viewer.
+    /// </summary>
+    public class ContentHistoryAuditDto
+    {
+        public int ContentHistoryId { get; set; }
+        public int ContentBlockId { get; set; }
+        public string? Title { get; set; }
+        public string? FriendlyName { get; set; }
+        public string? Page { get; set; }
+        public DateTime? ModifiedOn { get; set; }
+        public string? ModifiedBy { get; set; }
+        public bool BlockDeleted { get; set; }
+    }
 }
diff --git a/web/Areas/CMS/Services/CmsContentBlockService.cs b/web/Areas/CMS/Services/CmsContentBlockService.cs
index 06c41c437..8cbe5564a 100644
--- a/web/Areas/CMS/Services/CmsContentBlockService.cs
+++ b/web/Areas/CMS/Services/CmsContentBlockService.cs
@@ -1,7 +1,9 @@
 using Microsoft.EntityFrameworkCore;
+using HtmlDiffer = HtmlDiff.HtmlDiff;
 using Viper.Areas.CMS.Models;
 using Viper.Areas.CMS.Models.DTOs;
 using Viper.Classes.SQLContext;
+using Viper.Classes.Utilities;
 using Viper.Models.VIPER;
 using Viper.Services;
 
@@ -39,9 +41,30 @@ Task<List<ContentBlockDto>> GetContentBlocksAsync(string status, string? system,
 
         Task<ContentHistoryDto?> GetHistoryVersionAsync(int contentBlockId, int contentHistoryId, CancellationToken ct = default);
 
+        Task<ContentHistoryDiffDto?> GetHistoryVersionDiffAsync(int contentBlockId, int contentHistoryId, CancellationToken ct = default);
+
+        Task<ContentHistoryDiffDto?> DiffContentAgainstHistoryAsync(int contentBlockId, int contentHistoryId, string currentContent, CancellationToken ct = default);
+
+        Task<List<ContentHistoryAuditDto>> GetHistoryEntriesAsync(CmsContentHistoryFilter filter, int page, int perPage, CancellationToken ct = default);
+
+        Task<int> GetHistoryEntryCountAsync(CmsContentHistoryFilter filter, CancellationToken ct = default);
+
         Task<List<string>> GetViperSectionPathsAsync(CancellationToken ct = default);
     }
 
+    /// <summary>
+    /// Filters for the cross-block edit-history viewer. Mirrors CmsFileAuditFilter so the
+    /// content-history page can reuse the file-audit page's filter UX.
+    /// </summary>
+    public class CmsContentHistoryFilter
+    {
+        public int? ContentBlockId { get; set; }
+        public string? ModifiedBy { get; set; }
+        public DateTime? From { get; set; }
+        public DateTime? To { get; set; }
+        public string? Search { get; set; }
+    }
+
     /// <summary>
     /// Management operations for CMS content blocks. Mirrors legacy ColdFusion
     /// ContentBlocks.cfc semantics: content is stored raw and sanitized on render,
@@ -323,6 +346,159 @@ public async Task<List<ContentHistoryListItemDto>> GetHistoryAsync(int contentBl
             };
         }
 
+        public async Task<ContentHistoryDiffDto?> GetHistoryVersionDiffAsync(int contentBlockId, int contentHistoryId, CancellationToken ct = default)
+        {
+            var selected = await _context.ContentHistories
+                .AsNoTracking()
+                .FirstOrDefaultAsync(h => h.ContentBlockId == contentBlockId && h.ContentHistoryId == contentHistoryId, ct);
+            if (selected == null)
+            {
+                return null;
+            }
+
+            // The "previous version" is the next-older history row for this block, by the same
+            // newest-first ordering the history list uses. History holds superseded versions only,
+            // so the current live block is never the comparison target here.
+            var previous = await _context.ContentHistories
+                .AsNoTracking()
+                .Where(h => h.ContentBlockId == contentBlockId
+                    && (h.ModifiedOn < selected.ModifiedOn
+                        || (h.ModifiedOn == selected.ModifiedOn && h.ContentHistoryId < selected.ContentHistoryId)))
+                .OrderByDescending(h => h.ModifiedOn)
+                .ThenByDescending(h => h.ContentHistoryId)
+                .FirstOrDefaultAsync(ct);
+
+            if (previous == null)
+            {
+                // Original version: nothing older to diff against. Return its own sanitized markup.
+                return new ContentHistoryDiffDto
+                {
+                    Content = _sanitizer.Sanitize(selected.ContentBlockContent),
+                    HasComparison = false,
+                    NewModifiedOn = selected.ModifiedOn,
+                    NewModifiedBy = selected.ModifiedBy
+                };
+            }
+
+            var diffHtml = BuildDiffHtml(previous.ContentBlockContent, selected.ContentBlockContent);
+            return new ContentHistoryDiffDto
+            {
+                Content = diffHtml,
+                HasComparison = true,
+                HasChanges = DiffHasChanges(diffHtml),
+                OldModifiedOn = previous.ModifiedOn,
+                OldModifiedBy = previous.ModifiedBy,
+                NewModifiedOn = selected.ModifiedOn,
+                NewModifiedBy = selected.ModifiedBy
+            };
+        }
+
+        public async Task<ContentHistoryDiffDto?> DiffContentAgainstHistoryAsync(int contentBlockId, int contentHistoryId, string currentContent, CancellationToken ct = default)
+        {
+            var selected = await _context.ContentHistories
+                .AsNoTracking()
+                .FirstOrDefaultAsync(h => h.ContentBlockId == contentBlockId && h.ContentHistoryId == contentHistoryId, ct);
+            if (selected == null)
+            {
+                return null;
+            }
+
+            // The history version is the "old" side and the editor's current draft is the "new" side,
+            // so ins/del read as what the draft adds/removes relative to that version.
+            var diffHtml = BuildDiffHtml(selected.ContentBlockContent, currentContent);
+            return new ContentHistoryDiffDto
+            {
+                Content = diffHtml,
+                HasComparison = true,
+                HasChanges = DiffHasChanges(diffHtml),
+                OldModifiedOn = selected.ModifiedOn,
+                OldModifiedBy = selected.ModifiedBy
+            };
+        }
+
+        // Sanitize both sides with the render-time policy first so the diff compares what actually
+        // renders, then diff, then re-sanitize the merged result. The second pass re-parses through
+        // AngleSharp (balancing/closing the malformed tags htmldiff.net can emit) and strips anything
+        // off-policy, so we no longer trust the diff library's output — SanitizeDiff keeps only the
+        // <ins>/<del> change markers on top of our normal allowlist.
+        private string BuildDiffHtml(string oldContent, string newContent)
+        {
+            var oldSafe = _sanitizer.Sanitize(oldContent ?? string.Empty);
+            var newSafe = _sanitizer.Sanitize(newContent ?? string.Empty);
+            var diff = HtmlDiffer.Execute(oldSafe, newSafe);
+            return _sanitizer.SanitizeDiff(diff);
+        }
+
+        // htmldiff.net only wraps actual changes in <ins>/<del>; identical inputs come back with
+        // neither. Their absence means the two versions render the same.
+        private static bool DiffHasChanges(string diffHtml)
+        {
+            return diffHtml.Contains("<ins", StringComparison.OrdinalIgnoreCase)
+                || diffHtml.Contains("<del", StringComparison.OrdinalIgnoreCase);
+        }
+
+        public async Task<List<ContentHistoryAuditDto>> GetHistoryEntriesAsync(CmsContentHistoryFilter filter, int page, int perPage, CancellationToken ct = default)
+        {
+            return await BuildHistoryQuery(filter)
+                .OrderByDescending(x => x.History.ModifiedOn)
+                .ThenByDescending(x => x.History.ContentHistoryId)
+                .Skip((page - 1) * perPage)
+                .Take(perPage)
+                .Select(x => new ContentHistoryAuditDto
+                {
+                    ContentHistoryId = x.History.ContentHistoryId,
+                    ContentBlockId = x.History.ContentBlockId,
+                    Title = x.Block.Title,
+                    FriendlyName = x.Block.FriendlyName,
+                    Page = x.Block.Page,
+                    ModifiedOn = x.History.ModifiedOn,
+                    ModifiedBy = x.History.ModifiedBy,
+                    BlockDeleted = x.Block.DeletedOn != null
+                })
+                .ToListAsync(ct);
+        }
+
+        public async Task<int> GetHistoryEntryCountAsync(CmsContentHistoryFilter filter, CancellationToken ct = default)
+        {
+            return await BuildHistoryQuery(filter).CountAsync(ct);
+        }
+
+        // Join history to its block so the block's title/page are filterable and projectable
+        // (a join, not a correlated subquery). Each row is a superseded prior version.
+        private IQueryable<HistoryWithBlock> BuildHistoryQuery(CmsContentHistoryFilter filter)
+        {
+            var query =
+                from h in _context.ContentHistories.AsNoTracking()
+                join b in _context.ContentBlocks.AsNoTracking() on h.ContentBlockId equals b.ContentBlockId
+                select new HistoryWithBlock { History = h, Block = b };
+
+            if (filter.ContentBlockId != null)
+            {
+                query = query.Where(x => x.History.ContentBlockId == filter.ContentBlockId);
+            }
+            if (!string.IsNullOrEmpty(filter.ModifiedBy))
+            {
+                query = query.Where(x => x.History.ModifiedBy == filter.ModifiedBy);
+            }
+            if (filter.From != null)
+            {
+                query = query.Where(x => x.History.ModifiedOn >= filter.From);
+            }
+            if (filter.To != null)
+            {
+                // Treat the To date as inclusive through end of day.
+                var to = DateRangeHelper.ExclusiveUpperBound(filter.To.Value);
+                query = query.Where(x => x.History.ModifiedOn < to);
+            }
+            if (!string.IsNullOrEmpty(filter.Search))
+            {
+                query = query.Where(x => (x.Block.Title != null && x.Block.Title.Contains(filter.Search))
+                    || (x.Block.FriendlyName != null && x.Block.FriendlyName.Contains(filter.Search))
+                    || (x.Block.Page != null && x.Block.Page.Contains(filter.Search)));
+            }
+            return query;
+        }
+
         public async Task<List<string>> GetViperSectionPathsAsync(CancellationToken ct = default)
         {
             return await _context.ContentBlocks
@@ -458,6 +634,13 @@ private string CurrentLoginId()
             return _userHelper.GetCurrentUser()?.LoginId ?? "unknown";
         }
 
+        // Wrapper so the history/block join can be filtered and ordered before projection.
+        private sealed class HistoryWithBlock
+        {
+            public ContentHistory History { get; set; } = null!;
+            public ContentBlock Block { get; set; } = null!;
+        }
+
         private static List<string> CleanList(ICollection<string> values)
         {
             return values
diff --git a/web/Areas/CMS/Services/CmsFileAuditService.cs b/web/Areas/CMS/Services/CmsFileAuditService.cs
index f6de585b5..2c425ab68 100644
--- a/web/Areas/CMS/Services/CmsFileAuditService.cs
+++ b/web/Areas/CMS/Services/CmsFileAuditService.cs
@@ -2,6 +2,7 @@
 using Microsoft.EntityFrameworkCore;
 using Viper.Areas.CMS.Models;
 using Viper.Classes.SQLContext;
+using Viper.Classes.Utilities;
 using Viper.Models.VIPER;
 using File = Viper.Models.VIPER.File;
 
@@ -117,7 +118,7 @@ private IQueryable<FileAudit> BuildQuery(CmsFileAuditFilter filter)
             if (filter.To != null)
             {
                 // Treat the To date as inclusive through end of day.
-                var to = filter.To.Value.Date == filter.To.Value ? filter.To.Value.AddDays(1) : filter.To.Value;
+                var to = DateRangeHelper.ExclusiveUpperBound(filter.To.Value);
                 query = query.Where(a => a.Timestamp < to);
             }
             if (!string.IsNullOrEmpty(filter.Search))
diff --git a/web/Areas/CMS/Services/CmsNavMenu.cs b/web/Areas/CMS/Services/CmsNavMenu.cs
index 9f908e7ec..c6ce6849e 100644
--- a/web/Areas/CMS/Services/CmsNavMenu.cs
+++ b/web/Areas/CMS/Services/CmsNavMenu.cs
@@ -25,7 +25,7 @@ public NavMenu Nav()
 
             if (canManageBlocks || canCreateBlocks || canManageFiles || canManageNav)
             {
-                nav.Add(new NavMenuItem { MenuItemText = "Home", MenuItemURL = "Home" });
+                nav.Add(new NavMenuItem { MenuItemText = "Home", MenuItemURL = "Home", IndentLevel = 1 });
             }
 
             if (canManageBlocks || canCreateBlocks)
@@ -41,6 +41,7 @@ public NavMenu Nav()
                 }
                 if (canManageBlocks)
                 {
+                    nav.Add(new NavMenuItem { MenuItemText = "Edit History", MenuItemURL = "ManageContentBlocks/History", IndentLevel = 1 });
                     nav.Add(new NavMenuItem { MenuItemText = "Manage Link Collections", MenuItemURL = "ManageLinkCollections", IndentLevel = 1 });
                 }
             }
@@ -50,6 +51,7 @@ public NavMenu Nav()
                 nav.Add(new NavMenuItem { MenuItemText = "Files", IsHeader = true });
                 nav.Add(new NavMenuItem { MenuItemText = "Manage Files", MenuItemURL = "ManageFiles", IndentLevel = 1 });
                 nav.Add(new NavMenuItem { MenuItemText = "Add File", MenuItemURL = "ManageFiles?upload=1", IndentLevel = 1 });
+                nav.Add(new NavMenuItem { MenuItemText = "Audit Trail", MenuItemURL = "ManageFiles/Audit", IndentLevel = 1 });
             }
 
             if (canManageNav)
diff --git a/web/Classes/Utilities/DateRangeHelper.cs b/web/Classes/Utilities/DateRangeHelper.cs
new file mode 100644
index 000000000..265dd2d11
--- /dev/null
+++ b/web/Classes/Utilities/DateRangeHelper.cs
@@ -0,0 +1,16 @@
+namespace Viper.Classes.Utilities;
+
+/// <summary>
+/// Helpers for date-range query filters.
+/// </summary>
+public static class DateRangeHelper
+{
+    /// <summary>
+    /// Exclusive upper bound for an inclusive "To" date filter. A value with no time component
+    /// (midnight) is treated as "through the end of that day", so the next midnight is returned;
+    /// a value that already carries a time of day is returned unchanged. Compare with
+    /// &lt; against the result.
+    /// </summary>
+    public static DateTime ExclusiveUpperBound(DateTime to)
+        => to.Date == to ? to.AddDays(1) : to;
+}
diff --git a/web/Services/HtmlSanitizerService.cs b/web/Services/HtmlSanitizerService.cs
index 7a9de7841..b7876d9e5 100644
--- a/web/Services/HtmlSanitizerService.cs
+++ b/web/Services/HtmlSanitizerService.cs
@@ -9,12 +9,19 @@ namespace Viper.Services
     public class HtmlSanitizerService : IHtmlSanitizerService
     {
         private readonly HtmlSanitizer _sanitizer;
+        private readonly HtmlSanitizer _diffSanitizer;
 
         public HtmlSanitizerService()
         {
-            _sanitizer = new HtmlSanitizer();
+            _sanitizer = BuildSanitizer(allowDiffMarkers: false);
+            _diffSanitizer = BuildSanitizer(allowDiffMarkers: true);
+        }
+
+        private static HtmlSanitizer BuildSanitizer(bool allowDiffMarkers)
+        {
+            var sanitizer = new HtmlSanitizer();
 
-            _sanitizer.AllowedTags.Clear();
+            sanitizer.AllowedTags.Clear();
             foreach (var tag in new[]
             {
                 "p", "br", "hr", "strong", "b", "em", "i", "u", "s", "strike",
@@ -26,10 +33,20 @@ public HtmlSanitizerService()
                 "sub", "sup", "small", "abbr", "cite", "q"
             })
             {
-                _sanitizer.AllowedTags.Add(tag);
+                sanitizer.AllowedTags.Add(tag);
+            }
+
+            if (allowDiffMarkers)
+            {
+                // htmldiff.net wraps changes in <ins>/<del> (classes diffins/diffdel/diffmod).
+                // Allowing just these two tags lets a diff be re-sanitized to balance the library's
+                // markup and strip anything off-policy while keeping the change markers. The class
+                // attribute is already allowed below, so the diff* classes survive.
+                sanitizer.AllowedTags.Add("ins");
+                sanitizer.AllowedTags.Add("del");
             }
 
-            _sanitizer.AllowedAttributes.Clear();
+            sanitizer.AllowedAttributes.Clear();
             foreach (var attr in new[]
             {
                 "href", "src", "alt", "title", "class", "id", "name",
@@ -38,7 +55,7 @@ public HtmlSanitizerService()
                 "style"
             })
             {
-                _sanitizer.AllowedAttributes.Add(attr);
+                sanitizer.AllowedAttributes.Add(attr);
             }
 
             // Curated CSS property allowlist. Mirrors legacy antisamy-cms.xml plus font-size, which
@@ -46,7 +63,7 @@ public HtmlSanitizerService()
             // dangerous CSS value constructs are blocked by Ganss.Xss regardless of this list.
             // Shorthand properties (text-decoration, list-style) get expanded to longhands by
             // AngleSharp; both forms must be allowed or the entire declaration is dropped.
-            _sanitizer.AllowedCssProperties.Clear();
+            sanitizer.AllowedCssProperties.Clear();
             foreach (var prop in new[]
             {
                 "color", "font-family", "font-size", "font-style", "font-weight",
@@ -60,25 +77,25 @@ public HtmlSanitizerService()
                 "list-style", "list-style-type", "list-style-position", "list-style-image"
             })
             {
-                _sanitizer.AllowedCssProperties.Add(prop);
+                sanitizer.AllowedCssProperties.Add(prop);
             }
 
-            _sanitizer.AllowedSchemes.Clear();
-            _sanitizer.AllowedSchemes.Add("http");
-            _sanitizer.AllowedSchemes.Add("https");
-            _sanitizer.AllowedSchemes.Add("mailto");
-            _sanitizer.AllowedSchemes.Add("tel");
+            sanitizer.AllowedSchemes.Clear();
+            sanitizer.AllowedSchemes.Add("http");
+            sanitizer.AllowedSchemes.Add("https");
+            sanitizer.AllowedSchemes.Add("mailto");
+            sanitizer.AllowedSchemes.Add("tel");
 
             // Block all CSS at-rules (@import, @font-face, etc.). At-rules are not valid inside
             // an inline style attribute, but clearing the set is defense in depth against parser
             // edge cases.
-            _sanitizer.AllowedAtRules.Clear();
+            sanitizer.AllowedAtRules.Clear();
 
             // Block data: URIs in any URL (image XSS vector) on top of the scheme allowlist.
             // Also lock <img src> to relative URLs only — matches the legacy antisamy-cms.xml
             // onsiteURL regex and prevents editor-authored content from embedding third-party
             // tracking beacons or any absolute-URL image (same-origin absolutes included).
-            _sanitizer.FilterUrl += (sender, args) =>
+            sanitizer.FilterUrl += (sender, args) =>
             {
                 if (args.OriginalUrl.StartsWith("data:", StringComparison.OrdinalIgnoreCase))
                 {
@@ -92,6 +109,8 @@ public HtmlSanitizerService()
                     args.SanitizedUrl = null;
                 }
             };
+
+            return sanitizer;
         }
 
         private static bool IsOffSiteUrl(string url)
@@ -103,5 +122,7 @@ private static bool IsOffSiteUrl(string url)
         }
 
         public string Sanitize(string html) => _sanitizer.Sanitize(html);
+
+        public string SanitizeDiff(string html) => _diffSanitizer.Sanitize(html);
     }
 }
diff --git a/web/Services/IHtmlSanitizerService.cs b/web/Services/IHtmlSanitizerService.cs
index ab451e0a3..0225b525b 100644
--- a/web/Services/IHtmlSanitizerService.cs
+++ b/web/Services/IHtmlSanitizerService.cs
@@ -3,5 +3,12 @@ namespace Viper.Services
     public interface IHtmlSanitizerService
     {
         string Sanitize(string html);
+
+        /// <summary>
+        /// Sanitize generated diff markup. Same policy as <see cref="Sanitize"/> but additionally
+        /// permits the &lt;ins&gt;/&lt;del&gt; markers htmldiff.net wraps changes in, so a diff can be
+        /// re-parsed (balancing the library's malformed tags) and stripped to policy before render.
+        /// </summary>
+        string SanitizeDiff(string html);
     }
 }
diff --git a/web/Viper.csproj b/web/Viper.csproj
index 4ccb2a6ac..eafc1ba5a 100644
--- a/web/Viper.csproj
+++ b/web/Viper.csproj
@@ -54,6 +54,7 @@
     <PackageReference Include="Hangfire.Heartbeat" Version="0.6.0" />
     <PackageReference Include="Hangfire.SqlServer" Version="1.8.23" />
     <PackageReference Include="HtmlAgilityPack" Version="1.12.4" />
+    <PackageReference Include="htmldiff.net" Version="1.5.0" />
     <PackageReference Include="HtmlSanitizer" Version="9.0.892" />
     <PackageReference Include="JetBrains.Annotations" Version="2025.2.4" />
     <PackageReference Include="Joonasw.AspNetCore.SecurityHeaders" Version="6.0.0" />