feat(ui): 共享组件补齐——Card 面色分层 + Button link/lg + 4 原子件

- Card 新增 tone(panel/card/soft)/flat/interactive；cardClass 兼容旧字符串签名
- Button 新增 link(coral 文字链) 变体与 lg 尺寸
- 新增原子件 Eyebrow(统一眉题) / StatusDot(状态点·读屏可见) /
  Skeleton(motion-safe 占位) / Meter(进度条·progressbar)
- PageHeader/SectionHeader 用 display/title 字阶 + Eyebrow 眉题

apps/web/components/ui/Card.tsx

@@ -1,20 +1,29 @@
 import type { HTMLAttributes, ReactNode } from "react";
 
-import { cardClass } from "@/lib/ui/variants";
+import { cardClass, type CardTone } from "@/lib/ui/variants";
 
 interface CardProps extends HTMLAttributes<HTMLElement> {
   children: ReactNode;
   as?: "article" | "div" | "section";
+  tone?: CardTone;
+  flat?: boolean;
+  interactive?: boolean;
 }
 
 export function Card({
   as: Component = "div",
   children,
   className,
+  tone,
+  flat,
+  interactive,
   ...props
 }: CardProps) {
   return (
-    <Component className={cardClass(className)} {...props}>
+    <Component
+      className={cardClass({ tone, flat, interactive, className })}
+      {...props}
+    >
       {children}
     </Component>
   );