修改架构，移动端优先。

save

src/App.jsx

@@ -0,0 +1,40 @@
+import { Routes, Route, Navigate, useLocation } from 'react-router-dom'
+import MobileShell from './layouts/MobileShell.jsx'
+import LoginPage from './pages/LoginPage.jsx'
+import HomePage from './pages/HomePage.jsx'
+import MacroPage from './pages/MacroPage.jsx'
+import MonitorPage from './pages/MonitorPage.jsx'
+import MePage from './pages/MePage.jsx'
+import { useAuth } from './auth/AuthContext.jsx'
+
+// 已登录访问 /login 自动回首页
+function RedirectIfAuthed({ children }) {
+  const { user, loading } = useAuth()
+  if (loading) return null
+  if (user) return <Navigate to="/" replace />
+  return children
+}
+
+// 未登录访问受保护页面 → 跳 /login
+function RequireAuth({ children }) {
+  const { user, loading } = useAuth()
+  const location = useLocation()
+  if (loading) return <div className="page-loading">加载中...</div>
+  if (!user) return <Navigate to="/login" state={{ from: location }} replace />
+  return children
+}
+
+export default function App() {
+  return (
+    <Routes>
+      <Route path="/login" element={<RedirectIfAuthed><LoginPage /></RedirectIfAuthed>} />
+      <Route element={<RequireAuth><MobileShell /></RequireAuth>}>
+        <Route path="/" element={<HomePage />} />
+        <Route path="/macro/*" element={<MacroPage />} />
+        <Route path="/monitor" element={<MonitorPage />} />
+        <Route path="/me" element={<MePage />} />
+      </Route>
+      <Route path="*" element={<Navigate to="/" replace />} />
+    </Routes>
+  )
+}