diff --git a/frontend/src/App.css b/frontend/src/App.css
index b88ee953a..2bb355718 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -820,6 +820,9 @@
 }
 
 .citation-chip {
+  display: inline-flex;
+  align-items: center;
+  min-height: var(--size-control-min);
   border: 1px solid var(--color-chip-border);
   border-radius: var(--radius-chip);
   padding: var(--space-chip-block) var(--space-chip-inline);
diff --git a/frontend/src/styles/tokens.test.ts b/frontend/src/styles/tokens.test.ts
index 54432b43a..2c744a006 100644
--- a/frontend/src/styles/tokens.test.ts
+++ b/frontend/src/styles/tokens.test.ts
@@ -70,4 +70,14 @@ describe("design tokens", () => {
       expect(appCss, `App.css never references var(${token})`).toContain(`var(${token})`);
     }
   });
+
+  it("gives .citation-chip a real 24px minimum touch target", () => {
+    const citationChipBlock = appCss.match(/\.citation-chip\s*\{[^}]*\}/)?.[0] ?? "";
+    expect(citationChipBlock, ".citation-chip rule not found in App.css").not.toBe("");
+    expect(citationChipBlock).toContain("min-height: var(--size-control-min)");
+    // The chip is a bare <button>; without flex centering its text sits at
+    // the top of the box once min-height grows past the line height.
+    expect(citationChipBlock).toContain("display: inline-flex");
+    expect(citationChipBlock).toContain("align-items: center");
+  });
 });