feat(flutter): 应用浅色暖橙视觉主题

lib/app.dart

@@ -251,14 +251,14 @@ class _LumaDramaAppState extends State<LumaDramaApp> {
         localeResolutionCallback: (deviceLocale, _) =>
             resolveAppLocale(deviceLocale),
         debugShowCheckedModeBanner: false,
-        themeMode: ThemeMode.dark,
+        themeMode: ThemeMode.light,
         theme: AppTheme.light(),
-        darkTheme: AppTheme.dark(),
+        darkTheme: AppTheme.light(),
         builder: (context, child) => AnnotatedRegion<SystemUiOverlayStyle>(
-          value: SystemUiOverlayStyle.light.copyWith(
+          value: SystemUiOverlayStyle.dark.copyWith(
             statusBarColor: Colors.transparent,
             systemNavigationBarColor: AppColors.bar,
-            systemNavigationBarIconBrightness: Brightness.light,
+            systemNavigationBarIconBrightness: Brightness.dark,
           ),
           child: child ?? const SizedBox.shrink(),
         ),

lib/core/theme/app_colors.dart

@@ -2,79 +2,102 @@
 
 import 'package:flutter/material.dart';
 
-/// Obsidian Flare palette from `docs/design/README.md` and screens 01/02.
+/// K28-S 浅色暖橙主题色板。
 ///
-/// Existing semantic names (`blue`, `blueSoft`, `ink`, ...) are kept so page
-/// code does not need a mass rename; their values now follow the design tokens.
+/// 保留既有语义名，避免页面大范围改名；实际颜色统一由本文件控制。
 abstract final class AppColors {
-  /// Primary CTA, selected navigation, playback progress.
-  static const blue = Color(0xFFFF5B3D);
+  /// 主操作、选中态、播放进度。
+  static const blue = Color(0xFFFF7A1A);
   static const primary = blue;
 
-  /// Pressed state for the primary CTA.
-  static const bluePressed = Color(0xFFFF4321);
+  /// 主操作按下态。
+  static const bluePressed = Color(0xFFFF6A00);
 
-  /// Secondary accent for tags, locks, and highlighted icons.
-  static const blueSoft = Color(0xFF9278EA);
+  /// 粉色辅助强调色。
+  static const blueSoft = Color(0xFFFF6A8A);
   static const secondary = blueSoft;
   static const lavender = blueSoft;
 
-  /// Coins and rewards.
-  static const gold = Color(0xFFFBBF24);
+  /// 金币与奖励。
+  static const gold = Color(0xFFF3B34C);
 
-  /// Success and free-state accents.
-  static const success = Color(0xFF34D399);
+  /// 成功状态。
+  static const success = Color(0xFF2FA873);
 
-  /// Liked hearts use the primary accent.
-  static const favorite = blue;
+  /// 收藏和喜欢使用粉色强调。
+  static const favorite = secondary;
 
-  /// Text placed on [gold].
-  static const onGold = Color(0xFF2A1810);
+  /// 金币底色上的文字。
+  static const onGold = Color(0xFF5A3511);
 
-  /// Text and icons placed directly on [blue].
+  /// 主色上的文字与图标。
   static const onPrimary = Color(0xFFFFFFFF);
 
-  /// Page background.
-  static const ink = Color(0xFF0B0C10);
+  /// 页面背景。
+  static const ink = Color(0xFFFFF8F0);
 
-  /// Bottom navigation background (rendered at 95% with blur).
-  static const bar = Color(0xFF0D0D11);
+  /// 页面顶部暖色渐变起点。
+  static const surfaceTop = Color(0xFFFFE9D6);
 
-  /// Cards lifted off [ink].
-  static const card = Color(0xFF1B1C21);
+  /// 底部导航底色。
+  static const bar = Color(0xFFFFFDFB);
 
-  /// Alternate card surface from the mobile preview.
-  static const cardAlt = Color(0xFF1C1D21);
+  /// 中央操作按钮渐变。
+  static const navCenterStart = Color(0xFFFF9A3D);
+  static const navCenterEnd = Color(0xFFFF6A00);
+  static const navCenterShadow = Color(0x33FF7A1A);
 
-  /// Floating surfaces, inputs, and nested rows.
-  static const raised = Color(0xFF1C1D21);
-  static const quick = Color(0xFF202126);
-  static const input = Color(0xFF25252A);
-  static const goldCard = Color(0xFF201B1E);
+  /// 卡片轻阴影。
+  static const cardShadow = Color(0x14FF8A3D);
 
-  /// Body text on dark surfaces.
-  static const cream = Color(0xFFE6E1E3);
+  /// 卡片与弹层。
+  static const card = Color(0xFFFFFFFF);
 
-  /// Titles and high-emphasis text.
-  static const onSurface = Color(0xFFFFFFFF);
+  /// 次要卡片表面。
+  static const cardAlt = Color(0xFFFFF4E9);
 
-  /// Secondary text.
-  static const muted = Color(0xFFD2CDD0);
+  /// 浮层、输入框和嵌套区域。
+  static const raised = Color(0xFFFFF1E5);
+  static const quick = Color(0xFFFFF0E1);
+  static const input = Color(0xFFFFF4EA);
+  static const goldCard = Color(0xFFFFF4DF);
 
-  /// Weak hints and timestamps.
-  static const subtle = Color(0xFF9A96A3);
+  /// 正文颜色。
+  static const cream = Color(0xFF1F1B16);
 
-  /// Soft orange used for continue labels and secondary times.
-  static const accent = Color(0xFFFFA490);
+  /// 主文字。
+  static const onSurface = Color(0xFF1F1B16);
 
-  /// 8% white border used by cards and inputs.
-  static const border = Color(0x14FFFFFF);
+  /// 次要文字。
+  static const muted = Color(0xFF8C837B);
 
-  /// 14% white border used by glass controls.
-  static const glassBorder = Color(0x24FFFFFF);
+  /// 弱提示与时间。
+  static const subtle = Color(0xFFB3AAA1);
 
-  static const outlineDark = Color(0xFF2A2C36);
-  static const outlineVariantDark = Color(0xFF242329);
-  static const outlineLight = Color(0xFF8E8E93);
-  static const outlineVariantLight = Color(0xFFE4E4E7);
+  /// 橙色强调文案。
+  static const accent = blue;
+
+  /// 卡片描边。
+  static const border = Color(0xFFF0E4D6);
+
+  /// 玻璃面板描边。
+  static const glassBorder = Color(0x66FFFFFF);
+
+  /// 粉色角标。
+  static const badgePink = Color(0xFFFFE3EC);
+  static const badgePinkText = Color(0xFFFF6A8A);
+
+  /// 封面锁定数量与视频遮罩。
+  static const overlayDark = Color(0x33000000);
+
+  /// 封面集数胶囊。
+  static const badgeBeige = Color(0xFFFFF0DF);
+
+  /// 导航未选中。
+  static const navUnselected = muted;
+
+  static const outlineDark = border;
+  static const outlineVariantDark = border;
+  static const outlineLight = muted;
+  static const outlineVariantLight = border;
 }

lib/core/theme/app_dimens.dart

@@ -1,6 +1,6 @@
 // Author: fruit.com.cn
 
-/// Cross-page spacing, type, radius, and control sizes.
+/// 跨页面复用的间距、字号、圆角和控件尺寸。
 abstract final class AppDimens {
   static const double spaceXs = 4;
   static const double spaceSm = 8;
@@ -9,17 +9,18 @@ abstract final class AppDimens {
   static const double spaceXl = 24;
 
   static const double pageHorizontal = 16;
-  static const double cardRadius = 12;
+  static const double cardRadius = 16;
   static const double authCardRadius = 20;
   static const double cardPadding = 16;
-  static const double innerRadius = 10;
+  static const double innerRadius = 12;
   static const double innerPadding = 12;
-  static const double pillRadius = 20;
-  static const double glassSmallRadius = 12;
-  static const double glassRadius = 14;
-  static const double glassCardRadius = 14;
-  static const double buttonRadius = 9;
-  static const double coverRadius = 10;
+  static const double pillRadius = 999;
+  static const double glassSmallRadius = 16;
+  static const double glassRadius = 20;
+  static const double glassCardRadius = 20;
+  static const double buttonRadius = 999;
+  static const double coverRadius = 16;
+  static const double sheetRadius = 20;
 
   static const double caption = 12;
   static const double emptyStateSubtitle = 12.5;
@@ -33,7 +34,7 @@ abstract final class AppDimens {
   static const double previewCardTitle = 13;
   static const double previewSectionTitle = 14;
   static const double chipFont = 10;
-  static const double navLabel = 9;
+  static const double navLabel = 10;
 
   static const double buttonHeight = 48;
   static const double primaryButtonHeight = 52;
@@ -44,8 +45,10 @@ abstract final class AppDimens {
   static const double tapTarget = 44;
   static const double contentHeaderHeight = 46;
 
-  static const double navHeight = 54;
-  static const double navIcon = 17;
+  static const double navHeight = 64;
+  static const double navIcon = 20;
+  static const double navCenter = 56;
+  static const double navCenterIcon = 28;
   static const double progressHeight = 3;
   static const double progressRadius = 2;
   static const double progressLineHeight = 3;
@@ -60,7 +63,11 @@ abstract final class AppDimens {
 
   static const double watchPlaceholderHeight = 114;
   static const double heroBannerHeight = 176;
+  static const double heroBannerRadius = 20;
 
-  static const double cardMeta = 9;
-  static const double cardViews = 9;
+  static const double cardMeta = 12;
+  static const double cardViews = 11;
+  static const double cardTitle = 15;
+  static const double cardShadowBlur = 18;
+  static const double cardShadowY = 6;
 }

lib/core/theme/app_theme.dart

@@ -6,79 +6,62 @@ import 'package:flutter/services.dart';
 import 'app_colors.dart';
 import 'app_dimens.dart';
 
-/// Obsidian Flare themes. Dark is the product default; light mirrors the same
-/// orange primary for system-light devices.
+/// K28-S 浅色暖橙主题。
 abstract final class AppTheme {
-  static const _lightBackground = Color(0xFFF7F7F8);
-  static const _darkBackground = AppColors.ink;
-
-  /// Light theme for system light mode.
-  static ThemeData light() => _build(
-    brightness: Brightness.light,
-    surface: _lightBackground,
-    accent: AppColors.blue,
+  /// 页面顶部暖色到米白背景的渐变。
+  static const LinearGradient pageGradient = LinearGradient(
+    begin: Alignment.topCenter,
+    end: Alignment.bottomCenter,
+    colors: [AppColors.surfaceTop, AppColors.ink],
+    stops: [0, 0.24],
   );
 
-  /// Dark theme for system dark mode.
-  static ThemeData dark() => _build(
-    brightness: Brightness.dark,
-    surface: _darkBackground,
-    accent: AppColors.blue,
+  /// 卡片轻阴影。
+  static const BoxShadow cardShadow = BoxShadow(
+    color: AppColors.cardShadow,
+    blurRadius: AppDimens.cardShadowBlur,
+    offset: Offset(0, AppDimens.cardShadowY),
   );
 
-  static ThemeData _build({
-    required Brightness brightness,
-    required Color surface,
-    required Color accent,
-  }) {
-    final dark = brightness == Brightness.dark;
-    final scheme = dark
-        ? const ColorScheme.dark(
-            primary: AppColors.blue,
-            onPrimary: AppColors.onPrimary,
-            secondary: AppColors.secondary,
-            onSecondary: AppColors.onPrimary,
-            primaryContainer: AppColors.bluePressed,
-            onPrimaryContainer: AppColors.onPrimary,
-            secondaryContainer: AppColors.raised,
-            onSecondaryContainer: AppColors.onPrimary,
-            surface: _darkBackground,
-            onSurface: AppColors.onSurface,
-            outline: AppColors.outlineDark,
-            outlineVariant: AppColors.outlineVariantDark,
-            surfaceTint: AppColors.blue,
-            inversePrimary: AppColors.blueSoft,
-          )
-        : ColorScheme.light(
-            primary: AppColors.blue,
-            onPrimary: AppColors.onPrimary,
-            secondary: AppColors.secondary,
-            onSecondary: AppColors.onPrimary,
-            primaryContainer: AppColors.blue.withValues(alpha: 0.14),
-            onPrimaryContainer: AppColors.ink,
-            secondaryContainer: AppColors.blueSoft.withValues(alpha: 0.14),
-            onSecondaryContainer: AppColors.ink,
-            surface: _lightBackground,
-            onSurface: AppColors.ink,
-            outline: AppColors.outlineLight,
-            outlineVariant: AppColors.outlineVariantLight,
-            surfaceTint: AppColors.blue,
-            inversePrimary: AppColors.blueSoft,
-          );
+  /// 全局浅色暖橙主题。
+  static ThemeData light() {
+    const scheme = ColorScheme.light(
+      primary: AppColors.blue,
+      onPrimary: AppColors.onPrimary,
+      secondary: AppColors.secondary,
+      onSecondary: AppColors.onPrimary,
+      primaryContainer: AppColors.surfaceTop,
+      onPrimaryContainer: AppColors.onSurface,
+      secondaryContainer: AppColors.badgePink,
+      onSecondaryContainer: AppColors.badgePinkText,
+      surface: AppColors.ink,
+      onSurface: AppColors.onSurface,
+      outline: AppColors.border,
+      outlineVariant: AppColors.border,
+      surfaceTint: AppColors.blue,
+      inversePrimary: AppColors.bluePressed,
+    );
     final base = ThemeData(
       useMaterial3: true,
-      brightness: brightness,
+      brightness: Brightness.light,
       colorScheme: scheme,
-      scaffoldBackgroundColor: surface,
+      scaffoldBackgroundColor: AppColors.ink,
       fontFamily: 'PlusJakartaSans',
-      progressIndicatorTheme: ProgressIndicatorThemeData(color: accent),
-      sliderTheme: SliderThemeData(
-        activeTrackColor: accent,
+      progressIndicatorTheme: const ProgressIndicatorThemeData(
+        color: AppColors.blue,
+      ),
+      sliderTheme: const SliderThemeData(
+        activeTrackColor: AppColors.blue,
+        inactiveTrackColor: AppColors.border,
         thumbColor: AppColors.onPrimary,
       ),
-      tabBarTheme: TabBarThemeData(labelColor: accent, indicatorColor: accent),
+      tabBarTheme: const TabBarThemeData(
+        labelColor: AppColors.blue,
+        indicatorColor: AppColors.blue,
+        unselectedLabelColor: AppColors.muted,
+      ),
       textButtonTheme: TextButtonThemeData(
-        style: TextButton.styleFrom(foregroundColor: accent),
+        style: TextButton.styleFrom(foregroundColor: AppColors.blue),
       ),
       filledButtonTheme: FilledButtonThemeData(
         style: ButtonStyle(
@@ -87,25 +70,26 @@ abstract final class AppTheme {
           minimumSize: const WidgetStatePropertyAll(
             Size(0, AppDimens.buttonHeight),
           ),
+          shape: const WidgetStatePropertyAll(StadiumBorder()),
         ),
       ),
       outlinedButtonTheme: OutlinedButtonThemeData(
         style: ButtonStyle(
-          foregroundColor: WidgetStatePropertyAll(
-            dark ? AppColors.blueSoft : AppColors.bluePressed,
-          ),
+          foregroundColor: const WidgetStatePropertyAll(AppColors.blue),
           minimumSize: const WidgetStatePropertyAll(
             Size(0, AppDimens.buttonHeight),
           ),
-          side: WidgetStatePropertyAll(
-            BorderSide(
-              color: dark ? AppColors.outlineDark : AppColors.outlineLight,
-            ),
+          side: const WidgetStatePropertyAll(
+            BorderSide(color: AppColors.border),
           ),
+          shape: const WidgetStatePropertyAll(StadiumBorder()),
         ),
       ),
       appBarTheme: const AppBarTheme(
-        systemOverlayStyle: SystemUiOverlayStyle.light,
+        backgroundColor: AppColors.ink,
+        foregroundColor: AppColors.onSurface,
+        elevation: 0,
+        systemOverlayStyle: SystemUiOverlayStyle.dark,
         titleTextStyle: TextStyle(
           color: AppColors.onSurface,
           fontFamily: 'Outfit',
@@ -113,6 +97,16 @@ abstract final class AppTheme {
           fontWeight: FontWeight.w800,
         ),
       ),
+      iconTheme: const IconThemeData(color: AppColors.onSurface),
+      dividerTheme: const DividerThemeData(color: AppColors.border),
+      cardTheme: const CardThemeData(
+        color: AppColors.card,
+        elevation: 0,
+        shape: RoundedRectangleBorder(
+          borderRadius: BorderRadius.all(Radius.circular(AppDimens.cardRadius)),
+          side: BorderSide(color: AppColors.border),
+        ),
+      ),
       switchTheme: SwitchThemeData(
         thumbColor: WidgetStateProperty.resolveWith(
           (states) => states.contains(WidgetState.selected)
@@ -120,36 +114,35 @@ abstract final class AppTheme {
               : null,
         ),
         trackColor: WidgetStateProperty.resolveWith(
-          (states) => states.contains(WidgetState.selected) ? accent : null,
+          (states) =>
+              states.contains(WidgetState.selected) ? AppColors.blue : null,
         ),
       ),
-      snackBarTheme: SnackBarThemeData(
-        backgroundColor: AppColors.bluePressed,
-        contentTextStyle: const TextStyle(color: AppColors.onPrimary),
+      snackBarTheme: const SnackBarThemeData(
+        backgroundColor: AppColors.onSurface,
+        contentTextStyle: TextStyle(color: AppColors.onPrimary),
       ),
     );
     final textTheme = base.textTheme
         .apply(
           fontFamily: 'PlusJakartaSans',
-          bodyColor: dark ? AppColors.cream : AppColors.ink,
-          displayColor: dark ? AppColors.onSurface : AppColors.ink,
+          bodyColor: AppColors.cream,
+          displayColor: AppColors.onSurface,
         )
         .copyWith(
-          displayLarge: _display(base.textTheme.displayLarge, dark),
-          displayMedium: _display(base.textTheme.displayMedium, dark),
-          displaySmall: _display(base.textTheme.displaySmall, dark),
-          headlineLarge: _display(base.textTheme.headlineLarge, dark),
-          headlineMedium: _display(base.textTheme.headlineMedium, dark),
-          headlineSmall: _display(base.textTheme.headlineSmall, dark),
-          titleLarge: _display(base.textTheme.titleLarge, dark),
+          displayLarge: _display(base.textTheme.displayLarge),
+          displayMedium: _display(base.textTheme.displayMedium),
+          displaySmall: _display(base.textTheme.displaySmall),
+          headlineLarge: _display(base.textTheme.headlineLarge),
+          headlineMedium: _display(base.textTheme.headlineMedium),
+          headlineSmall: _display(base.textTheme.headlineSmall),
+          titleLarge: _display(base.textTheme.titleLarge),
         );
     return base.copyWith(textTheme: textTheme);
   }
 
-  static TextStyle? _display(TextStyle? style, bool dark) => style?.copyWith(
-    fontFamily: 'Outfit',
-    color: dark ? AppColors.onSurface : AppColors.ink,
-  );
+  static TextStyle? _display(TextStyle? style) =>
+      style?.copyWith(fontFamily: 'Outfit', color: AppColors.onSurface);
 
   static Color _buttonColor(Set<WidgetState> states) {
     if (states.contains(WidgetState.pressed) ||

lib/core/widgets/app_bottom_nav.dart

@@ -7,7 +7,7 @@ import 'package:flutter/material.dart';
 import '../theme/app_colors.dart';
 import '../theme/app_dimens.dart';
 
-/// One destination rendered by [AppBottomNav].
+/// 底部导航普通目的地。
 class AppBottomNavItem {
   const AppBottomNavItem({
     required this.tabKey,
@@ -26,41 +26,69 @@ class AppBottomNavItem {
   final bool selected;
 }
 
-/// Shared bottom navigation used by the root shell and standalone tabs.
+/// 底部导航中央操作按钮。
+class AppBottomNavCenterAction {
+  const AppBottomNavCenterAction({
+    required this.label,
+    required this.onTap,
+    this.key = const Key('nav-center-action'),
+  });
+
+  final Key key;
+  final String label;
+  final VoidCallback onTap;
+}
+
+/// 全局五槽底部导航。
 class AppBottomNav extends StatelessWidget {
   const AppBottomNav({
     super.key,
     required this.items,
+    this.centerAction,
     this.backgroundColor = AppColors.bar,
     this.barKey,
   });
 
   final List<AppBottomNavItem> items;
+  final AppBottomNavCenterAction? centerAction;
   final Color backgroundColor;
   final Key? barKey;
 
   @override
-  Widget build(BuildContext context) => ClipRect(
-    child: BackdropFilter(
-      filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
-      child: SafeArea(
-        top: false,
-        child: Container(
-          key: barKey,
-          height: AppDimens.navHeight,
-          decoration: BoxDecoration(
-            color: backgroundColor.withValues(alpha: 0.95),
-            border: const Border(
-              top: BorderSide(color: AppColors.outlineVariantDark),
+  Widget build(BuildContext context) {
+    final action = centerAction;
+    return ClipRect(
+      child: BackdropFilter(
+        filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
+        child: SafeArea(
+          top: false,
+          child: Container(
+            key: barKey,
+            height: AppDimens.navHeight,
+            decoration: BoxDecoration(
+              color: backgroundColor.withValues(alpha: 0.95),
+              border: const Border(top: BorderSide(color: AppColors.border)),
             ),
-          ),
-          child: Row(
-            children: [for (final item in items) _NavDestination(item: item)],
+            child: action == null
+                ? Row(
+                    children: [
+                      for (final item in items) _NavDestination(item: item),
+                    ],
+                  )
+                : Row(
+                    children: [
+                      for (final item in items.take(2))
+                        _NavDestination(item: item),
+                      Expanded(child: _CenterDestination(action: action)),
+                      for (final item in items.skip(2))
+                        _NavDestination(item: item),
+                    ],
+                  ),
           ),
         ),
       ),
-    ),
-  );
+    );
+  }
 }
 
 class _NavDestination extends StatelessWidget {
@@ -78,7 +106,7 @@ class _NavDestination extends StatelessWidget {
         key: item.tabKey,
         onTap: item.onTap,
         child: ConstrainedBox(
-          constraints: const BoxConstraints(minHeight: 48),
+          constraints: const BoxConstraints(minHeight: AppDimens.navHeight),
           child: Column(
             mainAxisAlignment: MainAxisAlignment.center,
             children: [
@@ -91,7 +119,7 @@ class _NavDestination extends StatelessWidget {
                   size: AppDimens.navIcon,
                   color: item.selected
                       ? AppColors.blue
-                      : Colors.white.withValues(alpha: 0.45),
+                      : AppColors.navUnselected,
                 ),
               ),
               const SizedBox(height: 2),
@@ -104,7 +132,7 @@ class _NavDestination extends StatelessWidget {
                   fontWeight: item.selected ? FontWeight.w700 : FontWeight.w500,
                   color: item.selected
                       ? AppColors.blue
-                      : Colors.white.withValues(alpha: 0.45),
+                      : AppColors.navUnselected,
                   letterSpacing: 0,
                 ),
               ),
@@ -115,3 +143,53 @@ class _NavDestination extends StatelessWidget {
     ),
   );
 }
+
+class _CenterDestination extends StatelessWidget {
+  const _CenterDestination({required this.action});
+
+  final AppBottomNavCenterAction action;
+
+  @override
+  Widget build(BuildContext context) {
+    return Center(
+      child: Semantics(
+        button: true,
+        label: action.label,
+        child: Material(
+          color: Colors.transparent,
+          shape: const CircleBorder(),
+          clipBehavior: Clip.antiAlias,
+          child: Ink(
+            width: AppDimens.navCenter,
+            height: AppDimens.navCenter,
+            decoration: const BoxDecoration(
+              shape: BoxShape.circle,
+              gradient: LinearGradient(
+                begin: Alignment.topLeft,
+                end: Alignment.bottomRight,
+                colors: [AppColors.navCenterStart, AppColors.navCenterEnd],
+              ),
+              boxShadow: [
+                BoxShadow(
+                  color: AppColors.navCenterShadow,
+                  blurRadius: 14,
+                  offset: Offset(0, 5),
+                ),
+              ],
+            ),
+            child: InkWell(
+              key: action.key,
+              customBorder: const CircleBorder(),
+              onTap: action.onTap,
+              child: const Icon(
+                Icons.add_rounded,
+                color: AppColors.onPrimary,
+                size: AppDimens.navCenterIcon,
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/core/widgets/glass_panel.dart

@@ -7,7 +7,7 @@ import 'package:flutter/material.dart';
 import '../theme/app_colors.dart';
 import '../theme/app_dimens.dart';
 
-/// Dark glass surface used by the home info card and floating controls.
+/// 首页信息卡与浮层控件使用的浅色玻璃面板。
 class GlassPanel extends StatelessWidget {
   const GlassPanel({
     super.key,
@@ -38,7 +38,7 @@ class GlassPanel extends StatelessWidget {
             const LinearGradient(
               begin: Alignment.topLeft,
               end: Alignment.bottomRight,
-              colors: [Color(0x24FFFFFF), Color(0x0DFFFFFF)],
+              colors: [Color(0xE6FFFFFF), Color(0xB3FFFDFB)],
             ),
       ),
       child: Padding(padding: padding ?? EdgeInsets.zero, child: child),

lib/l10n/app_en.arb

@@ -82,6 +82,18 @@
       "count": {"type": "int"}
     }
   },
+  "allEpisodesBadge": "All {count}",
+  "@allEpisodesBadge": {
+    "placeholders": {
+      "count": {"type": "int"}
+    }
+  },
+  "lockedEpisodeCount": "{count} locked",
+  "@lockedEpisodeCount": {
+    "placeholders": {
+      "count": {"type": "int"}
+    }
+  },
   "watchedPercent": "Watched {percent}%",
   "@watchedPercent": {
     "placeholders": {

lib/l10n/app_id.arb

@@ -82,6 +82,18 @@
       "count": {"type": "int"}
     }
   },
+  "allEpisodesBadge": "Semua {count}",
+  "@allEpisodesBadge": {
+    "placeholders": {
+      "count": {"type": "int"}
+    }
+  },
+  "lockedEpisodeCount": "{count} terkunci",
+  "@lockedEpisodeCount": {
+    "placeholders": {
+      "count": {"type": "int"}
+    }
+  },
   "watchedPercent": "Sudah ditonton {percent}%",
   "@watchedPercent": {
     "placeholders": {

lib/l10n/app_localizations.dart

@@ -460,6 +460,18 @@ abstract class AppLocalizations {
   /// **'{count} views'**
   String viewCountLabel(int count);
 
+  /// No description provided for @allEpisodesBadge.
+  ///
+  /// In en, this message translates to:
+  /// **'All {count}'**
+  String allEpisodesBadge(int count);
+
+  /// No description provided for @lockedEpisodeCount.
+  ///
+  /// In en, this message translates to:
+  /// **'{count} locked'**
+  String lockedEpisodeCount(int count);
+
   /// No description provided for @watchedPercent.
   ///
   /// In en, this message translates to:

lib/l10n/app_localizations_en.dart

@@ -201,6 +201,16 @@ class AppLocalizationsEn extends AppLocalizations {
     return '$count views';
   }
 
+  @override
+  String allEpisodesBadge(int count) {
+    return 'All $count';
+  }
+
+  @override
+  String lockedEpisodeCount(int count) {
+    return '$count locked';
+  }
+
   @override
   String watchedPercent(int percent) {
     return 'Watched $percent%';

lib/l10n/app_localizations_id.dart

@@ -201,6 +201,16 @@ class AppLocalizationsId extends AppLocalizations {
     return '$count tayangan';
   }
 
+  @override
+  String allEpisodesBadge(int count) {
+    return 'Semua $count';
+  }
+
+  @override
+  String lockedEpisodeCount(int count) {
+    return '$count terkunci';
+  }
+
   @override
   String watchedPercent(int percent) {
     return 'Sudah ditonton $percent%';

lib/l10n/app_localizations_zh.dart

@@ -196,6 +196,16 @@ class AppLocalizationsZh extends AppLocalizations {
     return '$count 次播放';
   }
 
+  @override
+  String allEpisodesBadge(int count) {
+    return '全 $count 集';
+  }
+
+  @override
+  String lockedEpisodeCount(int count) {
+    return '锁 $count';
+  }
+
   @override
   String watchedPercent(int percent) {
     return '已观看 $percent%';

lib/l10n/app_zh.arb

@@ -82,6 +82,18 @@
       "count": {"type": "int"}
     }
   },
+  "allEpisodesBadge": "全 {count} 集",
+  "@allEpisodesBadge": {
+    "placeholders": {
+      "count": {"type": "int"}
+    }
+  },
+  "lockedEpisodeCount": "锁 {count}",
+  "@lockedEpisodeCount": {
+    "placeholders": {
+      "count": {"type": "int"}
+    }
+  },
   "watchedPercent": "已观看 {percent}%",
   "@watchedPercent": {
     "placeholders": {

lib/pages/account/account_deactivate_page.dart

@@ -50,7 +50,7 @@ class _AccountDeactivatePageState extends State<AccountDeactivatePage> {
     final signedIn = context.watch<AuthController>().isSignedIn;
     final canShow = signedIn || _logic.scheduledAt != null;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         key: const Key('account-deactivate-page'),
         backgroundColor: AppColors.ink,

lib/pages/account/account_devices_page.dart

@@ -50,7 +50,7 @@ class _AccountDevicesPageState extends State<AccountDevicesPage> {
     final l10n = AppLocalizations.of(context)!;
     final signedIn = context.watch<AuthController>().isSignedIn;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         key: const Key('account-devices-page'),
         backgroundColor: AppColors.ink,

lib/pages/account/account_export_page.dart

@@ -51,7 +51,7 @@ class _AccountExportPageState extends State<AccountExportPage> {
     final l10n = AppLocalizations.of(context)!;
     final signedIn = context.watch<AuthController>().isSignedIn;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         key: const Key('account-export-page'),
         backgroundColor: AppColors.ink,

lib/pages/account/account_profile_page.dart

@@ -71,7 +71,7 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
     final l10n = AppLocalizations.of(context)!;
     final signedIn = context.watch<AuthController>().isSignedIn;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         key: const Key('account-profile-page'),
         backgroundColor: AppColors.ink,

lib/pages/auth/auth_view.dart

@@ -141,7 +141,7 @@ class _AuthPageState extends State<AuthPage> {
   Widget build(BuildContext context) {
     final l10n = AppLocalizations.of(context)!;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         resizeToAvoidBottomInset: true,
         backgroundColor: AppColors.ink,
@@ -332,7 +332,7 @@ class _AuthPageState extends State<AuthPage> {
       Text(
         l10n.authLandingSubtitle,
         textAlign: TextAlign.center,
-        style: const TextStyle(color: Color(0xFF9A96A3), fontSize: 11),
+        style: const TextStyle(color: AppColors.subtle, fontSize: 11),
       ),
       const SizedBox(height: 22),
       _AuthEntryButton(
@@ -358,7 +358,7 @@ class _AuthPageState extends State<AuthPage> {
         key: const Key('auth-legal'),
         textAlign: TextAlign.center,
         style: const TextStyle(
-          color: Color(0xFF6B6772),
+          color: AppColors.muted,
           fontSize: 9,
           height: 1.6,
         ),
@@ -442,8 +442,7 @@ class _AuthEntryButton extends StatelessWidget {
           child: Row(
             mainAxisAlignment: MainAxisAlignment.center,
             children: [
-              if (icon != null)
-                Icon(icon, size: 16, color: foreground),
+              if (icon != null) Icon(icon, size: 16, color: foreground),
               if (icon != null) const SizedBox(width: 7),
               Flexible(
                 child: Text(

lib/pages/create/create_view.dart

@@ -7,7 +7,7 @@ import '../../core/theme/app_dimens.dart';
 import '../../core/theme/app_theme.dart';
 import '../../l10n/app_localizations.dart';
 
-/// K28-A1 placeholder for the future creation workspace.
+/// K28-A1 创作页占位骨架。
 class CreatePage extends StatelessWidget {
   const CreatePage({super.key});
 
@@ -15,7 +15,7 @@ class CreatePage extends StatelessWidget {
   Widget build(BuildContext context) {
     final l10n = AppLocalizations.of(context)!;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: SafeArea(
         bottom: false,
         child: Padding(

lib/pages/discover/category_dramas_page.dart

@@ -27,7 +27,7 @@ class CategoryDramasPage extends StatelessWidget {
   Widget build(BuildContext context) {
     final l10n = AppLocalizations.of(context)!;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         key: const Key('category-dramas-page'),
         backgroundColor: AppColors.ink,

lib/pages/discover/discover_view.dart

@@ -108,9 +108,9 @@ class _DiscoverPageState extends State<DiscoverPage> {
       ),
     );
     return AnnotatedRegion<SystemUiOverlayStyle>(
-      value: SystemUiOverlayStyle.light,
+      value: SystemUiOverlayStyle.dark,
       child: Theme(
-        data: AppTheme.dark(),
+        data: AppTheme.light(),
         child: embedded
             ? content
             : Scaffold(backgroundColor: AppColors.ink, body: content),
@@ -340,6 +340,10 @@ class _DiscoverPageState extends State<DiscoverPage> {
   }
 
   Widget _bottomNav(AppLocalizations l10n) => AppBottomNav(
+    centerAction: AppBottomNavCenterAction(
+      label: l10n.createTab,
+      onTap: () => _act(DiscoverPageAction.create),
+    ),
     items: [
       AppBottomNavItem(
         tabKey: const Key('discover-nav-home'),

lib/pages/discover/widgets/discover_header.dart

@@ -88,12 +88,12 @@ class DiscoverHeader extends StatelessWidget {
             gradient: LinearGradient(
               begin: Alignment.topLeft,
               end: Alignment.bottomRight,
-              colors: [Color(0xFF6A5CFF), AppColors.blue],
+              colors: [AppColors.secondary, AppColors.blue],
             ),
           ),
           child: const Icon(
             Icons.person_rounded,
-            color: AppColors.onSurface,
+            color: AppColors.onPrimary,
             size: 18,
           ),
         ),
@@ -124,7 +124,7 @@ class _HeaderIcon extends StatelessWidget {
         onPressed: onTap,
         padding: EdgeInsets.zero,
         style: IconButton.styleFrom(
-          backgroundColor: const Color(0xFF2C2D33),
+          backgroundColor: AppColors.raised,
           foregroundColor: AppColors.onSurface,
         ),
         icon: Icon(icon, size: 18),

lib/pages/discover/widgets/drama_grid.dart

@@ -5,11 +5,15 @@ import 'package:flutter/material.dart';
 import '../../../core/config/app_config.dart';
 import '../../../core/data/models/drama.dart';
 import '../../../core/theme/app_colors.dart';
+import '../../../core/theme/app_dimens.dart';
+import '../../../core/theme/app_theme.dart';
 import '../../../l10n/app_localizations.dart';
 
 const int _columns = 2;
 const double _columnGap = 10;
 const double _cardGap = 10;
+const double _addSize = 28;
+const double _addIconSize = 18;
 
 /// 剧场/分类页共用的双列剧目网格。
 class DramaGrid extends StatelessWidget {
@@ -71,19 +75,33 @@ class DramaGridCard extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return InkWell(
-      key: Key('home-drama-card-${drama.id}'),
-      onTap: onTap,
-      borderRadius: BorderRadius.circular(10),
-      child: Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          _cover(),
-          const SizedBox(height: 5),
-          _title(),
-          const SizedBox(height: 2),
-          _genre(),
-        ],
+    return Container(
+      decoration: BoxDecoration(
+        color: AppColors.card,
+        borderRadius: BorderRadius.circular(AppDimens.cardRadius),
+        boxShadow: const [AppTheme.cardShadow],
+      ),
+      child: Material(
+        color: Colors.transparent,
+        borderRadius: BorderRadius.circular(AppDimens.cardRadius),
+        clipBehavior: Clip.antiAlias,
+        child: InkWell(
+          key: Key('home-drama-card-${drama.id}'),
+          onTap: onTap,
+          child: Padding(
+            padding: const EdgeInsets.all(AppDimens.spaceSm),
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                _cover(),
+                const SizedBox(height: AppDimens.spaceSm),
+                _title(),
+                const SizedBox(height: AppDimens.spaceXs),
+                _footer(),
+              ],
+            ),
+          ),
+        ),
       ),
     );
   }
@@ -94,34 +112,90 @@ class DramaGridCard extends StatelessWidget {
         drama.episodes.any((episode) => episode.isFree);
     return ClipRRect(
       key: Key('home-drama-cover-${drama.id}'),
-      borderRadius: BorderRadius.circular(10),
+      borderRadius: BorderRadius.circular(AppDimens.coverRadius),
       child: Stack(
         children: [
           _DiscoverCoverImage(path: drama.posterUrl),
-          if (free) Positioned(top: 6, left: 6, child: _freeBadge()),
+          Positioned(top: 8, left: 8, child: _tagBadge(free)),
+          if (_lockedCount > 0)
+            Positioned(top: 8, right: 8, child: _lockedBadge()),
+          Positioned(right: 8, bottom: 8, child: _episodeBadge()),
         ],
       ),
     );
   }
 
-  Widget _freeBadge() {
+  int get _lockedCount {
+    final explicit = drama.episodes.where((episode) => episode.locked).length;
+    if (explicit > 0) return explicit;
+    final inferred = drama.episodeCount - drama.freeEpisodes;
+    return inferred > 0 ? inferred : 0;
+  }
+
+  Widget _tagBadge(bool free) {
     return Container(
-      padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
+      key: Key('drama-tag-${drama.id}'),
+      padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
       decoration: BoxDecoration(
-        color: AppColors.blue,
-        borderRadius: BorderRadius.circular(6),
+        color: AppColors.badgePink,
+        borderRadius: BorderRadius.circular(AppDimens.pillRadius),
       ),
       child: Text(
-        l10n.free,
+        free ? l10n.free : l10n.originalTag,
         style: const TextStyle(
-          color: AppColors.onPrimary,
-          fontSize: 8,
+          color: AppColors.badgePinkText,
+          fontSize: AppDimens.cardMeta,
           fontWeight: FontWeight.w800,
         ),
       ),
     );
   }
 
+  Widget _lockedBadge() {
+    return Container(
+      key: Key('drama-locked-${drama.id}'),
+      padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 3),
+      decoration: BoxDecoration(
+        color: AppColors.overlayDark,
+        borderRadius: BorderRadius.circular(AppDimens.pillRadius),
+      ),
+      child: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          const Icon(Icons.lock_rounded, color: AppColors.onPrimary, size: 11),
+          const SizedBox(width: 2),
+          Text(
+            l10n.lockedEpisodeCount(_lockedCount),
+            style: const TextStyle(
+              color: AppColors.onPrimary,
+              fontSize: 9,
+              fontWeight: FontWeight.w700,
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _episodeBadge() {
+    return Container(
+      key: Key('drama-episodes-badge-${drama.id}'),
+      padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
+      decoration: BoxDecoration(
+        color: AppColors.badgeBeige,
+        borderRadius: BorderRadius.circular(AppDimens.pillRadius),
+      ),
+      child: Text(
+        l10n.allEpisodesBadge(drama.episodeCount),
+        style: const TextStyle(
+          color: AppColors.onSurface,
+          fontSize: 9,
+          fontWeight: FontWeight.w700,
+        ),
+      ),
+    );
+  }
+
   Widget _title() {
     return Text(
       drama.title,
@@ -130,7 +204,7 @@ class DramaGridCard extends StatelessWidget {
       overflow: TextOverflow.ellipsis,
       style: const TextStyle(
         color: AppColors.onSurface,
-        fontSize: 11,
+        fontSize: AppDimens.cardTitle,
         fontWeight: FontWeight.w800,
       ),
     );
@@ -143,7 +217,32 @@ class DramaGridCard extends StatelessWidget {
       key: Key('home-drama-genre-${drama.id}'),
       maxLines: 1,
       overflow: TextOverflow.ellipsis,
-      style: const TextStyle(color: Color(0xFFBBBBBB), fontSize: 9),
+      style: const TextStyle(
+        color: AppColors.muted,
+        fontSize: AppDimens.cardMeta,
+      ),
+    );
+  }
+
+  Widget _footer() {
+    return Row(
+      children: [
+        Expanded(child: _genre()),
+        Container(
+          key: Key('drama-add-${drama.id}'),
+          width: _addSize,
+          height: _addSize,
+          decoration: const BoxDecoration(
+            color: AppColors.blue,
+            shape: BoxShape.circle,
+          ),
+          child: const Icon(
+            Icons.add_rounded,
+            color: AppColors.onPrimary,
+            size: _addIconSize,
+          ),
+        ),
+      ],
     );
   }
 }

lib/pages/discover/widgets/ranking_section.dart

@@ -135,7 +135,7 @@ class _RankingSectionState extends State<RankingSection> {
     final selected = logic.board == board;
     return Material(
       key: key,
-      color: selected ? AppColors.blue : AppColors.raised,
+      color: selected ? AppColors.blue : AppColors.card,
       borderRadius: BorderRadius.circular(999),
       clipBehavior: Clip.antiAlias,
       child: InkWell(
@@ -145,7 +145,7 @@ class _RankingSectionState extends State<RankingSection> {
           child: Text(
             label,
             style: TextStyle(
-              color: selected ? AppColors.onPrimary : AppColors.muted,
+              color: selected ? AppColors.onPrimary : AppColors.onSurface,
               fontSize: 9,
               fontWeight: FontWeight.w700,
             ),

lib/pages/downloads/downloads_page.dart

@@ -54,7 +54,7 @@ class _DownloadsPageState extends State<DownloadsPage> {
     final l10n = AppLocalizations.of(context)!;
     final signedIn = context.watch<AuthController>().isSignedIn;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         key: const Key('downloads-page'),
         backgroundColor: AppColors.ink,
@@ -168,11 +168,8 @@ class _DownloadsBody extends StatelessWidget {
     );
     Navigator.of(context).push(
       MaterialPageRoute<void>(
-        builder: (_) => PlayerPage(
-          drama: drama,
-          initialIndex: 0,
-          downloads: downloads,
-        ),
+        builder: (_) =>
+            PlayerPage(drama: drama, initialIndex: 0, downloads: downloads),
       ),
     );
   }

lib/pages/drama_detail/drama_detail_view.dart

@@ -73,7 +73,7 @@ class _DramaDetailPageState extends State<DramaDetailPage> {
   @override
   Widget build(BuildContext context) {
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: ListenableBuilder(
         listenable: logic,
         builder: (context, _) => _page(context),
@@ -171,7 +171,7 @@ class _DramaDetailPageState extends State<DramaDetailPage> {
               gradient: LinearGradient(
                 begin: Alignment.topCenter,
                 end: Alignment.bottomCenter,
-                colors: [Color(0x33000000), Color(0xCC0B0C10)],
+                colors: [Color(0x33000000), AppColors.onSurface],
               ),
             ),
           ),
@@ -363,7 +363,7 @@ class _DramaDetailPageState extends State<DramaDetailPage> {
               ? AppColors.blue
               : locked
               ? AppColors.secondary.withValues(alpha: 0.16)
-              : const Color(0xFF29272B),
+              : AppColors.raised,
           borderRadius: BorderRadius.circular(9),
         ),
         child: Text(
@@ -461,8 +461,8 @@ class _DramaDetailPageState extends State<DramaDetailPage> {
       child: Container(
         width: 36,
         height: 36,
-        decoration: const BoxDecoration(
-          color: Color(0x80000000),
+        decoration: BoxDecoration(
+          color: AppColors.card.withValues(alpha: 0.92),
           shape: BoxShape.circle,
         ),
         child: const Icon(
@@ -562,8 +562,8 @@ class _RoundAction extends StatelessWidget {
     return Container(
       width: 36,
       height: 36,
-      decoration: const BoxDecoration(
-        color: Color(0x80000000),
+      decoration: BoxDecoration(
+        color: AppColors.card.withValues(alpha: 0.92),
         shape: BoxShape.circle,
       ),
       child: IconButton(
@@ -592,7 +592,7 @@ class _ResumeBar extends StatelessWidget {
           child: LinearProgressIndicator(
             value: fraction,
             minHeight: 3,
-            backgroundColor: const Color(0xFF474248),
+            backgroundColor: AppColors.border,
             valueColor: const AlwaysStoppedAnimation(AppColors.blue),
           ),
         ),

lib/pages/favorites/favorites_page.dart

@@ -51,7 +51,7 @@ class _FavoritesPageState extends State<FavoritesPage> {
     final l10n = AppLocalizations.of(context)!;
     final signedIn = context.watch<AuthController>().isSignedIn;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         backgroundColor: AppColors.ink,
         appBar: AppBar(

lib/pages/home/home_browse_logic.dart

@@ -7,10 +7,10 @@ import 'package:flutter/foundation.dart';
 import '../../core/data/models/watch_progress.dart';
 import '../../core/data/repositories/watch_history_repository.dart';
 
-/// Home browse channel, backed only by data already present in the catalogue.
+/// 首页频道，只依赖目录中已有数据排序或过滤。
 enum HomeChannel { hot, free, newReleases, ranking }
 
-/// Local UI state for the browse-first home page.
+/// 浏览型首页的本地 UI 状态。
 class HomeBrowseLogic extends ChangeNotifier {
   HomeBrowseLogic({required this.history}) {
     unawaited(refreshRecent());
@@ -24,7 +24,7 @@ class HomeBrowseLogic extends ChangeNotifier {
   bool loadingRecent = false;
   bool _disposed = false;
 
-  /// First unfinished record with a real position.
+  /// 第一条未完成且存在真实播放位置的记录。
   WatchProgress? get primaryRecord {
     for (final record in recent) {
       if (!record.finished && record.hasPosition) return record;
@@ -32,14 +32,14 @@ class HomeBrowseLogic extends ChangeNotifier {
     return null;
   }
 
-  /// Changes the selected browse channel without triggering network work.
+  /// 切换频道，不触发额外网络请求。
   void selectChannel(HomeChannel value) {
     if (channel == value) return;
     channel = value;
     _notify();
   }
 
-  /// Reloads continuation data; signed-out reads simply return an empty list.
+  /// 重新加载续看数据；未登录时返回空列表。
   Future<void> refreshRecent() async {
     loadingRecent = true;
     _notify();
@@ -53,7 +53,7 @@ class HomeBrowseLogic extends ChangeNotifier {
     }
   }
 
-  /// Refreshes continuation data when the home tab becomes visible again.
+  /// 首页重新可见时刷新续看数据。
   void syncPage({required bool active, required bool wasActive}) {
     if (active && !wasActive) unawaited(refreshRecent());
   }

lib/pages/home/home_browse_view.dart

@@ -20,7 +20,7 @@ import 'home_browse_logic.dart';
 import 'widgets/home_browse_header.dart';
 import 'widgets/home_drama_grid.dart';
 
-/// Browse-first home page with channels, hero, continuation, and catalogue.
+/// 浏览型首页：频道、Hero、继续观看与剧目目录。
 class HomeBrowseView extends StatefulWidget {
   const HomeBrowseView({
     super.key,
@@ -214,7 +214,7 @@ class _HomeBrowseViewState extends State<HomeBrowseView> {
               color: selected ? AppColors.blue : AppColors.border,
             ),
             labelStyle: TextStyle(
-              color: selected ? AppColors.onPrimary : AppColors.muted,
+              color: selected ? AppColors.onPrimary : AppColors.onSurface,
               fontSize: AppDimens.chipFont,
               fontWeight: FontWeight.w700,
             ),

lib/pages/home/home_view.dart

@@ -8,7 +8,6 @@ import 'package:provider/provider.dart';
 import '../../core/data/models/drama.dart';
 import '../../core/data/services/catalog_controller.dart';
 import '../../core/platform/haptics.dart';
-import '../../core/theme/app_colors.dart';
 import '../../core/theme/app_theme.dart';
 import '../../core/widgets/app_bottom_nav.dart';
 import '../../core/widgets/empty_state.dart';
@@ -32,8 +31,11 @@ class HomePage extends StatelessWidget {
     if (!catalog.settled) return const SplashPage();
     final l10n = AppLocalizations.of(context)!;
     return Theme(
-      data: AppTheme.dark(),
-      child: _buildHome(context, catalog, l10n),
+      data: AppTheme.light(),
+      child: DecoratedBox(
+        decoration: const BoxDecoration(gradient: AppTheme.pageGradient),
+        child: _buildHome(context, catalog, l10n),
+      ),
     );
   }
 
@@ -44,19 +46,19 @@ class HomePage extends StatelessWidget {
   ) {
     if (catalog.loading) {
       return const Scaffold(
-        backgroundColor: AppColors.ink,
+        backgroundColor: Colors.transparent,
         body: Center(child: CircularProgressIndicator()),
       );
     }
     if (catalog.error != null) {
       return Scaffold(
-        backgroundColor: AppColors.ink,
+        backgroundColor: Colors.transparent,
         body: HomeFailureView(onRetry: catalog.load),
       );
     }
     if (catalog.dramas.isEmpty) {
       return Scaffold(
-        backgroundColor: AppColors.ink,
+        backgroundColor: Colors.transparent,
         body: EmptyState(
           key: const Key('home-empty'),
           icon: Icons.movie_outlined,
@@ -75,7 +77,7 @@ class HomePage extends StatelessWidget {
   }
 }
 
-/// Home catalog failure with a single recovery action.
+/// 首页目录加载失败与重试入口。
 class HomeFailureView extends StatelessWidget {
   const HomeFailureView({super.key, required this.onRetry});
 
@@ -93,7 +95,7 @@ class HomeFailureView extends StatelessWidget {
   }
 }
 
-/// The four primary destinations share a single route and keep their state.
+/// 四个根页面共享同一路由并保持各自状态。
 class _HomeTabs extends StatefulWidget {
   const _HomeTabs({super.key, required this.dramas});
 
@@ -136,7 +138,7 @@ class _HomeTabsState extends State<_HomeTabs> {
       },
       child: Scaffold(
         key: logic.scaffoldKey,
-        backgroundColor: AppColors.ink,
+        backgroundColor: Colors.transparent,
         body: _body(context),
         bottomNavigationBar: logic.videoImmersive ? null : _nav(context, l10n),
       ),
@@ -193,6 +195,10 @@ class _HomeTabsState extends State<_HomeTabs> {
   Widget _nav(BuildContext context, AppLocalizations l10n) {
     return AppBottomNav(
       barKey: const Key('home-tabs-bar'),
+      centerAction: AppBottomNavCenterAction(
+        label: l10n.createTab,
+        onTap: () => _selectTab(context, 2),
+      ),
       items: [
         _navItem(context, l10n, 0),
         _navItem(context, l10n, 1),

lib/pages/home/widgets/home_browse_header.dart

@@ -8,7 +8,7 @@ import '../../../l10n/app_localizations.dart';
 
 const double _searchHeight = 36;
 
-/// Fixed home header with catalogue search, weekday, and profile entry.
+/// 首页固定顶栏：搜索、星期与头像入口。
 class HomeBrowseHeader extends StatelessWidget {
   const HomeBrowseHeader({
     super.key,

lib/pages/home/widgets/home_drama_grid.dart

@@ -5,6 +5,7 @@ import 'package:flutter/material.dart';
 import '../../../core/data/models/drama.dart';
 import '../../../core/theme/app_colors.dart';
 import '../../../core/theme/app_dimens.dart';
+import '../../../core/theme/app_theme.dart';
 import '../../../core/widgets/remote_image.dart';
 import '../../../l10n/app_localizations.dart';
 
@@ -12,8 +13,10 @@ const int _columns = 2;
 const double _columnGap = 10;
 const double _cardGap = 10;
 const double _coverAspectRatio = 3 / 4;
+const double _addSize = 28;
+const double _addIconSize = 18;
 
-/// Two-column drama grid used by the browse-first home page.
+/// 首页浏览态使用的双列剧目网格。
 class HomeDramaGrid extends StatelessWidget {
   const HomeDramaGrid({
     super.key,
@@ -57,7 +60,7 @@ class HomeDramaGrid extends StatelessWidget {
   }
 }
 
-/// Home catalogue card with title, genre, free badge, episode count, and heat.
+/// 首页剧卡：封面、角标、标题、题材、集数与热度。
 class HomeDramaCard extends StatelessWidget {
   const HomeDramaCard({
     super.key,
@@ -72,21 +75,35 @@ class HomeDramaCard extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return InkWell(
-      key: Key('home-drama-card-${drama.id}'),
-      onTap: onTap,
-      borderRadius: BorderRadius.circular(AppDimens.coverRadius),
-      child: Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          _cover(),
-          const SizedBox(height: AppDimens.spaceXs),
-          _title(),
-          const SizedBox(height: 2),
-          _genre(),
-          const SizedBox(height: AppDimens.spaceXs),
-          _metadata(),
-        ],
+    return Container(
+      decoration: BoxDecoration(
+        color: AppColors.card,
+        borderRadius: BorderRadius.circular(AppDimens.cardRadius),
+        boxShadow: const [AppTheme.cardShadow],
+      ),
+      child: Material(
+        color: Colors.transparent,
+        borderRadius: BorderRadius.circular(AppDimens.cardRadius),
+        clipBehavior: Clip.antiAlias,
+        child: InkWell(
+          key: Key('home-drama-card-${drama.id}'),
+          onTap: onTap,
+          child: Padding(
+            padding: const EdgeInsets.all(AppDimens.spaceSm),
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                _cover(),
+                const SizedBox(height: AppDimens.spaceSm),
+                _title(),
+                const SizedBox(height: AppDimens.spaceXs),
+                _genre(),
+                const SizedBox(height: AppDimens.spaceXs),
+                _metadata(),
+              ],
+            ),
+          ),
+        ),
       ),
     );
   }
@@ -104,7 +121,10 @@ class HomeDramaCard extends StatelessWidget {
             showFallbackIcon: true,
             fallbackAspectRatio: _coverAspectRatio,
           ),
-          if (_isFree) Positioned(top: 6, left: 6, child: _freeBadge()),
+          Positioned(top: 8, left: 8, child: _tagBadge()),
+          if (_lockedCount > 0)
+            Positioned(top: 8, right: 8, child: _lockedBadge()),
+          Positioned(right: 8, bottom: 8, child: _episodeBadge()),
         ],
       ),
     );
@@ -115,17 +135,29 @@ class HomeDramaCard extends StatelessWidget {
         drama.episodes.any((episode) => episode.isFree);
   }
 
-  Widget _freeBadge() {
+  int get _lockedCount {
+    final explicit = drama.episodes.where((episode) => episode.locked).length;
+    if (explicit > 0) return explicit;
+    final inferred = drama.episodeCount - drama.freeEpisodes;
+    return inferred > 0 ? inferred : 0;
+  }
+
+  Widget _tagBadge() {
+    final label = _isFree ? l10n.free : l10n.originalTag;
     return Container(
-      padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
+      key: Key('home-drama-tag-${drama.id}'),
+      padding: const EdgeInsets.symmetric(
+        horizontal: AppDimens.spaceSm,
+        vertical: 3,
+      ),
       decoration: BoxDecoration(
-        color: AppColors.blue,
-        borderRadius: BorderRadius.circular(6),
+        color: AppColors.badgePink,
+        borderRadius: BorderRadius.circular(AppDimens.pillRadius),
       ),
       child: Text(
-        l10n.free,
+        label,
         style: const TextStyle(
-          color: AppColors.onPrimary,
+          color: AppColors.badgePinkText,
           fontSize: AppDimens.cardMeta,
           fontWeight: FontWeight.w800,
         ),
@@ -133,6 +165,51 @@ class HomeDramaCard extends StatelessWidget {
     );
   }
 
+  Widget _lockedBadge() {
+    return Container(
+      key: Key('home-drama-locked-${drama.id}'),
+      padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 3),
+      decoration: BoxDecoration(
+        color: AppColors.overlayDark,
+        borderRadius: BorderRadius.circular(AppDimens.pillRadius),
+      ),
+      child: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          const Icon(Icons.lock_rounded, color: AppColors.onPrimary, size: 11),
+          const SizedBox(width: 2),
+          Text(
+            l10n.lockedEpisodeCount(_lockedCount),
+            style: const TextStyle(
+              color: AppColors.onPrimary,
+              fontSize: 9,
+              fontWeight: FontWeight.w700,
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _episodeBadge() {
+    return Container(
+      key: Key('home-drama-episodes-badge-${drama.id}'),
+      padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
+      decoration: BoxDecoration(
+        color: AppColors.badgeBeige,
+        borderRadius: BorderRadius.circular(AppDimens.pillRadius),
+      ),
+      child: Text(
+        l10n.allEpisodesBadge(drama.episodeCount),
+        style: const TextStyle(
+          color: AppColors.onSurface,
+          fontSize: 9,
+          fontWeight: FontWeight.w700,
+        ),
+      ),
+    );
+  }
+
   Widget _title() {
     return Text(
       drama.title,
@@ -141,7 +218,7 @@ class HomeDramaCard extends StatelessWidget {
       overflow: TextOverflow.ellipsis,
       style: const TextStyle(
         color: AppColors.onSurface,
-        fontSize: AppDimens.previewSectionTitle,
+        fontSize: AppDimens.cardTitle,
         fontWeight: FontWeight.w800,
       ),
     );
@@ -162,24 +239,44 @@ class HomeDramaCard extends StatelessWidget {
   }
 
   Widget _metadata() {
-    return Wrap(
-      spacing: AppDimens.spaceSm,
-      runSpacing: AppDimens.spaceXs,
+    return Row(
       children: [
-        Text(
-          l10n.episodeCount(drama.episodeCount),
-          key: Key('home-drama-episode-count-${drama.id}'),
-          style: const TextStyle(
-            color: AppColors.subtle,
-            fontSize: AppDimens.cardViews,
+        Expanded(
+          child: Wrap(
+            spacing: AppDimens.spaceSm,
+            runSpacing: AppDimens.spaceXs,
+            children: [
+              Text(
+                l10n.episodeCount(drama.episodeCount),
+                key: Key('home-drama-episode-count-${drama.id}'),
+                style: const TextStyle(
+                  color: AppColors.subtle,
+                  fontSize: AppDimens.cardViews,
+                ),
+              ),
+              Text(
+                l10n.viewCountLabel(drama.viewCount),
+                key: Key('home-drama-views-${drama.id}'),
+                style: const TextStyle(
+                  color: AppColors.subtle,
+                  fontSize: AppDimens.cardViews,
+                ),
+              ),
+            ],
           ),
         ),
-        Text(
-          l10n.viewCountLabel(drama.viewCount),
-          key: Key('home-drama-views-${drama.id}'),
-          style: const TextStyle(
-            color: AppColors.subtle,
-            fontSize: AppDimens.cardViews,
+        Container(
+          key: Key('home-drama-add-${drama.id}'),
+          width: _addSize,
+          height: _addSize,
+          decoration: const BoxDecoration(
+            color: AppColors.blue,
+            shape: BoxShape.circle,
+          ),
+          child: const Icon(
+            Icons.add_rounded,
+            color: AppColors.onPrimary,
+            size: _addIconSize,
           ),
         ),
       ],

lib/pages/mine/mine_view.dart

@@ -92,7 +92,7 @@ class _MyPageState extends State<MyPage> {
       ),
     );
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: embedded
           ? content
           : Scaffold(backgroundColor: AppColors.ink, body: content),
@@ -242,6 +242,10 @@ class _MyPageState extends State<MyPage> {
 
   Widget _bottomNav(AppLocalizations l10n) {
     return AppBottomNav(
+      centerAction: AppBottomNavCenterAction(
+        label: l10n.createTab,
+        onTap: () => _act(MyPageAction.create),
+      ),
       items: [
         AppBottomNavItem(
           tabKey: const Key('mine-nav-home'),

lib/pages/mine/widgets/continue_watching_card.dart

@@ -101,7 +101,7 @@ class ContinueWatchingCard extends StatelessWidget {
           key: progressKey,
           maxLines: 1,
           overflow: TextOverflow.ellipsis,
-          style: const TextStyle(color: Color(0xFFBBBBBB), fontSize: 9),
+          style: const TextStyle(color: AppColors.muted, fontSize: 9),
         ),
       ],
     );

lib/pages/mine/widgets/mine_header.dart

@@ -46,12 +46,12 @@ class MineHeader extends StatelessWidget {
         gradient: LinearGradient(
           begin: Alignment.topLeft,
           end: Alignment.bottomRight,
-          colors: [Color(0xFF6A5CFF), AppColors.blue],
+          colors: [AppColors.secondary, AppColors.blue],
         ),
       ),
       child: const Icon(
         Icons.person_rounded,
-        color: AppColors.onSurface,
+        color: AppColors.onPrimary,
         size: 22,
       ),
     );
@@ -76,7 +76,7 @@ class MineHeader extends StatelessWidget {
           subtitle,
           maxLines: 1,
           overflow: TextOverflow.ellipsis,
-          style: const TextStyle(color: Color(0xFFBBBBBB), fontSize: 10),
+          style: const TextStyle(color: AppColors.muted, fontSize: 10),
         ),
       ],
     );

lib/pages/notices/notices_page.dart

@@ -44,7 +44,7 @@ class _NoticesPageState extends State<NoticesPage> {
   Widget build(BuildContext context) {
     final l10n = AppLocalizations.of(context)!;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         key: const Key('notices-page'),
         backgroundColor: AppColors.ink,

lib/pages/player/player_logic.dart

@@ -669,7 +669,7 @@ class PlayerLogic extends ChangeNotifier {
                     maxLines: 1,
                     overflow: TextOverflow.ellipsis,
                     style: const TextStyle(
-                      color: Color(0xFFB7B3B8),
+                      color: AppColors.muted,
                       fontSize: 14,
                       fontWeight: FontWeight.w400,
                     ),

lib/pages/player/player_view.dart

@@ -146,9 +146,9 @@ class _PlayerPageState extends State<PlayerPage> with WidgetsBindingObserver {
       ),
     );
     return AnnotatedRegion<SystemUiOverlayStyle>(
-      value: SystemUiOverlayStyle.light,
+      value: SystemUiOverlayStyle.dark,
       child: Theme(
-        data: AppTheme.dark(),
+        data: AppTheme.light(),
         child: widget.embedded
             ? content
             : Scaffold(backgroundColor: AppColors.ink, body: content),
@@ -1155,7 +1155,7 @@ class _TopAction extends StatelessWidget {
         onPressed: onPressed,
         padding: EdgeInsets.zero,
         style: IconButton.styleFrom(
-          backgroundColor: const Color(0xFF2C2D33),
+          backgroundColor: AppColors.card.withValues(alpha: 0.94),
           foregroundColor: AppColors.onSurface,
         ),
         icon: Icon(icon, size: 18),
@@ -1179,7 +1179,7 @@ class _PlayerAction extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Material(
-      color: const Color(0xFF2A2A30),
+      color: AppColors.card.withValues(alpha: 0.94),
       borderRadius: BorderRadius.circular(9),
       clipBehavior: Clip.antiAlias,
       child: InkWell(

lib/pages/player/widgets/home_feed_overlay.dart

@@ -160,12 +160,7 @@ class HomeFeedOverlay extends StatelessWidget {
       radius: 14,
       blur: 6,
       padding: const EdgeInsets.all(12),
-      gradient: const LinearGradient(
-        begin: Alignment.topLeft,
-        end: Alignment.bottomRight,
-        colors: [Color(0xBF0F0F14), Color(0xA60F0F14)],
-      ),
-      borderColor: Colors.white.withValues(alpha: 0.06),
+      borderColor: AppColors.border,
       child: Column(
         mainAxisSize: MainAxisSize.min,
         crossAxisAlignment: CrossAxisAlignment.start,
@@ -184,13 +179,13 @@ class HomeFeedOverlay extends StatelessWidget {
               if (drama.category.isNotEmpty && drama.category != genre)
                 _tag(
                   drama.category,
-                  background: const Color(0xFF333333),
-                  foreground: const Color(0xFFDDDDDD),
+                  background: AppColors.raised,
+                  foreground: AppColors.onSurface,
                 ),
               Text(
                 l10n.episodeOfTotal(episode.number, drama.episodeCount),
                 key: const Key('home-feed-episode'),
-                style: const TextStyle(color: Color(0xFFBBBBBB), fontSize: 9),
+                style: const TextStyle(color: AppColors.muted, fontSize: 9),
               ),
             ],
           ),
@@ -248,7 +243,7 @@ class HomeFeedOverlay extends StatelessWidget {
                     key: const Key('home-feed-episodes'),
                     onPressed: onEpisodes,
                     style: FilledButton.styleFrom(
-                      backgroundColor: const Color(0xFF2A2A30),
+                      backgroundColor: AppColors.raised,
                       foregroundColor: AppColors.onSurface,
                       shape: RoundedRectangleBorder(
                         borderRadius: BorderRadius.circular(
@@ -362,7 +357,7 @@ class _RoundIcon extends StatelessWidget {
         onPressed: onPressed,
         padding: EdgeInsets.zero,
         style: IconButton.styleFrom(
-          backgroundColor: const Color(0xCC2C2D33),
+          backgroundColor: AppColors.card.withValues(alpha: 0.94),
           foregroundColor: AppColors.onSurface,
         ),
         icon: Icon(icon, size: 18),

lib/pages/player/widgets/player_center_toggle.dart

@@ -4,7 +4,7 @@ import 'package:flutter/material.dart';
 
 import '../../../core/theme/app_colors.dart';
 
-/// Shared play/pause control used by the home feed and full-screen player.
+/// 首页沉浸流与全屏播放器共用的播放/暂停按钮。
 class PlayerCenterToggle extends StatelessWidget {
   const PlayerCenterToggle({
     super.key,
@@ -26,7 +26,7 @@ class PlayerCenterToggle extends StatelessWidget {
           width: 52,
           height: 52,
           decoration: const BoxDecoration(
-            color: Color(0x80000000),
+            color: AppColors.blue,
             shape: BoxShape.circle,
           ),
           child: Icon(

lib/pages/player/widgets/player_featured_comment.dart

@@ -117,7 +117,7 @@ class _PlayerFeaturedCommentState extends State<PlayerFeaturedComment> {
                         Text(
                           '· $time',
                           style: const TextStyle(
-                            color: Color(0xFF777777),
+                            color: AppColors.muted,
                             fontSize: 9,
                           ),
                         ),
@@ -133,7 +133,7 @@ class _PlayerFeaturedCommentState extends State<PlayerFeaturedComment> {
               maxLines: 2,
               overflow: TextOverflow.ellipsis,
               style: const TextStyle(
-                color: Color(0xFFDDDDDD),
+                color: AppColors.onSurface,
                 fontSize: 10,
                 height: 1.5,
               ),

lib/pages/player/widgets/seek_progress_bar.dart

@@ -127,10 +127,8 @@ class _SeekProgressBarState extends State<SeekProgressBar> {
                   ? (scrubbing ? 3 : 1.5)
                   : (scrubbing ? 4 : 3),
               activeTrackColor: AppColors.blue,
-              inactiveTrackColor: widget.compact
-                  ? Colors.white.withValues(alpha: 0.18)
-                  : const Color(0xFF474248),
-              thumbColor: widget.compact ? AppColors.blue : Colors.white,
+              inactiveTrackColor: AppColors.border,
+              thumbColor: AppColors.onPrimary,
               thumbShape: RoundSliderThumbShape(
                 enabledThumbRadius: widget.compact
                     ? (scrubbing ? 6 : 4)

lib/pages/settings/settings_page.dart

@@ -22,7 +22,7 @@ class SettingsPage extends StatelessWidget {
     final l10n = AppLocalizations.of(context)!;
     final auth = context.watch<AuthController>();
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         key: const Key('settings-page'),
         backgroundColor: AppColors.ink,

lib/pages/store/store_page.dart

@@ -56,7 +56,7 @@ class _StorePageState extends State<StorePage> {
     final l10n = AppLocalizations.of(context)!;
     final isVip = widget.type == StoreController.vipType;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         key: const Key('store-page'),
         backgroundColor: AppColors.ink,

lib/pages/wallet/wallet_page.dart

@@ -44,7 +44,7 @@ class _WalletPageState extends State<WalletPage> {
     final l10n = AppLocalizations.of(context)!;
     final wallet = context.watch<WalletController>();
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         key: const Key('wallet-page'),
         backgroundColor: AppColors.ink,
@@ -188,7 +188,7 @@ class _BalanceHero extends StatelessWidget {
         gradient: const LinearGradient(
           begin: Alignment.topLeft,
           end: Alignment.bottomRight,
-          colors: [Color(0xFF2B2116), Color(0xFF17171D)],
+          colors: [AppColors.goldCard, AppColors.card],
         ),
         border: Border.all(color: AppColors.gold.withValues(alpha: 0.35)),
         boxShadow: [

lib/pages/watch_records/watch_records_page.dart

@@ -33,7 +33,7 @@ class WatchRecordsPage extends StatelessWidget {
     final signedIn = context.watch<AuthController>().isSignedIn;
     final l10n = AppLocalizations.of(context)!;
     return Theme(
-      data: AppTheme.dark(),
+      data: AppTheme.light(),
       child: Scaffold(
         key: const Key('watch-records-page'),
         backgroundColor: AppColors.ink,

test/drama_detail/drama_detail_view_test.dart

@@ -207,7 +207,7 @@ Widget _host(Drama drama) {
       ChangeNotifierProvider(create: (_) => CatalogController(catalog)..load()),
     ],
     child: MaterialApp(
-      theme: AppTheme.dark(),
+      theme: AppTheme.light(),
       locale: const Locale('en'),
       supportedLocales: AppLocalizations.supportedLocales,
       localizationsDelegates: AppLocalizations.localizationsDelegates,

test/empty_state/empty_state_test.dart

@@ -12,7 +12,7 @@ void main() {
     var taps = 0;
     await _pump(
       tester,
-      theme: AppTheme.dark(),
+      theme: AppTheme.light(),
       child: EmptyState(
         icon: Icons.movie_outlined,
         title: 'No stories',
@@ -33,7 +33,7 @@ void main() {
     );
     expect(
       tester.widget<Icon>(find.byKey(const Key('empty-state-icon'))).color,
-      AppColors.gold,
+      AppColors.blue,
     );
     expect(
       tester
@@ -103,15 +103,15 @@ void main() {
     expect(find.byKey(const Key('empty-state-action')), findsNothing);
   });
 
-  testWidgets('should_tint_the_bare_icon_for_light_and_dark', (tester) async {
+  testWidgets('should_tint_the_bare_icon_with_the_light_theme', (tester) async {
     await _pump(
       tester,
-      theme: AppTheme.dark(),
+      theme: AppTheme.light(),
       child: const EmptyState(icon: Icons.history_rounded, title: 'No history'),
     );
     expect(
       tester.widget<Icon>(find.byKey(const Key('empty-state-icon'))).color,
-      AppColors.gold,
+      AppColors.blue,
     );
 
     await _pump(
@@ -156,7 +156,7 @@ Future<void> _pump(
 }) async {
   await tester.pumpWidget(
     MaterialApp(
-      theme: theme ?? AppTheme.dark(),
+      theme: theme ?? AppTheme.light(),
       home: Scaffold(body: child),
     ),
   );

test/home/app_bottom_nav_test.dart

@@ -2,13 +2,13 @@
 
 import 'package:flutter/material.dart';
 import 'package:flutter_test/flutter_test.dart';
+import 'package:fruitshorts/core/theme/app_colors.dart';
 import 'package:fruitshorts/core/theme/app_dimens.dart';
 import 'package:fruitshorts/core/widgets/app_bottom_nav.dart';
 
 void main() {
-  testWidgets('should_render_64_high_navigation_and_keep_item_keys', (
-    tester,
-  ) async {
+  testWidgets('should_render_five_slots_with_center_action', (tester) async {
+    var centerTaps = 0;
     await tester.pumpWidget(
       MaterialApp(
         home: Scaffold(
@@ -23,24 +23,74 @@ void main() {
                 onTap: () {},
               ),
               AppBottomNavItem(
-                tabKey: const Key('tab-my'),
+                tabKey: const Key('tab-theater'),
+                icon: Icons.explore_outlined,
+                selectedIcon: Icons.explore_rounded,
+                label: 'Theater',
+                onTap: () {},
+              ),
+              AppBottomNavItem(
+                tabKey: const Key('tab-create'),
+                icon: Icons.add_box_outlined,
+                selectedIcon: Icons.add_box_rounded,
+                label: 'Create',
+                onTap: () {},
+              ),
+              AppBottomNavItem(
+                tabKey: const Key('tab-mine'),
                 icon: Icons.person_outline_rounded,
                 selectedIcon: Icons.person_rounded,
                 label: 'Me',
                 onTap: () {},
               ),
             ],
+            centerAction: AppBottomNavCenterAction(
+              label: 'Create',
+              onTap: () => centerTaps++,
+            ),
           ),
         ),
       ),
     );
 
     expect(find.byKey(const Key('tab-home')), findsOneWidget);
-    expect(find.byKey(const Key('tab-my')), findsOneWidget);
+    expect(find.byKey(const Key('tab-theater')), findsOneWidget);
+    expect(find.byKey(const Key('nav-center-action')), findsOneWidget);
+    expect(find.byKey(const Key('tab-create')), findsOneWidget);
+    expect(find.byKey(const Key('tab-mine')), findsOneWidget);
     expect(find.text('Home'), findsOneWidget);
+    final centers = [
+      Key('tab-home'),
+      Key('tab-theater'),
+      Key('nav-center-action'),
+      Key('tab-create'),
+      Key('tab-mine'),
+    ].map((key) => tester.getCenter(find.byKey(key)).dx).toList();
+    expect(centers, orderedEquals(centers.toList()..sort()));
     expect(
       tester.getSize(find.byType(AppBottomNav)).height,
       AppDimens.navHeight,
     );
+    expect(
+      tester.getSize(find.byKey(const Key('nav-center-action'))),
+      const Size.square(AppDimens.navCenter),
+    );
+    final ink = tester.widget<Ink>(
+      find
+          .ancestor(
+            of: find.byKey(const Key('nav-center-action')),
+            matching: find.byType(Ink),
+          )
+          .first,
+    );
+    final decoration = ink.decoration! as BoxDecoration;
+    expect(decoration.shape, BoxShape.circle);
+    expect((decoration.gradient! as LinearGradient).colors, const [
+      AppColors.navCenterStart,
+      AppColors.navCenterEnd,
+    ]);
+
+    await tester.tap(find.byKey(const Key('nav-center-action')));
+    expect(centerTaps, 1);
   });
 }

test/home/home_card_style_test.dart

@@ -0,0 +1,69 @@
+// Author: fruit.com.cn
+
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:fruitshorts/core/data/models/drama.dart';
+import 'package:fruitshorts/core/theme/app_colors.dart';
+import 'package:fruitshorts/core/theme/app_dimens.dart';
+import 'package:fruitshorts/core/theme/app_theme.dart';
+import 'package:fruitshorts/l10n/app_localizations.dart';
+import 'package:fruitshorts/pages/home/widgets/home_drama_grid.dart';
+
+void main() {
+  testWidgets('should_render_warm_orange_cover_badges_and_plus_action', (
+    tester,
+  ) async {
+    await tester.pumpWidget(
+      MaterialApp(
+        theme: AppTheme.light(),
+        locale: const Locale('en'),
+        supportedLocales: AppLocalizations.supportedLocales,
+        localizationsDelegates: AppLocalizations.localizationsDelegates,
+        home: Scaffold(
+          body: Builder(
+            builder: (context) => SizedBox(
+              width: 180,
+              child: HomeDramaCard(
+                l10n: AppLocalizations.of(context)!,
+                drama: _drama,
+                onTap: () {},
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+    await tester.pumpAndSettle();
+
+    final card = find.byKey(const Key('home-drama-card-style-drama'));
+    final cardContainer = tester.widget<Container>(
+      find.ancestor(of: card, matching: find.byType(Container)).last,
+    );
+    final cardDecoration = cardContainer.decoration! as BoxDecoration;
+    expect(cardDecoration.color, AppColors.card);
+    expect(
+      cardDecoration.borderRadius,
+      BorderRadius.circular(AppDimens.cardRadius),
+    );
+    expect(cardDecoration.boxShadow, const [AppTheme.cardShadow]);
+
+    final tag = tester.widget<Container>(
+      find.byKey(const Key('home-drama-tag-style-drama')),
+    );
+    expect((tag.decoration! as BoxDecoration).color, AppColors.badgePink);
+    expect(find.text('Free'), findsOneWidget);
+    expect(find.text('18 locked'), findsOneWidget);
+    expect(find.text('All 24'), findsOneWidget);
+    expect(find.byKey(const Key('home-drama-add-style-drama')), findsOneWidget);
+  });
+}
+
+const _drama = Drama(
+  id: 'style-drama',
+  title: 'Warm Orange Story',
+  synopsis: '暖橙短剧',
+  posterUrl: '/files/style.jpg',
+  genre: 'Romance',
+  totalEpisodes: 24,
+  freeEpisodes: 6,
+);

test/home/home_nav_ui_test.dart

@@ -20,6 +20,7 @@ const _keys = [
   Key('home-tabs-bar'),
   Key('tab-home'),
   Key('tab-theater'),
+  Key('nav-center-action'),
   Key('tab-create'),
   Key('tab-mine'),
 ];
@@ -53,7 +54,7 @@ void main() {
     final decoration = bar.decoration as BoxDecoration;
     final border = decoration.border as Border;
     expect(decoration.color, AppColors.bar.withValues(alpha: 0.95));
-    expect(border.top.color, AppColors.outlineVariantDark);
+    expect(border.top.color, AppColors.border);
     expect(border.top.color, isNot(Colors.white));
     expect(
       tester
@@ -73,6 +74,17 @@ void main() {
       ),
       findsOneWidget,
     );
+    expect(
+      tester
+          .widget<Icon>(
+            find.descendant(
+              of: find.byKey(const Key('tab-home')),
+              matching: find.byIcon(Icons.home_rounded),
+            ),
+          )
+          .color,
+      AppColors.blue,
+    );
 
     await tester.tap(find.byKey(const Key('tab-theater')));
     await tester.pumpAndSettle();
@@ -87,6 +99,30 @@ void main() {
       ),
       findsOneWidget,
     );
+    expect(
+      tester
+          .widget<Text>(
+            find.descendant(
+              of: find.byKey(const Key('tab-theater')),
+              matching: find.text('Theater'),
+            ),
+          )
+          .style
+          ?.color,
+      AppColors.blue,
+    );
+    expect(
+      tester
+          .widget<Text>(
+            find.descendant(
+              of: find.byKey(const Key('tab-home')),
+              matching: find.text('Home'),
+            ),
+          )
+          .style
+          ?.color,
+      AppColors.navUnselected,
+    );
     expect(
       find.descendant(
         of: find.byKey(const Key('tab-home')),
@@ -103,6 +139,7 @@ void main() {
 
     expect(find.byKey(const Key('tab-home')), findsOneWidget);
     expect(find.byKey(const Key('tab-theater')), findsOneWidget);
+    expect(find.byKey(const Key('nav-center-action')), findsOneWidget);
     expect(find.byKey(const Key('tab-create')), findsOneWidget);
     expect(find.byKey(const Key('tab-mine')), findsOneWidget);
     expect(find.byKey(const Key('home-browse-page')), findsOneWidget);
@@ -111,6 +148,12 @@ void main() {
     await tester.pumpAndSettle();
     expect(find.byKey(const Key('home-all-dramas-grid')), findsOneWidget);
 
+    await tester.tap(find.byKey(const Key('nav-center-action')));
+    await tester.pumpAndSettle();
+    expect(find.byKey(const Key('create-page')), findsOneWidget);
+
+    await tester.tap(find.byKey(const Key('tab-home')));
+    await tester.pumpAndSettle();
     await tester.tap(find.byKey(const Key('tab-create')));
     await tester.pumpAndSettle();
     expect(find.byKey(const Key('create-page')), findsOneWidget);

test/home/home_preview_layout_test.dart

@@ -82,7 +82,7 @@ void main() {
     Future<void> pumpEpisode(Episode episode) async {
       await tester.pumpWidget(
         MaterialApp(
-          theme: AppTheme.dark(),
+          theme: AppTheme.light(),
           locale: const Locale('en'),
           supportedLocales: AppLocalizations.supportedLocales,
           localizationsDelegates: AppLocalizations.localizationsDelegates,
@@ -141,7 +141,7 @@ void main() {
   ) async {
     await tester.pumpWidget(
       MaterialApp(
-        theme: AppTheme.dark(),
+        theme: AppTheme.light(),
         locale: const Locale('en'),
         supportedLocales: AppLocalizations.supportedLocales,
         localizationsDelegates: AppLocalizations.localizationsDelegates,

test/home/k28_a_navigation_test.dart

@@ -8,6 +8,7 @@ import 'package:fruitshorts/core/data/models/watch_progress.dart';
 import 'package:fruitshorts/core/data/repositories/favorite_repository.dart';
 import 'package:fruitshorts/core/data/repositories/playback_repository.dart';
 import 'package:fruitshorts/core/data/repositories/watch_history_repository.dart';
+import 'package:fruitshorts/core/theme/app_colors.dart';
 import 'package:fruitshorts/pages/player/player_view.dart';
 import 'package:shared_preferences_platform_interface/in_memory_shared_preferences_async.dart';
 import 'package:shared_preferences_platform_interface/shared_preferences_async_platform_interface.dart';
@@ -32,8 +33,9 @@ void main() {
     for (final key in _tabKeys) {
       expect(find.byKey(key), findsOneWidget);
     }
+    expect(find.byKey(const Key('nav-center-action')), findsOneWidget);
 
-    await tester.tap(find.byKey(const Key('tab-create')));
+    await tester.tap(find.byKey(const Key('nav-center-action')));
     await tester.pumpAndSettle();
 
     expect(find.byKey(const Key('create-page')), findsOneWidget);
@@ -46,12 +48,22 @@ void main() {
 
     expect(_chip(tester, 'home-channel-hot').selected, isTrue);
     expect(_chip(tester, 'home-channel-free').selected, isFalse);
+    expect(_chip(tester, 'home-channel-hot').selectedColor, AppColors.blue);
+    expect(_chip(tester, 'home-channel-free').backgroundColor, AppColors.card);
+    expect(
+      _chip(tester, 'home-channel-free').labelStyle?.color,
+      AppColors.onSurface,
+    );
 
     await tester.tap(find.byKey(const Key('home-channel-free')));
     await tester.pumpAndSettle();
 
     expect(_chip(tester, 'home-channel-hot').selected, isFalse);
     expect(_chip(tester, 'home-channel-free').selected, isTrue);
+    expect(
+      _chip(tester, 'home-channel-free').labelStyle?.color,
+      AppColors.onPrimary,
+    );
   });
 
   testWidgets('should_open_theater_search_when_home_search_is_tapped', (

test/player/player_center_toggle_test.dart

@@ -2,6 +2,7 @@
 
 import 'package:flutter/material.dart';
 import 'package:flutter_test/flutter_test.dart';
+import 'package:fruitshorts/core/theme/app_colors.dart';
 import 'package:fruitshorts/pages/player/widgets/player_center_toggle.dart';
 
 void main() {
@@ -36,7 +37,7 @@ void main() {
         find.descendant(of: find.byKey(key), matching: find.byType(Container)),
       );
       final decoration = container.decoration! as BoxDecoration;
-      expect(decoration.color, const Color(0x80000000));
+      expect(decoration.color, AppColors.blue);
       expect(decoration.shape, BoxShape.circle);
       final icon = tester.widget<Icon>(
         find.descendant(of: find.byKey(key), matching: find.byType(Icon)),

test/theme/app_dimens_test.dart

@@ -6,18 +6,22 @@ import 'package:fruitshorts/core/theme/app_dimens.dart';
 void main() {
   test('should_expose_the_k20_spacing_and_type_scale', () {
     expect(AppDimens.pageHorizontal, 16);
-    expect(AppDimens.cardRadius, 12);
-    expect(AppDimens.innerRadius, 10);
+    expect(AppDimens.cardRadius, 16);
+    expect(AppDimens.coverRadius, 16);
+    expect(AppDimens.authCardRadius, 20);
+    expect(AppDimens.pillRadius, 999);
+    expect(AppDimens.buttonRadius, 999);
     expect(AppDimens.caption, 12);
     expect(AppDimens.body, 14);
     expect(AppDimens.listTitle, 15);
     expect(AppDimens.sectionTitle, 16);
     expect(AppDimens.pageTitle, 20);
-    expect(AppDimens.navLabel, 9);
+    expect(AppDimens.navLabel, 10);
     expect(AppDimens.buttonHeight, 48);
     expect(AppDimens.primaryButtonHeight, 52);
     expect(AppDimens.tapTarget, 44);
-    expect(AppDimens.navHeight, 54);
+    expect(AppDimens.navHeight, 64);
+    expect(AppDimens.navCenter, 56);
     expect(AppDimens.progressHeight, 3);
   });
 }

test/theme/app_theme_test.dart

@@ -2,7 +2,7 @@
 
 import 'dart:math';
 
-import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:fruitshorts/core/theme/app_colors.dart';
 import 'package:fruitshorts/core/theme/app_theme.dart';
@@ -14,71 +14,46 @@ double _contrast(Color foreground, Color background) {
 }
 
 void main() {
-  test('should_expose_obsidian_flare_brand_tokens', () {
-    expect(AppColors.blue, const Color(0xFFFF5B3D));
-    expect(AppColors.bluePressed, const Color(0xFFFF4321));
-    expect(AppColors.blueSoft, const Color(0xFF9278EA));
-    expect(AppColors.secondary, const Color(0xFF9278EA));
-    expect(AppColors.gold, const Color(0xFFFBBF24));
-    expect(AppColors.ink, const Color(0xFF0B0C10));
-    expect(AppColors.card, const Color(0xFF1B1C21));
-    expect(AppColors.cardAlt, const Color(0xFF1C1D21));
-    expect(AppColors.raised, const Color(0xFF1C1D21));
-    expect(AppColors.bar, const Color(0xFF0D0D11));
-    expect(AppColors.success, const Color(0xFF34D399));
-    expect(AppColors.onPrimary, const Color(0xFFFFFFFF));
+  test('should_expose_light_warm_orange_tokens', () {
+    expect(AppColors.blue, const Color(0xFFFF7A1A));
+    expect(AppColors.bluePressed, const Color(0xFFFF6A00));
+    expect(AppColors.secondary, const Color(0xFFFF6A8A));
+    expect(AppColors.ink, const Color(0xFFFFF8F0));
+    expect(AppColors.surfaceTop, const Color(0xFFFFE9D6));
+    expect(AppColors.card, const Color(0xFFFFFFFF));
+    expect(AppColors.onSurface, const Color(0xFF1F1B16));
+    expect(AppColors.muted, const Color(0xFF8C837B));
+    expect(AppColors.subtle, const Color(0xFFB3AAA1));
+    expect(AppColors.border, const Color(0xFFF0E4D6));
+    expect(AppColors.badgePink, const Color(0xFFFFE3EC));
+    expect(AppColors.badgePinkText, const Color(0xFFFF6A8A));
+  });
+
+  test('should_keep_primary_text_readable_on_warm_background', () {
     expect(
-      _contrast(AppColors.onGold, AppColors.gold),
+      _contrast(AppColors.onSurface, AppColors.ink),
       greaterThanOrEqualTo(4.5),
     );
+    expect(_contrast(AppColors.muted, AppColors.card), greaterThanOrEqualTo(3));
   });
 
-  test('should_meet_text_and_icon_contrast_when_using_theme_tokens', () {
-    expect(
-      _contrast(AppColors.onPrimary, AppColors.blue),
-      greaterThanOrEqualTo(3),
-    );
-    expect(_contrast(AppColors.blue, Colors.white), greaterThanOrEqualTo(3));
-    expect(
-      _contrast(AppColors.blueSoft, AppColors.ink),
-      greaterThanOrEqualTo(3),
-    );
+  test('should_use_light_color_scheme_and_dark_system_icons', () {
+    final theme = AppTheme.light();
+
+    expect(theme.brightness, Brightness.light);
+    expect(theme.colorScheme.primary, AppColors.blue);
+    expect(theme.colorScheme.onPrimary, AppColors.onPrimary);
+    expect(theme.colorScheme.surface, AppColors.ink);
+    expect(theme.colorScheme.onSurface, AppColors.onSurface);
+    expect(theme.colorScheme.outline, AppColors.border);
+    expect(theme.scaffoldBackgroundColor, AppColors.ink);
+    expect(theme.appBarTheme.systemOverlayStyle, SystemUiOverlayStyle.dark);
   });
 
-  test('should_use_flare_brand_in_light_and_dark_color_schemes', () {
-    for (final theme in [AppTheme.light(), AppTheme.dark()]) {
-      expect(theme.colorScheme.primary, AppColors.blue);
-      expect(theme.colorScheme.onPrimary, AppColors.onPrimary);
-    }
-  });
-
-  test('should_define_non_white_outline_tokens_in_both_themes', () {
-    final light = AppTheme.light().colorScheme;
-    final dark = AppTheme.dark().colorScheme;
-
-    expect(light.outline, AppColors.outlineLight);
-    expect(light.outlineVariant, AppColors.outlineVariantLight);
-    expect(dark.outline, AppColors.outlineDark);
-    expect(dark.outlineVariant, AppColors.outlineVariantDark);
-    expect(dark.outlineVariant.computeLuminance(), lessThan(0.2));
-    expect(light.outlineVariant.computeLuminance(), lessThan(0.92));
-  });
-
-  testWidgets('should_expose_chili_brand_through_widget_theme', (tester) async {
-    late ThemeData applied;
-    await tester.pumpWidget(
-      MaterialApp(
-        theme: AppTheme.dark(),
-        home: Builder(
-          builder: (context) {
-            applied = Theme.of(context);
-            return const SizedBox.shrink();
-          },
-        ),
-      ),
-    );
-
-    expect(applied.colorScheme.primary, AppColors.blue);
-    expect(applied.colorScheme.onPrimary, AppColors.onPrimary);
+  test('should_expose_page_gradient_and_soft_card_shadow', () {
+    expect(AppTheme.pageGradient.colors, [AppColors.surfaceTop, AppColors.ink]);
+    expect(AppTheme.cardShadow.color, AppColors.cardShadow);
+    expect(AppTheme.cardShadow.blurRadius, 18);
+    expect(AppTheme.cardShadow.offset, const Offset(0, 6));
   });
 }