docs(agents): add design references

.agents/skills/arco-design-vue/references/overview/architecture.md

@@ -0,0 +1,86 @@
+---
+name: arco-vue-architecture
+description: "Arco Design Vue 架构和编码约定。用于 Vue 3 SFC 结构、Composition API、全局/局部注册、导入、属性、事件、插槽和 v-model。"
+user-invocable: false
+---
+
+# 架构约定
+
+把需求转换为使用 Arco Design Vue 的 Vue 3 代码时使用本参考。
+
+## 推荐 SFC 结构
+
+```vue
+<script setup lang="ts">
+import { reactive } from 'vue';
+import { Message } from '@arco-design/web-vue';
+
+const form = reactive({
+  name: '',
+});
+
+const handleSubmit = () => {
+  Message.success(`提交：${form.name}`);
+};
+</script>
+
+<template>
+  <a-form :model="form" layout="vertical" @submit-success="handleSubmit">
+    <a-form-item field="name" label="名称" required>
+      <a-input v-model="form.name" placeholder="请输入名称" />
+    </a-form-item>
+    <a-button type="primary" html-type="submit">提交</a-button>
+  </a-form>
+</template>
+```
+
+## 组件注册
+
+完整注册：
+
+```ts
+app.use(ArcoVue);
+```
+
+局部导入：
+
+```ts
+import { Button, Space } from '@arco-design/web-vue';
+```
+
+示例和小型应用可以使用完整注册。生产项目应跟随仓库已有的导入策略。
+
+## 属性、事件、插槽
+
+- 模板属性使用 kebab-case：`show-jumper`、`row-selection`、`popup-container`。
+- 动态属性使用 `:`：`:columns="columns"`、`:data="rows"`。
+- 事件使用 `@`：`@change`、`@page-change`、`@ok`、`@cancel`。
+- 插槽使用 `#`：`#title`、`#extra`、`#cell="{ record, column }"`。
+
+## v-model
+
+组件主值使用普通 `v-model`。
+
+```vue
+<a-input v-model="keyword" />
+<a-select v-model="status" :options="options" />
+```
+
+组件文档声明命名绑定时，使用命名 `v-model`。
+
+```vue
+<a-modal v-model:visible="visible" title="编辑">
+  ...
+</a-modal>
+```
+
+## 避免 React 模式
+
+不要使用：
+
+- `Form.useForm()`
+- JSX 子节点访问方式
+- `Component.Sub` 子组件语法
+- 直接复制 React 的 `value` / `onChange` 示例
+
+应使用本 skill 中的 Vue 参考。