diff --git a/app/globals.css b/app/globals.css
index e45d922..45dd6d1 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -6,8 +6,8 @@
 @theme inline {
   --color-background: var(--background);
   --color-foreground: var(--foreground);
-  --font-sans: var(--font-geist-sans);
-  --font-mono: var(--font-geist-mono);
+  --font-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
   --color-sidebar-ring: var(--sidebar-ring);
   --color-sidebar-border: var(--sidebar-border);
   --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
@@ -43,6 +43,19 @@
   --radius-xl: calc(var(--radius) + 4px);
 }
 
+/* Add font classes for Inter and Manrope fallbacks */
+.font-inter {
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+}
+
+.font-manrope {
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+}
+
+.font-system {
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+}
+
 :root {
   --radius: 0.625rem;
   --background: oklch(1 0 0);
diff --git a/app/layout.tsx b/app/layout.tsx
index 136387f..97bd863 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -4,29 +4,14 @@ import { Toaster } from "@/components/ui/sonner";
 import { AuthProvider } from "@/contexts/auth-context";
 import { FontProvider } from "@/contexts/font-context";
 import type { Metadata } from "next";
-import { Geist, Geist_Mono, Inter, Manrope } from "next/font/google";
 import NextToploader from "nextjs-toploader";
 import "./globals.css";
 
-const geistSans = Geist({
-  variable: "--font-geist-sans",
-  subsets: ["latin"],
-});
-
-const geistMono = Geist_Mono({
-  variable: "--font-geist-mono",
-  subsets: ["latin"],
-});
-
-const inter = Inter({
-  variable: "--font-inter",
-  subsets: ["latin"],
-});
-
-const manrope = Manrope({
-  variable: "--font-manrope",
-  subsets: ["latin"],
-});
+// Use system fonts instead of Google fonts to avoid Turbopack issues
+const geistSans = { variable: "--font-geist-sans" };
+const geistMono = { variable: "--font-geist-mono" };
+const inter = { variable: "--font-inter" };
+const manrope = { variable: "--font-manrope" };
 
 export const metadata: Metadata = {
   title: "Shadcn Admin",
diff --git a/app/page.tsx b/app/page.tsx
index 6be5aae..6097168 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,6 +1,74 @@
-import { redirect } from "next/navigation";
+"use client";
+
+import { useAuth } from "@/contexts/auth-context";
+import { Button } from "@/components/ui/button";
+import { Card } from "@/components/ui/card";
+import { redirect, useRouter } from "next/navigation";
+import { useEffect } from "react";
 
-// Redirect to dashboard - middleware will handle authentication
 export default function Home() {
-  redirect("/dashboard");
+  const { isAuthenticated, isLoading } = useAuth();
+  const router = useRouter();
+
+  useEffect(() => {
+    if (!isLoading && isAuthenticated) {
+      redirect("/dashboard");
+    }
+  }, [isAuthenticated, isLoading]);
+
+  if (isLoading) {
+    return (
+      <div className="flex items-center justify-center min-h-screen">
+        <div className="animate-spin rounded-full h-12 w-12 border-b-2 border-primary"></div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex items-center justify-center min-h-screen bg-background">
+      <Card className="w-full max-w-3xl p-8 md:p-12">
+        <div className="text-center space-y-6">
+          <div className="space-y-2">
+            <h1 className="text-4xl font-bold tracking-tight">Shadcn Admin</h1>
+            <p className="text-muted-foreground text-lg">
+              Production-ready admin dashboard powered by Next.js, Shadcn/UI and Better-Auth
+            </p>
+          </div>
+          
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+            <div className="space-y-2">
+              <h3 className="text-lg font-semibold">Core Technology</h3>
+              <ul className="text-muted-foreground space-y-1">
+                <li>• Next.js 14 with App Router</li>
+                <li>• Shadcn/UI components</li>
+                <li>• Tailwind CSS</li>
+                <li>• PostgreSQL database</li>
+                <li>• Better-Auth authentication</li>
+              </ul>
+            </div>
+            
+            <div className="space-y-2">
+              <h3 className="text-lg font-semibold">Key Features</h3>
+              <ul className="text-muted-foreground space-y-1">
+                <li>• User authentication flows</li>
+                <li>• Interactive charts and data tables</li>
+                <li>• Dark/light theme support</li>
+                <li>• Responsive design</li>
+                <li>• Customizable appearance</li>
+              </ul>
+            </div>
+          </div>
+          
+          <div className="pt-4">
+            <Button 
+              onClick={() => router.push("/sign-in")}
+              className="w-full md:w-auto"
+            >
+              登录后台
+            </Button>
+          </div>
+        </div>
+      </Card>
+    </div>
+  );
 }