feat: frontend 架构基座（横切层 + 接通 tailwind）

- 横切层：utils/logger（统一日志，禁 console.log）、services/wsClient（通用 WS 客户端）、
  components/ErrorBoundary（错误边界）；main.tsx 接 ErrorBoundary + Toaster
- 接通 tailwind：补 tailwind.config.js + postcss.config.js + @tailwind 指令
  （此前 tailwindcss/postcss/autoprefixer 是悬空依赖，无配置）
- vite-env.d.ts：VITE_ 环境变量类型（按 include_backend 渲染）
- App.tsx 改用 tailwind utility class（规则禁自定义 CSS）
- 验证：build/lint/typecheck 三门禁全过

至此三服务架构基座完成：copier 预生成横切层，每个生成项目第一天即结构完整、能跑、过门禁。

template/frontend/src/components/ErrorBoundary.tsx

@@ -0,0 +1,26 @@
+import { Component, type ErrorInfo, type ReactNode } from "react";
+
+import { logger } from "../utils/logger";
+
+type Props = { children: ReactNode };
+type State = { hasError: boolean };
+
+// 组件级错误边界：捕获渲染异常，记录日志并展示兜底 UI。
+export class ErrorBoundary extends Component<Props, State> {
+  state: State = { hasError: false };
+
+  static getDerivedStateFromError(): State {
+    return { hasError: true };
+  }
+
+  componentDidCatch(error: Error, info: ErrorInfo): void {
+    logger.error("component error", { message: error.message, info });
+  }
+
+  render(): ReactNode {
+    if (this.state.hasError) {
+      return <div className="p-8 text-red-600">页面出错了，请刷新重试。</div>;
+    }
+    return this.props.children;
+  }
+}