diff --git a/.jules/palette.md b/.jules/palette.md
new file mode 100644
index 0000000..5e26c9c
--- /dev/null
+++ b/.jules/palette.md
@@ -0,0 +1,3 @@
+## 2025-02-21 - Accessible Tabs Pattern
+**Learning:** React Tabs need `role="tablist"`, `role="tab"`, `aria-selected`, `aria-controls`, and `id` for proper accessibility and keyboard navigation. Using React `useId` for components is helpful for auto-generating accessible IDs.
+**Action:** When implementing tabs or collapsibles, ensure these ARIA attributes are correctly linked.
diff --git a/src/app/cite/page.tsx b/src/app/cite/page.tsx
index 0d86f84..873d07c 100644
--- a/src/app/cite/page.tsx
+++ b/src/app/cite/page.tsx
@@ -1961,7 +1961,11 @@ function CitePageContent() {
           onTabChange={setActiveTab}
         />
 
-        <div className="border border-wiki-border-light border-t-0 bg-wiki-white p-6 md:p-8">
+        <div
+          className="border border-wiki-border-light border-t-0 bg-wiki-white p-6 md:p-8"
+          role="tabpanel"
+          id={`panel-${activeTab}`}
+          aria-labelledby={`tab-${activeTab}`}>
           {activeTab === "quick-add" && (
             <div>
               <h2 className="text-lg font-bold mb-4">Quick Add</h2>
diff --git a/src/components/wiki/wiki-collapsible.tsx b/src/components/wiki/wiki-collapsible.tsx
index 5284dd8..f507721 100644
--- a/src/components/wiki/wiki-collapsible.tsx
+++ b/src/components/wiki/wiki-collapsible.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useState } from "react";
+import { useState, useId } from "react";
 
 interface WikiCollapsibleProps {
   title: string;
@@ -14,6 +14,7 @@ export function WikiCollapsible({
   defaultOpen = true,
 }: WikiCollapsibleProps) {
   const [isOpen, setIsOpen] = useState(defaultOpen);
+  const contentId = useId();
 
   return (
     <div className="border border-wiki-border-light bg-wiki-offwhite">
@@ -22,11 +23,14 @@ export function WikiCollapsible({
         <button
           onClick={() => setIsOpen(!isOpen)}
           className="text-wiki-link text-sm hover:underline"
+          aria-expanded={isOpen}
+          aria-controls={contentId}
+          aria-label={`${isOpen ? "Hide" : "Show"} ${title}`}
         >
           [{isOpen ? "hide" : "show"}]
         </button>
       </div>
-      {isOpen && <div className="px-4 py-3">{children}</div>}
+      {isOpen && <div id={contentId} className="px-4 py-3">{children}</div>}
     </div>
   );
 }
diff --git a/src/components/wiki/wiki-tabs.tsx b/src/components/wiki/wiki-tabs.tsx
index 75b22a5..eaaf61c 100644
--- a/src/components/wiki/wiki-tabs.tsx
+++ b/src/components/wiki/wiki-tabs.tsx
@@ -14,10 +14,14 @@ interface WikiTabsProps {
 
 export function WikiTabs({ tabs, onTabChange }: WikiTabsProps) {
   return (
-    <div className="flex border-b border-wiki-border-light">
+    <div className="flex border-b border-wiki-border-light" role="tablist">
       {tabs.map((tab) => (
         <button
           key={tab.id}
+          role="tab"
+          aria-selected={tab.active}
+          aria-controls={`panel-${tab.id}`}
+          id={`tab-${tab.id}`}
           onClick={() => onTabChange?.(tab.id)}
           className={`
             px-4 py-2 text-sm border border-b-0 -mb-px