refactor(web): 采用 Button/Card 原语替换多处手搓样式

apps/web/components/foreshadow/ForeshadowBoard.tsx

@@ -6,6 +6,7 @@ import { Flag, Plus } from "lucide-react";
 import { AppShell } from "@/components/AppShell";
 import { Badge } from "@/components/ui/Badge";
 import { Button } from "@/components/ui/Button";
+import { Card } from "@/components/ui/Card";
 import { EmptyState } from "@/components/ui/EmptyState";
 import { PageHeader } from "@/components/ui/PageHeader";
 import type { ForeshadowView, ProjectResponse } from "@/lib/api/types";
@@ -137,10 +138,7 @@ function ForeshadowBoardSummary({
       className="mb-3 grid grid-cols-2 gap-2 sm:grid-cols-4"
     >
       {LANES.map((status) => (
-        <div
-          key={status}
-          className="rounded border border-line bg-panel px-3 py-2"
-        >
+        <Card key={status} className="px-3 py-2">
           <div className="flex items-center justify-between gap-2">
             <Badge variant={SUMMARY_VARIANTS[status]}>
               {LANE_LABELS[status]}
@@ -152,7 +150,7 @@ function ForeshadowBoardSummary({
             {" · "}
             {total > 0 ? `${Math.round((counts[status] / total) * 100)}%` : "0%"}
           </p>
-        </div>
+        </Card>
       ))}
     </section>
   );