feat: enhance query view with fullscreen toggle and details management

- Added fullscreen toggle functionality to the QueryView component.
- Introduced new icons for maximizing and minimizing the view.
- Updated the QueryView component to handle details display with tab management.
- Refactored the store to manage details data and active tabs.
- Improved the handling of view data in the studio, including filtering unnecessary fields.
- Created new routes for ID and console views, integrating them into the routing structure.
- Added dynamic basename calculation based on the current URL path.
- Enhanced the query module to utilize context keys for better state management.
- Updated the UI components for better user experience and accessibility.

web/AGENTS.md

@@ -45,4 +45,11 @@ pages/page-app/
 - **react-hook-form**: 表单处理
 - **sonner**: Toast 通知
 - **zustand**: 状态管理
-- **tailwindcss v4**: 使用 @tailwindcss/vite 插件进行样式处理
+- **tailwindcss v4**: 使用 @tailwindcss/vite 插件进行样式处理
+
+## 主题系统
+
+- **主题配色**: 采用黑白配色方案，提供简洁优雅的视觉体验
+- **主题模式**: 支持 light（浅色）和 dark（深色）模式切换
+- **主题实现**: 使用 `next-themes` 进行主题管理
+- **CSS 变量**: 主题相关的 CSS 变量定义在 `src/styles/theme.css` 中