refactor(i18n): 全工程面向国际用户与全球现代商务重构，彻底清理出海跨境等单向视角表达并对齐自动化测试

2026-09-21 15:24:36 +08:00
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -8,10 +8,10 @@

 - **项目名称**：OmniCard AI (全球智能数字名片 & 移动微官网 SaaS)
 - **远程仓库**：`https://gitcode.gynhc.com/wikiboss/OmniCard.git`
- **业务定位**：面向全球商务出海的下一代 **AI 驱动型智能名片 + 移动微官网 + 访客雷达 CRM + NFC 实体卡管理** 一体化平台。
+- **业务定位**：面向全球现代商务、跨国团队与专业顾问的新一代 **AI 驱动型智能名片 + 移动微官网 + 访客雷达 CRM + NFC 实体卡管理** 一体化平台。
 - **业务核心模块**：
  1. 微官网搭建与展示系统（Bento Grid 便当盒美学、响应式与 RTL 多语言适配）
-  2. 访客雷达与轻量级出海 CRM（国家定位、停留轨迹、意向度评分、线索跟进）
+  2. 访客雷达与轻量级商务 CRM（国家定位、停留轨迹、意向度评分、线索跟进）
  3. AI 智能中枢与数字人顾问（全天候接待客商、智能留资、多语言地道润色）
  4. NFC 实体卡硬件云端生命周期管理（场景切换、远程挂失）
  5. 企业团队管理与多租户商业化订阅体系
@@ -83,7 +83,7 @@ CRMmp/
 - **类型安全**：全面采用 TypeScript，严禁滥用 `any`。严格定义 Props 接口与服务端 API 响应契约。
 - **状态与样式**：
  - 遵循现代 React 最佳实践（Hooks、函数组件、避免多余状态冗余）。
-  - 优先复用 Arco 官方样式变量与工具类，保持设计一致性与出海高端商务调性。
+  - 优先复用 Arco 官方样式变量与工具类，保持设计一致性与国际高端商务调性。

 ### 3.3 用户端：uni-app x (App + H5) 规范 (目录: mpuniapp/)
 - **语法与语言**：
