fix: der Inhalt hat ueberall dieselbe Breite

Konto und Einstellungen standen auf max-w-2xl, alle anderen Seiten auf der
Containerbreite -- beim Wechseln sprang der Inhalt sichtbar. Ein Fehler beim
Bauen, kein Entwurf.

Die Breite steht jetzt an EINER Stelle (BREITE in App.tsx) und gilt fuer
Kopfzeile und Inhalt. Vorher stand sie zweimal da, und zwei Seiten setzten
zusaetzlich ihre eigene: drei Orte fuer eine Zahl, die immer gleich sein soll.

Formulare werden stattdessen INNERHALB ihrer Karte begrenzt. Das war der
eigentliche Grund fuer die Ausnahme -- ein Passwortfeld ueber 1280 Pixel sieht
albern aus. Nur gehoert diese Begrenzung ans Formular und nicht an die Seite.

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

server/ui/src/App.tsx

@@ -23,6 +23,15 @@ import { Meldungen } from './components/Meldungen'
 import { gehZu, usePfad } from './router'
 import { Avatar } from './components/Avatar'
 
+/** Die Breite des Inhalts — an EINER Stelle.
+ *
+ *  Sie stand vorher zweimal da (Kopfzeile und Inhalt), und zwei Seiten setzten
+ *  zusätzlich ihre eigene: dadurch waren Konto und Einstellungen schmaler als
+ *  der Rest, und die Kopfzeile lief über beiden anders. Formulare werden
+ *  stattdessen INNERHALB ihrer Karte begrenzt.
+ */
+const BREITE = 'mx-auto w-full max-w-7xl px-4'
+
 const seiten = [
     { pfad: '/', name: 'Start', kind: Gauge, Inhalt: Start },
     { pfad: '/galerie', name: 'Galerie', kind: Images, Inhalt: Galerie },
@@ -74,7 +83,7 @@ export function App() {
     return (
         <div className="flex min-h-full flex-col">
             <header className="sticky top-0 z-40 border-b border-rand bg-flaeche/80 backdrop-blur">
-                <div className="mx-auto flex max-w-7xl flex-wrap items-center gap-x-6 gap-y-2 px-4 py-2.5">
+                <div className={`${BREITE} flex flex-wrap items-center gap-x-6 gap-y-2 py-2.5`}>
                     <a
                         href="/"
                         onClick={(e) => {
@@ -130,7 +139,7 @@ export function App() {
                 </div>
             </header>
 
-            <main key={aktiv.pfad} className="auftauchen mx-auto w-full max-w-7xl flex-1 px-4 py-5">
+            <main key={aktiv.pfad} className={`auftauchen ${BREITE} flex-1 py-5`}>
                 <Inhalt />
             </main>
 

server/ui/src/pages/Einstellungen.tsx

@@ -14,7 +14,7 @@ import { DiscordKarte } from '../components/DiscordKarte'
  *  gelaufen ist. Diese Seite tut es. */
 export function Einstellungen() {
     return (
-        <div className="flex max-w-2xl flex-col gap-4">
+        <div className="flex flex-col gap-4">
             <SicherungKarte />
             <DiscordKarte />
         </div>

server/ui/src/pages/Konto.tsx

@@ -45,7 +45,7 @@ export function Konto() {
             : 'über Discord angemeldet'
 
     return (
-        <div className="flex max-w-2xl flex-col gap-4">
+        <div className="flex flex-col gap-4">
             <Karte titel="Konto">
                 <div className="mb-4 flex items-center gap-3 border-b border-rand pb-4">
                     <Avatar name={user?.username ?? '?'} url={user?.avatar} groesse={44} />
@@ -64,7 +64,7 @@ export function Konto() {
                     </p>
                 )}
 
-                <form onSubmit={wechseln} className="flex flex-col gap-3">
+                <form onSubmit={wechseln} className="flex max-w-md flex-col gap-3">
                     <Feld
                         label="Aktuelles Passwort"
                         type="password"