# Trang 2.4: Giải thích cấu trúc thư mục .agent/ (Agents, Skills, Workflows, Rules, Scripts).

## 1. Tổng quan cấu trúc

Sau khi chạy lệnh `ag-kit init`, thư mục `.agent/` được tạo ra trong dự án của bạn với cấu trúc như sau:

<div class="relative whitespace-pre-wrap word-break-all my-2 rounded-lg bg-list-hover-subtle border border-gray-500/20" id="bkmrk-" node="[object Object]"><div class="min-h-7 relative box-border flex flex-row items-center justify-between rounded-t border-b border-gray-500/20 px-2 py-0.5"><div class="font-sans text-sm text-ide-text-color opacity-60">  
</div><div class="flex flex-row gap-2 justify-end">  
</div></div><div class="p-3"><div class="w-full h-full text-xs cursor-text"><div class="code-block"><div class="code-line" data-line-end="1" data-line-number="1" data-line-start="1">  
</div><div class="code-line" data-line-end="9" data-line-number="9" data-line-start="9"><div class="line-content">  
</div></div></div></div></div></div>```html
.agent/
├── ARCHITECTURE.md # Tài liệu kiến trúc tổng thể
├── AGENT_FLOW.md # Sơ đồ luồng hoạt động chi tiết
├── mcp_config.json # Cấu hình MCP servers (tích hợp bên thứ 3)
├── agents/ # 20 file cấu hình Specialist Agent
├── skills/ # 36 thư mục kiến thức chuyên sâu
├── workflows/ # 11 file quy trình làm việc
├── rules/ # Quy tắc hành vi toàn cục (GEMINI.md)
└── scripts/ # Script kiểm tra tổng thể (Python)
```

Mỗi thư mục có một vai trò cụ thể và rõ ràng. Dưới đây là giải thích chi tiết từng thành phần.

---

## 2. File <span class="context-scope-mention"><span class="inline-flex items-center gap-0.5 rounded-md align-middle text-sm font-medium transition-[opacity,background-color] cursor-pointer hover:bg-gray-500/20 select-text translate-y-[-1px]" draggable="true"><span class="inline-flex break-all leading-tight">ARCHITECTURE.md</span></span></span>

**Đây là "bản đồ hệ thống"** dành cho AI.

<div class="my-4 rounded-lg overflow-hidden border border-gray-500/20 [&_thead_tr:first-child_th:first-child]:border-t-0 [&_thead_tr:first-child_th:first-child]:border-l-0 [&_thead_tr:first-child_th:last-child]:border-t-0 [&_thead_tr:first-child_th:last-child]:border-r-0 [&_tbody_tr:last-child_td:first-child]:border-b-0 [&_tbody_tr:last-child_td:first-child]:border-l-0 [&_tbody_tr:last-child_td:last-child]:border-b-0 [&_tbody_tr:last-child_td:last-child]:border-r-0 [&_thead_tr:first-child_th]:border-t-0 [&_tbody_tr:last-child_td]:border-b-0 [&_th:first-child]:border-l-0 [&_td:first-child]:border-l-0 [&_th:last-child]:border-r-0 [&_td:last-child]:border-r-0" id="bkmrk-m%E1%BB%A5c-n%E1%BB%99i-dung-m%E1%BB%A5c-%C4%91%C3%ADc"><table class="min-w-full border-separate border-spacing-0"><thead><tr><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20">Mục</th><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20">Nội dung</th></tr></thead><tbody><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Mục đích**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Cung cấp cái nhìn tổng thể về toàn bộ kiến trúc của Kit cho AI</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Nội dung**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Danh sách đầy đủ 20 Agents (vai trò + Skills sử dụng), 36 Skills (phân loại theo nhóm), 11 Workflows (mô tả ngắn) và 2 master scripts</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Ai đọc**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">AI đọc file này đầu tiên khi khởi động để hiểu hệ sinh thái</td></tr></tbody></table>

</div>> **Lưu ý:** Không nên sửa file này trừ khi bạn thêm Agent hoặc Skill tùy chỉnh và muốn AI biết về chúng.

---

