style(main): extend proto2 surfaces to remaining pages

app/(main)/user/[id]/page.tsx

@@ -33,14 +33,14 @@ export default async function UserProfilePage({ params }: { params: Promise<{ id
     .filter((s): s is NonNullable<typeof s> => s != null)
 
   return (
-    <div className="container mx-auto py-8 px-4 max-w-4xl">
+    <div className="container mx-auto max-w-4xl px-4 py-8 space-y-6">
       <div className="flex items-center gap-6 mb-8">
-        <Avatar className="w-24 h-24 border-4 border-background shadow-lg">
+        <Avatar className="w-24 h-24 border-4 border-background shadow-[var(--shadow-card)]">
           <AvatarImage src={user.avatar} alt={user.nickname} />
           <AvatarFallback>{user.nickname[0]}</AvatarFallback>
         </Avatar>
         <div className="space-y-2">
-          <h1 className="text-2xl font-bold">{user.nickname}</h1>
+          <h1 className="text-2xl font-bold tracking-tighter leading-tight">{user.nickname}</h1>
           <p className="text-sm text-muted-foreground">{user.bio || "这个人很懒，什么都没写~"}</p>
           <div className="flex gap-4 text-sm text-muted-foreground">
             <span>{userPosts.length} 帖子</span>
@@ -61,7 +61,7 @@ export default async function UserProfilePage({ params }: { params: Promise<{ id
           ) : (
             userPosts.map((post) => (
               <Link key={post.id} href={`/post/${post.id}`}>
-                <Card className="hover:shadow-md transition-shadow">
+                <Card>
                   <CardHeader className="pb-2">
                     <div className="flex items-center justify-between">
                       <CardTitle className="text-base">{post.title}</CardTitle>
@@ -97,7 +97,7 @@ export default async function UserProfilePage({ params }: { params: Promise<{ id
               <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
                 {favoritePlayers.map((player) => (
                   <Link key={player.id} href={`/player/${player.id}`}>
-                    <Card className="hover:shadow-md transition-shadow">
+                    <Card>
                       <CardContent className="flex items-center gap-3 p-4">
                         <Avatar>
                           <AvatarImage src={player.user.avatar} />
@@ -132,7 +132,7 @@ export default async function UserProfilePage({ params }: { params: Promise<{ id
               <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
                 {favoriteShops.map((shop) => (
                   <Link key={shop.id} href={`/shop/${shop.id}`}>
-                    <Card className="hover:shadow-md transition-shadow">
+                    <Card>
                       <CardContent className="flex items-center gap-3 p-4">
                         <Avatar>
                           <AvatarImage src={shop.owner.avatar} />