style(client): 对齐短剧列表字号与间距

lib/pages/recommend/recommend_page.dart

@@ -134,7 +134,7 @@ class _RecommendPageState extends State<RecommendPage> {
       height: 56,
       child: Padding(
         padding: const EdgeInsets.symmetric(
-          horizontal: AppDimens.pageHorizontal,
+          horizontal: AppDimens.feedPageHorizontal,
         ),
         child: Row(
           children: [
@@ -189,9 +189,9 @@ class _RecommendPageState extends State<RecommendPage> {
               style: TextStyle(
                 color: selected
                     ? AppColors.textPrimary
-                    : AppColors.textSecondary,
-                fontSize: AppDimens.listTitle,
-                fontWeight: selected ? FontWeight.w700 : FontWeight.w500,
+                    : AppColors.textTertiary,
+                fontSize: AppDimens.homePrimaryTabFont,
+                fontWeight: selected ? FontWeight.w700 : FontWeight.w400,
               ),
             ),
             const SizedBox(height: 3),

lib/pages/recommend/widgets/all_dramas_filter_grid.dart

@@ -47,7 +47,7 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
       builder: (context, constraints) {
         final itemWidth =
             (constraints.maxWidth -
-                AppDimens.pageHorizontal * 2 -
+                AppDimens.feedPageHorizontal * 2 -
                 AppDimens.homeGridGap * 2) /
             3;
         final itemExtent = itemWidth * 6 / 5 + AppDimens.homeCardBodyExtent;
@@ -77,14 +77,14 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
                 else
                   SliverPadding(
                     padding: const EdgeInsets.symmetric(
-                      horizontal: AppDimens.pageHorizontal,
+                      horizontal: AppDimens.feedPageHorizontal,
                     ),
                     sliver: SliverGrid(
                       key: const Key('all-dramas-grid'),
                       gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                         crossAxisCount: 3,
                         crossAxisSpacing: AppDimens.homeGridGap,
-                        mainAxisSpacing: AppDimens.homeGridGap,
+                        mainAxisSpacing: AppDimens.homeGridRowGap,
                         mainAxisExtent: itemExtent,
                       ),
                       delegate: SliverChildBuilderDelegate(
@@ -122,9 +122,9 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
     final genres = _availableGenres(l10n);
     return Padding(
       padding: const EdgeInsets.fromLTRB(
-        AppDimens.pageHorizontal,
+        AppDimens.feedPageHorizontal,
         AppDimens.spaceSm,
-        AppDimens.pageHorizontal,
+        AppDimens.feedPageHorizontal,
         AppDimens.spaceMd,
       ),
       child: Column(
@@ -207,21 +207,21 @@ class _AllDramasFilterGridState extends State<AllDramasFilterGrid> {
     return InkWell(
       key: key,
       onTap: onTap,
-      borderRadius: BorderRadius.circular(AppDimens.pillRadius),
+      borderRadius: BorderRadius.circular(AppDimens.filterChipRadius),
       child: Container(
-        height: 32,
+        height: AppDimens.filterChipHeight,
         padding: const EdgeInsets.symmetric(horizontal: AppDimens.spaceMd),
         alignment: Alignment.center,
         decoration: BoxDecoration(
-          color: selected ? AppColors.contentChip : AppColors.contentSurface,
-          borderRadius: BorderRadius.circular(AppDimens.pillRadius),
+          color: selected ? AppColors.contentSurface : AppColors.transparent,
+          borderRadius: BorderRadius.circular(AppDimens.filterChipRadius),
         ),
         child: Text(
           label,
           style: TextStyle(
-            color: selected ? AppColors.textPrimary : AppColors.textSecondary,
-            fontSize: AppDimens.caption,
-            fontWeight: selected ? FontWeight.w700 : FontWeight.w500,
+            color: selected ? AppColors.textPrimary : AppColors.textTertiary,
+            fontSize: AppDimens.filterChipFont,
+            fontWeight: selected ? FontWeight.w700 : FontWeight.w400,
           ),
         ),
       ),

lib/pages/recommend/widgets/recommend_section_card.dart

@@ -10,6 +10,8 @@ import '../../../core/widgets/remote_image.dart';
 import '../../../l10n/app_localizations.dart';
 import '../../home/widgets/home_drama_classification.dart';
 
+final RegExp _tagSplitter = RegExp(r'[,/、·]');
+
 class RecommendSectionCard extends StatelessWidget {
   const RecommendSectionCard({
     super.key,
@@ -26,7 +28,7 @@ class RecommendSectionCard extends StatelessWidget {
   Widget build(BuildContext context) {
     final l10n = AppLocalizations.of(context)!;
     return SizedBox(
-      width: 122,
+      width: AppDimens.recommendCardWidth,
       child: InkWell(
         key: Key('recommend-card-$sectionKey-${drama.id}'),
         borderRadius: BorderRadius.circular(AppDimens.homeCardRadius),
@@ -38,7 +40,7 @@ class RecommendSectionCard extends StatelessWidget {
             ClipRRect(
               borderRadius: BorderRadius.circular(AppDimens.homeCardRadius),
               child: AspectRatio(
-                aspectRatio: 3 / 4,
+                aspectRatio: AppDimens.cardCoverAspectRatio,
                 child: Stack(
                   fit: StackFit.expand,
                   children: [
@@ -55,20 +57,20 @@ class RecommendSectionCard extends StatelessWidget {
                         child: Container(
                           key: Key('recommend-hot-$sectionKey-${drama.id}'),
                           padding: const EdgeInsets.symmetric(
-                            horizontal: 6,
-                            vertical: 2,
+                            horizontal: AppDimens.cardBadgeHorizontalPadding,
+                            vertical: AppDimens.cardBadgeVerticalPadding,
                           ),
                           decoration: BoxDecoration(
                             color: AppColors.badgeHot,
                             borderRadius: BorderRadius.circular(
-                              AppDimens.chipRadius,
+                              AppDimens.cardBadgeRadius,
                             ),
                           ),
                           child: Text(
                             l10n.homeBadgeHot,
                             style: const TextStyle(
                               color: AppColors.textPrimary,
-                              fontSize: AppDimens.homeCardBadge,
+                              fontSize: AppDimens.cardBadgeFont,
                               fontWeight: FontWeight.w700,
                             ),
                           ),
@@ -78,19 +80,20 @@ class RecommendSectionCard extends StatelessWidget {
                 ),
               ),
             ),
-            const SizedBox(height: AppDimens.spaceXs),
+            const SizedBox(height: AppDimens.cardCoverTitleGap),
             Row(
+              key: Key('recommend-views-$sectionKey-${drama.id}'),
               children: [
                 const Icon(
                   Icons.play_arrow_rounded,
-                  color: AppColors.textSecondary,
-                  size: AppDimens.homeCardMeta,
+                  color: AppColors.textPrimary,
+                  size: AppDimens.cardViewsIcon,
                 ),
                 Text(
                   formatInteractionCount(drama.viewCount),
                   style: const TextStyle(
-                    color: AppColors.textSecondary,
-                    fontSize: AppDimens.homeCardMeta,
+                    color: AppColors.textPrimary,
+                    fontSize: AppDimens.cardViewsFont,
                   ),
                 ),
               ],
@@ -103,14 +106,65 @@ class RecommendSectionCard extends StatelessWidget {
               overflow: TextOverflow.ellipsis,
               style: const TextStyle(
                 color: AppColors.textPrimary,
-                fontSize: AppDimens.homeCardTitle,
-                fontWeight: FontWeight.w600,
-                height: 1.25,
+                fontSize: AppDimens.cardTitleFont,
+                fontWeight: FontWeight.w500,
+                height: AppDimens.cardTitleLineHeight,
               ),
             ),
+            if (_cardTags().isNotEmpty) ...[
+              const SizedBox(height: AppDimens.cardTitleTagGap),
+              _tags(),
+            ],
           ],
         ),
       ),
     );
   }
+
+  Widget _tags() {
+    final tags = _cardTags();
+    return Row(
+      children: [
+        for (final (index, tag) in tags.indexed)
+          Flexible(
+            child: Padding(
+              padding: EdgeInsets.only(
+                right: index == tags.length - 1 ? 0 : AppDimens.spaceXs,
+              ),
+              child: Container(
+                key: Key('recommend-tag-$sectionKey-${drama.id}-$index'),
+                height: AppDimens.cardTagHeight,
+                alignment: Alignment.center,
+                padding: const EdgeInsets.symmetric(
+                  horizontal: AppDimens.cardTagHorizontalPadding,
+                ),
+                decoration: BoxDecoration(
+                  color: AppColors.contentSurface,
+                  borderRadius: BorderRadius.circular(AppDimens.cardTagRadius),
+                ),
+                child: Text(
+                  tag,
+                  maxLines: 1,
+                  overflow: TextOverflow.ellipsis,
+                  style: const TextStyle(
+                    color: AppColors.textTertiary,
+                    fontSize: AppDimens.cardTagFont,
+                  ),
+                ),
+              ),
+            ),
+          ),
+      ],
+    );
+  }
+
+  List<String> _cardTags() {
+    final seen = <String>{};
+    return [drama.genre, drama.category]
+        .expand((value) => value.split(_tagSplitter))
+        .map((value) => value.trim())
+        .where((value) => value.isNotEmpty && seen.add(value))
+        .take(2)
+        .toList(growable: false);
+  }
 }

lib/pages/recommend/widgets/recommend_sections_view.dart

@@ -132,7 +132,7 @@ class RecommendSectionsView extends StatelessWidget {
       children: [
         Padding(
           padding: const EdgeInsets.symmetric(
-            horizontal: AppDimens.pageHorizontal,
+            horizontal: AppDimens.feedPageHorizontal,
           ),
           child: Row(
             crossAxisAlignment: CrossAxisAlignment.start,
@@ -145,7 +145,7 @@ class RecommendSectionsView extends StatelessWidget {
                       title,
                       style: const TextStyle(
                         color: AppColors.textPrimary,
-                        fontSize: AppDimens.sectionTitle,
+                        fontSize: AppDimens.recommendSectionTitle,
                         fontWeight: FontWeight.w700,
                       ),
                     ),
@@ -154,7 +154,7 @@ class RecommendSectionsView extends StatelessWidget {
                       subtitle,
                       style: const TextStyle(
                         color: AppColors.textSecondary,
-                        fontSize: AppDimens.cardViews,
+                        fontSize: AppDimens.recommendSectionSubtitle,
                       ),
                     ),
                   ],
@@ -173,7 +173,8 @@ class RecommendSectionsView extends StatelessWidget {
                     Text(
                       l10n.more,
                       style: const TextStyle(
-                        fontSize: AppDimens.caption,
+                        color: AppColors.textSecondary,
+                        fontSize: AppDimens.recommendSectionMore,
                         fontWeight: FontWeight.w500,
                       ),
                     ),
@@ -186,12 +187,12 @@ class RecommendSectionsView extends StatelessWidget {
         ),
         const SizedBox(height: AppDimens.spaceMd),
         SizedBox(
-          height: 218,
+          height: AppDimens.recommendRowHeight,
           child: ListView.separated(
             key: Key('recommend-row-$key'),
             scrollDirection: Axis.horizontal,
             padding: const EdgeInsets.symmetric(
-              horizontal: AppDimens.pageHorizontal,
+              horizontal: AppDimens.feedPageHorizontal,
             ),
             itemCount: dramas.length,
             separatorBuilder: (_, _) =>