UX/UI/perf pass: admin tabs, theme toggle, log polish, mod search, JAR cache

- Admin page split into tabs (Server/Players/Chat/Mods/Backups/Logs) with
  hash + localStorage persistence; inactive tabs no longer mount.
- Log viewer: level color-coding, search, level filter chips, auto-scroll
  toggle, copy button, visible-line count.
- Installed mods list: search field + side filter (all/both/server/client)
  with live count; public ModList gets skeleton + empty states and search.
- Theme toggle with no-flash inline init, localStorage + system preference.
- Layout: full OG / Twitter metadata, title template, keywords,
  dual-theme themeColor, metadataBase.
- lib/mods.ts: per-jar mtime+size parse cache (cold 6s -> warm ~45ms on
  /api/mods for the full mod list); cache eviction on mod removal.
- ChatBridge polling eased 3s -> 5s with 2s stale window.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

app/admin/page.tsx

@@ -1,14 +1,7 @@
 import { auth } from "@/lib/auth";
 import { redirect } from "next/navigation";
 import { Navbar } from "@/components/Navbar";
-import { ClientOnly } from "@/components/ClientOnly";
-import { ServerControls } from "@/components/ServerControls";
-import { Analytics } from "@/components/Analytics";
-import { PlayerManager } from "@/components/PlayerManager";
-import { ChatBridge } from "@/components/ChatBridge";
-import { ModManager } from "@/components/ModManager";
-import { BackupManager } from "@/components/BackupManager";
-import { LogViewer } from "@/components/LogViewer";
+import { AdminTabs } from "@/components/AdminTabs";
 import Link from "next/link";
 
 export default async function AdminPage() {
@@ -28,26 +21,18 @@ export default async function AdminPage() {
         </div>
       </div>
 
-      <ClientOnly>
-        <div className="max-w-5xl mx-auto px-3 py-4 sm:p-6 space-y-4 sm:space-y-6 w-full overflow-x-hidden">
-          <ServerControls />
-          <Analytics />
-          <PlayerManager />
-          <ChatBridge />
-          <ModManager />
-          <BackupManager />
-          <LogViewer />
+      <div className="max-w-5xl mx-auto px-3 py-4 sm:p-6 w-full overflow-x-hidden">
+        <AdminTabs />
 
-          <div className="text-center">
-            <Link
-              href="/"
-              className="text-sm text-muted-foreground hover:text-foreground transition"
-            >
-              Back to dashboard
-            </Link>
-          </div>
+        <div className="text-center mt-6">
+          <Link
+            href="/"
+            className="text-sm text-muted-foreground hover:text-foreground transition"
+          >
+            Back to dashboard
+          </Link>
         </div>
-      </ClientOnly>
+      </div>
     </>
   );
 }

app/layout.tsx

@@ -13,28 +13,68 @@ const geistMono = Geist_Mono({
   subsets: ["latin"],
 });
 
+const SITE_URL = "https://minecraft.hurkicorgi.com";
+const SITE_TITLE = "HurkiCorgi MC";
+const SITE_DESCRIPTION =
+  "Modded Minecraft Forge 1.20.1 server — Create & Engineering, Raids, Survival. Live status, mod list, and installer.";
+
 export const metadata: Metadata = {
-  title: "HurkiCorgi MC",
-  description: "Create & Engineering | Raids | Survival - Minecraft Server",
+  metadataBase: new URL(SITE_URL),
+  title: {
+    default: SITE_TITLE,
+    template: `%s · ${SITE_TITLE}`,
+  },
+  description: SITE_DESCRIPTION,
   manifest: "/manifest.json",
+  applicationName: SITE_TITLE,
+  keywords: ["Minecraft", "Forge", "Create mod", "modded server", "HurkiCorgi"],
   appleWebApp: {
     capable: true,
     statusBarStyle: "black-translucent",
-    title: "HurkiCorgi MC",
+    title: SITE_TITLE,
   },
   icons: {
     icon: "/icon.svg",
     apple: "/icon.svg",
   },
+  openGraph: {
+    type: "website",
+    url: SITE_URL,
+    title: SITE_TITLE,
+    description: SITE_DESCRIPTION,
+    siteName: SITE_TITLE,
+    images: [{ url: "/icon.svg", width: 512, height: 512, alt: SITE_TITLE }],
+  },
+  twitter: {
+    card: "summary",
+    title: SITE_TITLE,
+    description: SITE_DESCRIPTION,
+    images: ["/icon.svg"],
+  },
+  robots: { index: true, follow: true },
 };
 
 export const viewport: Viewport = {
   width: "device-width",
   initialScale: 1,
   maximumScale: 1,
-  themeColor: "#1a1a2e",
+  themeColor: [
+    { media: "(prefers-color-scheme: dark)", color: "#1a1a2e" },
+    { media: "(prefers-color-scheme: light)", color: "#f8fafc" },
+  ],
 };
 
+const themeInit = `
+try {
+  var s = localStorage.getItem('theme');
+  var m = window.matchMedia('(prefers-color-scheme: light)').matches;
+  var t = s || (m ? 'light' : 'dark');
+  var h = document.documentElement;
+  h.classList.add(t);
+  h.style.colorScheme = t;
+} catch (e) { document.documentElement.classList.add('dark'); }
+`;
+
 export default function RootLayout({
   children,
 }: Readonly<{
@@ -43,8 +83,12 @@ export default function RootLayout({
   return (
     <html
       lang="en"
-      className={`dark ${geistSans.variable} ${geistMono.variable} h-full antialiased`}
+      className={`${geistSans.variable} ${geistMono.variable} h-full antialiased`}
+      suppressHydrationWarning
     >
+      <head>
+        <script dangerouslySetInnerHTML={{ __html: themeInit }} />
+      </head>
       <body className="min-h-full flex flex-col overflow-x-hidden">
         <Providers>
           <div className="flex flex-col flex-1 w-full overflow-x-hidden">