@edupia-tutor/spec-driven-docs 0.14.0

package/core/steps/review-fanout.md

@@ -0,0 +1,138 @@
+# Exhaustive Review Fan-Out + Completeness Convergence
+
+**Why this exists:** A single-pass review never lists every issue at once — the model
+stops at "enough" findings, so each later review round surfaces *new* problems
+(whack-a-mole). This procedure forces the review to **converge in one command run**:
+fan out across review dimensions in parallel, then loop a completeness critic until a
+round produces nothing new, *before* writing the findings file.
+
+The calling command supplies two things:
+- **DIMENSIONS** — the list of review dimensions to fan out over
+  (`/refine-prd` → the 4 lenses; `/review-context` → the P-checks or B-checks).
+- **FINDINGS SCHEMA** — the YAML shape each finding must follow (defined in the command).
+
+> **Sub-agent mode bypass:** If Gate Step 0 set `_agent_mode: true`, this whole
+> procedure is **skipped** — the orchestrator is already running one dimension/UC per
+> sub-agent. Run the command's checks directly on the scoped section and return findings.
+
+---
+
+## Phase 1 — Parallel dimension scan
+
+**How many sub-agents:** the agent *count* is not the completeness lever — breadth is
+fixed by the DIMENSION taxonomy (adding agents to the same dimension just re-finds the
+same issues), and *depth* is owned by the Phase 2 critic loop. Pick the **fan-out
+granularity** by target size, reusing the `steps/spawn-agent.md` thresholds:
+
+| Target size | Granularity | Agent count |
+|-------------|-------------|-------------|
+| ≤ 3 UCs **and** ≤ 300 lines | one agent per DIMENSION over the whole file | = number of dimensions |
+| > 3 UCs **or** > 300 lines | one agent per **DIMENSION × UC-scope** (UCs + a PRD-global scope), batched to fit the agent cap | `dimensions × (UCs + 1)`, capped (see below) |
+
+The larger granularity keeps each sub-agent's context small and its scan exhaustive on a
+single UC — which is what prevents misses on big PRDs.
+
+> **Global (non-UC) sections — required in `DIMENSION × UC` mode.** Per-UC agents only
+> see one UC each, so PRD-wide sections that belong to no UC (scope, success metrics,
+> problem statement, terminology, glossary, changelog) would go unscanned. Whenever you
+> fan out per UC, also include a **"PRD-global"** scope (the non-UC sections, findings get
+> `uc_id: ""`) alongside the UC list. So the natural agent count is `dimensions × (UCs + 1)`.
+> (Not needed in the whole-file mode — there each agent already sees the global sections.)
+
+### Agent cap — batch UCs when the fan-out gets too wide
+
+`dimensions × (UCs + 1)` can explode on large PRDs (e.g. 6 checks × (8 UCs + 1) = 54
+agents). Cap the wave at **`AGENT_CAP = 12`** agents and batch UC scopes to fit:
+
+1. Build the scope list = `[UC1, UC2, …, UCn, PRD-global]` (length `UCs + 1`).
+2. Compute scopes-per-agent-bucket: `groups = max(1, floor(AGENT_CAP / dimensions))`.
+   - If `groups ≥ UCs + 1` → no batching needed, run one agent per `DIMENSION × scope`.
+   - Else split the scope list into `groups` contiguous buckets of roughly equal size
+     (keep `PRD-global` in its own bucket if it fits; otherwise append it to the last
+     bucket). Each agent then handles **one DIMENSION over one bucket of UCs**.
+3. Resulting wave size = `dimensions × groups ≤ AGENT_CAP`.
+
+A batched agent reviews several UCs at once — still scoped far tighter than the whole
+file, so coverage stays high. `AGENT_CAP` is the only knob; raise it if the host allows
+more concurrency, lower it to save tokens. Whole-file mode (≤ 3 UCs) never hits the cap.
+
+Spawn the chosen sub-agents using the Agent tool (send them in a single message so they
+run concurrently). Each sub-agent gets a **fresh context window** and scans its scope
+through its **one** dimension only — deeper coverage than one session juggling every
+dimension at once (avoids lost-in-the-middle).
+
+Sub-agent prompt template (fill the braces):
+
+```
+You are a {DIMENSION_NAME} reviewer. Read the full target file at {target_file}.
+Scope: review ONLY through the {DIMENSION_NAME} lens/check — {DIMENSION_DESCRIPTION}.
+Be exhaustive: scan every section, every UC, every AC/BR/scenario. Do not stop early.
+Project context (terminology, entities, architecture):
+{slim_context — banned terms, canonical entities, layer order, domains}
+
+Return a JSON array of findings, each:
+{ "dimension": "{DIMENSION_NAME}", "severity": "critical|major|minor",
+  "section": "...", "uc_id": "...", "quote": "<verbatim ≤120 chars>",
+  "finding": "...", "suggestion": "...", "auto_fixable": true|false }
+Return [] if this dimension is clean. Return ONLY the JSON array.
+```
+
+Collect every sub-agent's array into one consolidated list `ALL_FINDINGS`.
+
+---
+
+## Phase 2 — Completeness-critic convergence loop
+
+This is the anti-whack-a-mole step. Repeat until **two consecutive rounds add zero new
+findings**, or a hard cap of **3 rounds**, whichever comes first:
+
+1. Spawn one **completeness-critic** sub-agent with the Agent tool. Give it:
+   - the full target file (`{target_file}`),
+   - the current `ALL_FINDINGS` list (so it knows what is already captured),
+   - the same slim context.
+   Prompt it:
+   ```
+   Here is a document and a list of issues already found. Read the WHOLE document.
+   List ONLY real, additional issues NOT already in the list — gaps, ambiguities,
+   contradictions, missing edge/negative paths, coverage holes, terminology drift,
+   structural omissions, and any issue that a fix to an existing finding would expose.
+   Do NOT repeat anything already listed. Return the same finding JSON shape, or [] if
+   nothing new.
+   ```
+2. Append any genuinely new findings (not already in `ALL_FINDINGS`) to the list.
+3. If this round returned 0 new → increment the dry-round counter; else reset it to 0.
+4. Stop when dry-round counter reaches 2, or after 3 rounds total.
+
+Record `convergence_rounds` (how many critic rounds ran) for the report.
+
+---
+
+## Phase 3 — Dedup, resolve conflicts, merge
+
+Sub-agents run **blind to each other** (independence = diverse coverage). They never
+talk or reconcile among themselves — all duplicate/conflict resolution happens **here in
+the orchestrator**, where the full set is visible.
+
+1. **Deduplicate** `ALL_FINDINGS`: two findings are duplicates if they target the same
+   `section` + `uc_id` and describe the same underlying issue. Keep the one with the
+   richer `suggestion`; if they differ on severity, keep the **higher** severity.
+2. **Resolve conflicts** — group remaining findings by `section` + `uc_id` and check for
+   contradictions (two findings whose `suggestion`s cannot both be applied, or that
+   propose opposite fixes for the same spot):
+   - If the two suggestions can be **merged** into one coherent fix → merge them into a
+     single finding.
+   - If they are **mutually exclusive** → emit **one** finding that states both options
+     and set `auto_fixable: false` with `status: "needs_discussion"` (PRD) /
+     `status: "pending"` (review) so a human picks — never silently drop one side.
+   - If a finding is **invalidated** by another (e.g. a structural finding says a section
+     is missing, but another quotes content from it) → drop the invalid one.
+3. **Sort** by severity (critical → major → minor), then by `section` order in the file.
+4. **Assign stable IDs** `F001, F002, …` in that sorted order.
+5. Map each finding's `dimension` into the command's schema field
+   (`lens` for `/refine-prd`; `check_id` for `/review-context`).
+6. Write the **single** findings file in the FINDINGS SCHEMA the command defines.
+
+In the command's final report, add one line:
+```
+Convergence: {convergence_rounds} critic round(s) — findings file is complete; re-running should surface 0 new issues.
+```

