diff --git a/ui/src/components/IssueChatThread.tsx b/ui/src/components/IssueChatThread.tsx
index c7a954d41c..aed1de750d 100644
--- a/ui/src/components/IssueChatThread.tsx
+++ b/ui/src/components/IssueChatThread.tsx
@@ -165,7 +165,7 @@ import {
 } from "../lib/transcriptPresentation";
 import { buildAgentMentionHref } from "@paperclipai/shared";
 import { cn, formatDateTime, formatShortDate } from "../lib/utils";
-import { brandChipBadge } from "../lib/status-colors";
+import { liveBlueBadge } from "../lib/status-colors";
 import { nextWorkMode, titleForPendingWorkMode, workModeMetaFor, workModeMetaList } from "../lib/work-mode-meta";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
@@ -1928,12 +1928,12 @@ function IssueChatAssistantMessage({
                 </Badge>
               ) : null}
               {isRunning ? (
-                // Gallery feedback r1: running chip uses the canonical brand blue
-                // (brandChipBadge.blue), not cyan; layout/size classes unchanged.
+                // Running chip shares the liveness-blue badge recipe with the
+                // issue header's "Live" badge (one live/running blue).
                 <Badge variant="outline"
                   className={cn(
                     "text-(length:--text-nano) uppercase tracking-(--tracking-eyebrow)",
-                    brandChipBadge.blue,
+                    liveBlueBadge,
                   )}
                 >
                   <Loader2 className="h-3 w-3 animate-spin" />
diff --git a/ui/src/components/SidebarNavItem.tsx b/ui/src/components/SidebarNavItem.tsx
index b9856e2ad7..a9603af7ab 100644
--- a/ui/src/components/SidebarNavItem.tsx
+++ b/ui/src/components/SidebarNavItem.tsx
@@ -144,8 +144,8 @@ export function SidebarNavItem({
             icon. The icon markup is untouched so it stays pixel-aligned. */}
         {rail && !alert && hasLive && (
           <span className="absolute -right-0.5 -top-0.5 flex h-2 w-2" aria-hidden="true">
-            <span className="animate-pulse absolute inline-flex h-full w-full rounded-full bg-(--status-agent-running) opacity-75" />
-            <span className="relative inline-flex h-2 w-2 rounded-full bg-(--status-agent-running) shadow-(--shadow-extract-12)" />
+            <span className="animate-pulse absolute inline-flex h-full w-full rounded-full bg-blue-600 dark:bg-blue-400 opacity-75" />
+            <span className="relative inline-flex h-2 w-2 rounded-full bg-blue-600 dark:bg-blue-400 shadow-(--shadow-extract-12)" />
           </span>
         )}
         {rail && !alert && !hasLive && hasBadge && (
@@ -178,8 +178,8 @@ export function SidebarNavItem({
           {hasLive && (
             <>
               <span className="relative flex h-2 w-2">
-                <span className="animate-pulse absolute inline-flex h-full w-full rounded-full bg-(--status-agent-running) opacity-75" />
-                <span className="relative inline-flex rounded-full h-2 w-2 bg-(--status-agent-running)" />
+                <span className="animate-pulse absolute inline-flex h-full w-full rounded-full bg-blue-600 dark:bg-blue-400 opacity-75" />
+                <span className="relative inline-flex rounded-full h-2 w-2 bg-blue-600 dark:bg-blue-400" />
               </span>
               <span className="text-(length:--text-micro) font-medium text-blue-600 dark:text-blue-400">{liveCount} live</span>
             </>
diff --git a/ui/src/lib/status-colors.ts b/ui/src/lib/status-colors.ts
index bdedbf3d7d..cf0d3f84ee 100644
--- a/ui/src/lib/status-colors.ts
+++ b/ui/src/lib/status-colors.ts
@@ -167,6 +167,13 @@ export const agentStatusMotion: Record<string, string> = {
  */
 export const runningLabelText = "text-[#1D4ED8] dark:text-[#2563EB]";
 
+/**
+ * Liveness-blue badge recipe — the shared "Live" / "Running" pill treatment
+ * (translucent blue fill + border + blue text). One source of truth so every
+ * live/running indicator reads as the same blue.
+ */
+export const liveBlueBadge = "bg-blue-500/10 border-blue-500/30 text-blue-600 dark:text-blue-400";
+
 /**
  * Issue/task status → brand colour name (PAP-75). `in_progress` is blue
  * (liveness), `todo` amber (queued), `in_review` violet (awaiting review),
diff --git a/ui/src/pages/Inbox.test.tsx b/ui/src/pages/Inbox.test.tsx
index 43f17f7be9..275ebcaf91 100644
--- a/ui/src/pages/Inbox.test.tsx
+++ b/ui/src/pages/Inbox.test.tsx
@@ -438,6 +438,68 @@ describe("Inbox toolbar", () => {
     });
   });
 
+  it("does not double-indent unread rows: the mark-read dot replaces the leading spacer", async () => {
+    routerMock.location.pathname = "/inbox/mine";
+    // Two sibling leaf rows, one unread and one read, so their leading columns
+    // are directly comparable.
+    const unread = createIssue({
+      id: "issue-unread",
+      identifier: "PAP-2001",
+      title: "Unread inbox row",
+      isUnreadForMe: true,
+    });
+    const read = createIssue({
+      id: "issue-read",
+      identifier: "PAP-2002",
+      title: "Read inbox row",
+      isUnreadForMe: false,
+    });
+    apiMocks.issuesList.mockResolvedValue([unread, read]);
+
+    const queryClient = new QueryClient({
+      defaultOptions: { queries: { retry: false, staleTime: 0, gcTime: 0 } },
+    });
+    const root = createRoot(container);
+
+    await act(async () => {
+      root.render(
+        <QueryClientProvider client={queryClient}>
+          <Inbox />
+        </QueryClientProvider>,
+      );
+    });
+    await vi.waitFor(() => {
+      expect(container.textContent).toContain("Unread inbox row");
+      expect(container.textContent).toContain("Read inbox row");
+    });
+
+    const rows = Array.from(container.querySelectorAll("[data-inbox-item]"));
+    const rowFor = (text: string) => rows.find((row) => row.textContent?.includes(text));
+    const linkOf = (row: Element) => row.querySelector<HTMLAnchorElement>("a[data-inbox-issue-link]");
+    const hasMarkReadDot = (row: Element) => !!row.querySelector('button[aria-label="Mark as read"]');
+    // The empty spacer that reserves the chevron column on read rows. Excludes
+    // the tree-guide span (`.self-stretch`), which only renders on nested rows.
+    const hasLeadingSpacer = (row: Element) =>
+      !!linkOf(row)?.querySelector("span.hidden.w-4.shrink-0.sm\\:block:not(.self-stretch)");
+
+    const unreadRow = rowFor("Unread inbox row")!;
+    const readRow = rowFor("Read inbox row")!;
+
+    // Unread rows carry the mark-read dot in the chevron column; rendering the
+    // spacer too would push the status icon + title one column further right
+    // than read rows (the bug this fix addresses).
+    expect(hasMarkReadDot(unreadRow)).toBe(true);
+    expect(hasLeadingSpacer(unreadRow)).toBe(false);
+
+    // Read rows have no dot, so they keep the spacer to hold that same column.
+    expect(hasMarkReadDot(readRow)).toBe(false);
+    expect(hasLeadingSpacer(readRow)).toBe(true);
+
+    act(() => {
+      root.unmount();
+    });
+  });
+
   it("keeps other issue archive controls enabled while one archive is pending", async () => {
     routerMock.location.pathname = "/inbox/mine";
     const issueA = createIssue({ id: "issue-a", identifier: "PAP-1001", title: "First inbox row" });
diff --git a/ui/src/pages/Inbox.tsx b/ui/src/pages/Inbox.tsx
index 7fee7da241..bcafa2de32 100644
--- a/ui/src/pages/Inbox.tsx
+++ b/ui/src/pages/Inbox.tsx
@@ -2566,6 +2566,12 @@ export function Inbox() {
                               >
                                 <ChevronRight className={cn("h-3.5 w-3.5 transition-transform", isExpanded && "rotate-90")} />
                               </button>
+                            ) : (isUnread || isFading) ? (
+                              // Unread rows already carry the leading mark-read
+                              // dot (IssueRow, order-first) in the chevron
+                              // column, so skip the spacer — otherwise the dot
+                              // and this spacer would double-indent the status.
+                              null
                             ) : (
                               <span className="hidden w-4 shrink-0 sm:block" />
                             )
diff --git a/ui/src/pages/IssueDetail.tsx b/ui/src/pages/IssueDetail.tsx
index 2e894d4520..694fd42a70 100644
--- a/ui/src/pages/IssueDetail.tsx
+++ b/ui/src/pages/IssueDetail.tsx
@@ -76,6 +76,7 @@ import {
 import { clearIssueExecutionRun, removeLiveRunById, upsertInterruptedRun } from "../lib/optimistic-issue-runs";
 import { useProjectOrder } from "../hooks/useProjectOrder";
 import { relativeTime, cn, formatDurationMs, formatTokens, visibleRunCostUsd } from "../lib/utils";
+import { liveBlueBadge } from "../lib/status-colors";
 import { ApprovalCard } from "../components/ApprovalCard";
 import { InlineEditor } from "../components/InlineEditor";
 import {
@@ -4158,7 +4159,7 @@ export function IssueDetail() {
           <span className="text-sm font-mono text-muted-foreground shrink-0">{issue.identifier ?? issue.id.slice(0, 8)}</span>
 
           {hasLiveRuns && (
-            <Badge variant="outline" className="gap-1.5 bg-blue-500/10 border-blue-500/30 text-(length:--text-nano) text-blue-600 dark:text-blue-400">
+            <Badge variant="outline" className={cn("gap-1.5 text-(length:--text-nano)", liveBlueBadge)}>
               <span className="relative flex h-1.5 w-1.5">
                 <span className="animate-pulse absolute inline-flex h-full w-full rounded-full bg-blue-400 opacity-75" />
                 <span className="relative inline-flex rounded-full h-1.5 w-1.5 bg-blue-500" />