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

apps/web/components/style/StylePanel.tsx

@@ -4,6 +4,7 @@ import { CheckCircle2, CircleDashed, RotateCcw } from "lucide-react";
 
 import { Badge } from "@/components/ui/Badge";
 import { Button } from "@/components/ui/Button";
+import { cardClass } from "@/lib/ui/variants";
 import type { StyleDriftReport, StyleDriftSegment } from "@/lib/review/sse";
 
 interface StylePanelProps {
@@ -63,7 +64,7 @@ export function StylePanel({ style, incomplete, onRefine }: StylePanelProps) {
               {style.segments.map((seg, i) => (
                 <li
                   key={i}
-                  className="rounded border border-line bg-panel p-2"
+                  className={cardClass("p-2")}
                   data-testid="drift-segment"
                 >
                   <div className="flex items-center gap-2">