package/core/steps/spawn-agent.md

@@ -0,0 +1,124 @@
+# Sub-Agent Orchestration Pattern
+
+Used by heavy commands when the target exceeds the complexity threshold.
+The main session becomes a **lightweight orchestrator** — it only coordinates.
+Each unit of work runs in its own sub-agent with a fresh context window.
+
+---
+
+## Complexity Thresholds
+
+| Signal | Threshold | Action |
+|--------|-----------|--------|
+| UC count in PRD | > 3 UCs | spawn 1 agent per UC |
+| PRD length | > 300 lines | spawn agents regardless of UC count |
+
+If **either** threshold is exceeded → switch to orchestration mode.
+
+---
+
+## Orchestrator Steps (main session)
+
+### Step A — Build slim context
+
+Extract only what sub-agents need — do NOT pass full CLAUDE.md or full business-dictionary:
+
+```json
+{
+  "project_name": "{project.name}",
+  "tech_stack": {
+    "language":       "{tech_stack.language}",
+    "framework":      "{tech_stack.framework}",
+    "build_tool":     "{tech_stack.build_tool}",
+    "test_framework": "{tech_stack.test_framework}",
+    "database":       "{tech_stack.database}",
+    "module":         "{tech_stack.module}"
+  },
+  "conventions": {
+    "build_command":  "{conventions.build_command}",
+    "commit_format":  "{conventions.commit_format}"
+  },
+  "paths": {
+    "specs_dir":     "{paths.specs_dir}",
+    "trace_dir":     "{paths.trace_dir}",
+    "tech_docs_dir": "{paths.tech_docs_dir}"
+  },
+  "architecture_summary": "<3-5 bullet points: layer order + key rules only>",
+  "domains": ["{domain1}", "{domain2}"],
+  "banned_terms": ["{term1}", "{term2}"]
+}
+```
+
+### Step B — Extract UC list
+
+Scan the target PRD for `#### {TICKET-ID}-UC{N}:` headings.
+Build list: `[ { uc_id, uc_name, line_start, line_end } ]`
+
+### Step C — Announce plan
+
+```
+High complexity detected — {N} UCs / {L} lines in {prd_file}
+Spawning {N} sub-agents (1 per UC)...
+  Agent 1 → {TICKET-ID}-UC1: {UC name}
+  Agent 2 → {TICKET-ID}-UC2: {UC name}
+  ...
+```
+
+### Step D — Spawn one sub-agent per UC
+
+Build payload and invoke Agent tool for each UC:
+
+```json
+{
+  "_agent_mode": true,
+  "command":      "generate-bdd",
+  "uc_id":        "{TICKET-ID}-UC{N}",
+  "target_file":  "{absolute path to PRD or feature file}",
+  "uc_section":   { "line_start": {N}, "line_end": {N} },
+  "context":      { "<slim context from Step A>" }
+}
+```
+
+> **Command scope**: Only `/generate-bdd` initiates orchestration mode. `/generate-code` and `/dev-gen-test` can run as sub-agents (they respect `_agent_mode: true` from Gate Step 0), but they do not spawn further sub-agents — their scope is already a single UC.
+
+Serialize this JSON and pass as `$ARGUMENTS` when invoking the sub-agent command.
+
+### Step E — Collect and merge results
+
+Each sub-agent returns:
+```json
+{
+  "uc_id":         "{TICKET-ID}-UC{N}",
+  "files_created": ["path/to/file1", "path/to/file2"],
+  "status":        "success | error",
+  "errors":        []
+}
+```
+
+Merge into a single report (follow report-footer.md format).
+If any sub-agent errors → list them clearly and suggest re-run for that UC only.
+
+---
+
+## Sub-Agent Entry Point (called commands)
+
+When `gate.md Step 0` detects `_agent_mode: true`:
+
+1. Parse full payload from `$ARGUMENTS`
+2. **Skip context-loader.md** — use `payload.context` directly
+3. **Scope to `payload.uc_id` only** — do not process other UCs in the file
+4. Read only the PRD section between `payload.uc_section.line_start` and `line_end`
+5. Execute the command's normal logic for this single UC
+6. Return structured result JSON (Step E format above)
+
+---
+
+## Context Window Savings
+
+| Mode | What loads per session |
+|------|------------------------|
+| Single session (≤ 3 UC) | Full context + full PRD + all UCs |
+| Orchestrator | Slim context + UC headings only |
+| Each sub-agent | Slim context + **1 UC section only** |
+
+The larger the PRD, the bigger the saving per sub-agent.

