feat(client): 免费版连接倒计时 + 到点切断 + 灰按钮 + 看广告加时(#21 前端)

四端共享 Dart 实现,配合 #21 后端账户级卡控:

- me.dart: 加 quota_cap_min(当日总额度 = daily + 看广告 bonus,进度条分母)。
- quota_provider: total 取 quotaCapMin;isExhausted;markExhausted(倒计时归零本地置耗尽
  + 登录态拉 me 校准);watchAd() async 调 /ads/unlock(占位 ad_token=uuid)→ 刷新 me,返回 granted。
- connection_provider: 连接时锁定 _freeRemainingSec(会员 null 不倒计时);复用 elapsed 计时器
  每 tick 算 freeCountdown,归零 → _onFreeQuotaExhausted(主动切断不报节点异常 + markExhausted);
  倒计时用墙上时钟(后台漏跳回前台补上、准时切);连接遇后端 QUOTA_EXHAUSTED 兜底置耗尽。
- connect_button: enabled/onDisabledTap —— 额度耗尽 off 态灰化(锁图标),点击弹加时。
- quota_card: 三态(连接倒计时 mm:ss / 未连接剩余分钟 / 耗尽今日已用完);移动「看广告加时」、桌面「升级会员」。
- ad_reward_dialog(新): 移动端占位广告(播放中→3s→加时→奖励);桌面版硬 10 分钟提示去移动端/升级。
- l10n(zh/en): 倒计时/已用完/看广告加时/占位广告/桌面升级 双语。
- 测试: quota isExhausted/markExhausted;连接倒计时归零自动切断+置耗尽(注入时钟);
  额度卡三态 widget;/me 契约含 quota_cap_min;golden 更新(Linux 权威基线 quota_low/exhausted)。
- 文档: docs/free-quota-ad.html + 登记 docs/index.html。

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

client/lib/screens/connect_page.dart

@@ -11,6 +11,7 @@ import '../state/app_providers.dart';
 import '../state/connection_provider.dart';
 import '../state/nodes_provider.dart';
 import '../state/quota_provider.dart';
+import '../widgets/ad_reward_dialog.dart';
 import '../widgets/app_top_bar.dart';
 import '../widgets/connect_button.dart';
 import '../widgets/country_code.dart';
@@ -52,11 +53,18 @@ class ConnectPage extends ConsumerWidget {
       VpnPhase.on => t.capOn,
     };
 
+    // 免费额度耗尽:off 态连接键灰化不可点,点击弹加时(移动看广告 / 桌面升级)。
+    final isDesktop = context.formFactor == FormFactor.desktop;
+    final connectEnabled = !(isFree && quota.isExhausted && conn.phase == VpnPhase.off);
+    void onQuotaBlockedTap() => showQuotaAdFlow(context, ref, isDesktop: isDesktop);
+
     final button = ConnectButton(
       phase: conn.phase,
       elapsed: conn.elapsed,
       offLabel: t.connectNow,
       secureLabel: t.secure,
+      enabled: connectEnabled,
+      onDisabledTap: onQuotaBlockedTap,
       onTap: () => ref.read(connectionProvider.notifier).toggle(),
     );
 
@@ -75,7 +83,13 @@ class ConnectPage extends ConsumerWidget {
 
     final infoChildren = <Widget>[
       if (isFree)
-        QuotaCard(quota: quota, t: t, onWatchAd: () => ref.read(quotaProvider.notifier).watchAd()),
+        QuotaCard(
+          quota: quota,
+          t: t,
+          countdown: conn.freeCountdown,
+          isDesktop: isDesktop,
+          onWatchAd: onQuotaBlockedTap,
+        ),
       if (conn.phase == VpnPhase.on) _SpeedRow(t: t, down: down, up: up, latency: latencyValue),
       _CurrentNodeCard(t: t, node: node, smart: smart, pingLabel: pingLabel, showLabel: isWide, onTap: onOpenNodes),
     ];
@@ -100,6 +114,8 @@ class ConnectPage extends ConsumerWidget {
               offLabel: t.connectNow,
               secureLabel: t.secure,
               size: 176,
+              enabled: connectEnabled,
+              onDisabledTap: onQuotaBlockedTap,
               onTap: () => ref.read(connectionProvider.notifier).toggle(),
             ),
             const SizedBox(height: 24),
@@ -120,7 +136,13 @@ class ConnectPage extends ConsumerWidget {
               const SizedBox(height: 24),
               SizedBox(
                 width: 340,
-                child: QuotaCard(quota: quota, t: t, onWatchAd: () => ref.read(quotaProvider.notifier).watchAd()),
+                child: QuotaCard(
+                  quota: quota,
+                  t: t,
+                  countdown: conn.freeCountdown,
+                  isDesktop: isDesktop,
+                  onWatchAd: onQuotaBlockedTap,
+                ),
               ),
             ],
             if (conn.phase == VpnPhase.on) ...[