refactor(pages): replace inline links with Button asChild and TabsList variant

app/(main)/page.tsx

@@ -62,14 +62,12 @@ export default function HomePage() {
         </div>
         <div className="flex flex-wrap gap-3">
           {games.map((game) => (
-            <Link
-              key={game.id}
-              href={`/search?game=${encodeURIComponent(game.name)}`}
-              className="flex items-center gap-2 rounded-full bg-muted/50 text-muted-foreground px-4 py-2 hover:bg-muted hover:text-foreground transition-all"
-            >
-              <GameIcon name={game.icon} className="h-5 w-5" />
-              <span className="text-sm font-medium">{game.name}</span>
-            </Link>
+            <Button key={game.id} variant="secondary" className="rounded-full" asChild>
+              <Link href={`/search?game=${encodeURIComponent(game.name)}`}>
+                <GameIcon name={game.icon} className="h-5 w-5" />
+                {game.name}
+              </Link>
+            </Button>
           ))}
         </div>
       </section>
@@ -77,34 +75,22 @@ export default function HomePage() {
       <section className="space-y-6">
         <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4">
           <h2 className="text-xl font-semibold">推荐内容</h2>
-          <div className="flex flex-wrap items-center gap-4 text-sm">
-            <Link href="/search?sort=composite" className="text-primary font-medium">
-              综合排序
-            </Link>
-            <Link
-              href="/search?sort=rating"
-              className="text-muted-foreground hover:text-foreground transition-colors"
-            >
-              评分最高
-            </Link>
-            <Link
-              href="/search?sort=orders"
-              className="text-muted-foreground hover:text-foreground transition-colors"
-            >
-              接单最多
-            </Link>
-            <Link
-              href="/search?sort=price_asc"
-              className="text-muted-foreground hover:text-foreground transition-colors"
-            >
-              价格最低
-            </Link>
-            <Link
-              href="/search?sort=price_desc"
-              className="text-muted-foreground hover:text-foreground transition-colors"
-            >
-              价格最高
-            </Link>
+          <div className="flex flex-wrap items-center gap-1 text-sm">
+            <Button variant="ghost" size="sm" asChild>
+              <Link href="/search?sort=composite">综合排序</Link>
+            </Button>
+            <Button variant="ghost" size="sm" className="text-muted-foreground" asChild>
+              <Link href="/search?sort=rating">评分最高</Link>
+            </Button>
+            <Button variant="ghost" size="sm" className="text-muted-foreground" asChild>
+              <Link href="/search?sort=orders">接单最多</Link>
+            </Button>
+            <Button variant="ghost" size="sm" className="text-muted-foreground" asChild>
+              <Link href="/search?sort=price_asc">价格最低</Link>
+            </Button>
+            <Button variant="ghost" size="sm" className="text-muted-foreground" asChild>
+              <Link href="/search?sort=price_desc">价格最高</Link>
+            </Button>
           </div>
         </div>