feat(ui): Markdown in Beschreibung und Notizen

Bisher wurde alles als reiner Text ausgegeben. Jetzt werden Ueberschriften,
Listen, Tabellen, Codebloecke, Zitate und Links dargestellt, und aus
"- [ ] Aufgabe" werden echte Checklisten.

Sicherheitsrelevant: der Inhalt stammt vom Benutzer. Ohne rehype-sanitize
waere das ein XSS-Loch, sobald jemand rohes HTML in eine Notiz schreibt. Das
Standardschema erlaubt nur harmlose Elemente; ergaenzt wird nur, was fuer
Aufgabenlisten und Sprachklassen an Codebloecken noetig ist. Links bekommen
zusaetzlich target=_blank mit noopener und nofollow.

Die Formatierung steht in components.css: Tailwinds Preflight setzt alle
Abstaende und Schriftgroessen zurueck, Ueberschriften und Listen brauchen
also wieder Form.

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

src/components/NotesPanel.tsx

@@ -4,6 +4,7 @@ import { useState } from "react";
 import { useRouter } from "next/navigation";
 import { Loader2, NotebookPen, Pencil, Pin, PinOff, Plus, Trash2, X } from "lucide-react";
 import type { Note } from "@prisma/client";
+import { Markdown } from "@/components/Markdown";
 import { cn, formatDateTime, formatRelative } from "@/lib/utils";
 
 /** Nur als "bearbeitet" zaehlen, wenn wirklich spaeter geaendert wurde. */
@@ -118,7 +119,7 @@ export function NotesPanel({ projectId, notes }: { projectId: string; notes: Not
           />
           <textarea
             className="field min-h-32 resize-y font-mono text-[13px] leading-relaxed"
-            placeholder="Gedanken, Todos, Snippets… Zeilenumbrueche bleiben erhalten."
+            placeholder={"Gedanken, Todos, Snippets…\n\nMarkdown wird dargestellt:\n- [ ] offene Aufgabe\n**fett**, `code`, [Link](https://…)"}
             value={content}
             onChange={(event) => setContent(event.target.value)}
             autoFocus
@@ -161,9 +162,7 @@ export function NotesPanel({ projectId, notes }: { projectId: string; notes: Not
                     {note.title}
                   </h3>
                 ) : null}
-                <p className="mt-1 whitespace-pre-wrap break-words text-sm leading-relaxed text-slate-300">
-                  {note.content}
-                </p>
+                <Markdown className="mt-1">{note.content}</Markdown>
                 <p className="mt-2.5 text-[11px] text-slate-600" suppressHydrationWarning>
                   {formatDateTime(note.createdAt)}
                   {wasEdited(note) ? ` · bearbeitet ${formatRelative(note.updatedAt)}` : null}