@@ -178,100 +178,97 @@ CRMmp/
 更新版，已把**风格约束**一起并入 AI Coding 约束。可直接放入 `.cursorrules` / `CLAUDE.md`。

 ```md
-# NexaCard AI — AI Coding 约束
+# OmniCard AI — AI Coding & UI/UX 核心设计约束

-## 风格定位
- 瑞士国际主义 + 现代 SaaS + 编辑感
- 内容优先，留白即品牌，AI 隐形，CRM 无感，NFC 轻量
- 全球商务、中性、可信、克制
- 禁止炫技、拟物、霓虹、玻璃拟态、重装饰
- 一屏只允许 1 个主 CTA
+## 1. 风格定位 (Aesthetic & Style)
+- **Bento Grid（便当盒美学）模组化布局 + 现代消费级全球化 SaaS（Consumerized B2B SaaS）**
+- **场景优先（Context-First）**：移动端名片出示场景采用**沉浸式全屏大二维码展台** + **底部大圆角浮层抽屉（Bottom Sheet）**，物理 NFC 实体卡与数字名片具象化联动
+- **极简科技纯净感**：中性冷白底色为主，辅以科技天蓝与局部极光弥散微光晕（Ambient Aurora / Mesh Gradient）
+- **全球现代商务**：可信、现代、通透、高呼吸感与留白，杜绝冰冷传统表单后台感
+- **一屏仅允许 1 个核心主 CTA**（悬浮胶囊式或居中凸起发送快捷按钮）

-## 技术栈
-
-## 设计 Token（必须引用，禁止硬编码）
+## 2. 设计 Token (Design Tokens - 必须引用，禁止硬编码)
 颜色 Light / Dark：
- primary: #0B5CFF / #4D8DFF
- primary-soft: #EAF1FF / #102A4D
- ai: #7C5CFF / #9B8CFF
- bg: #FFFFFF / #0B0D10
- surface: #F7F8FA / #12151A
- border: #E3E7ED / #262B33
- text: #101828 / #F2F4F7
- text-2: #667085 / #98A2B3
+- primary: #0088FF / #3894FF（科技天蓝/钴蓝）
+- primary-gradient: linear-gradient(135deg, #00A3FF 0%, #0B63E5 100%)
+- primary-soft: #EBF5FF / #0D2847
+- aurora: linear-gradient(135deg, #00D2FF 0%, #0088FF 50%, #6366F1 100%)（极光弥散）
+- bg: #F5F8FC / #0B0D10（冷白天幕底色）
+- surface: #FFFFFF / #13171F（纯白卡片容器）
+- border: #EBF1F7 / #232936（极浅分割微线）
+- text: #101828 / #F2F4F7（主内容高对比）
+- text-2: #64748B / #94A3B8（次级说明文字）
 - success: #12B76A / #32D583
 - warning: #F79009 / #FDB022
 - error: #F04438 / #F97066

-间距：4 / 8 / 12 / 16 / 24 / 32 / 48 / 64
-圆角：按钮 12px，卡片 16px，模态 20px
-阴影：0 1px 2px rgba(16,24,40,0.04)
-字体：Inter, Noto Sans SC, Noto Sans Arabic, Noto Sans JP, Noto Sans KR
-字号：12 / 14 / 16 / 20 / 24 / 32 / 40
+间距：4 / 8 / 12 / 16 / 20 / 24 / 32 / 48 / 64
+平滑大圆角 (Squircle)：
+- 按钮与胶囊标签: 14px / 9999px (Pill)
+- Bento 卡片与内容容器: 20px / 24px
+- 移动端底部抽屉与模态面板: 顶角 24px / 28px
+- 二维码展台卡片: 20px
+漫反射环境软阴影 (Ambient Soft Shadow)：
+- shadow-card: 0 8px 30px rgba(0, 0, 0, 0.04), 0 2px 8px rgba(11, 99, 229, 0.03)
+- shadow-cta: 0 8px 20px rgba(0, 136, 255, 0.22)
+- shadow-float: 0 12px 36px rgba(16, 24, 40, 0.08)
+字体：Inter, Noto Sans SC, Noto Sans Arabic, Noto Sans JP, Noto Sans KR, SF Pro Display
+字号：12 / 14 / 16 / 18 / 20 / 24 / 32 / 40
 行高：正文 1.6，标题 1.25，阿语 1.7
-最大宽度：内容 1200px，文章 720px
+最大宽度：内容 1200px，文章 720px，移动端自适应 480px
 行宽：45–75 字符

-## 配色规则
- 中性色占 80–90%，品牌色占 10–20%
- 品牌主色只用单一钴蓝
- 语义色只用于状态，不做装饰
- 禁止红、绿、黄作为品牌主色
- AI 渐变只允许小面积，面积 <5%
- NFC 用主色 20% 透明脉冲，一次 400ms，不循环
+## 3. 配色与光影规则
+- **比例原则**：纯净冷白与中性色占 85%–90%，品牌科技蓝占 10%–15%
+- **受控弥散光晕**：极光渐变（Aurora）仅限局部高价值区域（沉浸式展示头部、品牌卡、NFC 实体卡演示位、雷达高光），面积 < 8%，禁止全屏杂乱渐变
+- **环境软阴影**：以超大半径、极淡漫反射阴影营造卡片微悬浮感，替代厚重硬边框
+- **语义色只用于状态**：成功绿、警告橙、错误红仅用于雷达意向度、系统状态与验证提示，不做大面积装饰
+- **NFC 反馈**：触碰感应触发主色 20% 透明单次微脉冲动效，时长 400ms，不循环

-## 组件规则
- 按钮高 40 / 44 / 48，触控区 ≥44×44
- 输入框高 44，标签在上，错误在下
- 卡片 1px 边框，圆角 16，无重阴影
- 卡片最多两层嵌套，优先用分隔线
- 图标线性 1.5px，20 / 24px
- 焦点环 2px primary，offset 2，必须可见
- 加载优先骨架屏
- 空状态：一句话 + 一个主 CTA
- 悬停仅 2–4% 明暗变化，不放大
+## 4. 核心组件与交互规范
+- **Bento Grid 模组规范**：各卡片高度内聚自洽（趋势折线图、访客雷达通知条、个人 Profile、NFC 硬件状态、隐私时效控制），网格弹性响应
+- **移动端沉浸展台模式 (Showcase Mode)**：
+  - 顶部占屏约 45% 的科技蓝/极光底色，大号高清晰二维码居中直出，配 `Scan to share card` 微光引导
+  - 底部大圆角抽屉 (Bottom Sheet) 承载：一键复制直链栏（直链 + `COPY` 胶囊）、绿色可持续发展理念文案、实体白卡拟物微轮播
+  - 底部悬浮 TabBar：Contacts、Share（主 CTA 胶囊凸起微阴影）、Privacy
+- **访客雷达实时动态通知条**：
+  - 采用轻微圆角悬浮条（如 "Alex saved your contact card Just Now"），左侧品牌 Logo/头像，白底轻投影
+- **隐私时效控制控件**：
+  - 结构化时效行（Temporary Visibility / Extended Visibility）搭配平滑展开行与单选/滑块
+- **按钮与触控区**：高度 40 / 44 / 48，触控热区 ≥ 44×44，悬停仅 2–4% 明暗微变化，不放大
+- **图标体系**：统一 1.5px 极细线性图标，规格 20 / 24px

-## 动效
- 微交互 150ms，抽屉 250ms，页面 400ms
+## 5. 动效规范
+- 微交互 150ms，抽屉滑出/收起 250ms，页面转场 350ms
 - 缓动：cubic-bezier(0.2, 0.8, 0.2, 1)
- 支持 prefers-reduced-motion
- AI 用微光，不用打字机作为唯一反馈
- NFC 用一次脉冲，不循环
+- 极光微光晕呼吸缓慢流动，支持 prefers-reduced-motion
+- AI 采用微光晕浮现，不以打字机作为单一阻塞反馈

-## 代码规范
- 严格 TypeScript，禁止 any
- 组件 PascalCase，函数式
- 样式只用 Tailwind，禁止内联 style
- 所有文案走 i18n key，禁止硬编码
- 颜色 / 间距 / 字体必须用 token，禁止魔法值
- 支持暗色模式，用 CSS 变量
- 支持 RTL，用 logical properties（ms / me / ps / pe）
- 语义化标签 + aria + 键盘可达
- 动效必须支持 reduced-motion
+## 6. 代码与工程规范
+- 严格 TypeScript / uts，严禁使用 any
+- 组件 PascalCase，函数式，统一使用设计 Token，严禁内联魔法值
+- 所有文案必须走 i18n key，禁止硬编码文字
+- 支持暗色模式，采用 CSS/UTS 主题变量
+- 支持 RTL，一律采用逻辑属性（ms / me / ps / pe）
+- 语义化标签 + 键盘可达 + 无障碍 aria 规范

-## 国际化
- next-intl，默认 en
- 独立 URL：/en /es /fr
- hreflang + sitemap
- 日期 / 货币 / 时区本地化
- 按钮和标签预留 30% 文本扩展
- 社交适配：WhatsApp、LinkedIn、Telegram、Line、KakaoTalk、微信
- 支付：Stripe、PayPal
- GDPR、CCPA、Cookie 同意、数据导出 / 删除
- WCAG 2.2 AA，正文对比度 ≥ 4.5:1
- 不强制登录看名片，不自动播放声音
+## 7. 国际化与全球合规标准
+- 国际多语言优先（默认 en，支持多语言独立路由或上下文切换）
+- 国际主流社交一键触达：WhatsApp、LinkedIn、Telegram、Line、KakaoTalk、WeChat
+- 支付与协议：Stripe、PayPal，名片遵循 vCard (RFC 6350)
+- 合规：GDPR、CCPA、Cookie 同意、隐私时效自毁
+- WCAG 2.2 AA 标准，文本对比度 ≥ 4.5:1

-## 禁止
- 纯黑 #000
- 超过 3 种字体
- 大面积渐变 / 重阴影 / 霓虹
- 硬编码文案或颜色
- 固定宽度按钮
- 强制登录看名片
- 自动播放声音
- 一屏多个主按钮
- 装饰性插画 / 拟物图标 / 文化特定符号
- 禁止使用emoji
+## 8. 禁止事项 (Strictly Prohibited)
+- 严禁使用纯黑 #000
+- 严禁生硬、灰暗、传统冷冰冰的表单式名片页（禁止将二维码埋入杂乱表单角中）
+- 严禁大面积土味高饱和霓虹渐变、重阴影与过度玻璃拟态
+- 严禁超过 3 种字体
+- 严禁硬编码文案、固定宽度按钮
+- 严禁强制登录才可浏览名片，严禁自动播放声音
+- 严禁一屏出现多个主按钮
+- 严禁装饰性插画、拟物大图标与特定文化敏感符号
+- 严禁在正式生产界面中使用非业务硬编码 emoji
 ```

 ### 翻译要求