## 3. File <span class="context-scope-mention"><span class="inline-flex items-center gap-0.5 rounded-md align-middle text-sm font-medium transition-[opacity,background-color] cursor-pointer hover:bg-gray-500/20 select-text translate-y-[-1px]" draggable="true"><span class="inline-flex break-all leading-tight">AGENT\_FLOW.md</span></span></span>

**Đây là "hướng dẫn vận hành"** — mô tả chi tiết cách AI phải hành xử.

<div class="my-4 rounded-lg overflow-hidden border border-gray-500/20 [&_thead_tr:first-child_th:first-child]:border-t-0 [&_thead_tr:first-child_th:first-child]:border-l-0 [&_thead_tr:first-child_th:last-child]:border-t-0 [&_thead_tr:first-child_th:last-child]:border-r-0 [&_tbody_tr:last-child_td:first-child]:border-b-0 [&_tbody_tr:last-child_td:first-child]:border-l-0 [&_tbody_tr:last-child_td:last-child]:border-b-0 [&_tbody_tr:last-child_td:last-child]:border-r-0 [&_thead_tr:first-child_th]:border-t-0 [&_tbody_tr:last-child_td]:border-b-0 [&_th:first-child]:border-l-0 [&_td:first-child]:border-l-0 [&_th:last-child]:border-r-0 [&_td:last-child]:border-r-0" id="bkmrk-m%E1%BB%A5c-n%E1%BB%99i-dung-m%E1%BB%A5c-%C4%91%C3%ADc-1"><table class="min-w-full border-separate border-spacing-0"><thead><tr><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20">Mục</th><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20">Nội dung</th></tr></thead><tbody><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Mục đích**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Tài liệu hóa giao thức định tuyến Agent, bước kiểm tra bắt buộc và cổng Socratic</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Nội dung**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Quy trình từng bước để AI chọn Agent, Checklist bắt buộc trước khi viết code, mô tả luồng làm việc từ yêu cầu đến kết quả</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Phiên bản**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Được thêm vào từ phiên bản 2.0.1</td></tr></tbody></table>

</div>---

## 4. File <span class="context-scope-mention"><span class="inline-flex items-center gap-0.5 rounded-md align-middle text-sm font-medium transition-[opacity,background-color] cursor-pointer hover:bg-gray-500/20 select-text translate-y-[-1px]" draggable="true"><span class="inline-flex break-all leading-tight">mcp\_config.json</span></span></span>

**Cấu hình tích hợp dịch vụ bên thứ 3** thông qua giao thức MCP (Model Context Protocol).

<div class="relative whitespace-pre-wrap word-break-all my-2 rounded-lg bg-list-hover-subtle border border-gray-500/20" id="bkmrk--7" node="[object Object]"><div class="min-h-7 relative box-border flex flex-row items-center justify-between rounded-t border-b border-gray-500/20 px-2 py-0.5">  
</div><div class="p-3"><div class="w-full h-full text-xs cursor-text"><div class="code-block"><div class="code-line" data-line-end="7" data-line-number="7" data-line-start="7"><div class="line-content">  
</div></div></div></div></div></div>```json
json
{
"mcpServers": {
"context7": { ... }, // Tích hợp Context7 (tài liệu thư viện real-time)
"shadcn": { ... } // Tích hợp ShadCN UI
// Có thể thêm các MCP server khác tại đây
}
}
```

> **Lưu ý:** Để sử dụng, bạn cần copy file cấu hình này đến đúng vị trí mà Antigravity CLI nhận diện (thường là `~/.gemini/antigravity/mcp_config.json`). Xem tài liệu Antigravity CLI để biết thêm chi tiết.

---

## 5. Thư mục `agents/` — 20 Specialist Agents

### Cấu trúc

<div class="relative whitespace-pre-wrap word-break-all my-2 rounded-lg bg-list-hover-subtle border border-gray-500/20" id="bkmrk--9" node="[object Object]"><div class="min-h-7 relative box-border flex flex-row items-center justify-between rounded-t border-b border-gray-500/20 px-2 py-0.5"><div class="font-sans text-sm text-ide-text-color opacity-60">  
</div><div class="flex flex-row gap-2 justify-end">  
</div></div><div class="p-3"><div class="w-full h-full text-xs cursor-text"><div class="code-block"><div class="code-line" data-line-end="1" data-line-number="1" data-line-start="1">  
</div><div class="code-line" data-line-end="7" data-line-number="7" data-line-start="7"><div class="line-content">  
</div></div></div></div></div></div>```html
.agent/agents/
├── orchestrator.md
├── frontend-specialist.md
├── backend-specialist.md
├── security-auditor.md
├── debugger.md
└── ... (16 file khác)
```

