style(auth): apply proto2 surfaces

app/(auth)/layout.tsx

@@ -20,7 +20,7 @@ export default function AuthLayout({ children }: { children: React.ReactNode })
           </div>
         </div>
       </div>
-      <div className="flex-1 flex items-center justify-center p-6 bg-muted/30 md:bg-background">
+      <div className="flex-1 flex items-center justify-center p-6 bg-muted/30">
         <div className="w-full max-w-md">{children}</div>
       </div>
     </div>

app/(auth)/login/page.tsx

@@ -7,6 +7,7 @@ import { useRouter } from "next/navigation"
 import { useForm } from "react-hook-form"
 import { z } from "zod"
 import { Button } from "@/components/ui/button"
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
 import { Input } from "@/components/ui/input"
 import { Label } from "@/components/ui/label"
 import { getCurrentUserForLogin } from "@/lib/api"
@@ -35,17 +36,18 @@ export default function LoginPage() {
   }
 
   return (
-    <div className="space-y-8 bg-background p-8 rounded-xl border shadow-sm md:border-0 md:shadow-none md:p-0">
+    <Card className="hover:shadow-[var(--shadow-card)]">
-      <div className="flex flex-col gap-2">
+      <CardHeader className="space-y-2">
         <div className="flex items-center gap-2 md:hidden mb-4">
           <div className="rounded-lg bg-primary/10 p-2">
             <Gamepad2 className="h-6 w-6 text-primary" />
           </div>
           <span className="text-xl font-bold">聚玩</span>
         </div>
-        <h1 className="text-2xl font-bold tracking-tight">欢迎回来</h1>
+        <CardTitle className="text-2xl font-bold tracking-tight">欢迎回来</CardTitle>
-        <p className="text-sm text-muted-foreground">登录你的账号以继续</p>
+        <CardDescription>登录你的账号以继续</CardDescription>
-      </div>
+      </CardHeader>
+      <CardContent className="space-y-6">
         <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
           <div className="space-y-2">
             <Label htmlFor="phone">手机号</Label>
@@ -67,6 +69,7 @@ export default function LoginPage() {
             立即注册
           </Link>
         </p>
-    </div>
+      </CardContent>
+    </Card>
   )
 }

app/(auth)/register/page.tsx

@@ -7,6 +7,7 @@ import { useRouter } from "next/navigation"
 import { useForm } from "react-hook-form"
 import { z } from "zod"
 import { Button } from "@/components/ui/button"
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
 import { Input } from "@/components/ui/input"
 import { Label } from "@/components/ui/label"
 import { getCurrentUserForLogin } from "@/lib/api"
@@ -42,17 +43,18 @@ export default function RegisterPage() {
   }
 
   return (
-    <div className="space-y-8 bg-background p-8 rounded-xl border shadow-sm md:border-0 md:shadow-none md:p-0">
+    <Card className="hover:shadow-[var(--shadow-card)]">
-      <div className="flex flex-col gap-2">
+      <CardHeader className="space-y-2">
         <div className="flex items-center gap-2 md:hidden mb-4">
           <div className="rounded-lg bg-primary/10 p-2">
             <Gamepad2 className="h-6 w-6 text-primary" />
           </div>
           <span className="text-xl font-bold">聚玩</span>
         </div>
-        <h1 className="text-2xl font-bold tracking-tight">创建账号</h1>
+        <CardTitle className="text-2xl font-bold tracking-tight">创建账号</CardTitle>
-        <p className="text-sm text-muted-foreground">创建你的聚玩账号</p>
+        <CardDescription>创建你的聚玩账号</CardDescription>
-      </div>
+      </CardHeader>
+      <CardContent className="space-y-6">
         <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
           <div className="space-y-2">
             <Label htmlFor="nickname">昵称</Label>
@@ -91,6 +93,7 @@ export default function RegisterPage() {
             立即登录
           </Link>
         </p>
-    </div>
+      </CardContent>
+    </Card>
   )
 }