diff --git a/src/__tests__/mergify.test.js b/src/__tests__/mergify.test.js
index 36a0548..21068bb 100644
--- a/src/__tests__/mergify.test.js
+++ b/src/__tests__/mergify.test.js
@@ -1,5 +1,6 @@
 const {
     MergifyCache,
+    PrStatusCache,
     findTimelineActions,
     isPullRequestOpen,
     isPullRequestQueued,
@@ -14,6 +15,20 @@ const {
     convertMergifyTimestamps,
     isMergifyBotComment,
     formatLocalTime,
+    parseStackMarker,
+    parseRevisionMarker,
+    STACK_MARKER_PREFIX,
+    REVISION_MARKER_PREFIX,
+    MARKER_SUFFIX,
+    fetchPrStatus,
+    gatherPrStatuses,
+    buildContextPanel,
+    updateStackDotStatus,
+    injectContextPanel,
+    renderMergifyContext,
+    clearCommentsCache,
+    buildStackNav,
+    injectStackNav,
 } = require("../mergify");
 const { loadFixture, injectFixtureInDOM } = require("./utils");
 
@@ -797,3 +812,1531 @@ describe("convertMergifyTimestamps", () => {
         expect(code.textContent).toBe("9999-99-99 99:99 UTC");
     });
 });
