feat: improve app ui and project metadata

apps/web/components/style/StylePanel.tsx

@@ -1,5 +1,9 @@
 "use client";
 
+import { CheckCircle2, CircleDashed, RotateCcw } from "lucide-react";
+
+import { Badge } from "@/components/ui/Badge";
+import { Button } from "@/components/ui/Button";
 import type { StyleDriftReport, StyleDriftSegment } from "@/lib/review/sse";
 
 interface StylePanelProps {
@@ -26,7 +30,10 @@ export function StylePanel({ style, incomplete, onRefine }: StylePanelProps) {
         文风 (style-auditor)
       </h2>
       {incomplete ? (
-        <p className="mt-1 text-xs text-overdue">◌ 未完成</p>
+        <Badge variant="warning" className="mt-1">
+          <CircleDashed className="h-3 w-3" aria-hidden="true" />
+          未完成
+        </Badge>
       ) : style === null ? (
         <p className="mt-1 text-xs text-ink-soft">
           无文风报告（学文风后第四审才能打分）。
@@ -47,7 +54,10 @@ export function StylePanel({ style, incomplete, onRefine }: StylePanelProps) {
           </p>
 
           {style.segments.length === 0 ? (
-            <p className="text-pass">✓ 无明显文风漂移</p>
+            <Badge variant="success">
+              <CheckCircle2 className="h-3 w-3" aria-hidden="true" />
+              无明显文风漂移
+            </Badge>
           ) : (
             <ul className="space-y-2">
               {style.segments.map((seg, i) => (
@@ -57,9 +67,9 @@ export function StylePanel({ style, incomplete, onRefine }: StylePanelProps) {
                   data-testid="drift-segment"
                 >
                   <div className="flex items-center gap-2">
-                    <span className="font-mono text-overdue">
+                    <Badge variant="warning" className="font-mono">
                       第 {seg.idx} 段
-                    </span>
+                    </Badge>
                     <span className="font-mono text-ink-soft">
                       相似 {seg.score}%
                     </span>
@@ -68,13 +78,14 @@ export function StylePanel({ style, incomplete, onRefine }: StylePanelProps) {
                     ) : null}
                   </div>
                   <div className="mt-1.5 flex gap-2">
-                    <button
-                      type="button"
+                    <Button
                       onClick={() => onRefine(seg)}
-                      className="rounded bg-cinnabar px-2 py-1 text-panel hover:opacity-90"
+                      variant="primary"
+                      size="sm"
                     >
+                      <RotateCcw className="h-4 w-4" aria-hidden="true" />
                       一键回炉
-                    </button>
+                    </Button>
                   </div>
                 </li>
               ))}