package/core/steps/trace-mirror.md

@@ -0,0 +1,26 @@
+# Refresh Living Docs panel mirror *(local, umbrella mode)*
+
+*Skip entirely in single-service mode (no `services` and no `setup.spec_source`) — there
+the repo's own `.trace/` IS the panel location, so nothing to mirror.*
+
+After updating the authoritative TSV(s) at `{paths.trace_dir}`:
+
+**When `setup.spec_source` is set (consolidated trace — the common case):**
+`{paths.trace_dir}` resolves to `{spec_source}/.trace` — the single authoritative location.
+This command runs from `service_root`, so the write is **cross-repo into the spec submodule**;
+commit/push the spec submodule for the trace update (same as `feedback/`).
+1. Resolve `panel_mirror = ./.trace` at the **current workspace root**.
+2. If `panel_mirror` resolves to a different path than `{paths.trace_dir}`, copy each
+   just-updated `{UC-ID}.tsv` → `{panel_mirror}/{UC-ID}.tsv` (create the dir; overwrite).
+   No per-service namespacing — there is one trace set; the owning service is carried in each
+   row's `@trace.service`.
+
+**Legacy (no `spec_source` — per-service trace):**
+Copy each just-updated `{UC-ID}.tsv` → `{panel_mirror}/{service-name}/{UC-ID}.tsv`
+(namespaced by `active_service`).
+
+This keeps the open workspace's Living Docs panel current **between syncs** — it is a
+**local convenience mirror only**. The merged `trace-report.json` (canonical, in
+`{spec_source}/.living-docs/`) is rebuilt by `/sync` or `/validate-traces`. For orchestrated
+commands, do this once in the orchestrator after all sub-agents return — not inside each
+sub-agent.

