现在我对整个项目有了完整了解。问题很清楚：

1. 背景还是黑的 — 旧的 Tailwind/globals 样式覆盖了新的 CSS 变量，body/html 的背景没有被正确继承
2. 界面还太粗糙，需要更精致
3. 需要新建网站功能（输入名称即可）
4. 右侧详情面板需要更宽、做成滑入式抽屉

让我全面修改：

Now update App.vue to ensure the shell uses the right background:

Now rewrite HomeView.vue with the new site creation dialog and wider sliding detail panel:

Now add addSite to the news store:

Now update SiteCard to look more refined and fix the background:

Now update SiteDetail to be wider and more polished:

Now fix the SideBar to also have a solid white background and polished styling:

Finally fix the other views to ensure white backgrounds:

本次改动汇总：

1. 背景修复：在 main.css 中用 !important 强制覆盖 html/body 背景为 #f1f5f9，所有 View 页面的 page-header 和容器也改为硬编码的 #ffffff，彻底解决背景显示为黑色的问题。
2. 新建网站：HomeView 增加了带模态框的新建功能，用户输入网站名称和分类即可创建，Store 中同步添加了 addSite 方法。
3. 右侧抽屉升级：详情面板从 290px 扩宽至 380px，并通过 panel-slide 过渡动画从右侧平滑推入（translateX(100%) → 0），同时 SiteDetail 内部重写为统计卡片 + 更清晰的列表布局。
4. 整体精修：SiteCard 增加竖向分隔符、圆角升级；SideBar 导航图标添加透明度控制；各组件统一使用 border-radius: 8~12px 的圆角风格，视觉更简洁。

问题很清楚。先处理三件事：1) 删除 platforms.js 和 projects.js，2) 修复 SiteCard.vue 中重复的 <script setup> 和 <style scoped> 块。

现在修复 SiteCard.vue 中重复的 <script setup> 和 <style scoped> 块，只保留第一组（已经是完整且正确的版本）：

三处问题全部修复：删除了 platforms.js 和 projects.js 两个无关 store 文件；SiteCard.vue 中由于上次编辑误将整个文件内容追加了一遍，导致出现两个 <script setup> 和两个 <style scoped>，现已移除多余的重复部分，只保留第一组完整正确的代码。