feat(client): 系统设置角色徽章 → StatusPill + 系统参数 Tab golden

- _RoleBadge（超管/管理员/操作员/只读）硬编码 FCE4EC/E3F2FD/E8F5E9/F5F5F5
  → StatusPill（danger/primary/success/muted + 对应软底，走 token）
- 系统参数 Tab golden ×三主题：锁住外观主题选择器三色板微缩预览 + 参数卡
- 残留 0xFF0F3057 为品牌标识色（--brand-deep，主题无关），保留

analyze 0 error.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01TSKEiHsvauyxYUW2itzUXX

client/lib/screens/settings/settings_screen.dart

@@ -16,6 +16,7 @@ import '../../core/theme/context_tokens.dart';
 import '../../core/theme/app_tokens.dart';
 import '../../core/theme/app_tokens.g.dart';
 import '../../core/theme/theme_controller.dart';
+import '../../widgets/kpi_card.dart';
 import '../../models/number_rule.dart';
 import '../../models/user.dart';
 import '../../providers/license_provider.dart';
@@ -1112,30 +1113,14 @@ class _RoleBadge extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final Color bg;
-    final Color fg;
-    switch (role) {
-      case '超级管理员':
-        bg = const Color(0xFFFCE4EC);
-        fg = context.tokens.danger;
-        break;
-      case '管理员':
-        bg = const Color(0xFFE3F2FD);
-        fg = context.tokens.primary;
-        break;
-      case '操作员':
-        bg = const Color(0xFFE8F5E9);
-        fg = context.tokens.success;
-        break;
-      default:
-        bg = const Color(0xFFF5F5F5);
-        fg = context.tokens.muted;
-    }
-    return Container(
-      padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
-      decoration: BoxDecoration(color: bg, borderRadius: BorderRadius.circular(3)),
-      child: Text(role, style: TextStyle(color: fg, fontSize: 12, fontWeight: FontWeight.w500)),
-    );
+    final t = context.tokens;
+    final (Color fg, Color bg) = switch (role) {
+      '超级管理员' => (t.danger, t.dangerBg),
+      '管理员' => (t.primary, t.infoSoft),
+      '操作员' => (t.success, t.okSoft),
+      _ => (t.muted, t.infoSoft),
+    };
+    return StatusPill(label: role, color: fg, background: bg);
   }
 }
 

client/test/golden/settings_golden_test.dart

@@ -0,0 +1,25 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:shared_preferences/shared_preferences.dart';
+import 'package:jiu_client/core/auth/auth_state.dart';
+import 'package:jiu_client/screens/settings/settings_screen.dart';
+
+import '../support/golden_harness.dart';
+
+/// design-distill 阶段4：系统设置「系统参数」Tab golden × 三主题。
+/// 验证外观主题选择器（三色板微缩预览）+ 参数卡随主题换色。
+/// （该 Tab 走本地 state，无需 mock 业务 provider。）
+/// 更新基准：flutter test --update-goldens test/golden/settings_golden_test.dart
+void main() {
+  TestWidgetsFlutterBinding.ensureInitialized();
+  SharedPreferences.setMockInitialValues({});
+
+  goldenAcrossThemes(
+    'settings 系统参数 Tab',
+    goldenPrefix: 'settings_params',
+    child: () => const Scaffold(body: SettingsScreen(initialTab: 3)),
+    overrides: () => [isReadonlyProvider.overrideWithValue(false)],
+    logical: const Size(1280, 1000),
+  );
+}