package/core/templates/architecture.template.md

@@ -0,0 +1,113 @@
+# §1. Project Overview
+
+Project    : {{PROJECT_NAME}}
+Language   : {{LANGUAGE}}          # e.g., Java 17 / TypeScript / C# / Go
+Framework  : {{FRAMEWORK}}         # e.g., Spring Boot 3.2 / Angular 17 / .NET 8
+Build      : {{BUILD_COMMAND}}     # e.g., mvn clean install -DskipTests / dotnet build / ng build
+Test       : {{TEST_COMMAND}}      # e.g., mvn test / dotnet test / ng test
+Domains    : {{COMMA_SEPARATED_DOMAINS}}
+
+# §2. Architecture
+
+style: "{{ARCH_STYLE}}"  # e.g., Layered / Clean / Hexagonal / Component-based
+
+layers: "{{LAYER_STACK}}"
+# Examples:
+#   Java/Spring:  Controller → Facade → Service → Repository
+#   .NET Clean:   Presentation → Application → Domain → Infrastructure
+#   Angular:      Component → Service → HTTP Client → Backend API
+#   Go:           Handler → UseCase → Repository → Domain
+
+rules:
+  - "{{ARCH_RULE_1}}"  # e.g., Controllers must not contain business logic
+  - "{{ARCH_RULE_2}}"  # e.g., Services own transaction boundaries
+  - "{{ARCH_RULE_3}}"  # e.g., Repositories must not call services
+
+# Layer dependency direction (inner layers must not depend on outer):
+# {{OUTER_LAYER}} → {{MIDDLE_LAYER}} → {{INNER_LAYER}}
+
+# §3. Coding Standards
+
+naming:
+  classes: "{{CLASS_NAMING}}"        # e.g., PascalCase / PascalCase+Suffix
+  methods: "{{METHOD_NAMING}}"       # e.g., camelCase / PascalCase
+  packages: "{{PACKAGE_NAMING}}"     # e.g., lowercase / lowercase.snake_case
+  files: "{{FILE_NAMING}}"           # e.g., PascalCase.java / kebab-case.ts
+
+patterns:
+  response_wrapper: "{{RESPONSE_WRAPPER}}"  # e.g., ApiResponse<T> / Result<T> / IActionResult
+  mapping: "{{MAPPING_LIBRARY}}"            # e.g., MapStruct / AutoMapper / manual
+  exception_base: "{{BASE_EXCEPTION}}"      # e.g., ResourceNotFoundException / DomainException
+
+forbidden:
+  - "Magic numbers — use named constants"
+  - "Debug print statements in production code"
+  - "{{PROJECT_SPECIFIC_FORBIDDEN_PATTERN}}"
+
+# §4. API Conventions
+
+versioning: "{{API_VERSIONING}}"     # e.g., /v1/ prefix / header-based / query param
+auth: "{{AUTH_MECHANISM}}"           # e.g., JWT Bearer / OAuth2 / API Key
+
+http_status:
+  get_list:    200   # paginated or full list
+  get_single:  200
+  create:      201
+  update:      200
+  delete:      204
+  bad_request: 400
+  unauthorized: 401
+  forbidden:   403
+  not_found:   404
+  server_error: 500
+
+error_response_format: |
+  {
+    "code": "ERROR_CODE",
+    "message": "Human readable message",
+    "details": {}   // optional field-level errors
+  }
+
+# §5. Error Handling
+
+not_found_exception: "{{NOT_FOUND_EXCEPTION_CLASS}}"  # e.g., ResourceNotFoundException
+validation_exception: "{{VALIDATION_EXCEPTION_CLASS}}" # e.g., ValidationException
+domain_exception: "{{DOMAIN_EXCEPTION_CLASS}}"         # e.g., DomainException / BusinessRuleViolationException
+
+global_handler: "{{GLOBAL_EXCEPTION_HANDLER}}"  # e.g., @ControllerAdvice / ExceptionHandlerMiddleware
+
+rules:
+  - "Never swallow exceptions silently"
+  - "Log at error level with full stack trace for 5xx"
+  - "{{PROJECT_SPECIFIC_ERROR_RULE}}"
+
+# §6. Testing Standards
+
+unit_test_framework: "{{UNIT_TEST_FW}}"        # e.g., JUnit 5 + Mockito / xUnit + Moq / Jest
+integration_test_framework: "{{IT_TEST_FW}}"   # e.g., Spring Boot Test / WebApplicationFactory
+
+coverage_targets:
+  unit: "{{UNIT_COVERAGE_PCT}}%"          # e.g., 80%
+  integration: "{{IT_COVERAGE_PCT}}%"     # e.g., key flows covered
+
+naming_pattern: "{{TEST_METHOD_NAMING}}"  # e.g., methodName_whenCondition_shouldExpectation
+
+rules:
+  - "Unit tests mock direct dependencies only"
+  - "Integration tests cover happy path + main error paths"
+  - "Every scenario in .feature must have a corresponding test"
+
+# §7. Git Conventions
+
+branch_feature: "feature/{{TICKET_PREFIX}}-{N}-{slug}"
+branch_fix:     "fix/{{TICKET_PREFIX}}-{N}-{slug}"
+branch_chore:   "chore/{slug}"
+
+commit_feature: "feat({{TICKET_PREFIX}}-{N}): {description}"
+commit_fix:     "fix({{TICKET_PREFIX}}-{N}): {description}"
+commit_chore:   "chore: {description}"
+commit_docs:    "docs: {description}"
+
+pr_title: "{{TICKET_PREFIX}}-{N}: {feature name}"
+pr_requires_review: true
+pr_branch_protection: "{{BASE_BRANCH}}"  # e.g., main / develop

