feat(ui): Dark-Glassmorphism-Designsystem und Grundlayout

Optischer Rahmen der Anwendung:

- Hintergrund aus drei langsam driftenden Nebeln, feinem Raster und einer
  Rauschtextur gegen Farbbanding
- .glass / .glass-soft als Grundflaechen, .card-glow fuer den Hover-Effekt
  mit Farbverlaufsrand je Projektakzent
- Buttons, Formularfelder und Scrollbars im gleichen Stil
- prefers-reduced-motion schaltet saemtliche Animationen ab

Dazu Kopfzeile mit aktiver Navigationsmarkierung, ein wiederverwendbarer
Modal-Dialog (Escape schliesst, Scroll wird gesperrt), das SVG-Icon sowie
Fehler- und 404-Seiten. Die Fehlerseite erkennt Datenbankprobleme und nennt
direkt die drei Befehle, die in dem Fall meistens helfen.

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

src/app/layout.tsx

@@ -0,0 +1,51 @@
+import type { Metadata, Viewport } from "next";
+import { TopNav } from "@/components/TopNav";
+import "./globals.css";
+
+export const metadata: Metadata = {
+  title: {
+    default: "Nebula – Vibe Coding Dashboard",
+    template: "%s · Nebula",
+  },
+  description:
+    "Uebersicht ueber alle Vibe-Coding Projekte: Status, Notizen und Live-Daten aus GitHub, GitLab und Gitea.",
+  applicationName: "Nebula",
+};
+
+export const viewport: Viewport = {
+  themeColor: "#05060f",
+  width: "device-width",
+  initialScale: 1,
+};
+
+export default function RootLayout({
+  children,
+}: Readonly<{ children: React.ReactNode }>) {
+  return (
+    <html lang="de" suppressHydrationWarning>
+      <body className="min-h-screen antialiased">
+        <div className="aurora" aria-hidden="true">
+          <div className="aurora-blob aurora-blob--one" />
+          <div className="aurora-blob aurora-blob--two" />
+          <div className="aurora-blob aurora-blob--three" />
+        </div>
+        <div className="aurora-grid" aria-hidden="true" />
+
+        <TopNav />
+
+        <main className="mx-auto w-full max-w-[1400px] px-4 pb-24 pt-6 sm:px-6 lg:px-8">
+          {children}
+        </main>
+
+        <footer className="mx-auto w-full max-w-[1400px] px-4 pb-10 text-xs text-slate-500 sm:px-6 lg:px-8">
+          <div className="flex flex-wrap items-center justify-between gap-2 border-t border-white/5 pt-6">
+            <span>
+              Nebula · lokal betrieben, Daten bleiben in deiner PostgreSQL.
+            </span>
+            <span className="font-mono text-slate-600">v0.1.0</span>
+          </div>
+        </footer>
+      </body>
+    </html>
+  );
+}