fix(ui): unify layout wrappers and simplify player/shop detail pages

app/(main)/page.tsx

@@ -72,7 +72,10 @@ export default function HomePage() {
         </div>
         <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
           {players.map((player) => (
-            <Card key={player.id} className="hover:shadow-md transition-shadow">
+            <Card
+              key={player.id}
+              className="hover:shadow-md transition-shadow flex flex-col h-full"
+            >
               <CardHeader className="flex flex-row items-center gap-3 space-y-0 pb-3">
                 <Avatar className="h-12 w-12">
                   <AvatarImage src={player.user.avatar} />
@@ -99,7 +102,7 @@ export default function HomePage() {
                   </div>
                 </div>
               </CardHeader>
-              <CardContent className="pb-3">
+              <CardContent className="pb-3 flex-grow">
                 <div className="flex flex-wrap gap-1">
                   {player.tags.map((tag) => (
                     <Badge key={tag} variant="outline" className="text-xs">
@@ -132,12 +135,12 @@ export default function HomePage() {
         </div>
         <div className="grid gap-4 md:grid-cols-2">
           {shops.map((shop) => (
-            <Card key={shop.id} className="hover:shadow-md transition-shadow">
+            <Card key={shop.id} className="hover:shadow-md transition-shadow flex flex-col h-full">
               <CardHeader>
                 <CardTitle className="text-lg">{shop.name}</CardTitle>
                 <p className="text-sm text-muted-foreground">{shop.description}</p>
               </CardHeader>
-              <CardContent>
+              <CardContent className="flex-grow">
                 <div className="flex items-center gap-4 text-sm">
                   <div className="flex items-center">
                     <Star className="h-3.5 w-3.5 fill-yellow-400 text-yellow-400 mr-0.5" />