## Why

当前前端为单页面应用，仅有 Header + Content 的简单布局，无路由、无侧边栏，页面结构单一，无法支撑企业级 Admin 后台的多页面导航需求。作为 Bun 全栈应用模板，需要提供更完善的前端布局范例，便于使用者在此基础上扩展业务页面。

## What Changes

- 引入 React Router v7 (Declarative mode) 实现前端 SPA 路由
- 重构 Layout 为经典企业 Admin 后台布局：Header + 侧边栏 + 内容区
- 新增侧边栏菜单组件，支持折叠/展开，折叠状态持久化到 localStorage
- 新增多个示例页面（仪表盘、用户管理、系统设置、404）
- 将路由定义与菜单配置统一为单一数据源，保证两者同步
- 新增 `react-router` 依赖，Vite code splitting 单独分组

**BREAKING**: 原 `app.tsx` 的 Content 内容迁移至 Dashboard 页面；CSS 类名 `.dashboard-*` 变更为 `.app-*`

## Capabilities

### New Capabilities

- `frontend-routing`: 前端 SPA 路由能力，基于 React Router v7，支持多页面导航、路由匹配、404 处理
- `admin-layout`: 企业 Admin 后台布局能力，Header + 侧边栏 + 内容区，侧边栏可折叠

### Modified Capabilities

- `app-constants`: 新增 localStorage key `"sidebar.collapsed"` 用于持久化侧边栏折叠状态

## Impact

- 新增依赖：`react-router`
- 新增目录：`src/web/pages/`、`src/web/components/Sidebar/`
- 新增文件：`src/web/routes.tsx`、`src/web/menu.tsx`、`src/web/hooks/use-sidebar-collapsed.ts`
- 修改文件：`src/web/app.tsx`（重构 Layout）、`src/web/main.tsx`（+ BrowserRouter）、`src/web/styles.css`（布局样式重写）
- 修改配置：`vite.config.ts`（code splitting 新增 vendor-router 组）
- 更新文档：`DEVELOPMENT.md`、`README.md`
- 新增测试：Sidebar 组件测试、各页面测试、test-utils 增强
- 后端无需改动（SPA fallback 已支持）