refactor: 重构样式系统为五层分层架构

- 建立 tokens/core/layouts/components/pages 五层样式架构
- 所有组件采用 BEM 命名规范（.block__element--modifier）
- 16 个组件目录，每个组件独立 _index.scss
- 清理表格操作列内联样式，统一使用 .col-actions/.table-actions
- 更新 README 样式开发规范文档
- 同步 3 个 delta spec 到主 specs

Co-Authored-By: opencode <noreply@opencode.ai>

openspec/specs/design-tokens/spec.md

@@ -0,0 +1,62 @@
+## ADDED Requirements
+
+### Requirement: 颜色令牌定义
+设计系统 SHALL 提供统一的颜色令牌，包括品牌色、功能色、中性色、背景色、边框色。
+
+#### Scenario: 品牌色使用
+- **WHEN** 开发者需要应用主色调
+- **THEN** 系统 SHALL 提供 `--color-primary`、`--color-primary-light`、`--color-primary-dark` 等变量
+
+#### Scenario: 功能色使用
+- **WHEN** 开发者需要表示状态（成功、警告、错误）
+- **THEN** 系统 SHALL 提供 `--color-success`、`--color-warning`、`--color-danger` 及其浅色变体
+
+#### Scenario: 中性色使用
+- **WHEN** 开发者需要文本、边框、背景色
+- **THEN** 系统 SHALL 提供 `--color-text-1` 到 `--color-text-4`、`--color-border-1` 到 `--color-border-3`、`--color-bg-1` 到 `--color-bg-4`
+
+### Requirement: 间距令牌定义
+设计系统 SHALL 提供统一的间距令牌，基于 4px 基数网格。
+
+#### Scenario: 间距应用
+- **WHEN** 开发者需要设置 margin、padding、gap
+- **THEN** 系统 SHALL 提供标准化的间距值（4, 8, 12, 16, 20, 24, 32, 40, 48px）
+
+### Requirement: 阴影令牌定义
+设计系统 SHALL 提供统一的阴影令牌，用于表达层级和深度。
+
+#### Scenario: 阴影应用
+- **WHEN** 开发者需要为卡片、弹窗、下拉菜单添加阴影
+- **THEN** 系统 SHALL 提供 `--shadow-1`、`--shadow-2`、`--shadow-3`、`--shadow-card` 四级阴影
+
+### Requirement: 圆角令牌定义
+设计系统 SHALL 提供统一的圆角令牌。
+
+#### Scenario: 圆角应用
+- **WHEN** 开发者需要设置组件圆角
+- **THEN** 系统 SHALL 提供 `--radius-sm`（6px）、`--radius-md`（8px）、`--radius-lg`（12px）、`--radius-xl`（16px）
+
+### Requirement: 过渡动画令牌定义
+设计系统 SHALL 提供统一的过渡动画参数。
+
+#### Scenario: 过渡动画应用
+- **WHEN** 开发者需要为交互状态添加过渡效果
+- **THEN** 系统 SHALL 提供 `--transition` 标准过渡参数（0.2s cubic-bezier(0.4, 0, 0.2, 1)）
+
+### Requirement: 布局尺寸令牌定义
+设计系统 SHALL 提供统一的布局尺寸令牌。
+
+#### Scenario: 布局尺寸应用
+- **WHEN** 开发者需要设置侧边栏宽度、顶部栏高度
+- **THEN** 系统 SHALL 提供 `--sidebar-width`、`--header-height` 等变量
+
+### Requirement: SCSS 变量与 CSS 变量映射
+设计系统 SHALL 同时提供 SCSS 变量和 CSS 变量，满足不同场景需求。
+
+#### Scenario: 编译时使用
+- **WHEN** 开发者在 SCSS 中需要引用变量
+- **THEN** 系统 SHALL 提供 `$primary`、`$spacing-4` 等 SCSS 变量
+
+#### Scenario: 运行时使用
+- **WHEN** 开发者需要在运行时动态获取变量值
+- **THEN** 系统 SHALL 在 `:root` 中定义对应的 CSS 自定义属性