From 51abaf0fc03abd1d2783098642ff7290bd94808f Mon Sep 17 00:00:00 2001
From: Balaji Guntur <59932973+gnpthbalaji@users.noreply.github.com>
Date: Sat, 11 Apr 2026 20:30:47 -0700
Subject: [PATCH] fix: correct accessibility terminology and code fence in a11y
 skill and agent

- Fix inverted focus trap terms: Keyboard Traps -> Uncontained Modal Focus with WCAG SC 2.1.2 reference
- Fix Step 1 blocker example: missing keyboard traps -> missing focus containment in modals
- Attach [language] placeholder to opening triple-backtick fence in agent implementation template
---
 agents/a11y-architect.md      | 11 ++++++-----
 skills/accessibility/SKILL.md |  5 +++--
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/agents/a11y-architect.md b/agents/a11y-architect.md
index c5793317..cd00b806 100644
--- a/agents/a11y-architect.md
+++ b/agents/a11y-architect.md
@@ -20,7 +20,7 @@ You are a Senior Accessibility Architect. Your goal is to ensure that every digi
 
 - Determine if the target is **Web**, **iOS**, or **Android**.
 - Analyze the user interaction (e.g., Is this a simple button or a complex data grid?).
-- Identify potential accessibility "blockers" (e.g., color-only indicators, missing keyboard traps).
+- Identify potential accessibility "blockers" (e.g., color-only indicators, missing focus containment in modals).
 
 ### Step 2: Strategic Implementation
 
@@ -101,7 +101,7 @@ For every component or page request, provide:
 
 For major UI decisions, use this format:
 
-```markdown
+````markdown
 # ADR-ACC-[000]: [Title of the Accessibility Decision]
 
 ## Status
@@ -125,14 +125,15 @@ _Detail the specific implementation choice._
 
 ### Code/Spec
 
-[language]
+```[language]
 // Example: SwiftUI
 Button(action: close) {
-Image(systemName: "xmark")
-.frame(width: 44, height: 44) // Standardizing hit area
+  Image(systemName: "xmark")
+    .frame(width: 44, height: 44) // Standardizing hit area
 }
 .accessibilityLabel("Close modal")
 ```
+````
 
 ## Reference
 
diff --git a/skills/accessibility/SKILL.md b/skills/accessibility/SKILL.md
index 2f46136a..c9021041 100644
--- a/skills/accessibility/SKILL.md
+++ b/skills/accessibility/SKILL.md
@@ -117,14 +117,15 @@ Switch(
 
 - **Div-Buttons**: Using a `<div>` or `<span>` for a click event without adding a role and keyboard support.
 - **Color-Only Meaning**: Indicating an error or status _only_ with a color change (e.g., turning a border red).
-- **Infinite Tab Loops**: Modals that don't trap focus, allowing users to "escape" into the background content while the modal is open.
+- **Uncontained Modal Focus**: Modals that don't trap focus, allowing keyboard users to navigate background content while the modal is open. Focus must be contained _and_ escapable via the `Escape` key or an explicit close button (WCAG SC 2.1.2).
 - **Redundant Alt Text**: Using "Image of..." or "Picture of..." in alt text (screen readers already announce the role "Image").
 
 ## Best Practices Checklist
 
 - [ ] Interactive elements meet the **24x24px** (Web) or **44x44pt** (Native) target size.
 - [ ] Focus indicators are clearly visible and high-contrast.
-- [ ] No "Keyboard Traps" exist in complex components (modals, dropdowns).
+- [ ] Modals **contain focus** while open, and release it cleanly on close (`Escape` key or close button).
+- [ ] Dropdowns and menus restore focus to the trigger element on close.
 - [ ] Forms provide text-based error suggestions.
 - [ ] All icon-only buttons have a descriptive text label.
 - [ ] Content reflows properly when text is scaled.