### Vai trò

Mỗi file <span class="inline-flex break-all leading-tight">.md</span> là cấu hình đầy đủ cho một Agent chuyên gia. File bao gồm:

- **Phần YAML** (giữa `---`): `name`, `description`, `tools`, và quan trọng nhất là `skills` — danh sách các Skills Agent này được phép truy cập.
- **Phần Markdown**: Mô tả nhân cách, vai trò chuyên môn, các quy tắc hành vi riêng của Agent đó.

### Ví dụ nội dung một file Agent

<div class="relative whitespace-pre-wrap word-break-all my-2 rounded-lg bg-list-hover-subtle border border-gray-500/20" id="bkmrk--10" node="[object Object]"><div class="min-h-7 relative box-border flex flex-row items-center justify-between rounded-t border-b border-gray-500/20 px-2 py-0.5">  
</div><div class="p-3"><div class="w-full h-full text-xs cursor-text"><div class="code-block"><div class="code-line" data-line-end="16" data-line-number="16" data-line-start="16"><div class="line-content">  
</div></div></div></div></div></div>```yaml
yaml
---
name: frontend-specialist
description: Frontend architect for modern web applications
tools: Read, Edit, Write, Bash
skills: react-best-practices, frontend-design, tailwind-patterns, web-design-guidelines
---


# Frontend Specialist


Bạn là một kiến trúc sư Frontend cấp cao với 10+ năm kinh nghiệm...


## Quy tắc bắt buộc
- Luôn ưu tiên Core Web Vitals (LCP, CLS, INP)
- Không dùng màu tím/violet trong thiết kế (Purple Ban)
- Áp dụng mobile-first responsive design
...
```

---

## 6. Thư mục `skills/` — 36 Knowledge Modules

### Cấu trúc

<div class="relative whitespace-pre-wrap word-break-all my-2 rounded-lg bg-list-hover-subtle border border-gray-500/20" id="bkmrk--12" node="[object Object]"><div class="min-h-7 relative box-border flex flex-row items-center justify-between rounded-t border-b border-gray-500/20 px-2 py-0.5"><div class="font-sans text-sm text-ide-text-color opacity-60">  
</div><div class="flex flex-row gap-2 justify-end">  
</div></div><div class="p-3"><div class="w-full h-full text-xs cursor-text"><div class="code-block"><div class="code-line" data-line-end="1" data-line-number="1" data-line-start="1">  
</div><div class="code-line" data-line-end="18" data-line-number="18" data-line-start="18"><div class="line-content">  
</div></div></div></div></div></div>```html
.agent/skills/
├── react-best-practices/
│ ├── SKILL.md # (Bắt buộc) Metadata và hướng dẫn chính
│ ├── sections/ # Hướng dẫn chi tiết theo từng phần
│ └── scripts/ # Script Python/Bash hỗ trợ (nếu có)
├── api-patterns/
│ └── SKILL.md
├── vulnerability-scanner/
│ ├── SKILL.md
│ └── scripts/
│ ├── security_scan.py
│ └── dependency_analyzer.py
├── frontend-design/
│ ├── SKILL.md
│ └── scripts/
│ ├── ux_audit.py
│ └── accessibility_checker.py
└── ... (32 thư mục khác)
```

### Vai trò

- Mỗi thư mục là một **gói kiến thức độc lập** cho một lĩnh vực cụ thể.
- File <div>  
    </div><span class="context-scope-mention"><span class="inline-flex items-center gap-0.5 rounded-md align-middle text-sm font-medium transition-[opacity,background-color] cursor-pointer hover:bg-gray-500/20 select-text translate-y-[-1px]" draggable="true"><span class="inline-flex break-all leading-tight">SKILL.md</span></span></span> là bộ não của mỗi Skill, chứa các nguyên lý ra quyết định thay vì code mẫu cứng nhắc.
