feat(ui): 更新品牌启动页与选集交互

lib/pages/player/player_logic.dart

@@ -29,6 +29,9 @@ import '../mine/mine_logic.dart';
 import '../mine/mine_view.dart';
 import 'player_view.dart';
 import 'widgets/drama_comments_sheet.dart';
+import 'widgets/episode_picker_cell.dart';
+
+const double _episodeCellAspect = 1.05;
 
 class PlayerLogic extends ChangeNotifier {
   PlayerLogic({
@@ -616,7 +619,7 @@ class PlayerLogic extends ChangeNotifier {
     try {
       await showModalBottomSheet<void>(
         context: context,
-        backgroundColor: const Color(0xFF16171C),
+        backgroundColor: AppColors.ink,
         showDragHandle: true,
         builder: (sheetContext) => SafeArea(
           child: SizedBox(
@@ -655,7 +658,7 @@ class PlayerLogic extends ChangeNotifier {
                           crossAxisCount: 6,
                           mainAxisSpacing: 10,
                           crossAxisSpacing: 10,
-                          childAspectRatio: 1.45,
+                          childAspectRatio: _episodeCellAspect,
                         ),
                     itemCount: episodes.length,
                     itemBuilder: (_, index) => _episodeCell(
@@ -706,38 +709,27 @@ class PlayerLogic extends ChangeNotifier {
     int currentNumber,
   ) {
     final selected = episode.number == currentNumber;
-    return Material(
-      color: selected ? AppColors.bluePressed : const Color(0xFF2A2C33),
-      borderRadius: BorderRadius.circular(8),
-      child: InkWell(
-        borderRadius: BorderRadius.circular(8),
-        onTap: () {
-          Navigator.of(sheetContext).pop();
-          if (homeFeed) {
-            if (episode.number == currentNumber) return;
-            unawaited(openSeriesAt(pageContext, drama, index));
-            return;
-          }
-          if (index == session.currentIndex) return;
-          unawaited(
-            pages.animateToPage(
-              index,
-              duration: const Duration(milliseconds: 260),
-              curve: Curves.easeOutCubic,
-            ),
-          );
-        },
-        child: Center(
-          child: Text(
-            '${episode.number}',
-            style: const TextStyle(
-              color: Colors.white,
-              fontSize: 15,
-              fontWeight: FontWeight.w600,
-            ),
+    final l10n = AppLocalizations.of(pageContext)!;
+    return EpisodePickerCell(
+      episode: episode,
+      selected: selected,
+      lockLabel: l10n.locked,
+      onTap: () {
+        Navigator.of(sheetContext).pop();
+        if (homeFeed) {
+          if (episode.number == currentNumber) return;
+          unawaited(openSeriesAt(pageContext, drama, index));
+          return;
+        }
+        if (index == session.currentIndex) return;
+        unawaited(
+          pages.animateToPage(
+            index,
+            duration: const Duration(milliseconds: 260),
+            curve: Curves.easeOutCubic,
           ),
-        ),
-      ),
+        );
+      },
     );
   }
 
@@ -843,7 +835,7 @@ class PlayerLogic extends ChangeNotifier {
       await showModalBottomSheet<void>(
         context: context,
         isScrollControlled: true,
-        backgroundColor: const Color(0xFF232328),
+        backgroundColor: AppColors.ink,
         showDragHandle: true,
         builder: (_) => DramaCommentsSheet(drama: drama),
       );

lib/pages/player/player_view.dart

@@ -136,7 +136,7 @@ class _PlayerPageState extends State<PlayerPage> with WidgetsBindingObserver {
         data: AppTheme.dark(),
         child: widget.embedded
             ? content
-            : Scaffold(backgroundColor: Colors.black, body: content),
+            : Scaffold(backgroundColor: AppColors.ink, body: content),
       ),
     );
   }
@@ -183,7 +183,7 @@ class _PlayerPageState extends State<PlayerPage> with WidgetsBindingObserver {
     return Stack(
       fit: StackFit.expand,
       children: [
-        const ColoredBox(color: Colors.black),
+        const ColoredBox(color: AppColors.ink),
         ?video,
         if (!logic.chromeHidden)
           const IgnorePointer(
@@ -304,7 +304,7 @@ class _PlayerPageState extends State<PlayerPage> with WidgetsBindingObserver {
             child: IgnorePointer(
               child: DecoratedBox(
                 decoration: BoxDecoration(
-                  color: Color(0x73000000),
+                  color: AppColors.blue,
                   shape: BoxShape.circle,
                 ),
                 child: Padding(
@@ -494,31 +494,91 @@ class _BlockedNotice extends StatelessWidget {
         : l10n.noMediaNotice;
     return Center(
       child: Padding(
-        padding: const EdgeInsets.symmetric(horizontal: 36),
+        padding: const EdgeInsets.symmetric(horizontal: 28),
+        child: _UnlockCard(
+          locked: needsUnlock,
+          title: title,
+          coinLabel: needsUnlock && unlockCoin > 0
+              ? '$unlockCoin ${l10n.coins}'
+              : null,
+          footnote: needsUnlock ? l10n.unlockComingSoon : null,
+        ),
+      ),
+    );
+  }
+}
+
+/// Coin lock presented as a reward card: gold chip, chili only on the icon.
+class _UnlockCard extends StatelessWidget {
+  const _UnlockCard({
+    required this.locked,
+    required this.title,
+    required this.coinLabel,
+    required this.footnote,
+  });
+
+  final bool locked;
+  final String title;
+  final String? coinLabel;
+  final String? footnote;
+
+  @override
+  Widget build(BuildContext context) {
+    return DecoratedBox(
+      decoration: BoxDecoration(
+        color: AppColors.card,
+        borderRadius: BorderRadius.circular(20),
+        border: Border.all(color: AppColors.gold.withValues(alpha: 0.55)),
+      ),
+      child: Padding(
+        padding: const EdgeInsets.fromLTRB(20, 22, 20, 18),
         child: Column(
           mainAxisSize: MainAxisSize.min,
           children: [
             Icon(
-              needsUnlock
-                  ? Icons.lock_outline_rounded
-                  : Icons.movie_filter_outlined,
-              color: Colors.white70,
-              size: 36,
+              locked ? Icons.lock_outline_rounded : Icons.movie_filter_outlined,
+              color: locked ? AppColors.gold : AppColors.cream,
+              size: 32,
             ),
             const SizedBox(height: 12),
             Text(
               title,
               textAlign: TextAlign.center,
-              style: const TextStyle(color: Colors.white70),
+              style: const TextStyle(
+                color: AppColors.cream,
+                fontSize: 16,
+                fontWeight: FontWeight.w700,
+              ),
             ),
-            if (needsUnlock) ...[
-              const SizedBox(height: 6),
+            if (coinLabel != null) ...[
+              const SizedBox(height: 12),
+              DecoratedBox(
+                decoration: BoxDecoration(
+                  color: AppColors.gold,
+                  borderRadius: BorderRadius.circular(20),
+                ),
+                child: Padding(
+                  padding: const EdgeInsets.symmetric(
+                    horizontal: 12,
+                    vertical: 6,
+                  ),
+                  child: Text(
+                    coinLabel!,
+                    style: const TextStyle(
+                      color: AppColors.onGold,
+                      fontSize: 13,
+                      fontWeight: FontWeight.w800,
+                    ),
+                  ),
+                ),
+              ),
+            ],
+            if (footnote != null) ...[
+              const SizedBox(height: 8),
               Text(
-                unlockCoin > 0
-                    ? '${l10n.unlockComingSoon} · $unlockCoin ${l10n.coins}'
-                    : l10n.unlockComingSoon,
+                footnote!,
                 textAlign: TextAlign.center,
-                style: const TextStyle(color: Colors.white38, fontSize: 12),
+                style: const TextStyle(color: AppColors.muted, fontSize: 12),
               ),
             ],
           ],
@@ -674,14 +734,14 @@ class _PlaybackOverlay extends StatelessWidget {
     children: [
       _RailAction(
         key: const Key('rail-like'),
-        icon: liked ? Icons.favorite_rounded : Icons.favorite_border_rounded,
+        icon: Icons.favorite_border,
         label: l10n.like,
         selected: liked,
         onTap: onLike,
       ),
       _RailAction(
         key: const Key('rail-save'),
-        icon: saved ? Icons.bookmark_rounded : Icons.bookmark_border_rounded,
+        icon: Icons.bookmark_border,
         label: l10n.save,
         selected: saved,
         onTap: onSave,
@@ -693,19 +753,19 @@ class _PlaybackOverlay extends StatelessWidget {
         onTap: onDownload,
       ),
       _RailAction(
-        icon: Icons.grid_view_rounded,
+        icon: Icons.grid_view_outlined,
         label: l10n.episodes,
         onTap: onEpisodes,
       ),
       _RailAction(
         key: const Key('rail-comments'),
-        icon: Icons.mode_comment_outlined,
+        icon: Icons.chat_bubble_outline,
         label: l10n.comments,
         onTap: onComments,
       ),
       _RailAction(
         key: const Key('rail-share'),
-        icon: Icons.share_rounded,
+        icon: Icons.share_outlined,
         label: l10n.share,
         onTap: onShare,
       ),
@@ -713,10 +773,16 @@ class _PlaybackOverlay extends StatelessWidget {
         IconButton(
           tooltip: l10n.pictureInPicture,
           onPressed: onPip,
-          visualDensity: VisualDensity.compact,
-          iconSize: 20,
-          color: Colors.white,
-          icon: const Icon(Icons.picture_in_picture_alt_outlined),
+          padding: EdgeInsets.zero,
+          constraints: const BoxConstraints.tightFor(
+            width: _railTapSize,
+            height: _railTapSize,
+          ),
+          color: AppColors.cream,
+          icon: const Icon(
+            Icons.picture_in_picture_alt_outlined,
+            size: _railIconSize,
+          ),
         ),
     ],
   );
@@ -748,6 +814,10 @@ class _PlaybackOverlay extends StatelessWidget {
   );
 }
 
+const double _railIconSize = 28;
+const double _railIconWeight = 300;
+const double _railTapSize = 44;
+
 class _RailAction extends StatelessWidget {
   const _RailAction({
     super.key,
@@ -762,28 +832,16 @@ class _RailAction extends StatelessWidget {
   final bool selected;
 
   @override
-  Widget build(BuildContext context) => Column(
-    mainAxisSize: MainAxisSize.min,
-    children: [
-      IconButton(
-        tooltip: label,
-        onPressed: onTap,
-        visualDensity: VisualDensity.compact,
-        padding: EdgeInsets.zero,
-        constraints: const BoxConstraints.tightFor(width: 42, height: 36),
-        color: selected ? AppColors.blueSoft : Colors.white,
-        icon: Icon(icon, size: 24),
-      ),
-      Text(
-        label,
-        style: const TextStyle(
-          color: Colors.white,
-          fontSize: 11,
-          fontWeight: FontWeight.w600,
-          shadows: [Shadow(blurRadius: 8, color: Colors.black)],
-        ),
-      ),
-    ],
+  Widget build(BuildContext context) => IconButton(
+    tooltip: label,
+    onPressed: onTap,
+    padding: EdgeInsets.zero,
+    constraints: const BoxConstraints.tightFor(
+      width: _railTapSize,
+      height: _railTapSize,
+    ),
+    color: selected ? AppColors.blueSoft : AppColors.cream,
+    icon: Icon(icon, size: _railIconSize, weight: _railIconWeight, fill: 0),
   );
 }
 

lib/pages/player/widgets/comment_tile.dart

@@ -52,11 +52,11 @@ class CommentTile extends StatelessWidget {
         children: [
           CircleAvatar(
             radius: isReply ? 12 : 16,
-            backgroundColor: AppColors.blue.withValues(alpha: 0.2),
+            backgroundColor: AppColors.raised,
             child: Icon(
               Icons.person_rounded,
               size: isReply ? 14 : 18,
-              color: AppColors.blueSoft,
+              color: AppColors.cream,
             ),
           ),
           const SizedBox(width: 12),
@@ -101,7 +101,7 @@ class CommentTile extends StatelessWidget {
                 ),
                 Text(
                   comment.content,
-                  style: const TextStyle(color: Colors.white, fontSize: 14),
+                  style: const TextStyle(color: AppColors.cream, fontSize: 14),
                 ),
                 if (comment.isPending)
                   Padding(

lib/pages/player/widgets/drama_comments_sheet.dart

@@ -19,9 +19,10 @@ import '../../../l10n/app_localizations.dart';
 import '../../interaction/widgets/report_dialog.dart';
 import 'comment_tile.dart';
 
-const double _minSheetHeight = 240;
-const double _maxSheetHeight = 460;
+const double _minSheetHeight = 280;
+const double _maxSheetHeight = 520;
 const int _maxCommentLength = 300;
+const double _composerRadius = 22;
 
 /// 服务端评论底部弹窗：匿名列表、游标翻页、回复、点赞和本人删除。
 class DramaCommentsSheet extends StatefulWidget {
@@ -164,7 +165,7 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
         child: SafeArea(
           top: false,
           child: Padding(
-            padding: const EdgeInsets.fromLTRB(16, 12, 16, 8),
+            padding: const EdgeInsets.fromLTRB(20, 4, 20, 12),
             child: ListenableBuilder(
               listenable: _controller,
               builder: (context, _) => _content(context),
@@ -182,9 +183,13 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
       children: [
         Text(
           l10n.comments,
-          style: const TextStyle(fontSize: 20, fontWeight: FontWeight.w700),
+          style: const TextStyle(
+            color: AppColors.cream,
+            fontSize: 18,
+            fontWeight: FontWeight.w700,
+          ),
         ),
-        const SizedBox(height: 8),
+        const SizedBox(height: 12),
         Expanded(child: _list(l10n)),
         if (_replyTo != null) _replyBanner(l10n, _replyTo!),
         _composer(l10n),
@@ -199,24 +204,14 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
       );
     }
     if (_controller.error != null && _controller.comments.isEmpty) {
-      return Center(
+      return EmptyState(
         key: const Key('comment-list-error'),
-        child: Column(
-          mainAxisSize: MainAxisSize.min,
-          children: [
-            Text(
-              errorText(l10n, _controller.error, l10n.commentsLoadFailed),
-              textAlign: TextAlign.center,
-              style: const TextStyle(color: AppColors.muted),
-            ),
-            const SizedBox(height: 8),
-            TextButton(
-              key: const Key('comment-list-retry'),
-              onPressed: _controller.load,
-              child: Text(l10n.retry),
-            ),
-          ],
-        ),
+        icon: Icons.cloud_off_rounded,
+        title: errorText(l10n, _controller.error, l10n.commentsLoadFailed),
+        actionLabel: l10n.retry,
+        actionKey: const Key('comment-list-retry'),
+        onAction: _controller.load,
+        compact: true,
       );
     }
     if (_controller.comments.isEmpty) {
@@ -272,7 +267,7 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
             l10n.replyingTo(
               replyTo.nickname.isEmpty ? l10n.anonymousUser : replyTo.nickname,
             ),
-            style: const TextStyle(color: AppColors.blueSoft, fontSize: 12),
+            style: const TextStyle(color: AppColors.muted, fontSize: 12),
           ),
         ),
         IconButton(
@@ -286,6 +281,25 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
     ),
   );
 
+  InputDecoration _composerDecoration(String hint) {
+    const radius = BorderRadius.all(Radius.circular(_composerRadius));
+    const clear = OutlineInputBorder(
+      borderRadius: radius,
+      borderSide: BorderSide.none,
+    );
+    return InputDecoration(
+      hintText: hint,
+      hintStyle: const TextStyle(color: AppColors.muted, fontSize: 14),
+      counterText: '',
+      filled: true,
+      fillColor: AppColors.raised,
+      contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
+      border: clear,
+      enabledBorder: clear,
+      focusedBorder: clear,
+    );
+  }
+
   Widget _composer(AppLocalizations l10n) => Row(
     children: [
       Expanded(
@@ -295,16 +309,9 @@ class _DramaCommentsSheetState extends State<DramaCommentsSheet> {
           focusNode: _inputFocus,
           maxLength: _maxCommentLength,
           maxLines: 1,
-          decoration: InputDecoration(
-            hintText: l10n.writeComment,
-            counterText: '',
-            filled: true,
-            fillColor: const Color(0xFF35353A),
-            border: OutlineInputBorder(
-              borderRadius: BorderRadius.circular(14),
-              borderSide: BorderSide.none,
-            ),
-          ),
+          style: const TextStyle(color: AppColors.cream, fontSize: 14),
+          cursorColor: AppColors.gold,
+          decoration: _composerDecoration(l10n.writeComment),
           onSubmitted: (_) => _post(),
         ),
       ),
@@ -387,7 +394,7 @@ class _CommentThread extends StatelessWidget {
               ],
             ),
           ),
-        const Divider(height: 1),
+        const Divider(height: 1, color: AppColors.outlineVariantDark),
       ],
     );
   }

lib/pages/player/widgets/episode_picker_cell.dart

@@ -0,0 +1,116 @@
+// Author: fruit.com.cn
+
+import 'package:flutter/material.dart';
+
+import '../../../core/data/models/drama.dart';
+import '../../../core/theme/app_colors.dart';
+
+const double _cellRadius = 8;
+const double _numberSize = 15;
+const double _lockSize = 16;
+const double _lockGap = 4;
+const double _lockWeight = 300;
+const double _coverAlpha = 0.45;
+
+/// 选集格子。需要解锁时铺一层透明底，锁在上，集数在锁下面。
+class EpisodePickerCell extends StatelessWidget {
+  const EpisodePickerCell({
+    required this.episode,
+    required this.selected,
+    required this.lockLabel,
+    required this.onTap,
+    super.key,
+  });
+
+  final Episode episode;
+  final bool selected;
+  final String lockLabel;
+  final VoidCallback onTap;
+
+  @override
+  Widget build(BuildContext context) {
+    return Material(
+      clipBehavior: Clip.antiAlias,
+      color: selected ? AppColors.bluePressed : AppColors.raised,
+      borderRadius: BorderRadius.circular(_cellRadius),
+      child: InkWell(
+        onTap: onTap,
+        child: Stack(
+          fit: StackFit.expand,
+          children: [
+            if (!episode.locked) Center(child: _EpisodeNumber(episode.number)),
+            if (episode.locked)
+              _LockCover(
+                episodeId: episode.id,
+                number: episode.number,
+                label: lockLabel,
+              ),
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+class _EpisodeNumber extends StatelessWidget {
+  const _EpisodeNumber(this.number);
+
+  final int number;
+
+  @override
+  Widget build(BuildContext context) {
+    return Text(
+      '$number',
+      style: const TextStyle(
+        color: AppColors.cream,
+        fontSize: _numberSize,
+        fontWeight: FontWeight.w600,
+        height: 1,
+      ),
+    );
+  }
+}
+
+/// 透明底铺满格子，锁在上，集数在锁下面。
+class _LockCover extends StatelessWidget {
+  const _LockCover({
+    required this.episodeId,
+    required this.number,
+    required this.label,
+  });
+
+  final String episodeId;
+  final int number;
+  final String label;
+
+  @override
+  Widget build(BuildContext context) {
+    return Stack(
+      fit: StackFit.expand,
+      children: [
+        ColoredBox(
+          key: ValueKey('episode-lock-cover-$episodeId'),
+          color: AppColors.ink.withValues(alpha: _coverAlpha),
+        ),
+        Center(
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              Icon(
+                Icons.lock_outline,
+                key: ValueKey('episode-lock-$episodeId'),
+                size: _lockSize,
+                weight: _lockWeight,
+                fill: 0,
+                color: AppColors.gold,
+                semanticLabel: label,
+              ),
+              const SizedBox(height: _lockGap),
+              _EpisodeNumber(number),
+            ],
+          ),
+        ),
+      ],
+    );
+  }
+}

lib/pages/player/widgets/seek_progress_bar.dart

@@ -120,7 +120,7 @@ class _SeekProgressBarState extends State<SeekProgressBar> {
           child: SliderTheme(
             data: SliderTheme.of(context).copyWith(
               trackHeight: scrubbing ? 4 : 3,
-              activeTrackColor: AppColors.blueSoft,
+              activeTrackColor: AppColors.gold,
               inactiveTrackColor: Colors.white30,
               thumbColor: Colors.white,
               thumbShape: RoundSliderThumbShape(