feat: Header 倒计时数字滚动动画 — @number-flow/react 替换静态文本

openspec/specs/css-utility-classes/spec.md

@@ -105,6 +105,25 @@ styles.css SHALL 定义前端组件复用的工具类，包含页面布局相关
 - **WHEN** Drawer 概览统计区渲染
 - **THEN** 统计卡片 SHALL 使用 `.overview-stat-card` 类（background: var(--td-bg-color-container-hover)），并使用 TDesign Statistic 组件自带的上下布局（title 在上、value 在下），通过 `.summary-stat-col` 类（text-align: center）实现内容居中。系统 SHALL NOT 使用已移除的 `.overview-stat-item` 和 `.overview-stat-value` 类。
 
+### Requirement: NumberFlow 倒计时样式类
+styles.css SHALL 定义 NumberFlow 倒计时相关样式类，供 Header 倒计时组件使用。样式 SHALL 继承 TDesign 文本颜色或使用 TDesign CSS tokens，不得使用组件内联 `style`、硬编码色值、`!important` 或覆盖 TDesign 内部类名。
+
+#### Scenario: 倒计时滚动容器类
+- **WHEN** Header 自动刷新倒计时以 NumberFlow 形式渲染
+- **THEN** 倒计时 SHALL 使用集中定义的滚动容器类，保持 inline-flex、baseline 对齐、nowrap 和 tabular-nums
+
+#### Scenario: 倒计时数字类
+- **WHEN** NumberFlow 数字渲染
+- **THEN** 数字 SHALL 使用集中定义的数字类配置 line-height 和 NumberFlow mask CSS 变量，减少滚动边缘突兀感
+
+#### Scenario: 倒计时单位类
+- **WHEN** 分钟或秒单位文本渲染
+- **THEN** 单位 SHALL 使用集中定义的单位类与数字保持基线对齐，并继承当前 TDesign 文本色
+
+#### Scenario: 不使用内联样式
+- **WHEN** RefreshCountdown 组件渲染 NumberFlow 倒计时
+- **THEN** 组件 SHALL 通过 `className` 引用 styles.css 中的样式类，不得通过 React `style` prop 设置 NumberFlow 展示样式
+
 ### Requirement: 异常行背景类
 styles.css SHALL 定义 DOWN 行的背景色和左侧竖线，使用安全选择器且不使用 `!important`。