feat: add frontend development guidelines and structure documentation

- Introduced API guidelines for interface contracts and request handling.
- Added design tokens usage guidelines for consistent styling across the project.
- Established DTO guidelines for defining request parameters and response data types.
- Created frontend structure guidelines to clarify directory organization and code placement rules.
- Compiled a comprehensive frontend development guideline document covering various aspects of the development process.
- Implemented quality guidelines to ensure code maintainability and adherence to best practices.

AI-RD-Workflow/20-skills/rd-design-generate/SKILL.md

@@ -0,0 +1,38 @@
+---
+name: rd-design-generate
+description: Generate detailed design specifications from SE-produced OR and DR. Use when Codex needs to help an RD decompose engineering requirements into modules, APIs, data changes, state flows, error handling, implementation tasks, and test points for AI-assisted development.
+---
+
+# RD Design Generate
+
+Generate detailed design from OR and DR.
+
+## Inputs
+
+- OR.
+- DR.
+- Existing architecture or code context if available.
+
+## Process
+
+1. Identify affected modules and boundaries.
+2. Define proposed design, alternatives considered, and tradeoffs.
+3. Specify API, data model, state flow, permissions, error handling, observability, and compatibility changes.
+4. Split the design into implementation tasks.
+5. Add test points and regression impact.
+6. Preserve traceability from DS and TASK back to OR/DR.
+
+## Output
+
+Generate:
+
+- DS.
+- TASK list.
+- Test point list.
+- Open technical questions.
+
+## Quality Bar
+
+- A developer or AI agent can implement each task without reinterpreting business intent.
+- Risky areas are marked explicitly.
+- Test points are connected to design decisions.