+
+describe("parseStackMarker", () => {
+    function makeBody(payload, titleRows = "") {
+        return (
+            "Stack:\n" +
+            "| # | Pull Request | Link | |\n" +
+            "|--:|---|---|---|\n" +
+            titleRows +
+            `\n<!-- mergify-stack-data: ${JSON.stringify(payload)} -->\n`
+        );
+    }
+
+    it("returns null when no comment carries the marker", () => {
+        expect(
+            parseStackMarker(["plain text", "no marker here"], 122),
+        ).toBeNull();
+    });
+
+    it("parses a well-formed marker and merges titles from the table", () => {
+        const payload = {
+            schema_version: 1,
+            stack_id: "feature/auth",
+            pulls: [
+                {
+                    number: 121,
+                    change_id: "Ia",
+                    head_sha: "ab12cd3",
+                    base_branch: "main",
+                    dest_branch: "feature/auth",
+                    is_current: false,
+                },
+                {
+                    number: 122,
+                    change_id: "Ib",
+                    head_sha: "ef45gh6",
+                    base_branch: "feature/auth",
+                    dest_branch: "feature/auth",
+                    is_current: true,
+                },
+            ],
+        };
+        const titleRows =
+            "| 0 | Auth scaffolding | [#121](https://x/121) |  |\n" +
+            "| 1 | Token refresh | [#122](https://x/122) | 👈 |\n";
+        const result = parseStackMarker([makeBody(payload, titleRows)], 122);
+        expect(result.stack_id).toBe("feature/auth");
+        expect(result.pulls).toHaveLength(2);
+        expect(result.pulls[0]).toMatchObject({
+            number: 121,
+            title: "Auth scaffolding",
+            is_current: false,
+        });
+        expect(result.pulls[1]).toMatchObject({
+            number: 122,
+            title: "Token refresh",
+            is_current: true,
+        });
+    });
+
+    it("uses the latest marker when multiple are present", () => {
+        function payload(stack_id) {
+            return {
+                schema_version: 1,
+                stack_id,
+                pulls: [
+                    {
+                        number: 1,
+                        change_id: "i",
+                        head_sha: "h",
+                        base_branch: "main",
+                        dest_branch: stack_id,
+                        is_current: true,
+                    },
+                ],
+            };
+        }
+        const a = `<!-- mergify-stack-data: ${JSON.stringify(payload("old"))} -->`;
+        const b = `<!-- mergify-stack-data: ${JSON.stringify(payload("new"))} -->`;
+        expect(parseStackMarker([a, b], 1).stack_id).toBe("new");
+    });
+
+    it("returns null on malformed JSON", () => {
+        const body = `${STACK_MARKER_PREFIX}{not json}${MARKER_SUFFIX}`;
+        expect(parseStackMarker([body], 122)).toBeNull();
+    });
+
+    it("returns null on schema_version != 1", () => {
+        const body = `<!-- mergify-stack-data: ${JSON.stringify({
+            schema_version: 2,
+            stack_id: "x",
+            pulls: [],
+        })} -->`;
+        expect(parseStackMarker([body], 122)).toBeNull();
+    });
+
+    it("returns null when the marker's is_current PR doesn't match — guards against stale-DOM SPA fetches", () => {
+        // Marker says #30163 is the current PR, but we're rendering for #30164.
+        // The fetched comment came from #30163's page during a navigation race.
+        const payload = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [
+                {
+                    number: 30163,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "main",
+                    dest_branch: "x",
+                    is_current: true,
+                },
+                {
+                    number: 30164,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "x",
+                    dest_branch: "x",
+                    is_current: false,
+                },
+            ],
+        };
+        const body = `<!-- mergify-stack-data: ${JSON.stringify(payload)} -->`;
+        expect(parseStackMarker([body], 30164)).toBeNull();
+        // Same marker matches when rendering for #30163.
+        expect(parseStackMarker([body], 30163)).not.toBeNull();
+    });
+
+    it("falls back to 'PR #N' when title row is missing", () => {
+        const payload = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [
+                {
+                    number: 999,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "main",
+                    dest_branch: "x",
+                    is_current: true,
+                },
+            ],
+        };
+        const body = `<!-- mergify-stack-data: ${JSON.stringify(payload)} -->`;
+        expect(parseStackMarker([body], 999).pulls[0].title).toBe("PR #999");
+    });
+
+    it("unescapes \\| in titles", () => {
+        const payload = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [
+                {
+                    number: 5,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "main",
+                    dest_branch: "x",
+                    is_current: true,
+                },
+            ],
+        };
+        const titleRows = "| 0 | Pipe \\| in title | [#5](https://x/5) |  |\n";
+        const body =
+            "| # | Pull Request | Link | |\n|--:|---|---|---|\n" +
+            titleRows +
+            `<!-- mergify-stack-data: ${JSON.stringify(payload)} -->`;
+        expect(parseStackMarker([body], 5).pulls[0].title).toBe(
+            "Pipe | in title",
+        );
+    });
+});
+
+describe("parseRevisionMarker", () => {
+    function makeMarker(payload) {
+        return `<!-- mergify-revision-data: ${JSON.stringify(payload)} -->`;
+    }
+
+    it("returns null when no comment matches the pull number", () => {
+        const body = makeMarker({
+            schema_version: 1,
+            pull_number: 999,
+            entries: [],
+        });
+        expect(parseRevisionMarker([body], 122)).toBeNull();
+    });
+
+    it("parses a matching marker", () => {
+        const payload = {
+            schema_version: 1,
+            pull_number: 122,
+            entries: [
+                {
+                    number: 1,
+                    change_type: "initial",
+                    old_sha: null,
+                    new_sha: "ab12cd3",
+                    timestamp_iso: "2026-04-22T09:14:00Z",
+                    compare_url: null,
+                },
+                {
+                    number: 2,
+                    change_type: "amend",
+                    old_sha: "ab12cd3",
+                    new_sha: "cd34ef5",
+                    timestamp_iso: "2026-04-23T16:02:00Z",
+                    compare_url: "https://x/compare/ab12cd3...cd34ef5",
+                },
+            ],
+        };
+        const result = parseRevisionMarker([makeMarker(payload)], 122);
+        expect(result.entries).toHaveLength(2);
+        expect(result.entries[1].change_type).toBe("amend");
+    });
+
+    it("returns null on malformed JSON", () => {
+        const body = `${REVISION_MARKER_PREFIX}{bad}${MARKER_SUFFIX}`;
+        expect(parseRevisionMarker([body], 122)).toBeNull();
+    });
+
+    it("captures the reason from a 5-col markdown table for any change_type", () => {
+        const payload = {
+            schema_version: 1,
+            pull_number: 122,
+            entries: [
+                {
+                    number: 1,
+                    change_type: "rebase",
+                    old_sha: "a",
+                    new_sha: "b",
+                    timestamp_iso: "t",
+                    compare_url: "u",
+                },
+                {
+                    number: 2,
+                    change_type: "unknown",
+                    old_sha: "b",
+                    new_sha: "c",
+                    timestamp_iso: "t",
+                    compare_url: "u",
+                },
+                {
+                    number: 3,
+                    change_type: "amend",
+                    old_sha: "c",
+                    new_sha: "d",
+                    timestamp_iso: "t",
+                    compare_url: "u",
+                },
+            ],
+        };
+        const body =
+            "### Revision history\n\n" +
+            "| # | Type | Changes | Reason | Date |\n" +
+            "|---|------|---------|--------|------|\n" +
+            "| 1 | rebase | [link](u) | rebased onto main | 2026-04-22 09:00 UTC |\n" +
+            "| 2 | unknown | [link](u) | follow-up after review | 2026-04-22 10:00 UTC |\n" +
+            "| 3 | amend | [link](u) |  | 2026-04-22 11:00 UTC |\n" +
+            `${REVISION_MARKER_PREFIX}${JSON.stringify(payload)}${MARKER_SUFFIX}`;
+        const result = parseRevisionMarker([body], 122);
+        // change_type values must come from the JSON unchanged.
+        expect(result.entries[0].change_type).toBe("rebase");
+        expect(result.entries[1].change_type).toBe("unknown");
+        expect(result.entries[2].change_type).toBe("amend");
+        // Reasons come from the markdown.
+        expect(result.entries[0].reason).toBe("rebased onto main");
+        expect(result.entries[1].reason).toBe("follow-up after review");
+        expect(result.entries[2].reason).toBeNull();
+    });
+
+    it("returns null on schema_version mismatch", () => {
+        const body = makeMarker({
+            schema_version: 2,
+            pull_number: 122,
+            entries: [],
+        });
+        expect(parseRevisionMarker([body], 122)).toBeNull();
+    });
+
+    it("uses the latest matching marker when multiple are present", () => {
+        const a = makeMarker({
+            schema_version: 1,
+            pull_number: 122,
+            entries: [{ number: 1 }],
+        });
+        const b = makeMarker({
+            schema_version: 1,
+            pull_number: 122,
+            entries: [{ number: 2 }],
+        });
+        expect(parseRevisionMarker([a, b], 122).entries[0].number).toBe(2);
+    });
+});
+
+describe("PrStatusCache", () => {
+    beforeEach(() => {
+        localStorage.clear();
+        jest.spyOn(Date, "now").mockImplementation(() => 1000);
+    });
+    afterEach(() => {
+        jest.restoreAllMocks();
+    });
+
+    it("returns null on cache miss", () => {
+        const cache = new PrStatusCache();
+        expect(cache.get("o", "r", 1, "abc")).toBeNull();
+    });
+
+    it("returns stored status on cache hit", () => {
+        const cache = new PrStatusCache();
+        cache.update("o", "r", 1, "abc", "open");
+        expect(cache.get("o", "r", 1, "abc")).toBe("open");
+    });
+
+    it("treats different head_sha as a miss", () => {
+        const cache = new PrStatusCache();
+        cache.update("o", "r", 1, "abc", "open");
+        expect(cache.get("o", "r", 1, "def")).toBeNull();
+    });
+
+    it("expires entries after TTL", () => {
+        const cache = new PrStatusCache(500);
+        cache.update("o", "r", 1, "abc", "open");
+        Date.now.mockImplementation(() => 1501);
+        expect(cache.get("o", "r", 1, "abc")).toBeNull();
+    });
+
+    it("returns null on corrupted entry", () => {
+        const cache = new PrStatusCache();
+        const k = cache.key("o", "r", 1, "abc");
+        localStorage.setItem(k, "not-json");
+        const errSpy = jest
+            .spyOn(console, "error")
+            .mockImplementation(() => {});
+        expect(cache.get("o", "r", 1, "abc")).toBeNull();
+        expect(errSpy).toHaveBeenCalled();
+        errSpy.mockRestore();
+    });
+
+    it("clearAll removes only entries with our prefix", () => {
+        const cache = new PrStatusCache();
+        cache.update("o", "r", 1, "h", "open");
+        cache.update("o", "r", 2, "h", "merged");
+        localStorage.setItem("unrelated_key", "keep me");
+        cache.clearAll();
+        expect(cache.get("o", "r", 1, "h")).toBeNull();
+        expect(cache.get("o", "r", 2, "h")).toBeNull();
+        expect(localStorage.getItem("unrelated_key")).toBe("keep me");
+    });
+
+    it("expires after 1h by default", () => {
+        const cache = new PrStatusCache();
+        cache.update("o", "r", 1, "h", "open");
+        // 59 minutes — still valid
+        Date.now.mockImplementation(() => 1000 + 59 * 60 * 1000);
+        expect(cache.get("o", "r", 1, "h")).toBe("open");
+        // 61 minutes — expired
+        Date.now.mockImplementation(() => 1000 + 61 * 60 * 1000);
+        expect(cache.get("o", "r", 1, "h")).toBeNull();
+    });
+});
+
+describe("fetchPrStatus", () => {
+    afterEach(() => {
+        jest.restoreAllMocks();
+    });
+
+    function mockFetchHtml(html, ok = true) {
+        global.fetch = jest.fn().mockResolvedValue({
+            ok,
+            text: () => Promise.resolve(html),
+        });
+    }
+
+    it("returns 'open' for an opened PR", async () => {
+        mockFetchHtml('<html><span data-status="pullOpened"></span></html>');
+        await expect(fetchPrStatus("o", "r", 1)).resolves.toBe("open");
+    });
+
+    it("returns 'merged' for a merged PR", async () => {
+        mockFetchHtml('<span data-status="pullMerged"></span>');
+        await expect(fetchPrStatus("o", "r", 1)).resolves.toBe("merged");
+    });
+
+    it("returns 'closed' for a closed PR", async () => {
+        mockFetchHtml('<span data-status="pullClosed"></span>');
+        await expect(fetchPrStatus("o", "r", 1)).resolves.toBe("closed");
+    });
+
+    it("returns 'draft' for a draft PR", async () => {
+        mockFetchHtml('<span data-status="draft"></span>');
+        await expect(fetchPrStatus("o", "r", 1)).resolves.toBe("draft");
+    });
+
+    it("returns 'unknown' on non-OK response", async () => {
+        mockFetchHtml("", false);
+        await expect(fetchPrStatus("o", "r", 1)).resolves.toBe("unknown");
+    });
+
+    it("returns 'unknown' on fetch error", async () => {
+        global.fetch = jest.fn().mockRejectedValue(new Error("net"));
+        await expect(fetchPrStatus("o", "r", 1)).resolves.toBe("unknown");
+    });
+});
+
+describe("gatherPrStatuses", () => {
+    beforeEach(() => {
+        // Navigate away from any PR URL left by earlier tests so that
+        // background RAF callbacks from the MutationObserver / onPageUpdate
+        // path do not trigger extra fetch() calls during the concurrency test.
+        History.prototype.pushState.call(window.history, {}, "", "/");
+    });
+    afterEach(() => {
+        jest.restoreAllMocks();
+        localStorage.clear();
+    });
+
+    it("uses cached statuses without calling fetch", async () => {
+        const cache = new PrStatusCache();
+        cache.update("o", "r", 1, "h", "open");
+        const fetchSpy = jest.fn();
+        global.fetch = fetchSpy;
+        const items = [{ org: "o", repo: "r", num: 1, head_sha: "h" }];
+        const resolved = [];
+        await gatherPrStatuses(items, cache, (item, status) => {
+            resolved.push([item.num, status]);
+        });
+        expect(fetchSpy).not.toHaveBeenCalled();
+        expect(resolved).toEqual([[1, "open"]]);
+    });
+
+    it("fetches misses, caches results, and calls onResolve", async () => {
+        const cache = new PrStatusCache();
+        global.fetch = jest.fn().mockResolvedValue({
+            ok: true,
+            text: () =>
+                Promise.resolve('<span data-status="pullMerged"></span>'),
+        });
+        const items = [{ org: "o", repo: "r", num: 2, head_sha: "h2" }];
+        const resolved = [];
+        await gatherPrStatuses(items, cache, (item, status) => {
+            resolved.push([item.num, status]);
+        });
+        expect(resolved).toEqual([[2, "merged"]]);
+        expect(cache.get("o", "r", 2, "h2")).toBe("merged");
+    });
+
+    it("respects the concurrency cap", async () => {
+        const cache = new PrStatusCache();
+        let inflight = 0;
+        let peak = 0;
+        global.fetch = jest.fn(async () => {
+            inflight += 1;
+            peak = Math.max(peak, inflight);
+            await new Promise((r) => setTimeout(r, 5));
+            inflight -= 1;
+            return {
+                ok: true,
+                text: () =>
+                    Promise.resolve('<span data-status="pullOpened"></span>'),
+            };
+        });
+        const items = Array.from({ length: 8 }, (_, i) => ({
+            org: "o",
+            repo: "r",
+            num: i,
+            head_sha: `h${i}`,
+        }));
+        await gatherPrStatuses(items, cache, () => {}, 3);
+        expect(peak).toBeLessThanOrEqual(3);
+    });
+});
+
+describe("buildContextPanel", () => {
+    function stack() {
+        return {
+            schema_version: 1,
+            stack_id: "feature/auth",
+            pulls: [
+                {
+                    number: 122,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "main",
+                    dest_branch: "feature/auth",
+                    is_current: true,
+                    title: "PR title",
+                },
+            ],
+        };
+    }
+
+    function rev() {
+        return {
+            schema_version: 1,
+            pull_number: 122,
+            entries: [
+                {
+                    number: 1,
+                    change_type: "initial",
+                    old_sha: null,
+                    new_sha: "ab12cd3",
+                    timestamp_iso: "2026-04-22T09:14:00Z",
+                    compare_url: null,
+                },
+            ],
+        };
+    }
+
+    function ctx() {
+        return { org: "o", repo: "r", number: 122 };
+    }
+
+    it("returns null when both inputs are null", () => {
+        expect(buildContextPanel(null, null, ctx())).toBeNull();
+    });
+
+    it("returns a panel with id 'mergify-context' when at least one is present", () => {
+        const el = buildContextPanel(stack(), null, ctx());
+        expect(el.id).toBe("mergify-context");
+    });
+
+    it("renders only the stack column when revision is null", () => {
+        const el = buildContextPanel(stack(), null, ctx());
+        expect(
+            el.querySelector('[data-mergify-section="stack"]'),
+        ).not.toBeNull();
+        expect(
+            el.querySelector('[data-mergify-section="revisions"]'),
+        ).toBeNull();
+    });
+
+    it("renders only the revisions column when stack is null", () => {
+        const el = buildContextPanel(null, rev(), ctx());
+        expect(el.querySelector('[data-mergify-section="stack"]')).toBeNull();
+        expect(
+            el.querySelector('[data-mergify-section="revisions"]'),
+        ).not.toBeNull();
+    });
+
+    it("renders both columns when both inputs are present", () => {
+        const el = buildContextPanel(stack(), rev(), ctx());
+        expect(
+            el.querySelector('[data-mergify-section="stack"]'),
+        ).not.toBeNull();
+        expect(
+            el.querySelector('[data-mergify-section="revisions"]'),
+        ).not.toBeNull();
+    });
+
+    it("renders stack rows in base-on-top order with current PR accent", () => {
+        const stackData = {
+            schema_version: 1,
+            stack_id: "feature/auth",
+            pulls: [
+                {
+                    number: 121,
+                    change_id: "i1",
+                    head_sha: "h1",
+                    base_branch: "main",
+                    dest_branch: "feature/auth",
+                    is_current: false,
+                    title: "Auth scaffolding",
+                },
+                {
+                    number: 122,
+                    change_id: "i2",
+                    head_sha: "h2",
+                    base_branch: "feature/auth",
+                    dest_branch: "feature/auth",
+                    is_current: true,
+                    title: "Token refresh",
+                },
+                {
+                    number: 123,
+                    change_id: "i3",
+                    head_sha: "h3",
+                    base_branch: "feature/auth",
+                    dest_branch: "feature/auth",
+                    is_current: false,
+                    title: "Logout flow",
+                },
+            ],
+        };
+        const el = buildContextPanel(stackData, null, ctx());
+        const rows = el.querySelectorAll("[data-mergify-pr-row]");
+        expect(rows).toHaveLength(3);
+        expect(rows[0].getAttribute("data-mergify-pr-row")).toBe("121");
+        expect(rows[1].getAttribute("data-mergify-pr-row")).toBe("122");
+        expect(rows[2].getAttribute("data-mergify-pr-row")).toBe("123");
+        expect(rows[1].getAttribute("data-mergify-current")).toBe("true");
+        expect(rows[0].getAttribute("data-mergify-current")).toBeNull();
+        const dot121 = el.querySelector(
+            '[data-mergify-status-dot][data-mergify-pr-num="121"]',
+        );
+        expect(dot121.getAttribute("data-mergify-head-sha")).toBe("h1");
+        const dot122 = el.querySelector(
+            '[data-mergify-status-dot][data-mergify-pr-num="122"]',
+        );
+        expect(dot122.getAttribute("data-mergify-head-sha")).toBe("h2");
+        const dot123 = el.querySelector(
+            '[data-mergify-status-dot][data-mergify-pr-num="123"]',
+        );
+        expect(dot123.getAttribute("data-mergify-head-sha")).toBe("h3");
+        // Current row uses inset box-shadow (not border-left) so its content
+        // doesn't shift right and stays aligned with non-current rows.
+        const currentRow = rows[1];
+        expect(currentRow.style.cssText).toMatch(/box-shadow:[^;]*inset/);
+        expect(currentRow.style.cssText).not.toMatch(/border-left:/);
+    });
+
+    it("section label includes the position-in-stack indicator", () => {
+        const stackData = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [
+                {
+                    number: 1,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "main",
+                    dest_branch: "x",
+                    is_current: false,
+                    title: "a",
+                },
+                {
+                    number: 2,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "x",
+                    dest_branch: "x",
+                    is_current: true,
+                    title: "b",
+                },
+                {
+                    number: 3,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "x",
+                    dest_branch: "x",
+                    is_current: false,
+                    title: "c",
+                },
+            ],
+        };
+        const el = buildContextPanel(stackData, null, {
+            org: "o",
+            repo: "r",
+            number: 2,
+        });
+        const sectionLabel = el.querySelector(
+            '[data-mergify-section="stack"] div',
+        );
+        expect(sectionLabel.textContent).toBe("STACK · 3 PRs · you are #2");
+    });
+
+    it("makes each stack row an anchor to its PR", () => {
+        const stackData = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [
+                {
+                    number: 122,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "main",
+                    dest_branch: "x",
+                    is_current: true,
+                    title: "x",
+                },
+            ],
+        };
+        const el = buildContextPanel(stackData, null, {
+            org: "o",
+            repo: "r",
+            number: 122,
+        });
+        const row = el.querySelector('[data-mergify-pr-row="122"]');
+        expect(row.tagName).toBe("A");
+        expect(row.getAttribute("href")).toBe("/o/r/pull/122");
+    });
+
+    it("renders stack rows with a status-dot placeholder by default", () => {
+        const stackData = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [
+                {
+                    number: 122,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "main",
+                    dest_branch: "x",
+                    is_current: true,
+                    title: "x",
+                },
+            ],
+        };
+        const el = buildContextPanel(stackData, null, ctx());
+        const dot = el.querySelector("[data-mergify-status-dot]");
+        expect(dot).not.toBeNull();
+        expect(dot.getAttribute("data-mergify-status")).toBe("unknown");
+    });
+
+    it("updateStackDotStatus paints the dot and label", () => {
+        const stackData = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [
+                {
+                    number: 122,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "main",
+                    dest_branch: "x",
+                    is_current: true,
+                    title: "x",
+                },
+            ],
+        };
+        const el = buildContextPanel(stackData, null, ctx());
+        updateStackDotStatus(el, 122, "merged");
+        const dot = el.querySelector("[data-mergify-status-dot]");
+        expect(dot.getAttribute("data-mergify-status")).toBe("merged");
+        const lbl = el.querySelector("[data-mergify-status-label]");
+        expect(lbl.textContent).toBe("merged");
+    });
+
+    it("renders revision dots in oldest→newest order", () => {
+        const revData = {
+            schema_version: 1,
+            pull_number: 122,
+            entries: [
+                {
+                    number: 1,
+                    change_type: "initial",
+                    old_sha: null,
+                    new_sha: "aaaaaaa",
+                    timestamp_iso: "2026-04-22T09:14:00Z",
+                    compare_url: null,
+                },
+                {
+                    number: 2,
+                    change_type: "amend",
+                    old_sha: "aaaaaaa",
+                    new_sha: "bbbbbbb",
+                    timestamp_iso: "2026-04-23T16:02:00Z",
+                    compare_url: "https://x/compare/aaaaaaa...bbbbbbb",
+                },
+            ],
+        };
+        const el = buildContextPanel(null, revData, ctx());
+        const dots = el.querySelectorAll("[data-mergify-rev-dot]");
+        expect(dots).toHaveLength(2);
+        expect(dots[0].getAttribute("data-mergify-change-type")).toBe(
+            "initial",
+        );
+        expect(dots[1].getAttribute("data-mergify-change-type")).toBe("amend");
+    });
+
+    it("links 'initial' to commit page and others to compare_url", () => {
+        const revData = {
+            schema_version: 1,
+            pull_number: 122,
+            entries: [
+                {
+                    number: 1,
+                    change_type: "initial",
+                    old_sha: null,
+                    new_sha: "aaaaaaa",
+                    timestamp_iso: "2026-04-22T09:14:00Z",
+                    compare_url: null,
+                },
+                {
+                    number: 2,
+                    change_type: "amend",
+                    old_sha: "aaaaaaa",
+                    new_sha: "bbbbbbb",
+                    timestamp_iso: "2026-04-23T16:02:00Z",
+                    compare_url: "https://x/compare/aaaaaaa...bbbbbbb",
+                },
+            ],
+        };
+        const el = buildContextPanel(null, revData, {
+            org: "o",
+            repo: "r",
+            number: 122,
+        });
+        const links = el.querySelectorAll("[data-mergify-rev-dot]");
+        expect(links[0].getAttribute("href")).toBe("/o/r/commit/aaaaaaa");
+        expect(links[1].getAttribute("href")).toBe(
+            "https://x/compare/aaaaaaa...bbbbbbb",
+        );
+        for (const a of links) expect(a.getAttribute("target")).toBe("_blank");
+    });
+
+    it("marks the latest revision with data-mergify-latest", () => {
+        const revData = {
+            schema_version: 1,
+            pull_number: 122,
+            entries: [
+                {
+                    number: 1,
+                    change_type: "initial",
+                    old_sha: null,
+                    new_sha: "a",
+                    timestamp_iso: "2026-04-22T09:14:00Z",
+                    compare_url: null,
+                },
+                {
+                    number: 2,
+                    change_type: "amend",
+                    old_sha: "a",
+                    new_sha: "b",
+                    timestamp_iso: "2026-04-23T09:14:00Z",
+                    compare_url: "u",
+                },
+            ],
+        };
+        const el = buildContextPanel(null, revData, ctx());
+        const dots = el.querySelectorAll("[data-mergify-rev-dot]");
+        expect(dots[0].getAttribute("data-mergify-latest")).toBeNull();
+        expect(dots[1].getAttribute("data-mergify-latest")).toBe("true");
+    });
+
+    it("collapses middle entries when there are more than 6", () => {
+        const entries = Array.from({ length: 8 }, (_, i) => ({
+            number: i + 1,
+            change_type: i === 0 ? "initial" : "amend",
+            old_sha: i === 0 ? null : `${i}`.repeat(7),
+            new_sha: `${i + 1}`.repeat(7),
+            timestamp_iso: `2026-04-${String(20 + i).padStart(2, "0")}T09:14:00Z`,
+            compare_url: i === 0 ? null : `u${i}`,
+        }));
+        const revData = { schema_version: 1, pull_number: 122, entries };
+        const el = buildContextPanel(null, revData, ctx());
+        const ellipsis = el.querySelector("[data-mergify-rev-ellipsis]");
+        expect(ellipsis).not.toBeNull();
+        const dots = el.querySelectorAll("[data-mergify-rev-dot]");
+        // first + entry-before-last + last two = 4 visible dots
+        expect(dots).toHaveLength(4);
+    });
+
+    it("expands the ellipsis on click", () => {
+        const entries = Array.from({ length: 8 }, (_, i) => ({
+            number: i + 1,
+            change_type: i === 0 ? "initial" : "amend",
+            old_sha: i === 0 ? null : `${i}`.repeat(7),
+            new_sha: `${i + 1}`.repeat(7),
+            timestamp_iso: `2026-04-${String(20 + i).padStart(2, "0")}T09:14:00Z`,
+            compare_url: i === 0 ? null : `u${i}`,
+        }));
+        const revData = { schema_version: 1, pull_number: 122, entries };
+        const el = buildContextPanel(null, revData, ctx());
+        const ellipsis = el.querySelector("[data-mergify-rev-ellipsis]");
+        ellipsis.click();
+        const dots = el.querySelectorAll("[data-mergify-rev-dot]");
+        expect(dots).toHaveLength(8);
+    });
+
+    it("renders 'No revisions yet' when entries is empty", () => {
+        const revData = {
+            schema_version: 1,
+            pull_number: 122,
+            entries: [],
+        };
+        const el = buildContextPanel(null, revData, ctx());
+        expect(
+            el.querySelector("[data-mergify-revisions-empty]"),
+        ).not.toBeNull();
+        expect(el.querySelectorAll("[data-mergify-rev-dot]")).toHaveLength(0);
+    });
+
+    it("revision dot anchors carry an aria-label", () => {
+        const revData = {
+            schema_version: 1,
+            pull_number: 122,
+            entries: [
+                {
+                    number: 1,
+                    change_type: "amend",
+                    old_sha: "a",
+                    new_sha: "b",
+                    timestamp_iso: "2026-04-22T09:14:00Z",
+                    compare_url: "u",
+                },
+            ],
+        };
+        const el = buildContextPanel(null, revData, ctx());
+        const dot = el.querySelector("[data-mergify-rev-dot]");
+        expect(dot.getAttribute("aria-label")).toMatch(/Revision 1 \(amend\)/);
+    });
+
+    it("renders the reason inline under the dot whenever it is set", () => {
+        const revData = {
+            schema_version: 1,
+            pull_number: 122,
+            entries: [
+                {
+                    number: 1,
+                    change_type: "rebase",
+                    old_sha: "a",
+                    new_sha: "b",
+                    timestamp_iso: "2026-04-22T09:14:00Z",
+                    compare_url: "u",
+                    reason: "rebased onto main",
+                },
+                {
+                    number: 2,
+                    change_type: "unknown",
+                    old_sha: "b",
+                    new_sha: "c",
+                    timestamp_iso: "2026-04-23T09:14:00Z",
+                    compare_url: "u",
+                    reason: "follow-up after review",
+                },
+                {
+                    number: 3,
+                    change_type: "amend",
+                    old_sha: "c",
+                    new_sha: "d",
+                    timestamp_iso: "2026-04-24T09:14:00Z",
+                    compare_url: "u",
+                    reason: null,
+                },
+            ],
+        };
+        const el = buildContextPanel(null, revData, ctx());
+        const reasons = el.querySelectorAll("[data-mergify-rev-reason]");
+        // Exactly the two entries with non-null reasons render the label.
+        expect(reasons).toHaveLength(2);
+        expect(reasons[0].textContent).toBe("rebased onto main");
+        expect(reasons[1].textContent).toBe("follow-up after review");
+        // Tooltip on the parent anchor matches the reason for accessibility.
+        const dots = el.querySelectorAll("[data-mergify-rev-dot]");
+        expect(dots[0].getAttribute("title")).toBe("rebased onto main");
+        expect(dots[2].hasAttribute("title")).toBe(false);
+    });
+
+    it("squashes consecutive rebase entries into one dot", () => {
+        const revData = {
+            schema_version: 1,
+            pull_number: 122,
+            entries: [
+                {
+                    number: 1,
+                    change_type: "initial",
+                    old_sha: null,
+                    new_sha: "aaaaaaa",
+                    timestamp_iso: "2026-04-22T09:00:00Z",
+                    compare_url: null,
+                },
+                {
+                    number: 2,
+                    change_type: "rebase",
+                    old_sha: "aaaaaaa",
+                    new_sha: "bbbbbbb",
+                    timestamp_iso: "2026-04-22T10:00:00Z",
+                    compare_url: "u2",
+                },
+                {
+                    number: 3,
+                    change_type: "rebase",
+                    old_sha: "bbbbbbb",
+                    new_sha: "ccccccc",
+                    timestamp_iso: "2026-04-22T11:00:00Z",
+                    compare_url: "u3",
+                },
+                {
+                    number: 4,
+                    change_type: "rebase",
+                    old_sha: "ccccccc",
+                    new_sha: "ddddddd",
+                    timestamp_iso: "2026-04-22T12:00:00Z",
+                    compare_url: "u4",
+                },
+            ],
+        };
+        const el = buildContextPanel(null, revData, {
+            org: "o",
+            repo: "r",
+            number: 122,
+        });
+        const dots = el.querySelectorAll("[data-mergify-rev-dot]");
+        // initial + one squashed-rebase = 2 dots
+        expect(dots).toHaveLength(2);
+        const squashed = dots[1];
+        expect(squashed.getAttribute("data-mergify-change-type")).toBe(
+            "rebase",
+        );
+        expect(squashed.getAttribute("data-mergify-rebase-run")).toBe("3");
+        // Compare URL should span the whole run: aaaaaaa -> ddddddd
+        expect(squashed.getAttribute("href")).toBe(
+            "/o/r/compare/aaaaaaa...ddddddd",
+        );
+        // Latest dot wears the halo regardless of squashing.
+        expect(squashed.getAttribute("data-mergify-latest")).toBe("true");
+    });
+
+    it("does not squash rebase entries separated by an amend", () => {
+        const revData = {
+            schema_version: 1,
+            pull_number: 122,
+            entries: [
+                {
+                    number: 1,
+                    change_type: "rebase",
+                    old_sha: "a",
+                    new_sha: "b",
+                    timestamp_iso: "2026-04-22T09:00:00Z",
+                    compare_url: "u1",
+                },
+                {
+                    number: 2,
+                    change_type: "amend",
+                    old_sha: "b",
+                    new_sha: "c",
+                    timestamp_iso: "2026-04-22T10:00:00Z",
+                    compare_url: "u2",
+                },
+                {
+                    number: 3,
+                    change_type: "rebase",
+                    old_sha: "c",
+                    new_sha: "d",
+                    timestamp_iso: "2026-04-22T11:00:00Z",
+                    compare_url: "u3",
+                },
+            ],
+        };
+        const el = buildContextPanel(null, revData, ctx());
+        const dots = el.querySelectorAll("[data-mergify-rev-dot]");
+        expect(dots).toHaveLength(3);
+        for (const dot of dots) {
+            expect(dot.getAttribute("data-mergify-rebase-run")).toBeNull();
+        }
+    });
+
+    it("produces a stable data-mergify-hash across rebuilds with equal inputs", () => {
+        const a = buildContextPanel(stack(), rev(), ctx());
+        const b = buildContextPanel(stack(), rev(), ctx());
+        expect(a.getAttribute("data-mergify-hash")).toBe(
+            b.getAttribute("data-mergify-hash"),
+        );
+    });
+});
+
+describe("injectContextPanel", () => {
+    afterEach(() => {
+        document.body.innerHTML = "";
+    });
+
+    function makePanel(hash = "abc") {
+        const p = document.createElement("div");
+        p.id = "mergify-context";
+        p.setAttribute("data-mergify-hash", hash);
+        return p;
+    }
+
+    it("inserts the panel into the conversation target", () => {
+        document.body.innerHTML =
+            '<div id="discussion_bucket"><div></div></div>';
+        injectContextPanel(makePanel());
+        const dom = document.querySelector(
+            "#discussion_bucket #mergify-context",
+        );
+        expect(dom).not.toBeNull();
+    });
+
+    it("skips re-rendering when the hash matches", () => {
+        document.body.innerHTML = '<div id="discussion_bucket"></div>';
+        injectContextPanel(makePanel("h1"));
+        const first = document.querySelector("#mergify-context");
+        injectContextPanel(makePanel("h1"));
+        const after = document.querySelector("#mergify-context");
+        expect(after).toBe(first);
+    });
+
+    it("rebuilds when the hash differs", () => {
+        document.body.innerHTML = '<div id="discussion_bucket"></div>';
+        injectContextPanel(makePanel("h1"));
+        const first = document.querySelector("#mergify-context");
+        injectContextPanel(makePanel("h2"));
+        const after = document.querySelector("#mergify-context");
+        expect(after).not.toBe(first);
+        expect(after.getAttribute("data-mergify-hash")).toBe("h2");
+    });
+
+    it("no-ops when no acceptable target exists", () => {
+        document.body.innerHTML = "<div></div>";
+        injectContextPanel(makePanel());
+        expect(document.querySelector("#mergify-context")).toBeNull();
+    });
+});
+
+describe("renderMergifyContext", () => {
+    beforeEach(() => {
+        History.prototype.pushState.call(window.history, {}, "", "/");
+        clearCommentsCache();
+    });
+
+    afterEach(() => {
+        document.body.innerHTML = "";
+        jest.restoreAllMocks();
+        clearCommentsCache();
+    });
+
+    // Sets up the page DOM so findMergifyCommentIds picks up our fake
+    // comments, and mocks fetch to handle the two URL patterns we hit:
+    //   - /<org>/<repo>/issue_comments/<id>/edit_form → textarea HTML with raw body
+    //   - /<org>/<repo>/pull/<n>                      → HTML with data-status span
+    function mockFetch({
+        commentBodies = [],
+        statusHtml = "",
+        currentPrStatus = null,
+    } = {}) {
+        const visibleText = (body) =>
+            /revision-data/i.test(body) ? "Revision history" : "Mergify stack";
+        let html = '<div id="discussion_bucket"></div>';
+        if (currentPrStatus) {
+            html += `<span data-status="${currentPrStatus}"></span>`;
+        }
+        html += commentBodies
+            .map(
+                (body, i) =>
+                    '<div class="TimelineItem">' +
+                    `<div id="issuecomment-${i + 1}"></div>` +
+                    `<div class="comment-body">${visibleText(body)}</div>` +
+                    "</div>",
+            )
+            .join("");
+        document.body.innerHTML = html;
+
+        global.fetch = jest.fn((url) => {
+            if (typeof url === "string") {
+                const m = url.match(/\/issue_comments\/(\d+)\/edit_form$/);
+                if (m) {
+                    const idx = Number.parseInt(m[1], 10) - 1;
+                    const body = commentBodies[idx] ?? "";
+                    const escaped = body
+                        .replace(/&/g, "&amp;")
+                        .replace(/</g, "&lt;")
+                        .replace(/>/g, "&gt;");
+                    return Promise.resolve({
+                        ok: true,
+                        text: () =>
+                            Promise.resolve(
+                                `<html><body><textarea>${escaped}</textarea></body></html>`,
+                            ),
+                    });
+                }
+            }
+            return Promise.resolve({
+                ok: true,
+                text: () => Promise.resolve(statusHtml),
+            });
+        });
+    }
+
+    it("renders the panel when a stack marker is present", async () => {
+        const stackPayload = {
+            schema_version: 1,
+            stack_id: "feature/auth",
+            pulls: [
+                {
+                    number: 122,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "main",
+                    dest_branch: "feature/auth",
+                    is_current: true,
+                },
+            ],
+        };
+        const stackBody =
+            "Stack:\n" +
+            "| 0 | Token refresh | [#122](https://x/122) | 👈 |\n" +
+            `<!-- mergify-stack-data: ${JSON.stringify(stackPayload)} -->`;
+        mockFetch({
+            commentBodies: [stackBody],
+            statusHtml: '<span data-status="pullOpened"></span>',
+        });
+        await renderMergifyContext({ org: "o", repo: "r", number: 122 });
+        const panel = document.querySelector("#mergify-context");
+        expect(panel).not.toBeNull();
+        expect(
+            panel.querySelector('[data-mergify-pr-row="122"]'),
+        ).not.toBeNull();
+    });
+
+    it("does not render when no Mergify-looking comment is present", async () => {
+        // Empty commentBodies → no candidate IDs → no fetches → no panel.
+        mockFetch({ commentBodies: [] });
+        await renderMergifyContext({ org: "o", repo: "r", number: 122 });
+        expect(document.querySelector("#mergify-context")).toBeNull();
+    });
+
+    it("writes the current PR's live status into PrStatusCache", async () => {
+        // Seed cache with a stale value the user couldn't have seen
+        const cache = new PrStatusCache();
+        cache.update("o", "r", 122, "h", "draft");
+        expect(cache.get("o", "r", 122, "h")).toBe("draft");
+
+        const stackPayload = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [
+                {
+                    number: 122,
+                    change_id: "i",
+                    head_sha: "h",
+                    base_branch: "main",
+                    dest_branch: "x",
+                    is_current: true,
+                },
+            ],
+        };
+        const stackBody =
+            "Stack:\n" +
+            "| 0 | T | [#122](https://x/122) | 👈 |\n" +
+            `<!-- mergify-stack-data: ${JSON.stringify(stackPayload)} -->`;
+        mockFetch({
+            commentBodies: [stackBody],
+            currentPrStatus: "pullOpened",
+        });
+        await renderMergifyContext({ org: "o", repo: "r", number: 122 });
+        // The stale "draft" entry must have been overwritten by the live "open".
+        expect(cache.get("o", "r", 122, "h")).toBe("open");
+    });
+
+    it("does not render when edit_form fetches fail", async () => {
+        // Set up a candidate comment in the DOM so an ID is found, but make
+        // the edit_form fetch return 404 (e.g., comment was deleted, or
+        // the user lacks read access). Result: no body collected, no panel.
+        document.body.innerHTML =
+            '<div id="discussion_bucket"></div>' +
+            '<div class="TimelineItem">' +
+            '<div id="issuecomment-1"></div>' +
+            '<div class="comment-body">Mergify stack</div>' +
+            "</div>";
+        global.fetch = jest.fn(() =>
+            Promise.resolve({ ok: false, status: 404 }),
+        );
+        await renderMergifyContext({ org: "o", repo: "r", number: 122 });
+        expect(document.querySelector("#mergify-context")).toBeNull();
+    });
+
+    it("resetQueueState removes any existing #mergify-context panel", () => {
+        document.body.innerHTML =
+            '<div id="discussion_bucket"><div id="mergify-context"></div></div>';
+        resetQueueState();
+        expect(document.querySelector("#mergify-context")).toBeNull();
+    });
+
+    it("does not paint stale-PR statuses onto a re-rendered panel", async () => {
+        const stackPayloadA = {
+            schema_version: 1,
+            stack_id: "a",
+            pulls: [
+                {
+                    number: 1,
+                    change_id: "i1",
+                    head_sha: "h1",
+                    base_branch: "main",
+                    dest_branch: "a",
+                    is_current: true,
+                },
+                {
+                    number: 2,
+                    change_id: "i2",
+                    head_sha: "h2",
+                    base_branch: "a",
+                    dest_branch: "a",
+                    is_current: false,
+                },
+            ],
+        };
+        const stackBodyA =
+            "Stack:\n" +
+            "| 0 | A1 | [#1](https://x/1) | 👈 |\n" +
+            "| 1 | A2 | [#2](https://x/2) |  |\n" +
+            `<!-- mergify-stack-data: ${JSON.stringify(stackPayloadA)} -->`;
+        // Mount the first PR's DOM, then mock fetch with a slow status response
+        // so we can navigate before it resolves.
+        let resolveStatusFetch;
+        document.body.innerHTML =
+            '<div id="discussion_bucket"></div>' +
+            '<div class="TimelineItem">' +
+            '<div id="issuecomment-1"></div>' +
+            '<div class="comment-body">Mergify stack</div>' +
+            "</div>";
+        const escapedA = stackBodyA
+            .replace(/&/g, "&amp;")
+            .replace(/</g, "&lt;")
+            .replace(/>/g, "&gt;");
+        global.fetch = jest.fn((url) => {
+            if (
+                typeof url === "string" &&
+                /\/issue_comments\/\d+\/edit_form$/.test(url)
+            ) {
+                return Promise.resolve({
+                    ok: true,
+                    text: () =>
+                        Promise.resolve(
+                            `<html><body><textarea>${escapedA}</textarea></body></html>`,
+                        ),
+                });
+            }
+            return new Promise((res) => {
+                resolveStatusFetch = () =>
+                    res({
+                        ok: true,
+                        text: () =>
+                            Promise.resolve(
+                                '<span data-status="pullMerged"></span>',
+                            ),
+                    });
+            });
+        });
+        const renderPromise = renderMergifyContext({
+            org: "o",
+            repo: "r",
+            number: 1,
+        });
+        // Wait so the panel mounts before we simulate navigation.
+        await Promise.resolve();
+        await Promise.resolve();
+        resetQueueState();
+        // Now mount the second PR's DOM and mock fetch for it.
+        const stackPayloadB = {
+            schema_version: 1,
+            stack_id: "b",
+            pulls: [
+                {
+                    number: 5,
+                    change_id: "i",
+                    head_sha: "hb",
+                    base_branch: "main",
+                    dest_branch: "b",
+                    is_current: true,
+                },
+            ],
+        };
+        const stackBodyB =
+            "Stack:\n" +
+            "| 0 | B1 | [#5](https://x/5) | 👈 |\n" +
+            `<!-- mergify-stack-data: ${JSON.stringify(stackPayloadB)} -->`;
+        mockFetch({ commentBodies: [stackBodyB] });
+        await renderMergifyContext({ org: "o", repo: "r", number: 5 });
+        // Resolve the stale fetch from the first render.
+        if (resolveStatusFetch) resolveStatusFetch();
+        await renderPromise.catch(() => {});
+        const dot = document.querySelector(
+            '[data-mergify-status-dot][data-mergify-pr-num="5"]',
+        );
+        expect(dot.getAttribute("data-mergify-status")).not.toBe("merged");
+    });
+});
+
+describe("buildStackNav", () => {
+    function pull(number, opts = {}) {
+        return {
+            number,
+            change_id: `i${number}`,
+            head_sha: `h${number}`,
+            base_branch: "main",
+            dest_branch: "x",
+            is_current: opts.is_current || false,
+            title: opts.title || `Title ${number}`,
+        };
+    }
+    function stackOf(...pulls) {
+        return { schema_version: 1, stack_id: "x", pulls };
+    }
+    function ctx(num) {
+        return { org: "o", repo: "r", number: num };
+    }
+
+    it("returns null when stack has fewer than 2 PRs", () => {
+        const single = stackOf(pull(1, { is_current: true }));
+        expect(buildStackNav(single, ctx(1))).toBeNull();
+    });
+
+    it("returns null when stackData is null", () => {
+        expect(buildStackNav(null, ctx(1))).toBeNull();
+    });
+
+    it("returns null when current PR is not in the stack", () => {
+        const stack = stackOf(pull(1), pull(2));
+        expect(buildStackNav(stack, ctx(99))).toBeNull();
+    });
+
+    it("renders prev and next halves when in the middle", () => {
+        const stack = stackOf(pull(1), pull(2, { is_current: true }), pull(3));
+        const el = buildStackNav(stack, ctx(2));
+        expect(el.id).toBe("mergify-stack-nav");
+        const prev = el.querySelector('[data-mergify-stack-nav="prev"]');
+        const next = el.querySelector('[data-mergify-stack-nav="next"]');
+        expect(prev.getAttribute("href")).toBe("/o/r/pull/1");
+        expect(prev.getAttribute("data-mergify-stack-nav-num")).toBe("1");
+        expect(next.getAttribute("href")).toBe("/o/r/pull/3");
+        expect(next.getAttribute("data-mergify-stack-nav-num")).toBe("3");
+    });
+
+    it("middle label shows position-in-stack as N/M", () => {
+        const stack = stackOf(
+            pull(1),
+            pull(2, { is_current: true }),
+            pull(3),
+            pull(4),
+            pull(5),
+        );
+        const el = buildStackNav(stack, ctx(2));
+        // The middle label sits between prev and next, exposing the position.
+        const labels = Array.from(el.children).map((c) => c.textContent);
+        expect(labels.some((t) => t === "STACK 2/5")).toBe(true);
+    });
+
+    it("mutes prev when at the base of the stack", () => {
+        const stack = stackOf(pull(1, { is_current: true }), pull(2));
+        const el = buildStackNav(stack, ctx(1));
+        expect(el.querySelector('[data-mergify-stack-nav="prev"]')).toBeNull();
+        expect(
+            el.querySelector('[data-mergify-stack-nav="prev-empty"]'),
+        ).not.toBeNull();
+        expect(
+            el.querySelector('[data-mergify-stack-nav="next"]'),
+        ).not.toBeNull();
+    });
+
+    it("mutes next when at the tip of the stack", () => {
+        const stack = stackOf(pull(1), pull(2, { is_current: true }));
+        const el = buildStackNav(stack, ctx(2));
+        expect(
+            el.querySelector('[data-mergify-stack-nav="prev"]'),
+        ).not.toBeNull();
+        expect(el.querySelector('[data-mergify-stack-nav="next"]')).toBeNull();
+        expect(
+            el.querySelector('[data-mergify-stack-nav="next-empty"]'),
+        ).not.toBeNull();
+    });
+});
+
+describe("injectStackNav", () => {
+    afterEach(() => {
+        document.body.innerHTML = "";
+    });
+
+    function pull(number, opts = {}) {
+        return {
+            number,
+            change_id: `i${number}`,
+            head_sha: `h${number}`,
+            base_branch: "main",
+            dest_branch: "x",
+            is_current: opts.is_current || false,
+            title: opts.title || `Title ${number}`,
+        };
+    }
+
+    function makeStickyHtml() {
+        return '<section class="use-sticky-header-module__stickyHeader__abc PullRequestFilesToolbar-module__toolbar__def"></section>';
+    }
+
+    it("appends the nav as a child of the sticky toolbar and forces flex-wrap", () => {
+        document.body.innerHTML = makeStickyHtml();
+        const stack = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [pull(1, { is_current: true }), pull(2)],
+        };
+        injectStackNav(stack, { org: "o", repo: "r", number: 1 });
+        const nav = document.querySelector("#mergify-stack-nav");
+        expect(nav).not.toBeNull();
+        const sticky = document.querySelector(
+            '[class*="use-sticky-header-module__stickyHeader"]',
+        );
+        expect(nav.parentElement).toBe(sticky);
+        expect(sticky.style.flexWrap).toBe("wrap");
+    });
+
+    it("ignores the stickyHeaderActivationThreshold sentinel", () => {
+        // The threshold sentinel is a 1px marker that we must NOT inject into.
+        document.body.innerHTML =
+            '<div class="PullRequestFilesToolbar-module__stickyHeaderActivationThreshold__nWqbQ"></div>' +
+            makeStickyHtml();
+        const stack = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [pull(1, { is_current: true }), pull(2)],
+        };
+        injectStackNav(stack, { org: "o", repo: "r", number: 1 });
+        const nav = document.querySelector("#mergify-stack-nav");
+        expect(nav.parentElement.className).toMatch(
+            /use-sticky-header-module__stickyHeader/,
+        );
+    });
+
+    it("is idempotent — replaces existing nav when called again", () => {
+        document.body.innerHTML = makeStickyHtml();
+        const stack = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [pull(1, { is_current: true }), pull(2)],
+        };
+        injectStackNav(stack, { org: "o", repo: "r", number: 1 });
+        injectStackNav(stack, { org: "o", repo: "r", number: 1 });
+        expect(document.querySelectorAll("#mergify-stack-nav").length).toBe(1);
+    });
+
+    it("removes the nav when stackData becomes null", () => {
+        document.body.innerHTML =
+            '<section class="use-sticky-header-module__stickyHeader__abc">' +
+            '<div id="mergify-stack-nav"></div>' +
+            "</section>";
+        injectStackNav(null, { org: "o", repo: "r", number: 1 });
+        expect(document.querySelector("#mergify-stack-nav")).toBeNull();
+    });
+
+    it("no-ops when no sticky target is found", () => {
+        document.body.innerHTML = "<div></div>";
+        const stack = {
+            schema_version: 1,
+            stack_id: "x",
+            pulls: [pull(1, { is_current: true }), pull(2)],
+        };
+        injectStackNav(stack, { org: "o", repo: "r", number: 1 });
+        expect(document.querySelector("#mergify-stack-nav")).toBeNull();
+    });
+});
diff --git a/src/mergify.js b/src/mergify.js
index a65c2f0..56c67e4 100644
--- a/src/mergify.js
+++ b/src/mergify.js
@@ -66,7 +66,113 @@ function formatLocalTime(date) {
     return LOCAL_TIME_FORMATTER.format(date);
 }
 