- Thư mục `scripts/` (nếu có) chứa các công cụ thực thi Python/Bash để Agent có thể tự chạy kiểm tra.

### Skills có script đặc biệt

Các Skills sau có kèm script Python để thực hiện kiểm tra tự động:

<div class="my-4 rounded-lg overflow-hidden border border-gray-500/20 [&_thead_tr:first-child_th:first-child]:border-t-0 [&_thead_tr:first-child_th:first-child]:border-l-0 [&_thead_tr:first-child_th:last-child]:border-t-0 [&_thead_tr:first-child_th:last-child]:border-r-0 [&_tbody_tr:last-child_td:first-child]:border-b-0 [&_tbody_tr:last-child_td:first-child]:border-l-0 [&_tbody_tr:last-child_td:last-child]:border-b-0 [&_tbody_tr:last-child_td:last-child]:border-r-0 [&_thead_tr:first-child_th]:border-t-0 [&_tbody_tr:last-child_td]:border-b-0 [&_th:first-child]:border-l-0 [&_td:first-child]:border-l-0 [&_th:last-child]:border-r-0 [&_td:last-child]:border-r-0" id="bkmrk-skill-scripts-t%C3%A1c-d%E1%BB%A5"><table class="min-w-full border-separate border-spacing-0"><thead><tr><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20">Skill</th><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20">Scripts</th><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20">Tác dụng</th></tr></thead><tbody><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">`vulnerability-scanner`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">`security_scan.py`, `dependency_analyzer.py`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Quét lỗ hổng bảo mật</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">`lint-and-validate`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">`lint_runner.py`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Kiểm tra chất lượng code</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">`database-design`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">`schema_validator.py`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Kiểm tra tính nhất quán DB schema</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">`testing-patterns`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">`test_runner.py`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Chạy bộ test tự động</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">`frontend-design`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">`ux_audit.py`, `accessibility_checker.py`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Kiểm tra UX và Accessibility</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">`seo-fundamentals`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">`seo_checker.py`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Kiểm tra các yếu tố SEO</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">`performance-profiling`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">`bundle_analyzer.py`, `lighthouse_audit.py`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Đo lường hiệu năng</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">`webapp-testing`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">`playwright_runner.py`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Chạy E2E test</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">`mobile-design`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">`mobile_audit.py`</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Kiểm tra giao diện mobile</td></tr></tbody></table>

</div>---

## 7. Thư mục `workflows/` — 11 Slash Commands

### Cấu trúc

<div class="relative whitespace-pre-wrap word-break-all my-2 rounded-lg bg-list-hover-subtle border border-gray-500/20" id="bkmrk--14" node="[object Object]"><div class="min-h-7 relative box-border flex flex-row items-center justify-between rounded-t border-b border-gray-500/20 px-2 py-0.5"><div class="font-sans text-sm text-ide-text-color opacity-60">  
</div><div class="flex flex-row gap-2 justify-end">  
</div></div><div class="p-3"><div class="w-full h-full text-xs cursor-text"><div class="code-block"><div class="code-line" data-line-end="1" data-line-number="1" data-line-start="1">  
</div><div class="code-line" data-line-end="12" data-line-number="12" data-line-start="12"><div class="line-content">  
</div></div></div></div></div></div>```html
.agent/workflows/
├── brainstorm.md
├── create.md
├── debug.md
├── deploy.md
├── enhance.md
├── orchestrate.md
├── plan.md
├── preview.md
├── status.md
├── test.md
└── ui-ux-pro-max.md
```

### Vai trò

Mỗi file <span class="inline-flex break-all leading-tight">.md</span> là định nghĩa đầy đủ cho một quy trình làm việc. File bao gồm:

- **Phần YAML**: `description` — mô tả ngắn gọn kích hoạt thứ gì trong IDE.
- **Phần Markdown**: Các bước thực hiện chi tiết, quyết định điều kiện, và các `// turbo` annotation (cho phép AI tự chạy lệnh an toàn ở bước đó).

### Cách thêm Workflow tùy chỉnh

