feat: add mobile tab bar navigation

src/app/globals.css

@@ -1102,3 +1102,19 @@
 .icon-container-brand:hover {
   box-shadow: 0 4px 12px rgba(196, 30, 58, 0.15);
 }
+
+/* 移动端安全区域适配 */
+.safe-area-inset-bottom {
+  padding-bottom: env(safe-area-inset-bottom, 0px);
+}
+
+/* 隐藏移动端底部导航栏时的页面底部间距 */
+body {
+  padding-bottom: 0;
+}
+
+@media (max-width: 767px) {
+  body {
+    padding-bottom: 64px;
+  }
+}

src/app/layout.tsx

@@ -4,6 +4,7 @@ import "./globals.css";
 import { ThemeProvider } from "@/contexts/theme-context";
 import { WebVitals } from "@/components/analytics/web-vitals";
 import { OrganizationSchema, WebsiteSchema } from "@/components/seo/structured-data";
+import { MobileTabBar } from "@/components/layout/mobile-tab-bar";
 
 const geistSans = Geist({
   variable: "--font-geist-sans",
@@ -145,6 +146,7 @@ export default function RootLayout({
         <ThemeProvider>
           {children}
         </ThemeProvider>
+        <MobileTabBar />
       </body>
     </html>
   );