-// Whether a comment container belongs to the Mergify bot.
+const STACK_MARKER_PREFIX = "<!-- mergify-stack-data: ";
+const REVISION_MARKER_PREFIX = "<!-- mergify-revision-data: ";
+const MARKER_SUFFIX = " -->";
+
+function extractMarkerJson(body, prefix) {
+    const results = [];
+    let idx = 0;
+    while (true) {
+        const start = body.indexOf(prefix, idx);
+        if (start === -1) break;
+        const jsonStart = start + prefix.length;
+        const end = body.indexOf(MARKER_SUFFIX, jsonStart);
+        if (end === -1) break;
+        results.push(body.slice(jsonStart, end));
+        idx = end + MARKER_SUFFIX.length;
+    }
+    return results;
+}
+
+const STACK_TITLE_ROW_RE = /^\| \d+ \| (.+?) \| \[#(\d+)\]\([^)]+\) \|/gm;
+
+function extractStackTitles(body) {
+    const titles = {};
+    for (const match of body.matchAll(STACK_TITLE_ROW_RE)) {
+        const title = match[1].replace(/\\\|/g, "|").trim();
+        titles[Number.parseInt(match[2], 10)] = title;
+    }
+    return titles;
+}
+
+// Extract the per-row reason ("note") from the rendered revision-history
+// markdown table. The JSON marker doesn't include reasons, but mergify-cli
+// emits them in the 5-column markdown form: | # | Type | Changes | Reason | Date |
+// Returns { [number]: reason } only for entries whose reason cell is non-empty.
+function extractRevisionRowReasons(body) {
+    const out = {};
+    for (const line of body.split("\n")) {
+        if (!line.startsWith("| ")) continue;
+        if (/^\|\s*-+/.test(line)) continue;
+        const cells = line
+            .split(/\s*\|\s*/)
+            .slice(1, -1)
+            .map((s) => s.trim());
+        if (cells.length !== 5) continue;
+        const num = Number.parseInt(cells[0], 10);
+        if (Number.isNaN(num)) continue;
+        if (cells[3]) out[num] = cells[3];
+    }
+    return out;
+}
+
+function parseStackMarker(commentBodies, pullNumber) {
+    let latest = null;
+    for (const body of commentBodies) {
+        for (const raw of extractMarkerJson(body, STACK_MARKER_PREFIX)) {
+            try {
+                const parsed = JSON.parse(raw);
+                if (parsed.schema_version !== 1) continue;
+                // Each PR in a stack has its own stack comment; the only
+                // difference is which entry has is_current=true. If the marker
+                // doesn't mark *this* PR as current, we fetched the wrong
+                // comment (e.g. SPA navigation grabbed a stale DOM ID). Reject
+                // it and let the next tick try again with a settled DOM.
+                const matchesCurrent = parsed.pulls?.some(
+                    (p) => p.is_current && p.number === pullNumber,
+                );
+                if (!matchesCurrent) continue;
+                const titles = extractStackTitles(body);
+                latest = {
+                    ...parsed,
+                    pulls: parsed.pulls.map((p) => ({
+                        ...p,
+                        title: titles[p.number] || `PR #${p.number}`,
+                    })),
+                };
+            } catch (_e) {
+                debug("parseStackMarker: failed to parse marker JSON", _e);
+            }
+        }
+    }
+    return latest;
+}
+
+function parseRevisionMarker(commentBodies, pullNumber) {
+    let latest = null;
+    for (const body of commentBodies) {
+        for (const raw of extractMarkerJson(body, REVISION_MARKER_PREFIX)) {
+            try {
+                const parsed = JSON.parse(raw);
+                if (parsed.schema_version !== 1) continue;
+                if (parsed.pull_number !== pullNumber) continue;
+                const reasons = extractRevisionRowReasons(body);
+                latest = {
+                    ...parsed,
+                    entries: parsed.entries.map((e) => ({
+                        ...e,
+                        reason: reasons[e.number] || null,
+                    })),
+                };
+            } catch (_e) {
+                debug("parseRevisionMarker: failed to parse marker JSON", _e);
+            }
+        }
+    }
+    return latest;
+}
+
 function isMergifyBotComment(container) {
     const authorLink = container.querySelector(
         'a.author[href="/apps/mergify"]',
@@ -81,6 +187,88 @@ function isMergifyBotComment(container) {
     return false;
 }
 
+// GitHub's markdown renderer strips HTML comments from rendered .comment-body
+// nodes, so the JSON markers (which live inside `<!-- ... -->`) never reach
+// the DOM. We can't read them from .comment-body. The unauthenticated
+// api.github.com REST API works for public repos but 404s on private ones,
+// so we use the github.com web's per-comment edit_form endpoint instead:
+// it's authenticated by the user's session cookie, returns the raw markdown
+// inside a <textarea>, and works on any repo the user can read. To keep
+// fetch volume down, we only hit comments whose visible text suggests they
+// were posted by mergify-cli (Mergify stack / Revision history).
+// Cache by comment ID (not by PR) so SPA navigations between PRs in the same
+// stack don't poison a per-PR entry with stale DOM contents seen mid-React-
+// reconciliation. The DOM scan for IDs runs every call (cheap); only the
+// fetch is cached.
+const COMMENTS_CACHE_TTL_MS = 5 * 60 * 1000;
+const COMMENT_FETCH_CONCURRENCY = 4;
+const _commentBodyCache = new Map();
+
+function clearCommentsCache() {
+    _commentBodyCache.clear();
+}
+
+function findMergifyCommentIds() {
+    const ids = new Set();
+    const containers = document.querySelectorAll(
+        ".TimelineItem, .js-comment-container, .timeline-comment",
+    );
+    for (const c of containers) {
+        const body = c.querySelector(".comment-body");
+        if (!body) continue;
+        const text = body.textContent || "";
+        if (!/Mergify stack|Revision history/i.test(text)) continue;
+        const idEl = c.querySelector('[id^="issuecomment-"]');
+        const m = idEl?.id?.match(/issuecomment-(\d+)/);
+        if (m) ids.add(m[1]);
+    }
+    return [...ids];
+}
+
+async function fetchCommentBodyMarkdown(org, repo, commentId) {
+    try {
+        const r = await fetch(
+            `/${org}/${repo}/issue_comments/${commentId}/edit_form`,
+        );
+        if (!r.ok) return null;
+        const html = await r.text();
+        const doc = new DOMParser().parseFromString(html, "text/html");
+        const ta = doc.querySelector("textarea");
+        return ta ? ta.value || ta.textContent || "" : null;
+    } catch (e) {
+        debug("fetchCommentBodyMarkdown failed", e);
+        return null;
+    }
+}
+
+async function fetchCommentBodies(org, repo, _prNumber) {
+    const ids = findMergifyCommentIds();
+    if (ids.length === 0) return [];
+    const bodies = [];
+    const queue = ids.slice();
+    const workerCount = Math.min(COMMENT_FETCH_CONCURRENCY, queue.length);
+    const workers = Array.from({ length: workerCount }, async () => {
+        while (queue.length > 0) {
+            const id = queue.shift();
+            const cached = _commentBodyCache.get(id);
+            if (
+                cached &&
+                Date.now() - cached.timestamp < COMMENTS_CACHE_TTL_MS
+            ) {
+                bodies.push(cached.body);
+                continue;
+            }
+            const body = await fetchCommentBodyMarkdown(org, repo, id);
+            if (body) {
+                _commentBodyCache.set(id, { body, timestamp: Date.now() });
+                bodies.push(body);
+            }
+        }
+    });
+    await Promise.all(workers);
+    return bodies;
+}
+
 // Replaces UTC timestamps in Mergify comments with local times.
 function convertMergifyTimestamps() {
     const codeElements = document.querySelectorAll(
@@ -215,11 +403,18 @@ function isMergifyQueueCheckQueued(text) {
 let lastKnownQueueState = false;
 let queueStateInitialized = false;
 let lastPullRequestUrl = null;
+let _contextRenderGeneration = 0;
 
 function resetQueueState() {
     lastKnownQueueState = false;
     queueStateInitialized = false;
     lastPullRequestUrl = null;
+    _contextRenderGeneration += 1;
+    clearCommentsCache();
+    const panel = document.querySelector("#mergify-context");
+    if (panel) panel.remove();
+    const nav = document.querySelector("#mergify-stack-nav");
+    if (nav) nav.remove();
     if (queuePollTimer) {
         clearTimeout(queuePollTimer);
         queuePollTimer = null;
@@ -626,18 +821,25 @@ async function _tryInject() {
         lastPullRequestUrl = currentUrl;
     }
 
-    const existingRow = document.querySelector("#mergify");
-    if (existingRow) {
-        updateMergifyRow(existingRow);
-        return;
-    }
-
     const hasMergifyConfiguration = await getMergifyConfigurationStatus();
     if (!isMergifyEnabledOnTheRepo(hasMergifyConfiguration)) {
         debug("Mergify is not enabled on the repo");
         return;
     }
 
+    const _data = getPullRequestData();
+    await renderMergifyContext({
+        org: _data.org,
+        repo: _data.repo,
+        number: Number.parseInt(_data.pull, 10),
+    });
+
+    const existingRow = document.querySelector("#mergify");
+    if (existingRow) {
+        updateMergifyRow(existingRow);
+        return;
+    }
+
     // Fetch queue state before first render
     if (!queueStateInitialized) {
         queueStateInitialized = true;
@@ -814,6 +1016,71 @@ class MergifyCache {
     }
 }
 
+class PrStatusCache {
+    constructor(expirationMs = 60 * 60 * 1000) {
+        this.PREFIX = "mergify_browser_extension_pr_status";
+        this.expirationMs = expirationMs;
+    }
+
+    key(org, repo, num, headSha) {
+        return `${this.PREFIX}_${org}_${repo}_${num}_${headSha}`;
+    }
+
+    get(org, repo, num, headSha) {
+        const k = this.key(org, repo, num, headSha);
+        try {
+            const raw = localStorage.getItem(k);
+            if (!raw) return null;
+            const data = JSON.parse(raw);
+            if (Date.now() - data.timestamp > this.expirationMs) {
+                localStorage.removeItem(k);
+                return null;
+            }
+            return data.status;
+        } catch (e) {
+            console.error("PrStatusCache get failed:", e);
+            return null;
+        }
+    }
+
+    update(org, repo, num, headSha, status) {
+        const k = this.key(org, repo, num, headSha);
+        try {
+            localStorage.setItem(
+                k,
+                JSON.stringify({ status, timestamp: Date.now() }),
+            );
+        } catch (e) {
+            console.error("PrStatusCache update failed:", e);
+        }
+    }
+
+    clearAll() {
+        try {
+            const keys = [];
+            for (let i = 0; i < localStorage.length; i++) {
+                const k = localStorage.key(i);
+                if (k?.startsWith(this.PREFIX)) keys.push(k);
+            }
+            for (const k of keys) localStorage.removeItem(k);
+        } catch (e) {
+            console.error("PrStatusCache clearAll failed:", e);
+        }
+    }
+}
+
+// Clear cached PR statuses on a page reload (covers force-reload too —
+// browsers don't expose hard-vs-soft reload to JS, so we treat any reload
+// the same way). Normal SPA navigations stay cached.
+try {
+    const navType = performance.getEntriesByType?.("navigation")?.[0]?.type;
+    if (navType === "reload") {
+        new PrStatusCache().clearAll();
+    }
+} catch (_e) {
+    // Best effort.
+}
+
 // Coalesces rapid-fire calls (e.g. from MutationObserver) into a single update per frame.
 let pageUpdateScheduled = false;
 function onPageUpdate() {
@@ -853,10 +1120,673 @@ function onPageUpdate() {
     });
 })();
 
+const PR_STATUS_SELECTORS = [
+    { selector: 'span[data-status="draft"]', status: "draft" },
+    { selector: 'span[data-status="pullOpened"]', status: "open" },
+    { selector: 'span[data-status="pullMerged"]', status: "merged" },
+    { selector: 'span[data-status="pullClosed"]', status: "closed" },
+];
+
+function readPrStatusFromDocument(scope) {
+    for (const { selector, status } of PR_STATUS_SELECTORS) {
+        if (scope.querySelector(selector)) return status;
+    }
+    return null;
+}
+
+async function fetchPrStatus(org, repo, num) {
+    try {
+        const r = await fetch(`/${org}/${repo}/pull/${num}`);
+        if (!r.ok) return "unknown";
+        const html = await r.text();
+        const doc = new DOMParser().parseFromString(html, "text/html");
+        return readPrStatusFromDocument(doc) || "unknown";
+    } catch (_e) {
+        return "unknown";
+    }
+}
+
+async function gatherPrStatuses(items, cache, onResolve, concurrency = 4) {
+    const queue = items.slice();
+    const workerCount = Math.min(concurrency, queue.length);
+    const workers = Array.from({ length: workerCount }, async () => {
+        while (queue.length > 0) {
+            const item = queue.shift();
+            const cached = cache.get(
+                item.org,
+                item.repo,
+                item.num,
+                item.head_sha,
+            );
+            if (cached !== null) {
+                onResolve(item, cached);
+                continue;
+            }
+            const status = await fetchPrStatus(item.org, item.repo, item.num);
+            // Don't cache "unknown" — it usually means a transient fetch
+            // failure, and we want the next tick to retry rather than serve
+            // gray for the full TTL.
+            if (status !== "unknown") {
+                cache.update(
+                    item.org,
+                    item.repo,
+                    item.num,
+                    item.head_sha,
+                    status,
+                );
+            }
+            onResolve(item, status);
+        }
+    });
+    await Promise.all(workers);
+}
+
+function buildStackColumn(stackData, revisionData, currentPull) {
+    const col = document.createElement("div");
+    col.setAttribute("data-mergify-section", "stack");
+    col.style.cssText = revisionData
+        ? "padding:10px 14px;border-bottom:1px solid var(--borderColor-default, #30363d);"
+        : "padding:10px 14px;";
+
+    const sectionLabel = document.createElement("div");
+    sectionLabel.style.cssText =
+        "color:var(--fgColor-muted, #7d8590);font-weight:600;" +
+        "text-transform:uppercase;font-size:10px;letter-spacing:0.5px;" +
+        "margin-bottom:6px;";
+    const currentIdx = stackData.pulls.findIndex(
+        (p) => p.number === currentPull.number,
+    );
+    sectionLabel.textContent =
+        currentIdx >= 0
+            ? `STACK · ${stackData.pulls.length} PRs · you are #${currentIdx + 1}`
+            : `STACK · ${stackData.pulls.length} PRs`;
+    col.appendChild(sectionLabel);
+
+    const rows = document.createElement("div");
+    rows.style.cssText = "display:flex;flex-direction:column;gap:1px;";
+
+    for (const pull of stackData.pulls) {
+        const a = document.createElement("a");
+        a.setAttribute("data-mergify-pr-row", String(pull.number));
+        if (pull.is_current) {
+            a.setAttribute("data-mergify-current", "true");
+        }
+        a.href = `/${currentPull.org}/${currentPull.repo}/pull/${pull.number}`;
+        a.style.cssText =
+            "display:grid;grid-template-columns:14px auto 1fr auto;" +
+            "gap:8px;align-items:center;padding:3px 8px 3px 16px;" +
+            "border-radius:3px;" +
+            "color:inherit;text-decoration:none;font-size:12px;" +
+            (pull.is_current
+                ? "background:rgba(31,111,235,0.12);" +
+                  "box-shadow:inset 2px 0 0 var(--fgColor-accent, #1f6feb);"
+                : "");
+
+        const dot = document.createElement("span");
+        dot.setAttribute("data-mergify-status-dot", "");
+        dot.setAttribute("data-mergify-status", "unknown");
+        dot.setAttribute("data-mergify-pr-num", String(pull.number));
+        dot.setAttribute("data-mergify-head-sha", pull.head_sha);
+        dot.style.cssText =
+            "display:inline-block;width:8px;height:8px;border-radius:50%;" +
+            "background:var(--fgColor-muted, #7d8590);";
+        a.appendChild(dot);
+
+        const num = document.createElement("span");
+        num.style.cssText =
+            "color:var(--fgColor-muted, #7d8590);font-variant-numeric:tabular-nums;";
+        num.textContent = `#${pull.number}`;
+        a.appendChild(num);
+
+        const title = document.createElement("span");
+        title.textContent = pull.title;
+        title.style.cssText =
+            "white-space:nowrap;overflow:hidden;text-overflow:ellipsis;";
+        if (pull.is_current) title.style.fontWeight = "600";
+        a.appendChild(title);
+
+        const statusLabel = document.createElement("span");
+        statusLabel.setAttribute("data-mergify-status-label", "");
+        statusLabel.style.cssText =
+            "color:var(--fgColor-muted, #7d8590);font-size:10px;" +
+            "text-transform:uppercase;letter-spacing:0.4px;";
+        a.appendChild(statusLabel);
+
+        rows.appendChild(a);
+    }
+
+    col.appendChild(rows);
+    return col;
+}
+
+function buildRevisionColumn(revisionData, currentPull) {
+    const col = document.createElement("div");
+    col.setAttribute("data-mergify-section", "revisions");
+    col.style.cssText = "padding:10px 14px;";
+
+    if (!revisionData.entries || revisionData.entries.length === 0) {
+        const empty = document.createElement("div");
+        empty.setAttribute("data-mergify-revisions-empty", "");
+        empty.style.cssText =
+            "color:var(--fgColor-muted, #7d8590);font-style:italic;font-size:11px;";
+        empty.textContent = "No revisions yet";
+        col.appendChild(empty);
+        return col;
+    }
+
+    // Squash runs of consecutive `rebase` entries into one display entry.
+    // Adjacent rebases without an amend in between are mostly noise;
+    // collapsing them gives a cleaner timeline. The squashed dot's compare
+    // URL spans the run (oldest old_sha → newest new_sha) so clicking
+    // shows the full delta of the rebase storm.
+    const displayEntries = [];
+    for (const entry of revisionData.entries) {
+        const last = displayEntries[displayEntries.length - 1];
+        if (
+            entry.change_type === "rebase" &&
+            last &&
+            last.change_type === "rebase"
+        ) {
+            last.new_sha = entry.new_sha;
+            last.timestamp_iso = entry.timestamp_iso;
+            last.last_number = entry.number;
+            last.run_count = (last.run_count || 1) + 1;
+            if (entry.old_sha && last.old_sha) {
+                last.compare_url = `/${currentPull.org}/${currentPull.repo}/compare/${last.old_sha}...${entry.new_sha}`;
+            }
+            continue;
+        }
+        displayEntries.push({ ...entry, run_count: 1 });
+    }
+
+    const sectionLabel = document.createElement("div");
+    sectionLabel.style.cssText =
+        "color:var(--fgColor-muted, #7d8590);font-weight:600;" +
+        "text-transform:uppercase;font-size:10px;letter-spacing:0.5px;" +
+        "margin-bottom:8px;";
+    sectionLabel.textContent =
+        displayEntries.length === revisionData.entries.length
+            ? `REVISIONS · ${revisionData.entries.length} entries`
+            : `REVISIONS · ${revisionData.entries.length} entries · ${displayEntries.length} shown`;
+    col.appendChild(sectionLabel);
+
+    const timeline = document.createElement("div");
+    timeline.style.cssText =
+        "display:flex;align-items:flex-start;gap:0;font-size:10px;";
+
+    const total = displayEntries.length;
+    const lastIdx = total - 1;
+    const collapsed = total > 6;
+    const visibleIndexes = collapsed
+        ? new Set([0, lastIdx - 2, lastIdx - 1, lastIdx])
+        : new Set(displayEntries.map((_, i) => i));
+
+    const DOT_COLORS = {
+        initial: "var(--fgColor-muted, #7d8590)",
+        amend: "var(--fgColor-accent, #58a6ff)",
+        rebase: "var(--fgColor-done, #a371f7)",
+    };
+
+    function appendRevDot(entry, isLatest) {
+        const a = document.createElement("a");
+        a.setAttribute("data-mergify-rev-dot", "");
+        a.setAttribute("data-mergify-rev-num", String(entry.number));
+        a.setAttribute("data-mergify-change-type", entry.change_type);
+        if (entry.run_count > 1) {
+            a.setAttribute("data-mergify-rebase-run", String(entry.run_count));
+        }
+        if (isLatest) a.setAttribute("data-mergify-latest", "true");
+        a.target = "_blank";
+        a.rel = "noopener noreferrer";
+        const typeText =
+            entry.run_count > 1
+                ? `${entry.change_type} ×${entry.run_count}`
+                : entry.change_type;
+        a.setAttribute(
+            "aria-label",
+            `Revision ${entry.number} (${typeText}) — open diff`,
+        );
+        a.href =
+            entry.change_type === "initial" || !entry.compare_url
+                ? `/${currentPull.org}/${currentPull.repo}/commit/${entry.new_sha}`
+                : entry.compare_url;
+        a.style.cssText =
+            "display:flex;flex-direction:column;align-items:center;" +
+            "gap:4px;width:60px;text-decoration:none;color:inherit;";
+
+        const color =
+            DOT_COLORS[entry.change_type] || "var(--fgColor-accent, #58a6ff)";
+        const dotEl = document.createElement("span");
+        dotEl.style.cssText = isLatest
+            ? `width:12px;height:12px;border-radius:50%;background:${color};` +
+              "box-shadow:0 0 0 2px var(--bgColor-muted, #161b22),0 0 0 3px " +
+              "var(--fgColor-success, #7ee787);"
+            : `width:10px;height:10px;border-radius:50%;background:${color};`;
+        a.appendChild(dotEl);
+
+        const typeLabel = document.createElement("span");
+        typeLabel.style.fontWeight = "600";
+        typeLabel.textContent =
+            entry.run_count > 1
+                ? `${entry.change_type} ×${entry.run_count}`
+                : entry.change_type;
+        a.appendChild(typeLabel);
+
+        const dateLabel = document.createElement("span");
+        dateLabel.style.color = "var(--fgColor-muted, #7d8590)";
+        const date = entry.timestamp_iso ? new Date(entry.timestamp_iso) : null;
+        dateLabel.title = entry.timestamp_iso || "";
+        dateLabel.textContent =
+            date && !Number.isNaN(date.getTime())
+                ? date.toLocaleDateString(undefined, {
+                      month: "short",
+                      day: "numeric",
+                  })
+                : "";
+        a.appendChild(dateLabel);
+
+        const shaLabel = document.createElement("span");
+        shaLabel.style.cssText =
+            "color:var(--fgColor-accent, #58a6ff);font-family:monospace;";
+        shaLabel.textContent = entry.new_sha.slice(0, 7);
+        a.appendChild(shaLabel);
+
+        if (entry.reason) {
+            a.title = entry.reason;
+            const reasonLabel = document.createElement("span");
+            reasonLabel.setAttribute("data-mergify-rev-reason", "");
+            reasonLabel.style.cssText =
+                "color:var(--fgColor-muted, #7d8590);max-width:60px;" +
+                "white-space:nowrap;overflow:hidden;text-overflow:ellipsis;" +
+                "font-style:italic;";
+            reasonLabel.textContent = entry.reason;
+            a.appendChild(reasonLabel);
+        }
+
+        timeline.appendChild(a);
+    }
+
+    function appendConnector() {
+        const line = document.createElement("span");
+        line.style.cssText =
+            "height:2px;flex:1;background:var(--borderColor-default, #30363d);" +
+            "margin-top:4px;";
+        timeline.appendChild(line);
+    }
+
+    function appendEllipsis(hiddenCount) {
+        const span = document.createElement("span");
+        span.setAttribute("data-mergify-rev-ellipsis", "");
+        span.style.cssText =
+            "color:var(--fgColor-muted, #7d8590);cursor:pointer;" +
+            "padding:0 8px;align-self:center;font-weight:600;";
+        span.textContent = `· · · (${hiddenCount} more) · · ·`;
+        span.onclick = () => {
+            timeline.innerHTML = "";
+            renderEntries(false);
+        };
+        timeline.appendChild(span);
+    }
+
+    function renderEntries(useCollapsed) {
+        let prevWasVisible = false;
+        let lastShownIdx = -1;
+        for (let i = 0; i < total; i++) {
+            const visible = useCollapsed ? visibleIndexes.has(i) : true;
+            if (visible) {
+                if (prevWasVisible) {
+                    if (lastShownIdx === i - 1) {
+                        appendConnector();
+                    } else {
+                        appendEllipsis(i - lastShownIdx - 1);
+                    }
+                }
+                appendRevDot(displayEntries[i], i === lastIdx);
+                prevWasVisible = true;
+                lastShownIdx = i;
+            }
+        }
+    }
+
+    renderEntries(collapsed);
+    col.appendChild(timeline);
+    return col;
+}
+
+function buildContextPanel(stackData, revisionData, currentPull) {
+    if (!stackData && !revisionData) return null;
+
+    const root = document.createElement("div");
+    root.id = "mergify-context";
+    root.style.cssText =
+        "border:1px solid var(--borderColor-default, #30363d);" +
+        "border-radius:6px;background:var(--bgColor-muted, #161b22);" +
+        "margin:12px 0;font-size:13px;";
+
+    const header = document.createElement("div");
+    header.style.cssText =
+        "padding:10px 14px;display:flex;align-items:center;gap:8px;" +
+        "border-bottom:1px solid var(--borderColor-default, #30363d);";
+    const logo = parseSvg(getLogoSvg());
+    logo.setAttribute("width", "18");
+    logo.setAttribute("height", "18");
+    header.appendChild(logo);
+    const titleLink = document.createElement("a");
+    titleLink.href = "https://docs.mergify.com/stacks/";
+    titleLink.target = "_blank";
+    titleLink.rel = "noopener noreferrer";
+    titleLink.textContent = "Mergify Stacks";
+    titleLink.style.cssText =
+        "font-weight:600;color:inherit;text-decoration:none;";
+    titleLink.title = "Open Mergify Stacks documentation";
+    header.appendChild(titleLink);
+    if (stackData) {
+        const sep = document.createElement("span");
+        sep.style.color = "var(--fgColor-muted, #7d8590)";
+        sep.textContent = "·";
+        header.appendChild(sep);
+        const stackChip = document.createElement("code");
+        stackChip.style.cssText =
+            "background:var(--bgColor-default, #0d1117);padding:1px 6px;" +
+            "border-radius:3px;font-size:12px;";
+        stackChip.textContent = stackData.stack_id;
+        header.appendChild(stackChip);
+    }
+    root.appendChild(header);
+
+    const body = document.createElement("div");
+    body.style.cssText = "display:flex;flex-direction:column;";
+    if (stackData)
+        body.appendChild(
+            buildStackColumn(stackData, revisionData, currentPull),
+        );
+    if (revisionData)
+        body.appendChild(buildRevisionColumn(revisionData, currentPull));
+    root.appendChild(body);
+
+    const hashInput = JSON.stringify({
+        s: stackData
+            ? {
+                  id: stackData.stack_id,
+                  nums: stackData.pulls.map((p) => `${p.number}@${p.head_sha}`),
+              }
+            : null,
+        r: revisionData
+            ? {
+                  n: revisionData.pull_number,
+                  es: revisionData.entries.map(
+                      (e) => `${e.number}/${e.change_type}/${e.new_sha}`,
+                  ),
+              }
+            : null,
+    });
+    let hash = 0;
+    for (let i = 0; i < hashInput.length; i++) {
+        hash = ((hash << 5) - hash + hashInput.charCodeAt(i)) | 0;
+    }
+    root.setAttribute("data-mergify-hash", String(hash));
+
+    return root;
+}
+
+function updateStackDotStatus(panelEl, prNumber, status) {
+    const dot = panelEl.querySelector(
+        `[data-mergify-status-dot][data-mergify-pr-num="${prNumber}"]`,
+    );
+    if (!dot) return;
+    dot.setAttribute("data-mergify-status", status);
+    const colors = {
+        open: "var(--fgColor-success, #3fb950)",
+        merged: "var(--fgColor-done, #a371f7)",
+        closed: "var(--fgColor-danger, #f85149)",
+        draft: "var(--fgColor-muted, #7d8590)",
+        unknown: "var(--fgColor-muted, #7d8590)",
+    };
+    dot.style.background = colors[status] || colors.unknown;
+    const row = dot.closest("[data-mergify-pr-row]");
+    if (row) {
+        const lbl = row.querySelector("[data-mergify-status-label]");
+        if (lbl) lbl.textContent = status === "unknown" ? "" : status;
+    }
+}
+
+function findFirstElement(selectors) {
+    for (const sel of selectors) {
+        const el = document.querySelector(sel);
+        if (el) return el;
+    }
+    return null;
+}
+
+const CONTEXT_PANEL_TARGETS = [
+    '[data-testid="issue-pr-conversation-content"]',
+    "#discussion_bucket",
+    ".js-discussion",
+];
+
+function findContextPanelTarget() {
+    return findFirstElement(CONTEXT_PANEL_TARGETS);
+}
+
+function injectContextPanel(panel) {
+    const target = findContextPanelTarget();
+    if (!target) return;
+
+    const existing = target.querySelector("#mergify-context");
+    if (existing) {
+        const oldHash = existing.getAttribute("data-mergify-hash");
+        const newHash = panel.getAttribute("data-mergify-hash");
+        if (oldHash && newHash && oldHash === newHash) return;
+        existing.replaceWith(panel);
+        return;
+    }
+    target.insertBefore(panel, target.firstChild);
+}
+
+const _prStatusCache = new PrStatusCache();
+
+async function renderMergifyContext(currentPull) {
+    const generation = ++_contextRenderGeneration;
+    const bodies = await fetchCommentBodies(
+        currentPull.org,
+        currentPull.repo,
+        currentPull.number,
+    );
+    if (generation !== _contextRenderGeneration) return;
+    if (bodies.length === 0) return;
+
+    const stackData = parseStackMarker(bodies, currentPull.number);
+    const revisionData = parseRevisionMarker(bodies, currentPull.number);
+    const panel = buildContextPanel(stackData, revisionData, currentPull);
+    if (!panel) return;
+    injectContextPanel(panel);
+    injectStackNav(stackData, currentPull);
+
+    if (!stackData) return;
+    const live = document.querySelector("#mergify-context");
+    if (!live) return;
+
+    const items = stackData.pulls
+        .filter((p) => !p.is_current)
+        .map((p) => ({
+            org: currentPull.org,
+            repo: currentPull.repo,
+            num: p.number,
+            head_sha: p.head_sha,
+        }));
+
+    // Apply the current PR's own live status from the page, and write it
+    // through to the cache so a stale entry from a previous visit doesn't
+    // outlive a status change the user has now seen with their own eyes.
+    const currentStatus = readCurrentPrStatus();
+    if (currentStatus) {
+        updateStackDotStatus(live, currentPull.number, currentStatus);
+        const currentEntry = stackData.pulls.find(
+            (p) => p.number === currentPull.number,
+        );
+        if (currentEntry) {
+            _prStatusCache.update(
+                currentPull.org,
+                currentPull.repo,
+                currentPull.number,
+                currentEntry.head_sha,
+                currentStatus,
+            );
+        }
+    }
+
+    if (items.length === 0) return;
+
+    gatherPrStatuses(items, _prStatusCache, (item, status) => {
+        if (generation !== _contextRenderGeneration) return;
+        const fresh = document.querySelector("#mergify-context");
+        if (!fresh) return;
+        updateStackDotStatus(fresh, item.num, status);
+    }).catch((e) => debug("status fetch failed:", e));
+}
+
+// The `use-sticky-header-module` class is shared across both the Conversation
+// tab's StickyPullRequestHeader and the Files tab's PullRequestFilesToolbar
+// (the actual toolbar, not the 1px stickyHeaderActivationThreshold sentinel).
+function findStackNavTarget() {
+    return document.querySelector(
+        '[class*="use-sticky-header-module__stickyHeader"]',
+    );
+}
+
+function buildStackNav(stackData, currentPull) {
+    if (!stackData || !stackData.pulls || stackData.pulls.length < 2) {
+        return null;
+    }
+    const idx = stackData.pulls.findIndex(
+        (p) => p.number === currentPull.number,
+    );
+    if (idx === -1) return null;
+    const prev = idx > 0 ? stackData.pulls[idx - 1] : null;
+    const next =
+        idx < stackData.pulls.length - 1 ? stackData.pulls[idx + 1] : null;
+
+    const root = document.createElement("div");
+    root.id = "mergify-stack-nav";
+    // flex:1 0 100% + min-width:100% + order:99 force the nav onto its own
+    // row inside the sticky toolbar's flex container (which we set to
+    // flex-wrap:wrap during injection). Symmetric vertical padding (no border)
+    // keeps the row content visually centered.
+    root.style.cssText =
+        "display:grid;grid-template-columns:1fr auto 1fr;gap:12px;" +
+        "align-items:center;padding:6px 16px;font-size:11px;" +
+        "background:var(--bgColor-muted, #161b22);" +
+        "box-shadow:inset 0 1px 0 var(--borderColor-default, #30363d);" +
+        "flex:1 0 100%;min-width:100%;order:99;box-sizing:border-box;";
+
+    const stackLabel = document.createElement("span");
+    stackLabel.style.cssText =
+        "color:var(--fgColor-muted, #7d8590);" +
+        "text-transform:uppercase;letter-spacing:0.5px;" +
+        "font-size:10px;font-weight:600;text-align:center;" +
+        "font-variant-numeric:tabular-nums;";
+    stackLabel.textContent = `STACK ${idx + 1}/${stackData.pulls.length}`;
+
+    function renderHalf(pull, direction) {
+        const arrow = direction === "prev" ? "←" : "→";
+        const align = direction === "prev" ? "left" : "right";
+        if (!pull) {
+            const muted = document.createElement("span");
+            muted.style.cssText =
+                `text-align:${align};color:var(--fgColor-muted, #7d8590);` +
+                "white-space:nowrap;overflow:hidden;text-overflow:ellipsis;" +
+                "font-style:italic;";
+            muted.textContent =
+                direction === "prev" ? "base of stack" : "tip of stack";
+            muted.setAttribute("data-mergify-stack-nav", `${direction}-empty`);
+            return muted;
+        }
+        const a = document.createElement("a");
+        a.setAttribute("data-mergify-stack-nav", direction);
+        a.setAttribute("data-mergify-stack-nav-num", String(pull.number));
+        a.href = `/${currentPull.org}/${currentPull.repo}/pull/${pull.number}`;
+        a.title = `Open #${pull.number}: ${pull.title}`;
+        a.style.cssText =
+            "display:flex;align-items:center;gap:6px;" +
+            "color:var(--fgColor-accent, #58a6ff);" +
+            "text-decoration:none;white-space:nowrap;overflow:hidden;" +
+            (direction === "prev"
+                ? "justify-content:flex-start;"
+                : "justify-content:flex-end;");
+        a.onmouseenter = () => {
+            a.style.textDecoration = "underline";
+        };
+        a.onmouseleave = () => {
+            a.style.textDecoration = "none";
+        };
+        const arrowEl = document.createElement("span");
+        arrowEl.style.cssText =
+            "color:var(--fgColor-muted, #7d8590);flex-shrink:0;font-size:13px;";
+        arrowEl.textContent = arrow;
+        const num = document.createElement("span");
+        num.style.cssText =
+            "color:var(--fgColor-muted, #7d8590);flex-shrink:0;" +
+            "font-variant-numeric:tabular-nums;";
+        num.textContent = `#${pull.number}`;
+        const title = document.createElement("span");
+        title.textContent = pull.title;
+        title.style.cssText =
+            "overflow:hidden;text-overflow:ellipsis;min-width:0;";
+        if (direction === "prev") {
+            a.appendChild(arrowEl);
+            a.appendChild(num);
+            a.appendChild(title);
+        } else {
+            a.appendChild(title);
+            a.appendChild(num);
+            a.appendChild(arrowEl);
+        }
+        return a;
+    }
+
+    root.appendChild(renderHalf(prev, "prev"));
+    root.appendChild(stackLabel);
+    root.appendChild(renderHalf(next, "next"));
+    return root;
+}
+
+function injectStackNav(stackData, currentPull) {
+    const target = findStackNavTarget();
+    if (!target) return;
+    const existing = document.querySelector("#mergify-stack-nav");
+    const fresh = buildStackNav(stackData, currentPull);
+    if (!fresh) {
+        if (existing) {
+            existing.remove();
+            target.style.flexWrap = "";
+            target.style.removeProperty("padding-bottom");
+        }
+        return;
+    }
+    // The toolbar is a flex-row. Force flex-wrap so our 100%-width child
+    // spills onto a new line below the existing toolbar contents, and stays
+    // inside the same sticky element so it inherits stickiness naturally.
+    // Zero the toolbar's padding-bottom (with !important — GitHub ships an
+    // !important rule for it) so there's no visible gap between our nav and
+    // the bottom edge of the sticky bar.
+    target.style.flexWrap = "wrap";
+    target.style.setProperty("padding-bottom", "0", "important");
+    if (existing) {
+        existing.replaceWith(fresh);
+        return;
+    }
+    target.appendChild(fresh);
+}
+
+function readCurrentPrStatus() {
+    return readPrStatusFromDocument(document);
+}
+
 // Required for testing only, module does not exists in an extension
 try {
     module.exports = {
         MergifyCache,
+        PrStatusCache,
         findTimelineActions,
         isPullRequestOpen,
         isPullRequestQueued,
@@ -872,5 +1802,20 @@ try {
         convertMergifyTimestamps,
         isMergifyBotComment,
         formatLocalTime,
+        parseStackMarker,
+        parseRevisionMarker,
+        STACK_MARKER_PREFIX,
+        REVISION_MARKER_PREFIX,
+        MARKER_SUFFIX,
+        fetchPrStatus,
+        gatherPrStatuses,
+        buildContextPanel,
+        updateStackDotStatus,
+        injectContextPanel,
+        renderMergifyContext,
+        fetchCommentBodies,
+        clearCommentsCache,
+        buildStackNav,
+        injectStackNav,
     };
 } catch (_error) {}