diff --git a/src/components/ui/Tabs.test.tsx b/src/components/ui/Tabs.test.tsx
index aca1135..f4e28e2 100644
--- a/src/components/ui/Tabs.test.tsx
+++ b/src/components/ui/Tabs.test.tsx
@@ -142,3 +142,25 @@ describe("Tabs — keyboard navigation (#24)", () => {
     expect(screen.getByRole("tab", { name: "First" })).toHaveFocus();
   });
 });
+
+describe("Tabs — aria-controls (#710)", () => {
+  it("sets aria-controls on the active tab and omits it on inactive tabs", () => {
+    const { rerender } = render(
+      <Tabs tabs={sampleTabs} active="active" onChange={() => {}} />,
+    );
+
+    const activeTab = screen.getByRole("tab", { name: "Active" });
+    const completedTab = screen.getByRole("tab", { name: "Completed" });
+    const archivedTab = screen.getByRole("tab", { name: "Archived" });
+
+    expect(activeTab).toHaveAttribute("aria-controls", "tabpanel-active");
+    expect(completedTab).not.toHaveAttribute("aria-controls");
+    expect(archivedTab).not.toHaveAttribute("aria-controls");
+
+    rerender(<Tabs tabs={sampleTabs} active="completed" onChange={() => {}} />);
+
+    expect(activeTab).not.toHaveAttribute("aria-controls");
+    expect(completedTab).toHaveAttribute("aria-controls", "tabpanel-completed");
+    expect(archivedTab).not.toHaveAttribute("aria-controls");
+  });
+});
diff --git a/src/components/ui/Tabs.tsx b/src/components/ui/Tabs.tsx
index a5236b0..0375dd0 100644
--- a/src/components/ui/Tabs.tsx
+++ b/src/components/ui/Tabs.tsx
@@ -79,7 +79,7 @@ export function Tabs<T extends string>({
             role="tab"
             id={`tab-${tab.key}`}
             aria-selected={isActive}
-            aria-controls={`tabpanel-${tab.key}`}
+            aria-controls={isActive ? `tabpanel-${tab.key}` : undefined}
             tabIndex={isActive ? 0 : -1}
             onClick={() => onChange(tab.key)}
             onKeyDown={(e) => handleKeyDown(e, tab.key)}