feat(client): C 端 1-2 账号链路（邮箱登录/注册 + 令牌与 401 + 匿名/登录分叉）

为什么：客户端此前完全没有账号概念（mine 页的"登录"只是本地 demo 开关），
而受限动作（收藏/评论）要对到具体账号。本批把账号链路接上，为后续互动、进度同步、下载打底。

- AuthApi + AuthController + AuthSessionStore：注册/登录/登出/刷新，令牌与设备号存 shared_preferences
  （用 SharedPreferencesAsync，与 engagement 仓库同一套 API）
- ApiClient：统一带 Authorization 与 X-Device-Id；401 自动刷新一次并重试，刷新失败清登录态走 onUnauthorized
- 登录/注册页（pages/auth，沿用 binding/logic/view 与现有视觉）：邮箱格式、密码 8-64 位含字母数字本地先校验，
  错误提示走 l10n；登录/注册一键切换
- 匿名/登录分叉：首页、发现、详情保持匿名可看；收藏/点赞等受限动作走 ensureSignedIn() 弹底部提示引导登录
- mine 页展示真实账号（昵称 + uid），拿不到才回落到演示文案
- 测试：新增 auth 控制器（注册落盘/401 刷新重试/刷新失败清会话/登出）与登录页（校验/切换）用例；
  widget_test 改为预置本地会话（账号不再是本地开关）；修掉 playback 用例对 host 大小写的环境依赖断言

门禁：flutter analyze 0 问题；flutter test 148 全过。

lib/pages/mine/mine_view.dart

@@ -4,7 +4,10 @@ import 'package:provider/provider.dart';
 import '../../core/formatting/localized_content.dart';
 import '../../core/data/models/drama.dart';
 import '../../core/data/repositories/watch_history_repository.dart';
+import '../../core/data/services/auth_controller.dart';
 import '../../core/data/services/engagement_controller.dart';
+import '../../core/widgets/remote_image.dart';
+import '../../core/theme/app_colors.dart';
 import '../../l10n/app_localizations.dart';
 import 'mine_binding.dart';
 import 'mine_logic.dart';
@@ -15,11 +18,16 @@ class MyPage extends StatefulWidget {
     required this.drama,
     required this.duration,
     this.initialSection = 0,
+    this.profile = false,
+    this.onOpenHistory,
     this.history,
     this.embedded = false,
     this.active = true,
     this.sectionRequest = 0,
     this.onAction,
+    this.signedIn = false,
+    this.onSignIn,
+    this.onSignOut,
     this.dramas,
     this.onDramaSelected,
   });