Bạn có thể thêm Workflow riêng bằng cách tạo file mới:

```html
.agent/workflows/my-custom-workflow.md
```

Sau đó gọi bằng lệnh `/my-custom-workflow` trong chat với AI.

---

## 8. Thư mục `rules/` — Quy tắc toàn cục

### Cấu trúc

<div class="relative whitespace-pre-wrap word-break-all my-2 rounded-lg bg-list-hover-subtle border border-gray-500/20" id="bkmrk--16" node="[object Object]"><div class="min-h-7 relative box-border flex flex-row items-center justify-between rounded-t border-b border-gray-500/20 px-2 py-0.5"><div class="font-sans text-sm text-ide-text-color opacity-60">  
</div><div class="flex flex-row gap-2 justify-end">  
</div></div><div class="p-3"><div class="w-full h-full text-xs cursor-text"><div class="code-block"><div class="code-line" data-line-end="1" data-line-number="1" data-line-start="1">  
</div><div class="code-line" data-line-end="2" data-line-number="2" data-line-start="2"><div class="line-content">  
</div></div></div></div></div></div>```html
.agent/rules/
└── GEMINI.md # File quy tắc chính, luôn được áp dụng
```

### Vai trò của `GEMINI.md`

Đây là file **quan trọng nhất** trong toàn bộ hệ thống. Nó chứa:

<div class="my-4 rounded-lg overflow-hidden border border-gray-500/20 [&_thead_tr:first-child_th:first-child]:border-t-0 [&_thead_tr:first-child_th:first-child]:border-l-0 [&_thead_tr:first-child_th:last-child]:border-t-0 [&_thead_tr:first-child_th:last-child]:border-r-0 [&_tbody_tr:last-child_td:first-child]:border-b-0 [&_tbody_tr:last-child_td:first-child]:border-l-0 [&_tbody_tr:last-child_td:last-child]:border-b-0 [&_tbody_tr:last-child_td:last-child]:border-r-0 [&_thead_tr:first-child_th]:border-t-0 [&_tbody_tr:last-child_td]:border-b-0 [&_th:first-child]:border-l-0 [&_td:first-child]:border-l-0 [&_th:last-child]:border-r-0 [&_td:last-child]:border-r-0" id="bkmrk-ph%E1%BA%A7n-n%E1%BB%99i-dung-tier-0"><table class="min-w-full border-separate border-spacing-0"><thead><tr><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20">Phần</th><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20">Nội dung</th></tr></thead><tbody><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**TIER 0 — Universal Rules**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Quy tắc luôn áp dụng: Xử lý ngôn ngữ, code sạch, nhận thức phụ thuộc file</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Request Classifier**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Bảng phân loại yêu cầu (Question, Survey, Simple Code, Complex Code, Design...)</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Intelligent Routing**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Giao thức tự động chọn Agent phù hợp</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Agent Routing Checklist**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Các bước bắt buộc AI phải làm trước khi viết code</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**TIER 1 — Code Rules**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Quy tắc khi viết code: Chọn project type, Socratic Gate</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Gemini Mode Mapping**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Ánh xạ Plan/Ask/Edit mode sang Agent tương ứng</td></tr></tbody></table>

</div>> **Tùy chỉnh:** `GEMINI.md` có thể được chỉnh sửa để thêm các quy tắc riêng của dự án hoặc tổ chức. Ví dụ: thêm quy tắc về naming convention, ngôn ngữ bình luận code, hay các pattern cấm dùng.

---

## 9. Thư mục `scripts/` — Master Validation Scripts

### Cấu trúc

```html
.agent/scripts/
├── checklist.py # Kiểm tra ưu tiên (P0→P6)
├── verify_all.py # Kiểm tra toàn diện (bao gồm Lighthouse, Playwright)
├── auto_preview.py # Tự động khởi chạy server xem trước
└── session_manager.py # Quản lý trạng thái phiên làm việc AI
```

### So sánh hai main scripts