package/core/templates/design-spec.template.md

@@ -0,0 +1,217 @@
+# {TICKET-ID} {Feature Name} — Design Spec [{Platform}]
+
+<!--
+  Template này được sử dụng bởi /generate-design-spec.
+  Platform = web | app | app-ios | app-android
+
+  PLATFORM SECTIONS:
+  - Section 3A + 4A: chỉ dành cho web (react/nextjs/vue/angular). Xóa C khi dùng cho web.
+  - Section 3C + 4B: chỉ dành cho app (flutter/react-native/ios/android). Xóa A+B khi dùng cho app.
+
+  COMPONENT MAPPING (bắt buộc):
+  - Mọi component trong Component Inventory PHẢI được map với figma-components/{module}.md
+  - ✅ Matched     → dùng Code Component và Import Path từ catalog
+  - ⚠️ TODO        → đánh dấu [TODO — chưa implement]
+  - ❌ Chưa có     → đánh dấu [NEW — cần confirm với designer]
+
+  FIGMA LINKS (bắt buộc mỗi màn):
+  - Mỗi screen PHẢI có link Figma node-level (URL chứa ?node-id=...) — lấy bằng
+    right-click frame → "Copy link to selection". Đây là link AI đọc được qua Figma MCP.
+  - Link file trần (không có node-id) KHÔNG hợp lệ — AI không định vị được frame.
+  - Screen chưa có design → đánh dấu ❌ Missing; spec giữ Status "draft", chặn sign-off
+    và /generate-bdd cho tới khi đủ link.
+
+  SCREEN STATES (bắt buộc mỗi màn):
+  - Tối thiểu: default, loading, error
+  - Thêm "empty" nếu màn có thể hiển thị trạng thái không có dữ liệu
+  - Thêm "success" nếu action tạo ra trạng thái xác nhận riêng biệt
+-->
+
+---
+
+## Metadata
+
+| Field              | Value                                                         |
+|--------------------|---------------------------------------------------------------|
+| **Spec ID**        | {TICKET-ID}-DS-{platform}                                     |
+| **Version**        | 1.0                                                           |
+| **Status**         | draft / approved                                              |
+| **Platform**       | {web \| app \| app-ios \| app-android}                        |
+| **Module**         | {active_module}                                               |
+| **Service**        | {active_service}                                              |
+| **Domain**         | {domain}                                                      |
+| **Business PRD**   | [{TICKET-ID}](./{TICKET-ID}-slug.md)                          |
+| **Figma**          | {feature file link} ({linked}/{N} frames linked)             |
+| **Author**         | {PO name or "AI-assisted"}                                    |
+| **Created**        | {YYYY-MM-DD}                                                  |
+| **Updated**        | {YYYY-MM-DD}                                                  |
+
+---
+
+# 1. Screen Inventory
+
+| # | Screen Name | Entry Point | Figma Frame (node-level link) | Notes |
+|---|-------------|-------------|-------------------------------|-------|
+| 1 | {Screen 1}  | {how user arrives} | [Frame]({node-level url}) | |
+| 2 | {Screen 2}  | {entry point} | ❌ Missing — add node-id link | |
+
+---
+
+# 2. Screen Specs
+
+## Screen 1: {Screen Name}
+
+**Figma**: [{Frame name}]({figma_frame_url})
+
+### Layout
+
+{Grid / max-width / padding / spacing — reference design tokens where applicable}
+
+### Component Inventory
+
+| Component (Figma)      | Code Component | Import Path            | States                          | Notes   |
+|------------------------|----------------|------------------------|---------------------------------|---------|
+| {Figma/Button/Primary} | Button         | @/components/ui/Button | default, loading, disabled      |         |
+| {Figma/Input/Text}     | TextInput      | @/components/ui/Input  | default, focus, error, disabled |         |
+
+### Screen States
+
+| State     | Trigger                          | UI Behavior                                              |
+|-----------|----------------------------------|----------------------------------------------------------|
+| default   | Screen loaded, data available    | {Describe full rendered appearance}                      |
+| loading   | API call in flight               | {Skeleton / spinner position and style}                  |
+| error     | API failure / validation error   | {Toast / inline error / error screen + recovery CTA}     |
+| empty     | No data returned                 | {Illustration + CTA — e.g., "No items yet. Add one →"}   |
+| success   | Action completed (if applicable) | {Confirmation toast / navigation / visual change}        |
+
+### Actions & Navigation
+
+| Action          | Trigger                   | Result                                            |
+|-----------------|---------------------------|---------------------------------------------------|
+| {Action name}   | Tap/click {element}       | Navigate to {Screen N} / Open {Modal name}        |
+| {Back/Cancel}   | Back gesture / button     | Return to {previous screen} without saving        |
+
+---
+
+<!--  Repeat ## Screen N for each additional screen  -->
+
+---
+
+# 3. Interaction Patterns
+
+<!-- === WEB ONLY — delete this section for app === -->
+
+## A. Responsive Behavior  *(web)*
+
+| Breakpoint | Width      | Layout Changes                              |
+|------------|------------|---------------------------------------------|
+| Mobile     | < 768px    | {Single column, bottom nav, full-width CTA} |
+| Tablet     | 768–1279px | {2-col grid, sidebar collapsed}             |
+| Desktop    | ≥ 1280px   | {Full layout, max-width 1440px}             |
+
+## B. Hover / Focus / Keyboard  *(web)*
+
+| Element        | Hover                         | Focus                           | Keyboard      |
+|----------------|-------------------------------|---------------------------------|---------------|
+| Primary button | Background → {color.hover}    | Outline 2px {color.focus}       | Enter / Space |
+| Text input     | Border → {color.border.hover} | Border → {color.primary}        | Tab to focus  |
+
+<!-- === APP ONLY — delete sections A+B for app === -->
+
+## C. Gestures & Navigation  *(app)*
+
+| Gesture              | Screen / Element    | Behavior                                    |
+|----------------------|---------------------|---------------------------------------------|
+| Back gesture         | All screens         | {Return / show "Discard changes?" dialog}   |
+| Pull-to-refresh      | {Screen names}      | Refresh data, spinner at top                |
+| Swipe left on row    | {List item}         | Reveal {Delete / Archive} action            |
+
+### Navigation Stack  *(app)*
+
+```
+{e.g., BottomTab(Home) → ListPage → DetailPage → EditPage}
+```
+
+### Platform Conventions  *(app)*
+
+| Aspect           | iOS                                       | Android                             |
+|------------------|-------------------------------------------|-------------------------------------|
+| Navigation bar   | Back button top-left, title centered      | Up arrow, title left-aligned        |
+| Bottom sheet     | UISheetPresentation, grabber visible      | BottomSheet, drag handle            |
+| Dialog           | Actions right-aligned                     | Actions left-aligned                |
+
+---
+
+# 4. Platform Considerations
+
+<!-- === WEB ONLY === -->
+
+## A. Accessibility  *(web)*
+
+- [ ] All interactive elements reachable by Tab key — no keyboard traps
+- [ ] Focus trap inside modals
+- [ ] Icon-only buttons have `aria-label`
+- [ ] Dynamic content announces via `aria-live`
+- [ ] WCAG AA contrast: text ≥ 4.5:1, large text ≥ 3:1
+- [ ] Form inputs have visible labels (not placeholder-only)
+
+<!-- === APP ONLY === -->
+
+## B. Device & OS  *(app)*
+
+- [ ] Safe area insets applied (top + bottom) on all screens
+- [ ] Minimum touch target: 44×44pt (iOS) / 48×48dp (Android)
+- [ ] Tested on 375pt (iPhone SE) and 360dp (small Android)
+- [ ] Deep link: `{scheme}://{host}/{path}` → {screen name}
+- [ ] Permissions: {Camera / Location / Notification} — rationale copy TBD
+- [ ] Offline: {screen name} shows cached data + banner; {action} disabled with tooltip
+- [ ] Dark mode tested — no hardcoded colors
+
+---
+
+# 5. AC-UI — Design Acceptance Criteria
+
+> Reviewed and signed off by **PO + Designer** before BDD generation.
+> Complements business-level AC in [Business PRD](./{TICKET-ID}-slug.md).
+
+| ID     | Acceptance Criterion                                                     | Verified by     |
+|--------|--------------------------------------------------------------------------|-----------------|
+| AC-UI1 | All screens match approved Figma frames within design-system tolerances  | Designer        |
+| AC-UI2 | Loading state appears within 200ms of any API call initiation            | QA              |
+| AC-UI3 | All error messages are visible, descriptive, and include a recovery CTA  | PO              |
+| AC-UI4 | Empty states include illustration and call-to-action                     | PO + Designer   |
+| AC-UI5 | {Platform-specific criterion}                                            | QA              |
+
+---
+
+# Appendix
+
+## Figma Summary
+
+| Screen     | Figma Frame (node-level) | Link / Fetch Status            |
+|------------|--------------------------|--------------------------------|
+| {Screen 1} | [Link]({node-level url}) | ✅ Linked & fetched            |
+| {Screen 2} | —                        | ❌ Missing — no node-id link    |
+
+## Design Tokens Referenced
+
+| Token             | Value    | Used in                    |
+|-------------------|----------|----------------------------|
+| `color.primary`   | {#hex}   | Buttons, links             |
+| `spacing.md`      | {16px}   | Standard vertical gap      |
+
+## References
+
+- [{TICKET-ID}](./{TICKET-ID}-slug.md) — Business PRD
+
+## AI Assumptions
+
+- {Assumption — [AI DRAFT]}
+
+---
+
+## Changelog
+
+| Version | Date         | Changes         |
+|---------|--------------|-----------------|
+| 1.0     | {YYYY-MM-DD} | Initial version |