@@ -27,11 +35,16 @@ class MyPage extends StatefulWidget {
   final Drama drama;
   final Duration duration;
   final int initialSection;
+  final bool profile;
+  final VoidCallback? onOpenHistory;
   final WatchHistoryRepository? history;
   final bool embedded;
   final bool active;
   final int sectionRequest;
   final ValueChanged<MyPageAction>? onAction;
+  final bool signedIn;
+  final VoidCallback? onSignIn;
+  final VoidCallback? onSignOut;
   final List<Drama>? dramas;
   final ValueChanged<Drama>? onDramaSelected;
 
@@ -86,7 +99,7 @@ class _MyPageState extends State<MyPage> {
       bottom: !widget.embedded,
       child: Column(
         children: [
-          _topBar(l10n),
+          if (!widget.profile) _topBar(l10n),
           Expanded(
             child: FutureBuilder<Duration?>(
               future: logic.position,
@@ -101,15 +114,13 @@ class _MyPageState extends State<MyPage> {
                       1.0,
                     );
                 return ListView(
-                  padding: const EdgeInsets.fromLTRB(16, 12, 16, 20),
+                  padding: const EdgeInsets.fromLTRB(16, 8, 16, 20),
                   children: [
-                    _profile(l10n),
-                    const SizedBox(height: 22),
-                    _continueCard(l10n, fraction, position, total),
-                    const SizedBox(height: 26),
-                    _library(l10n, position, total, fraction),
-                    const SizedBox(height: 26),
-                    _preferences(l10n),
+                    if (widget.profile)
+                      ..._accountPage(l10n)
+                    else ...[
+                      _library(l10n, position, total, fraction),
+                    ],
                     const SizedBox(height: 24),
                     Center(
                       child: Text(
@@ -147,8 +158,8 @@ class _MyPageState extends State<MyPage> {
           const Icon(Icons.play_circle_fill_rounded, color: _orange, size: 27),
           const SizedBox(width: 7),
           Text(
-            l10n.myTab,
-            style: const TextStyle(fontSize: 18, fontWeight: FontWeight.w800),
+            l10n.myListTab,
+            style: const TextStyle(fontSize: 22, fontWeight: FontWeight.w800),
           ),
           const Spacer(),
           IconButton(
@@ -172,158 +183,247 @@ class _MyPageState extends State<MyPage> {
     ),
   );
 
-  Widget _profile(AppLocalizations l10n) => Row(
-    children: [
-      const CircleAvatar(
-        radius: 30,
-        backgroundColor: Color(0xFF32343A),
-        child: Icon(Icons.person_rounded, color: Colors.white, size: 34),
+  List<Widget> _accountPage(AppLocalizations l10n) => [
+    if (widget.signedIn) _signedInRow(l10n) else _guestRow(l10n),
+    if (widget.signedIn) ...[const SizedBox(height: 18), _wallet(l10n)],
+    const SizedBox(height: 14),
+    _menuCard(l10n),
+    const SizedBox(height: 18),
+    Text(
+      l10n.preferencesHeading,
+      style: const TextStyle(
+        color: AppColors.muted,
+        fontSize: 12,
+        fontWeight: FontWeight.w800,
+        letterSpacing: 1.1,
       ),
-      const SizedBox(width: 12),
-      Expanded(
-        child: Column(
-          crossAxisAlignment: CrossAxisAlignment.start,
-          children: [
-            Text(
-              l10n.localViewer,
-              maxLines: 1,
-              overflow: TextOverflow.ellipsis,
-              style: const TextStyle(fontSize: 19, fontWeight: FontWeight.w800),
-            ),
-            const SizedBox(height: 4),
-            Text(
-              l10n.localDemoProfile,
-              style: const TextStyle(color: Color(0xFFE6E1E3), fontSize: 12),
-            ),
-          ],
-        ),
-      ),
-      Container(
-        padding: const EdgeInsets.symmetric(horizontal: 11, vertical: 6),
-        decoration: BoxDecoration(
-          color: const Color(0xFF24252A),
-          borderRadius: BorderRadius.circular(20),
-        ),
-        child: Text(l10n.demo, style: const TextStyle(fontSize: 11)),
-      ),
-    ],
-  );
-
-  Widget _continueCard(
-    AppLocalizations l10n,
-    double fraction,
-    Duration position,
-    Duration total,
-  ) => Container(
-    padding: const EdgeInsets.all(13),
-    decoration: BoxDecoration(
-      color: const Color(0xFF201B1E),
-      borderRadius: BorderRadius.circular(13),
     ),
-    child: Column(
-      crossAxisAlignment: CrossAxisAlignment.start,
+    const SizedBox(height: 8),
+    ListTile(
+      contentPadding: EdgeInsets.zero,
+      leading: const Icon(Icons.language_rounded, color: AppColors.blueSoft),
+      title: Text(l10n.appLanguage),
+      trailing: const Icon(Icons.chevron_right_rounded),
+      onTap: () => logic.showLanguage(context),
+    ),
+  ];
+
+  Widget _guestRow(AppLocalizations l10n) {
+    return Row(
       children: [
-        Row(
-          children: [
-            const Icon(Icons.history_rounded, color: _orange, size: 17),
-            const SizedBox(width: 6),
-            Expanded(
-              child: Text(
-                l10n.continueWatching,
+        const CircleAvatar(
+          radius: 28,
+          backgroundColor: Color(0xFF32343A),
+          child: Icon(Icons.person_rounded, color: Colors.white, size: 30),
+        ),
+        const SizedBox(width: 12),
+        Expanded(
+          child: Text(
+            l10n.logInHint,
+            maxLines: 2,
+            overflow: TextOverflow.ellipsis,
+            style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w600),
+          ),
+        ),
+        const SizedBox(width: 8),
+        TextButton(
+          onPressed: widget.onSignIn,
+          style: TextButton.styleFrom(
+            foregroundColor: Colors.white,
+            backgroundColor: AppColors.blue,
+            padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
+            shape: const StadiumBorder(),
+          ),
+          child: Text(l10n.logIn),
+        ),
+      ],
+    );
+  }
+
+  Widget _signedInRow(AppLocalizations l10n) {
+    // 显示真实登录账号（昵称 + uid）；拿不到才回落到演示文案
+    final user = context.watch<AuthController>().user;
+    final name = (user?.nickname.isNotEmpty ?? false) ? user!.nickname : l10n.mockUserName;
+    final uidText = (user?.uid.isNotEmpty ?? false) ? 'ID: ${user!.uid}' : l10n.mockUserId;
+    return Row(
+      children: [
+        const CircleAvatar(
+          radius: 28,
+          backgroundColor: Color(0xFF32343A),
+          child: Icon(Icons.person_rounded, color: Colors.white, size: 30),
+        ),
+        const SizedBox(width: 12),
+        Expanded(
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              Text(
+                name,
                 maxLines: 1,
                 overflow: TextOverflow.ellipsis,
                 style: const TextStyle(
-                  fontSize: 14,
-                  fontWeight: FontWeight.w800,
+                  fontSize: 20,
+                  fontWeight: FontWeight.w600,
                 ),
               ),
-            ),
-            Text(
-              l10n.episodeProgress(1, widget.drama.episodes.length),
-              style: const TextStyle(color: Color(0xFFFFA38F), fontSize: 10),
-            ),
-          ],
-        ),
-        const SizedBox(height: 12),
-        Row(
-          children: [
-            _poster(width: 75, height: 96),
-            const SizedBox(width: 11),
-            Expanded(
-              child: Column(
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  Text(
-                    localizedDramaTitle(l10n, widget.drama),
-                    style: const TextStyle(
-                      fontSize: 17,
-                      fontWeight: FontWeight.w800,
-                    ),
-                  ),
-                  const SizedBox(height: 3),
-                  Text(
-                    l10n.dramaTag,
-                    style: const TextStyle(
-                      color: Color(0xFFE6E1E3),
-                      fontSize: 12,
-                    ),
-                  ),
-                  const SizedBox(height: 10),
-                  Text(
-                    l10n.watchedPercent((fraction * 100).round()),
-                    style: const TextStyle(
-                      color: Color(0xFFE7DEDD),
-                      fontSize: 11,
-                    ),
-                  ),
-                  const SizedBox(height: 5),
-                  ClipRRect(
-                    borderRadius: BorderRadius.circular(3),
-                    child: LinearProgressIndicator(
-                      value: fraction,
-                      minHeight: 4,
-                      backgroundColor: const Color(0xFF444046),
-                      color: _orange,
-                    ),
-                  ),
-                  const SizedBox(height: 6),
-                  Text(
-                    '${_clock(position)} / ${_clock(total)}',
-                    style: const TextStyle(
-                      color: Color(0xFFE6E1E3),
-                      fontSize: 12,
-                    ),
-                  ),
-                ],
+              const SizedBox(height: 2),
+              Text(
+                uidText,
+                style: const TextStyle(color: AppColors.muted, fontSize: 12),
               ),
-            ),
-          ],
-        ),
-        const SizedBox(height: 12),
-        SizedBox(
-          width: double.infinity,
-          child: FilledButton.icon(
-            onPressed: () => logic.act(
-              context,
-              MyPageAction.resume,
-              embedded: widget.embedded,
-              onAction: widget.onAction,
-            ),
-            style: FilledButton.styleFrom(
-              backgroundColor: _orange,
-              foregroundColor: Colors.white,
-              minimumSize: const Size.fromHeight(37),
-              shape: RoundedRectangleBorder(
-                borderRadius: BorderRadius.circular(9),
-              ),
-            ),
-            icon: const Icon(Icons.play_arrow_rounded, size: 18),
-            label: Text(l10n.resume),
+            ],
           ),
         ),
+        TextButton(
+          onPressed: widget.onSignOut ?? () => _mockSnack(l10n),
+          style: TextButton.styleFrom(
+            backgroundColor: const Color(0xFF2A2C33),
+            foregroundColor: Colors.white,
+            padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
+            shape: const StadiumBorder(),
+          ),
+          child: Text(l10n.signOut),
+        ),
       ],
-    ),
-  );
+    );
+  }
+
+  Widget _wallet(AppLocalizations l10n) {
+    return Container(
+      padding: const EdgeInsets.all(14),
+      decoration: BoxDecoration(
+        color: const Color(0xFF17191F),
+        borderRadius: BorderRadius.circular(16),
+      ),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text(
+            l10n.myAccount,
+            style: const TextStyle(fontSize: 16, fontWeight: FontWeight.w800),
+          ),
+          const SizedBox(height: 12),
+          Row(
+            children: [
+              Expanded(
+                child: _accountTile(
+                  label: l10n.coins,
+                  value: '\$ 0',
+                  action: l10n.topUpWallet,
+                  color: AppColors.blue,
+                  onPressed: () => _mockSnack(l10n),
+                ),
+              ),
+              const SizedBox(width: 10),
+              Expanded(
+                child: _accountTile(
+                  label: l10n.vipMembership,
+                  value: l10n.notActive,
+                  action: l10n.joinVip,
+                  color: const Color(0xFFF5C451),
+                  onPressed: () => _mockSnack(l10n),
+                ),
+              ),
+            ],
+          ),
+        ],
+      ),
+    );
+  }
+
+  void _mockSnack(AppLocalizations l10n) {
+    ScaffoldMessenger.of(
+      context,
+    ).showSnackBar(SnackBar(content: Text(l10n.mockNotice)));
+  }
+
+  Widget _accountTile({
+    required String label,
+    required String value,
+    required String action,
+    required Color color,
+    required VoidCallback onPressed,
+  }) {
+    return Container(
+      padding: const EdgeInsets.all(12),
+      decoration: BoxDecoration(
+        color: const Color(0xFF12141A),
+        borderRadius: BorderRadius.circular(14),
+        border: Border.all(color: color.withValues(alpha: 0.45)),
+      ),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text(label, style: TextStyle(color: color, fontSize: 12)),
+          const SizedBox(height: 6),
+          Text(
+            value,
+            style: const TextStyle(fontSize: 18, fontWeight: FontWeight.w800),
+          ),
+          const SizedBox(height: 10),
+          SizedBox(
+            width: double.infinity,
+            child: FilledButton(
+              onPressed: onPressed,
+              style: FilledButton.styleFrom(
+                backgroundColor: color,
+                foregroundColor: color == AppColors.blue
+                    ? Colors.white
+                    : const Color(0xFF2A2110),
+                visualDensity: VisualDensity.compact,
+                shape: const StadiumBorder(),
+              ),
+              child: Text(action, maxLines: 1, overflow: TextOverflow.ellipsis),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _menuCard(AppLocalizations l10n) {
+    return Material(
+      color: const Color(0xFF17191F),
+      borderRadius: BorderRadius.circular(16),
+      clipBehavior: Clip.antiAlias,
+      child: Column(
+        children: [
+          ListTile(
+            leading: const Icon(
+              Icons.card_giftcard_rounded,
+              color: AppColors.blueSoft,
+            ),
+            title: Text(l10n.earnRewards),
+            trailing: Text(
+              l10n.freeBonus,
+              style: const TextStyle(color: AppColors.blue, fontSize: 12),
+            ),
+            onTap: () => _mockSnack(l10n),
+          ),
+          const Divider(height: 1, color: Color(0xFF2A2C33)),
+          ListTile(
+            leading: const Icon(
+              Icons.history_rounded,
+              color: AppColors.blueSoft,
+            ),
+            title: Text(l10n.watchHistory),
+            trailing: const Icon(Icons.chevron_right_rounded),
+            onTap: widget.onOpenHistory,
+          ),
+          const Divider(height: 1, color: Color(0xFF2A2C33)),
+          ListTile(
+            leading: const Icon(
+              Icons.settings_rounded,
+              color: AppColors.blueSoft,
+            ),
+            title: Text(l10n.settings),
+            trailing: const Icon(Icons.chevron_right_rounded),
+            onTap: () => logic.showLanguage(context),
+          ),
+        ],
+      ),
+    );
+  }
 
   Widget _library(
     AppLocalizations l10n,
@@ -353,14 +453,25 @@ class _MyPageState extends State<MyPage> {
               for (var index = 0; index < tabs.length; index++) ...[
                 InkWell(
                   onTap: () => logic.selectSection(index),
-                  child: Text(
-                    tabs[index],
-                    style: TextStyle(
+                  borderRadius: BorderRadius.circular(20),
+                  child: Container(
+                    padding: const EdgeInsets.symmetric(
+                      horizontal: 14,
+                      vertical: 8,
+                    ),
+                    decoration: BoxDecoration(
                       color: logic.section == index
-                          ? _orange
-                          : const Color(0xFFE4DBDD),
-                      fontSize: 16,
-                      fontWeight: FontWeight.w800,
+                          ? AppColors.blue
+                          : const Color(0xFF24262E),
+                      borderRadius: BorderRadius.circular(20),
+                    ),
+                    child: Text(
+                      tabs[index],
+                      style: const TextStyle(
+                        color: Colors.white,
+                        fontSize: 14,
+                        fontWeight: FontWeight.w700,
+                      ),
                     ),
                   ),
                 ),
@@ -446,7 +557,7 @@ class _MyPageState extends State<MyPage> {
                           maxLines: 1,
                           overflow: TextOverflow.ellipsis,
                           style: const TextStyle(
-                            color: Color(0xFFFFA18D),
+                            color: AppColors.blueSoft,
                             fontSize: 10,
                           ),
                         ),
@@ -507,12 +618,7 @@ class _MyPageState extends State<MyPage> {
         children: [
           ClipRRect(
             borderRadius: BorderRadius.circular(8),
-            child: Image.asset(
-              drama.posterAsset,
-              width: 74,
-              height: 103,
-              fit: BoxFit.cover,
-            ),
+            child: RemoteImage(drama.posterUrl, width: 74, height: 103),
           ),
           const SizedBox(width: 11),
           Expanded(
@@ -530,7 +636,7 @@ class _MyPageState extends State<MyPage> {
                 ),
                 const SizedBox(height: 7),
                 Text(
-                  l10n.episodeCount(drama.episodes.length),
+                  l10n.episodeCount(drama.episodeCount),
                   style: const TextStyle(
                     color: Color(0xFFE6E1E3),
                     fontSize: 12,
@@ -545,49 +651,6 @@ class _MyPageState extends State<MyPage> {
     ),
   );
 
-  Widget _preferences(AppLocalizations l10n) => Column(
-    crossAxisAlignment: CrossAxisAlignment.start,
-    children: [
-      Text(
-        l10n.preferencesHeading,
-        style: const TextStyle(
-          color: Color(0xFFCEBBB9),
-          fontSize: 11,
-          fontWeight: FontWeight.w800,
-          letterSpacing: 0.5,
-        ),
-      ),
-      const SizedBox(height: 12),
-      Material(
-        color: const Color(0xFF1B1C21),
-        borderRadius: BorderRadius.circular(12),
-        clipBehavior: Clip.antiAlias,
-        child: ListTile(
-          leading: const Icon(
-            Icons.translate_rounded,
-            color: Color(0xFFFFBC65),
-          ),
-          title: Text(l10n.appLanguage),
-          subtitle: Text(l10n.language),
-          trailing: Row(
-            mainAxisSize: MainAxisSize.min,
-            children: [
-              Text(
-                Localizations.localeOf(context).languageCode == 'zh'
-                    ? l10n.simplifiedChinese
-                    : l10n.english,
-                style: const TextStyle(color: Color(0xFFFFB2A1), fontSize: 11),
-              ),
-              const SizedBox(width: 4),
-              const Icon(Icons.chevron_right_rounded, size: 18),
-            ],
-          ),
-          onTap: () => logic.showLanguage(context),
-        ),
-      ),
-    ],
-  );
-
   Widget _bottomNav(AppLocalizations l10n) => Container(
     height: 63,
     decoration: const BoxDecoration(
@@ -629,12 +692,7 @@ class _MyPageState extends State<MyPage> {
 
   Widget _poster({required double width, required double height}) => ClipRRect(
     borderRadius: BorderRadius.circular(7),
-    child: Image.asset(
-      widget.drama.posterAsset,
-      width: width,
-      height: height,
-      fit: BoxFit.cover,
-    ),
+    child: RemoteImage(widget.drama.posterUrl, width: width, height: height),
   );
 }
 
@@ -683,4 +741,4 @@ String _clock(Duration duration) {
   return '${(seconds ~/ 60).toString().padLeft(2, '0')}:${(seconds % 60).toString().padLeft(2, '0')}';
 }
 
-const _orange = Color(0xFFFF5B3D);
+const _orange = AppColors.blue;