<div class="my-4 rounded-lg overflow-hidden border border-gray-500/20 [&_thead_tr:first-child_th:first-child]:border-t-0 [&_thead_tr:first-child_th:first-child]:border-l-0 [&_thead_tr:first-child_th:last-child]:border-t-0 [&_thead_tr:first-child_th:last-child]:border-r-0 [&_tbody_tr:last-child_td:first-child]:border-b-0 [&_tbody_tr:last-child_td:first-child]:border-l-0 [&_tbody_tr:last-child_td:last-child]:border-b-0 [&_tbody_tr:last-child_td:last-child]:border-r-0 [&_thead_tr:first-child_th]:border-t-0 [&_tbody_tr:last-child_td]:border-b-0 [&_th:first-child]:border-l-0 [&_td:first-child]:border-l-0 [&_th:last-child]:border-r-0 [&_td:last-child]:border-r-0" id="bkmrk-ti%C3%AAu-ch%C3%AD-checklist.p"><table class="min-w-full border-separate border-spacing-0"><thead><tr><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20">Tiêu chí</th><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20"><div>  
</div><span class="context-scope-mention"><span class="inline-flex items-center gap-0.5 rounded-md align-middle text-sm font-medium transition-[opacity,background-color] cursor-pointer hover:bg-gray-500/20 select-text translate-y-[-1px]" draggable="true"><span class="inline-flex break-all leading-tight">checklist.py</span></span></span></th><th class="bg-gray-500/20 px-3 py-2 text-left font-medium leading-snug border border-gray-500/20"><div>  
</div><span class="context-scope-mention"><span class="inline-flex items-center gap-0.5 rounded-md align-middle text-sm font-medium transition-[opacity,background-color] cursor-pointer hover:bg-gray-500/20 select-text translate-y-[-1px]" draggable="true"><span class="inline-flex break-all leading-tight">verify\_all.py</span></span></span></th></tr></thead><tbody><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Khi nào dùng**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Phát triển hàng ngày, trước commit</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Trước khi release production</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Tốc độ**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Nhanh (dừng ngay khi có lỗi nghiêm trọng)</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Chậm hơn (chạy toàn bộ)</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Yêu cầu**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Không cần URL</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Cần cung cấp URL để chạy Lighthouse &amp; Playwright</td></tr><tr><td class="px-3 py-2 leading-snug border border-gray-500/20">**Phạm vi kiểm tra**</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Security, Lint, Schema, Tests, UX, SEO</td><td class="px-3 py-2 leading-snug border border-gray-500/20">Tất cả của checklist + Lighthouse, Playwright, Bundle, Mobile, i18n</td></tr></tbody></table>

</div>### Cách chạy thủ công

<div class="relative whitespace-pre-wrap word-break-all my-2 rounded-lg bg-list-hover-subtle border border-gray-500/20" id="bkmrk--18" node="[object Object]"><div class="min-h-7 relative box-border flex flex-row items-center justify-between rounded-t border-b border-gray-500/20 px-2 py-0.5">  
</div><div class="p-3"><div class="w-full h-full text-xs cursor-text"><div class="code-block"><div class="code-line" data-line-end="5" data-line-number="5" data-line-start="5"><div class="line-content">  
</div></div></div></div></div></div>```bash
bash
# Kiểm tra cơ bản (từ thư mục gốc dự án)
python .agent/scripts/checklist.py .


# Kiểm tra toàn diện (cần server đang chạy)
python .agent/scripts/verify_all.py . --url http://localhost:3000
```

---

## 10. Sơ đồ quan hệ giữa các thành phần

```html
rules/GEMINI.md ← (1) AI đọc quy tắc đầu tiên
│
▼
ARCHITECTURE.md ← (2) AI hiểu toàn bộ hệ sinh thái
│
▼
agents/*.md ← (3) AI đóng vai Agent phù hợp
│
▼
skills/*/SKILL.md ← (4) Agent tải kiến thức cần thiết
│
▼
skills/*/scripts/*.py ← (5) Script chạy kiểm tra tự động
│
▼
scripts/checklist.py ← (6) Tổng hợp kết quả và báo cáo
```

> Hiểu rõ cấu trúc này giúp bạn dễ dàng **tùy chỉnh và mở rộng** bộ kit theo nhu cầu dự án của mình mà không làm ảnh hưởng đến phần còn lại của hệ thống.