refactor(ui): 合并双组件库为 components/ui 基元层,设计令牌变量化,报头字体子集自托管

- 新建 components/ui/(Button/Input/Select/Modal/Tabs/Spinner/Skeleton 等),变体用联合类型约束,根治幻影变体
- admin/components.tsx 与 matches/ui.tsx 改为再导出壳,消除 Spinner 三份重复
- 日期工具收口到 lib/date.ts,滚动监听收口到 lib/useScroll.ts
- index.css 引入 :root RGB 三元组令牌,tailwind.config 接 <alpha-value>(修复透明度修饰符静默失效)
- 刘建毛草 5MB 全字库(jsDelivr 未锁版) → 1KB 自托管子集(仅「先知」二字,unicode-range 限定)

frontend/src/components/ui/Badge.tsx

@@ -0,0 +1,39 @@
+/**
+ * 状态标记 Badge。
+ *
+ * 报刊不用彩色药丸:小方块 + 文字,红=异常/失败,墨=正常,灰=中性。
+ * 原位于 admin/components.tsx。
+ */
+import type { ReactNode } from 'react'
+
+const MARK_STYLES: Record<string, { text: string; mark: string }> = {
+  success: { text: 'text-ink-800', mark: 'bg-ink-900' },
+  completed: { text: 'text-ink-800', mark: 'bg-ink-900' },
+  win: { text: 'text-ink-800', mark: 'bg-ink-900' },
+  ok: { text: 'text-ink-800', mark: 'bg-ink-900' },
+  running: { text: 'text-ink-600', mark: 'bg-ink-400' },
+  info: { text: 'text-ink-600', mark: 'bg-ink-400' },
+  queued: { text: 'text-ink-500', mark: 'border border-ink-400' },
+  pending: { text: 'text-ink-400', mark: 'bg-ink-300' },
+  push: { text: 'text-ink-400', mark: 'bg-ink-300' },
+  warning: { text: 'text-press', mark: 'border border-press' },
+  failed: { text: 'text-press font-medium', mark: 'bg-press' },
+  error: { text: 'text-press font-medium', mark: 'bg-press' },
+  loss: { text: 'text-press font-medium', mark: 'bg-press' },
+}
+
+export function Badge({
+  status,
+  children,
+}: {
+  status: string
+  children: ReactNode
+}) {
+  const s = MARK_STYLES[status] ?? MARK_STYLES.pending
+  return (
+    <span className={`inline-flex items-center gap-1.5 whitespace-nowrap text-2xs ${s.text}`}>
+      <span className={`inline-block h-1.5 w-1.5 ${s.mark}`} aria-hidden="true" />
+      {children}
+    </span>
+  )
+}