Konto-Seite: eigenen Namen, E-Mail, Passwort und Passkeys selbst verwalten

- Klick auf den Benutzernamen im Header (Kantinen- und Admin-Bereich)
  öffnet /konto
- Name-Änderung per RLS-Policy mit spaltenscharfem Grant (nur
  full_name), Rolle bleibt ausschließlich über die Admin-API änderbar
- E-Mail-Änderung über supabase.auth.updateUser mit Bestätigungslink;
  Trigger synchronisiert profiles.email nach Bestätigung
- Passwortänderung verlangt zur Verifizierung das aktuelle Passwort
  (Re-Login-Check) plus Wiederholung des neuen Passworts
- Passkey-Verwaltung aus /intern/konto hierher verschoben

app/admin/layout.tsx

@@ -40,9 +40,9 @@ export default async function AdminLayout({
             </Link>
           </nav>
           <div className="ml-auto flex items-center gap-3 text-sm">
-            <span className="text-white/70">
+            <Link href="/konto" className="text-white/70 hover:underline">
               {profile.full_name || user.email}
-            </span>
+            </Link>
             <form action="/logout" method="post">
               <button type="submit" className="btn btn-del">
                 Abmelden

app/intern/konto/page.tsx

@@ -1,5 +0,0 @@
-import PasskeyManager from "@/components/PasskeyManager";
-
-export default function KontoPage() {
-  return <PasskeyManager />;
-}

app/intern/layout.tsx

@@ -35,9 +35,6 @@ export default async function InternLayout({
             <Link href="/intern/kennzeichnung" className="hover:underline">
               Allergene &amp; Zusatzstoffe
             </Link>
-            <Link href="/intern/konto" className="hover:underline">
-              Passkeys
-            </Link>
             {profile.role === "admin" && (
               <Link href="/admin" className="hover:underline">
                 Verwaltung
@@ -48,9 +45,9 @@ export default async function InternLayout({
             </Link>
           </nav>
           <div className="ml-auto flex items-center gap-3 text-sm">
-            <span className="text-white/70">
+            <Link href="/konto" className="text-white/70 hover:underline">
               {profile.full_name || user.email}
-            </span>
+            </Link>
             <form action="/logout" method="post">
               <button type="submit" className="btn btn-del">
                 Abmelden

app/konto/page.tsx

@@ -0,0 +1,44 @@
+import { redirect } from "next/navigation";
+import Link from "next/link";
+import { createClient } from "@/lib/supabase/server";
+import AccountManager from "@/components/AccountManager";
+
+export default async function KontoPage() {
+  const supabase = await createClient();
+  const {
+    data: { user },
+  } = await supabase.auth.getUser();
+  if (!user) redirect("/login");
+
+  const { data: profile } = await supabase
+    .from("profiles")
+    .select("role, full_name")
+    .eq("id", user.id)
+    .single();
+  if (!profile || !["staff", "admin"].includes(profile.role)) redirect("/");
+
+  return (
+    <div className="flex-1 flex flex-col">
+      <header className="bg-[var(--c-primary-dark)] text-white">
+        <div className="max-w-[1600px] mx-auto w-full px-4 py-3 flex flex-wrap items-center gap-x-5 gap-y-2">
+          <span className="font-bold">Mein Konto</span>
+          <nav className="ml-auto flex flex-wrap gap-x-4 gap-y-1 text-sm">
+            <Link
+              href={profile.role === "admin" ? "/admin" : "/intern"}
+              className="hover:underline"
+            >
+              ← Zurück
+            </Link>
+          </nav>
+        </div>
+      </header>
+      <main className="max-w-[1600px] mx-auto w-full px-4 py-6 flex-1">
+        <AccountManager
+          role={profile.role}
+          initialFullName={profile.full_name ?? ""}
+          initialEmail={user.email ?? ""}
+        />
+      </main>
+    </div>
+  );
+}