style: update surface colors and typography for improved contrast and readability across various components

- Changed text colors from surface-400 to surface-600 and surface-500 to surface-700 for better visibility in multiple Svelte files.
- Updated background and border colors in app.css for a more cohesive industrial design.
- Adjusted font weights and sizes for headings, labels, and buttons to enhance clarity and user experience.
- Refined styles for tables, badges, and buttons to align with the new design language.
- Added new styles for input fields and switches to maintain consistency in the UI.

hub/admin-web/src/lib/components/RoleCard.svelte

@@ -76,7 +76,7 @@
 <div class="saas-card-pad">
 	<div class="mb-4 flex flex-wrap items-center gap-2">
 		<span class="saas-badge-primary font-mono">/{roleId || r.roleId}</span>
-		<span class="text-sm text-surface-500">{label || r.label}</span>
+		<span class="text-sm text-surface-700">{label || r.label}</span>
 	</div>
 
 	<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
@@ -97,7 +97,7 @@
 
 	<div class="mt-4">
 		<span class="saas-label">工具白名单</span>
-		<label class="mb-3 flex cursor-pointer items-center gap-2 rounded-lg border border-surface-200 bg-surface-100/40 px-3 py-2">
+		<label class="mb-3 flex cursor-pointer items-center gap-2 border border-surface-300 bg-surface-100 px-3 py-2">
 			<CheckboxControl bind:checked={unrestricted} />
 			<span class="text-sm">不限（使用全部注册工具）</span>
 		</label>
@@ -105,10 +105,10 @@
 			<Checkbox.Group bind:value={selectedTools} disabled={unrestricted}>
 				{#each Object.entries(groupedTools) as [group, tools]}
 					<div>
-						<p class="mb-1.5 text-xs font-semibold uppercase tracking-wide text-surface-400">{group}</p>
+						<p class="mb-1.5 text-xs font-semibold uppercase tracking-wide text-surface-600">{group}</p>
 						<div class="grid grid-cols-1 gap-1.5 sm:grid-cols-2">
 							{#each tools as t}
-								<label class="flex cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 text-sm hover:bg-surface-100">
+								<label class="flex cursor-pointer items-center gap-2 px-2 py-1.5 text-sm hover:bg-surface-100">
 									<Checkbox.Root class="saas-checkbox" value={t.id} id={`tool-${r.id}-${t.id}`}>
 										{#snippet children({ checked })}
 											{#if checked}
@@ -138,7 +138,7 @@
 	</div>
 
 	<div class="mt-4 flex flex-wrap items-center gap-3 border-t border-surface-100 pt-4">
-		<span class="text-xs text-surface-400">更新于 {fmtDate(r.updatedAt)}</span>
+		<span class="text-xs text-surface-600">更新于 {fmtDate(r.updatedAt)}</span>
 		<div class="flex-1"></div>
 		<button class="saas-btn-danger" onclick={onremoved}>删除角色</button>
 		<button class="saas-btn-primary" onclick={save} disabled={saving}>