refactor: 全面重构前端样式，消除内联 style 和硬编码色值，统一 TDesign 规范

- 重写 styles.css：CSS 变量化可用率色阶、状态色类、工具类、安全选择器
- 组件改造：StatusDot/StatusBar/TargetDetailDrawer/GroupHeader 等改用 CSS 类和 Typography
- color-threshold 移除 getLatencyColor 死代码，保留 getAvailabilityProgressColor 返回 CSS 变量
- target-table-columns 状态列和延迟列切换为 CSS 类
- 新增 css-utility-classes spec，更新 4 个 main specs（probe/card/table/drawer）
- README 和 config.yaml 写入前端样式开发规范

src/web/constants/color-threshold.ts

@@ -1,24 +1,4 @@
-const AVAILABILITY_COLORS = [
-  "#d54941", // 0-10%
-  "#d96241", // 10-20%
-  "#e37318", // 20-30%
-  "#e89318", // 30-40%
-  "#d9a818", // 40-50%
-  "#b8b020", // 50-60%
-  "#8dba30", // 60-70%
-  "#6dba3f", // 70-80%
-  "#4dba50", // 80-90%
-  "#3dba60", // 90-100%
-];
-
 export function getAvailabilityProgressColor(availability: number): string {
   const index = Math.min(Math.floor(availability / 10), 9);
-  return AVAILABILITY_COLORS[index]!;
-}
-
-
-export function getLatencyColor(ms: number): string {
-  if (ms <= 100) return "var(--td-success-color)";
-  if (ms <= 500) return "var(--td-warning-color)";
-  return "var(--td-error-color)";
+  return `var(--avail-${index})`;
 }