Frontend: Account-Bereich (GET /user/info, POST /user/delete)

- Account-Section nur sichtbar wenn eingeloggt; zeigt Nutzername und
  Mitglied-seit-Datum aus /user/info
- Konto loeschen in aufklappbarer Danger-Zone, Passwortbestaetigung
  plus zusaetzliche confirm()-Rueckfrage (unwiderruflich)
- nach Loeschung zurueck zur Login-Ansicht via refreshHeader

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

web/css/app.css

@@ -74,6 +74,12 @@ button:hover { opacity: 0.9; }
 .msg { color: #ff6b6b; font-size: 0.9rem; min-height: 1.2em; }
 .switch { color: var(--muted); font-size: 0.9rem; margin: 0.6rem 0 0; }
 .switch a { color: var(--accent); }
+
+#account-info { color: var(--muted); font-size: 0.9rem; }
+.danger summary { cursor: pointer; color: #ff6b6b; font-size: 0.9rem; }
+.danger form { margin-top: 0.6rem; }
+.danger p { color: var(--muted); font-size: 0.85rem; }
+#delete-form button { background: #c0392b; border-color: #c0392b; }
 .end { text-align: center; color: var(--muted); padding: 2rem 0; }
 
 .interactions {

web/index.html

@@ -46,6 +46,20 @@
       <p class="msg" id="entry-msg"></p>
     </section>
 
+    <!-- Konto -->
+    <section id="account" hidden>
+      <p id="account-info"></p>
+      <details class="danger">
+        <summary>Konto löschen</summary>
+        <form id="delete-form">
+          <p>Löscht dein Konto samt Beiträgen und Votes unwiderruflich.</p>
+          <input name="pass1" type="password" placeholder="Passwort bestätigen" autocomplete="current-password">
+          <button type="submit">Konto endgültig löschen</button>
+        </form>
+        <p class="msg" id="delete-msg"></p>
+      </details>
+    </section>
+
     <!-- Feed -->
     <section id="feed"></section>
     <div id="sentinel"></div>

web/js/app.js

@@ -25,6 +25,7 @@ async function refreshHeader() {
   const bar = document.getElementById("headerbar");
   document.getElementById("auth-box").hidden = loggedIn;
   document.getElementById("compose").hidden = !loggedIn;
+  document.getElementById("account").hidden = !loggedIn;
 
   if (loggedIn) {
     bar.innerHTML = `<button id="logout-btn">Logout</button>`;
@@ -32,12 +33,32 @@ async function refreshHeader() {
       await api.get("/auth/logout");
       await refreshHeader();
     });
+    loadAccount();
   } else {
     bar.innerHTML = "";
     showAuth("login");
   }
 }
 
+async function loadAccount() {
+  const info = await api.get("/user/info");
+  const since = new Date(info.created_at * 1000).toLocaleDateString("de-DE");
+  document.getElementById("account-info").textContent =
+    `Angemeldet als ${info.username} · Mitglied seit ${since}`;
+}
+
+document.getElementById("delete-form").addEventListener("submit", async (e) => {
+  e.preventDefault();
+  if (!confirm("Konto wirklich unwiderruflich löschen?")) return;
+  const res = await api.post("/user/delete", new FormData(e.target));
+  if (res.ok) {
+    await refreshHeader();
+  } else {
+    document.getElementById("delete-msg").textContent =
+      res.data.error || "Löschen fehlgeschlagen.";
+  }
+});
+
 // --- Login / Registrierung ---
 const loginForm = document.getElementById("login-form");
 const registerForm = document.getElementById("register-form");