style(charakter-erstellung): alle 20-Fragen-Abschnitte standardmäßig eingeklappt

Der Konzept-Abschnitt war als einziger initial geöffnet; jetzt starten alle
vier Abschnitte eingeklappt (Projektkonvention: einklappbare Kategorien sind
standardmäßig eingeklappt).

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

client/src/App.tsx

@@ -6,6 +6,7 @@ import { CampaignsPage, CampaignDetailPage } from '@/features/campaigns';
 import { CharacterSheetPage } from '@/features/characters';
 import { BattlePage } from '@/features/battle';
 import { LibraryPage } from '@/features/library';
+import { CharacterCreationPage } from '@/features/character-creation';
 import { ProtectedRoute } from '@/shared/components/protected-route';
 import { Layout } from '@/shared/components/layout';
 
@@ -41,6 +42,7 @@ function AppContent() {
           isAuthenticated ? <Navigate to="/" replace /> : <RegisterPage />
         }
       />
+      <Route path="/charakter-erstellung" element={<CharacterCreationPage />} />
 
       {/* Protected Routes */}
       <Route element={<ProtectedRoute />}>

client/src/features/character-creation/components/character-creation-page.tsx

@@ -0,0 +1,505 @@
+import { useMemo, useState } from 'react';
+import { Link } from 'react-router-dom';
+import {
+  Swords,
+  ListChecks,
+  ChevronDown,
+  ExternalLink,
+  ArrowLeft,
+  Lightbulb,
+  ScrollText,
+  Palette,
+  Users,
+  Info,
+  type LucideIcon,
+} from 'lucide-react';
+import LogoOhneText from '../../../../Logos/Logo_ohne_Text.svg';
+
+// Generate random stars for the brand background (matches the auth screen).
+function generateStars(count: number) {
+  return Array.from({ length: count }, (_, i) => ({
+    id: i,
+    x: Math.random() * 100,
+    y: Math.random() * 100,
+    duration: 2 + Math.random() * 4,
+    delay: Math.random() * 5,
+    size: Math.random() > 0.8 ? 3 : Math.random() > 0.5 ? 2 : 1,
+  }));
+}
+
+// --- Messer-Theorie (Knife Theory) ---
+
+interface Knife {
+  text: string;
+  value: string;
+  note?: string;
+}
+
+const KNIVES: Knife[] = [
+  {
+    text: 'Jede benannte Person, die deinem Charakter wichtig ist, ob lebendig oder tot (z. B. Geschwister, Ehepartnerin, Kindheitsfreund).',
+    value: '+1',
+    note: 'Eine große Familie darf zu einem einzigen großen Messer gebündelt werden.',
+  },
+  {
+    text: 'Jede Phobie oder jedes Trauma, das dein Charakter durchlebt oder durchlebt hat.',
+    value: '+1',
+  },
+  {
+    text: 'Jedes Rätsel im Leben deines Charakters (z. B. unbekannte Eltern, unerklärte Kräfte).',
+    value: '+1',
+  },
+  {
+    text: 'Jeder Feind, den dein Charakter hat.',
+    value: '+1',
+  },
+  {
+    text: 'Jede fortlaufende Verpflichtung oder Loyalität deines Charakters.',
+    value: '+1',
+  },
+  {
+    text: 'Zusätzlich: jede Verpflichtung, an der dein Charakter gescheitert ist.',
+    value: '+1',
+  },
+  {
+    text: 'Jedes schwere Verbrechen, das dein Charakter begangen hat (z. B. Mord, Brandstiftung).',
+    value: '+1',
+  },
+  {
+    text: 'Jedes Verbrechen, dessen dein Charakter zu Unrecht beschuldigt wird.',
+    value: '+1',
+  },
+  {
+    text: 'Ist dein Charakter ein Serienmörder oder der Anführer einer Diebesgilde, lassen sich diese Taten zu einem großen Messer bündeln.',
+    value: '+1',
+  },
+  {
+    text: 'Jede erlebte Diskriminierung (z. B. Fantasy-Rassismus).',
+    value: '+1',
+  },
+  {
+    text: 'Jeder Lieblingsgegenstand oder jedes Erbstück.',
+    value: '+1',
+  },
+  {
+    text: 'Jedes Geheimnis, das dein Charakter hütet.',
+    value: '+1',
+  },
+];
+
+// --- 20 Fragen (20 Questions for Deep Character Creation) ---
+
+interface Question {
+  title: string;
+  description: string;
+}
+
+interface QuestionPart {
+  id: string;
+  title: string;
+  subtitle: string;
+  icon: LucideIcon;
+  questions: Question[];
+}
+
+const QUESTION_PARTS: QuestionPart[] = [
+  {
+    id: 'konzept',
+    title: 'Konzept',
+    subtitle: 'Die breitesten Striche. Jeder Charakter, auch jeder NSC, sollte diese fünf beantworten.',
+    icon: Lightbulb,
+    questions: [
+      {
+        title: 'Welche Emotion beschreibt deinen Charakter am besten?',
+        description:
+          'Finde eine vorherrschende Emotion und benenne sie mit einem anschaulichen, spezifischen Wort. Statt »wütend« etwa »rachsüchtig« oder »tobend«, statt »glücklich« vielleicht »fröhlich« oder »überschwänglich«.',
+      },
+      {
+        title: 'Welche Emotion löst dein Charakter in anderen aus?',
+        description:
+          'Wie reagieren andere auf dich? Beeindruckst, erschreckst, beruhigst, begeisterst oder nervst du? Such auch hier den treffendsten Begriff. Unterscheidet sich die Reaktion zwischen Freunden und Feinden?',
+      },
+      {
+        title: 'Was braucht dein Charakter am dringendsten?',
+        description:
+          'Hätte dein Charakter alles, was er braucht, warum sollte er auf Abenteuer ausziehen? Übliche Bedürfnisse sind Überleben, Sicherheit, Gemeinschaft, Ansehen, Romantik, Familie oder Weisheit. Überlege, wo er startet und wo er am Ende stehen soll, am besten mit der Spielleitung abgestimmt.',
+      },
+      {
+        title: 'Was ist das Lebensziel deines Charakters?',
+        description:
+          'Die grundlegende Motivation hinter allem, was er denkt, sagt und tut. Woran klammert er sich, wenn er im Sterben liegt? Gute Ziele lassen sich bedrohen: Gerechtigkeit, Rache, der Schutz geliebter Menschen, die eigene Erlösung oder das Erlangen von Macht. Frag bei jeder Antwort »warum?«, bis du beim eigentlichen Ziel ankommst.',
+      },
+      {
+        title: 'Wie glaubt dein Charakter, dieses Ziel zu erreichen?',
+        description:
+          'Die Methode ist eng mit Überzeugungen (oder deren Fehlen) verknüpft und vor allem eine Frage des Lebensstils. Wer auf Rache sinnt, perfektioniert vielleicht eine Kampfkunst; wer einer Sache ergeben ist, folgt vielleicht einer religiösen oder philosophischen Lehre.',
+      },
+    ],
+  },
+  {
+    id: 'hintergrund',
+    title: 'Hintergrund',
+    subtitle: 'Geschichte gibt deinem Charakter dramatisches und emotionales Gewicht.',
+    icon: ScrollText,
+    questions: [
+      {
+        title: 'Woher kommt dein Charakter?',
+        description:
+          'Betrachte die Wurzeln vor dem Teenageralter, denn diese Zeit prägt am stärksten. Wer waren deine Eltern? Wo lebtest du? Welchen wirtschaftlichen und sozialen Status hatte deine Familie? Wie wurdest du erzogen? Welche drei wichtigsten Lektionen hast du gelernt?',
+      },
+      {
+        title: 'Wann bist du erwachsen geworden?',
+        description:
+          'Jeder übernimmt zu unterschiedlichen Zeiten und auf unterschiedliche Weise Verantwortung für sein Leben. Beschreibe die Ereignisse rund um den Moment, in dem dein Charakter begann, für sich selbst zu sorgen.',
+      },
+      {
+        title: 'Welche Werte vertritt dein Charakter?',
+        description:
+          'Nenne drei Dinge, die ihm heilig sind, und drei, die er aus Überzeugung ablehnt. Woher stammen diese Werte, anerzogen oder als Reaktion entstanden? Lege Grenzen fest, die dein Charakter bei der Verfolgung seines Ziels niemals überschreitet.',
+      },
+      {
+        title: 'Wie kleidet sich dein Charakter?',
+        description:
+          'Beginne allgemein mit Qualität und Auftreten (Status, Beruf, gepflegt oder verwahrlost) und arbeite dich zu verräterischen Details vor: Frisur, Schmuck, Gürtel, Handschuhe. Besonders aufschlussreich ist das Schuhwerk: Schnitt, Sitz, Absatz, Sohle, Verschluss, Form, Farbe, Material, Sauberkeit und Zustand.',
+      },
+      {
+        title: 'Über welche Mittel verfügt dein Charakter?',
+        description:
+          'Bedenke alle Ressourcen: materielle (Geld, Besitz), soziale (Freunde, Verbündete) und persönliche (Geschick, Mut, Stärke, Verstand). Mach eine Liste dessen, womit dein Charakter Widrigkeiten wie Kämpfe, Rätsel, Reisen oder Überzeugungsarbeit meistern kann.',
+      },
+    ],
+  },
+  {
+    id: 'details',
+    title: 'Details',
+    subtitle: 'Textur und Farbe. Das macht einen Charakter über Jahre unvergesslich.',
+    icon: Palette,
+    questions: [
+      {
+        title: 'Was sind die persönlichen Vorlieben deines Charakters?',
+        description:
+          'Nenne mindestens drei Dinge, die er aus reiner Vorliebe genießt, am besten je Sinn eines: ein Geräusch, ein Geruch, ein Geschmack, ein Gefühl, ein Anblick. Denk auch an Hobbys oder Gewohnheiten. Und nenne drei Dinge, die er nicht ausstehen kann.',
+      },
+      {
+        title: 'Welche Meinungen hat dein Charakter?',
+        description:
+          'Lege zu mindestens drei Aspekten der lokalen Gesellschaft eine Haltung fest, etwa zu Arm und Reich, zu einer politischen oder religiösen Gruppe oder zu einer bekannten Person. Stimm dich mit der Spielleitung ab, welche Themen in der Kampagne relevant sind.',
+      },
+      {
+        title: 'Was ist die Komfortzone deines Charakters?',
+        description:
+          'Welche Umgebung, Tätigkeit oder Geisteshaltung beruhigt ihn? Das verleiht stressigen Momenten Farbe, weil er dann einen Ort hat, an den er sich flüchtet, oder eine Sache, die er tut. Ideal, wenn ein Teil davon »tragbar« ist.',
+      },
+      {
+        title: 'Wer hatte den größten Einfluss auf das Leben deines Charakters?',
+        description:
+          'Nenne und beschreibe kurz mindestens eine Person, die seine Sicht auf die Welt geprägt hat. Mehrere sind möglich, sollten aber unterschiedliche Facetten spiegeln. Nutze sie als Bezugspunkt bei schweren Entscheidungen: »Was würde diese Person tun?«',
+      },
+      {
+        title: 'Welche unerwarteten Eigenheiten hat dein Charakter?',
+        description:
+          'Drei Dinge, die seinem Stand, Alter oder Beruf widersprechen. Drei unerwartete Talente (singen, Mathe, unnützes Wissen). Drei Dinge, die er nicht kann, obwohl es die meisten können (pfeifen, schwimmen, flüssig lesen). Und drei Dinge, die er fürchtet (Höhe, Hunde, Insekten).',
+      },
+    ],
+  },
+  {
+    id: 'spieler',
+    title: 'Spieler & Spielerin',
+    subtitle: 'Diese Fragen lenken dein Spielerlebnis. Beantwortet sie als Gruppe gemeinsam.',
+    icon: Users,
+    questions: [
+      {
+        title: 'In welche Art von Geschichte gehört dein Charakter?',
+        description:
+          'Mit wem interagiert er? Welche Schauplätze bewohnt er, welche Themen sind wichtig, welchen Konflikten stellt er sich? Das hilft der Spielleitung, passende Abenteuer zu bauen, und dir, mit den Charakteren der Mitspielenden zu harmonieren.',
+      },
+      {
+        title: 'Welche Rolle füllt dein Charakter aus?',
+        description:
+          'Rollenspiel lebt vom Ensemble. Sorge dafür, dass dein Charakter eine eigene Rolle einnimmt, ohne anderen auf die Füße zu treten: zwischenmenschlich, im Kampf, bei seinen besten Fertigkeiten und in seinem thematischen Ton.',
+      },
+      {
+        title: 'Was sollten die anderen Spielenden über deinen Charakter wissen?',
+        description:
+          'Die großen thematischen Punkte, seine Grundemotion (sofern kein Geheimnis), mögliche Überraschungen oder heikle Bereiche. Skizziere mögliche Interaktionen: Zu wem geht dein Charakter um Hilfe, mit wem aneinander? Offenheit verhindert unangenehme Überraschungen.',
+      },
+      {
+        title: 'Was ist dein Spielstil?',
+        description:
+          'Magst du tiefe Immersion, Liebe zum Regeldetail oder klare Zielorientierung? Bist du eher wettbewerbsorientiert? Bevorzugst du blumige Beschreibungen oder einen schnellen Überblick? Sprichst du in der Stimme deines Charakters? Das zu kennen hilft der Kommunikation am Tisch.',
+      },
+      {
+        title: 'Wie soll dein Charakter sterben?',
+        description:
+          'Er wird nicht ewig leben. Wenn du seinen Tod wählen könntest: Tod im hohen Alter nach allen Prüfungen? Ein blutiges, gewaltsames Ende? Ein edles Opfer? Reiner Zufall? Das verrät, ob dein Charakter tragisch oder heldenhaft ist, und hilft der Spielleitung, Konflikte einzuschätzen.',
+      },
+    ],
+  },
+];
+
+function PartSection({
+  part,
+  index,
+  defaultOpen,
+}: {
+  part: QuestionPart;
+  index: number;
+  defaultOpen: boolean;
+}) {
+  const [open, setOpen] = useState(defaultOpen);
+  const Icon = part.icon;
+
+  return (
+    <div className="overflow-hidden rounded-xl border border-border bg-bg-secondary/60">
+      <button
+        type="button"
+        onClick={() => setOpen((o) => !o)}
+        aria-expanded={open}
+        className="flex min-h-[44px] w-full items-center gap-3 p-4 text-left transition-colors hover:bg-bg-tertiary/50"
+      >
+        <span className="flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-primary-500/15 text-primary-400">
+          <Icon className="h-5 w-5" />
+        </span>
+        <span className="flex-1">
+          <span className="block text-base font-semibold text-text-primary">{part.title}</span>
+          <span className="block text-sm text-text-secondary">{part.subtitle}</span>
+        </span>
+        <ChevronDown
+          className={`h-5 w-5 shrink-0 text-text-secondary transition-transform ${open ? 'rotate-180' : ''}`}
+        />
+      </button>
+
+      {open && (
+        <ol className="space-y-4 border-t border-border px-4 pb-5 pt-4">
+          {part.questions.map((q, qi) => (
+            <li key={qi} className="flex gap-3">
+              <span className="flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-primary-500/15 text-sm font-semibold text-primary-400">
+                {index * 5 + qi + 1}
+              </span>
+              <div>
+                <p className="font-medium text-text-primary">{q.title}</p>
+                <p className="mt-1 text-sm leading-relaxed text-text-secondary">{q.description}</p>
+              </div>
+            </li>
+          ))}
+        </ol>
+      )}
+    </div>
+  );
+}
+
+export function CharacterCreationPage() {
+  const stars = useMemo(() => generateStars(70), []);
+
+  return (
+    <div className="relative min-h-screen w-full">
+      {/* Brand background (shared with the auth screen) */}
+      <div className="auth-background">
+        <div className="auth-stars">
+          {stars.map((star) => (
+            <div
+              key={star.id}
+              className="auth-star"
+              style={{
+                left: `${star.x}%`,
+                top: `${star.y}%`,
+                width: `${star.size}px`,
+                height: `${star.size}px`,
+                ['--duration' as string]: `${star.duration}s`,
+                ['--delay' as string]: `${star.delay}s`,
+              }}
+            />
+          ))}
+        </div>
+        <div className="auth-orb auth-orb-1" />
+        <div className="auth-orb auth-orb-2" />
+        <div className="auth-orb auth-orb-3" />
+      </div>
+
+      {/* Content */}
+      <div className="relative z-10 mx-auto w-full max-w-3xl px-4 py-10 sm:py-14">
+        {/* Brand header */}
+        <header className="mb-10 flex flex-col items-center text-center">
+          <img src={LogoOhneText} alt="Dimension 47" className="mb-4 h-20 auth-logo" />
+          <div className="flex items-center gap-3">
+            <h2
+              className="text-2xl font-bold tracking-[0.2em] text-text-primary sm:text-3xl"
+              style={{ fontFamily: 'Cinzel, serif' }}
+            >
+              DIMENSION
+            </h2>
+            <div className="h-px w-8 bg-gradient-to-r from-transparent to-primary-500" />
+            <span
+              className="text-3xl text-primary-500 sm:text-4xl"
+              style={{ fontFamily: 'Cinzel, serif', fontWeight: 700 }}
+            >
+              47
+            </span>
+          </div>
+        </header>
+
+        <h1 className="text-center text-3xl font-bold text-text-primary sm:text-4xl">
+          Tipps für die Charaktererstellung
+        </h1>
+        <p className="mx-auto mt-3 max-w-2xl text-center text-base leading-relaxed text-text-secondary">
+          Ein guter Charakter ist mehr als ein Bündel Werte. Diese beiden Werkzeuge helfen dir, eine
+          Figur zu erschaffen, die sich am Tisch lebendig anfühlt, die Spielleitung in die Geschichte
+          einbinden kann und über die ganze Kampagne hinweg spannend bleibt.
+        </p>
+
+        {/* --- Abschnitt 1: Messer-Theorie --- */}
+        <section className="mt-12">
+          <div className="mb-4 flex items-center gap-3">
+            <span className="flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-primary-500/15 text-primary-400">
+              <Swords className="h-6 w-6" />
+            </span>
+            <div>
+              <h2 className="text-xl font-semibold text-text-primary sm:text-2xl">
+                Die Messer-Theorie
+              </h2>
+              <p className="text-sm text-text-secondary">
+                Gib deiner Spielleitung etwas, womit sie dich »stechen« kann.
+              </p>
+            </div>
+          </div>
+
+          <div className="rounded-2xl border border-border bg-bg-secondary/60 p-5 backdrop-blur-sm sm:p-6">
+            <div className="space-y-4 text-text-secondary">
+              <p className="leading-relaxed">
+                Wenn du die Hintergrundgeschichte eines Charakters schreibst, ist es wichtig, eine
+                gewisse Anzahl an <span className="font-medium text-text-primary">»Messern«</span>{' '}
+                einzubauen. Ein Messer ist im Grunde alles, was die Spielleitung nutzen kann, um den
+                Einsatz einer Situation für deinen Charakter zu erhöhen: alles, was einen Konflikt
+                persönlich macht, etwa eine bedrohte geliebte Person oder das plötzliche Auftauchen
+                eines Feindes.
+              </p>
+              <p className="leading-relaxed">
+                Sie heißen »Messer«, weil die Spielenden sie liebevoll schmieden und der Spielleitung
+                überreichen, damit diese sie immer wieder benutzen kann, um den Charakter damit zu
+                stechen. Je mehr Messer ein Charakter hat, desto leichter lässt er sich in die
+                Geschichte einbinden. Deshalb lohnt es sich, welche zu haben!
+              </p>
+            </div>
+
+            <h3 className="mb-3 mt-6 text-sm font-semibold uppercase tracking-wide text-text-muted">
+              Wie viele Messer hat dein Charakter?
+            </h3>
+            <ul className="space-y-2.5">
+              {KNIVES.map((knife, i) => (
+                <li
+                  key={i}
+                  className="flex items-start gap-3 rounded-lg border border-border bg-bg-tertiary/40 p-3"
+                >
+                  <span className="mt-0.5 shrink-0 rounded-md bg-primary-500/15 px-2 py-0.5 text-xs font-semibold text-primary-400">
+                    {knife.value}
+                  </span>
+                  <span className="text-sm leading-relaxed text-text-secondary">
+                    {knife.text}
+                    {knife.note && (
+                      <span className="mt-1 block text-xs italic text-text-muted">{knife.note}</span>
+                    )}
+                  </span>
+                </li>
+              ))}
+            </ul>
+
+            <div className="mt-5 flex items-start gap-3 rounded-xl border border-primary-500/20 bg-primary-500/5 p-4">
+              <Info className="mt-0.5 h-5 w-5 shrink-0 text-primary-400" />
+              <div className="space-y-2 text-sm leading-relaxed text-text-secondary">
+                <p>
+                  Jeder Teil deiner Hintergrundgeschichte, der gegen dich verwendet werden kann, ist
+                  ein Messer. Eine gute Spielleitung zerbricht sie in kleinere, schärfere Messer oder
+                  bündelt die Messer mehrerer Charaktere zu einem riesigen.
+                </p>
+                <p>
+                  <span className="font-medium text-text-primary">Die Faustregel:</span> Sei kein
+                  trauriger Edgelord mit zu vielen Messern: mehr als 15 wirkt übertrieben, und
+                  irgendwann sticht es die ganze Gruppe. Aber sei auch nicht der langweilige Charakter
+                  mit nur zwei. Etwa <span className="font-medium text-text-primary">sieben</span>{' '}
+                  sind ein guter Startwert.
+                </p>
+                <p>
+                  <span className="font-medium text-text-primary">Variiere die Arten:</span> Nicht
+                  alle sieben sollten Familienmitglieder oder vergangene Verbrechen sein, denn das
+                  führt zu eintönigem Spiel. Der Reiz liegt in neuen, überraschenden Messern.
+                </p>
+              </div>
+            </div>
+
+            <p className="mt-5 text-xs text-text-muted">
+              Adaptiert und übersetzt aus einem Beitrag der Community{' '}
+              <a
+                href="https://www.reddit.com/r/DnD/comments/775caq/my_friends_and_i_have_something_called_knife/"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="inline-flex items-center gap-1 text-primary-400 hover:text-primary-300"
+              >
+                r/DnD auf Reddit
+                <ExternalLink className="h-3 w-3" />
+              </a>
+              .
+            </p>
+          </div>
+        </section>
+
+        {/* --- Abschnitt 2: 20 Fragen --- */}
+        <section className="mt-14">
+          <div className="mb-4 flex items-center gap-3">
+            <span className="flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-primary-500/15 text-primary-400">
+              <ListChecks className="h-6 w-6" />
+            </span>
+            <div>
+              <h2 className="text-xl font-semibold text-text-primary sm:text-2xl">
+                20 Fragen für tiefgründige Charaktere
+              </h2>
+              <p className="text-sm text-text-secondary">
+                In vier Stufen vom groben Konzept bis zum gemeinsamen Spielerlebnis.
+              </p>
+            </div>
+          </div>
+
+          <p className="mb-5 text-sm leading-relaxed text-text-secondary">
+            Bearbeite einen Abschnitt am Stück, statt zwischen ihnen zu springen, denn jede Stufe
+            geht tiefer. Für eine kurze Runde genügen oft die ersten fünf Fragen; die ganze Liste lohnt
+            sich für lange Kampagnen. Du kannst sie auch in größeren Abständen erneut durchgehen, wenn
+            sich dein Charakter weiterentwickelt.
+          </p>
+
+          <div className="space-y-3">
+            {QUESTION_PARTS.map((part, index) => (
+              <PartSection key={part.id} part={part} index={index} defaultOpen={false} />
+            ))}
+          </div>
+
+          <p className="mt-5 text-xs text-text-muted">
+            Übersetzt und adaptiert aus{' '}
+            <a
+              href="http://www.plus1gaming.com/2011/07/20-questions-for-deep-character-creation"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="inline-flex items-center gap-1 text-primary-400 hover:text-primary-300"
+            >
+              »20 Questions for Deep Character Creation« auf plus1gaming.com
+              <ExternalLink className="h-3 w-3" />
+            </a>
+            .
+          </p>
+        </section>
+
+        {/* Footer */}
+        <footer className="mt-14 flex flex-col items-center gap-4 border-t border-border pt-8 text-center">
+          <Link
+            to="/login"
+            className="inline-flex min-h-[44px] items-center gap-2 rounded-lg px-4 text-sm font-medium text-primary-400 transition-colors hover:text-primary-300"
+          >
+            <ArrowLeft className="h-4 w-4" />
+            Zurück zur Anmeldung
+          </Link>
+          <p className="text-xs text-text-muted">
+            Dimension 47: Charaktererstellung für deine Pathfinder-2e-Tischrunde.
+          </p>
+        </footer>
+      </div>
+    </div>
+  );
+}

client/src/features/character-creation/index.ts

@@ -0,0 +1 @@
+export { CharacterCreationPage } from './components/character-creation-page';

server/tsconfig.build.json

@@ -1,4 +1,4 @@
 {
   "extends": "./tsconfig.json",
-  "exclude": ["node_modules", "test", "dist", "**/*spec.ts"]
+  "exclude": ["node_modules", "test", "dist", "**/*spec.ts", "prisma/data/foundry-pf2e"]
 }