Playtester bekommen einen eigenen Bereich, Module ziehen um

Playtester und Alpha-Keys standen als zwei Kaesten mitten im Community-Bereich
zwischen Geburtstagen und Starboard. Die Liste war reine Anzeige: Namen und
Datum, sonst nichts. Wer einem Einzelnen einen Schluessel geben wollte, konnte
nur "an alle verteilen" druecken, und wer jemanden wieder rausnehmen wollte,
musste an die Datenbank.

Jetzt ist es ein eigener Bereich mit drei Zahlen oben und einer Liste, in der
neben jedem Namen sein Schluessel steht. Daneben, je nach Zustand, "Schluessel
geben" oder "Zurueckziehen", und ein ✕ zum Entfernen — die Rolle geht dabei
mit, denn nur aus der Liste zu streichen und die Rolle stehen zu lassen waere
eine Halbwahrheit.

Der Vorrat ist jetzt sichtbar, nicht nur seine Groesse: einen vertippten
Schluessel findet man sonst nie wieder. Nachlegen und "wer bekommt einen?"
laufen ueber Dialoge, damit der Bereich nicht zumuellt — dafuer gibt es jetzt
eine kleine Dialog-Komponente, gebaut wie die Lightbox (Portal, Escape,
Hintergrund festhalten).

Zurueckziehen legt den Schluessel zurueck in den Vorrat. Die Person hat ihn per
DM natuerlich weiterhin — das ist eine Buchhaltung, keine Sperre. Loeschen geht
absichtlich nur bei freien Schluesseln.

## Module dorthin, wo man sie sucht

Ein paar Module standen im falschen Bereich, teils seit Langem:

- Willkommens-Karte: Support → Brand. Sie ist Aussehen, kein Support-Fall, und
  im Brand-Bereich steht der Rest vom Auftritt. Der Block ist woertlich
  umgezogen, nur in eine eigene Konstante — so kann sich beim Umzug nichts am
  Inhalt geaendert haben.
- Twitch & YouTube: System → Feeds. Es ist ein Feed.
- Events: System → Community.
- Auto-Rolle und Rollen merken: Ihre Felder standen laengst im Rollen-Bereich,
  nur das Register sagte "Community" — dadurch sprang "Einrichten" woanders hin
  als die Einstellung liegt.
- Playtester und Alpha-Keys: Community → eigener Bereich.

Damit ist System kein Sammelbecken mehr, sondern nur noch Technik: Waechter,
Sprachkanaele, Erinnerungen, Sicherungen, Member-Gate.

Geprueft: Routen (alle vier neuen bewacht), SQL gegen das Schema, und im
Browser beide Dialoge (Escape schliesst, Hintergrund wird wieder freigegeben,
Hinzufuegen bleibt bei leerem Feld aus), die Liste in allen drei Zustaenden,
und die Suche — "willkommen" fuehrt jetzt nach Brand, "twitch" zu Feeds,
"sticky" zu Rollen.

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

frontend/src/style.css

@@ -1884,6 +1884,56 @@ label.toggle {
     font-size: .62rem; letter-spacing: .06em; color: var(--muted2); white-space: nowrap;
 }
 
+/* Schlüssel stehen als Code — sonst verwechselt man O und 0 */
+.pt-key { font-family: var(--mono); font-size: .74rem; color: var(--neon); }
+.pt-wartet { font-family: var(--mono); font-size: .66rem; color: var(--muted2); }
+
+/* ── DIALOG ────────────────────────────────────────── */
+.dlg-backdrop {
+    position: fixed; inset: 0; z-index: 1200;
+    display: flex; align-items: center; justify-content: center;
+    padding: 1.5rem;
+    background: rgba(0, 0, 0, .82);
+    animation: lbIn .18s ease both;
+}
+.dlg {
+    width: min(34rem, 100%);
+    /* Hoher Inhalt scrollt im Kasten, nicht die Seite dahinter */
+    max-height: min(85vh, 46rem);
+    display: flex; flex-direction: column;
+    background: var(--bg2); border: 1px solid var(--border);
+    border-radius: 4px; min-width: 0;
+    animation: riseIn .2s ease both;
+}
+.dlg.weit { width: min(48rem, 100%); }
+.dlg-head {
+    display: flex; align-items: center; gap: .8rem;
+    padding: 1rem 1.2rem; border-bottom: 1px solid var(--border);
+}
+.dlg-title {
+    margin: 0; flex: 1; min-width: 0;
+    font-family: var(--mono); font-size: .72rem;
+    letter-spacing: .12em; text-transform: uppercase; color: var(--neon);
+}
+.dlg-body { padding: 1.2rem; overflow-y: auto; min-height: 0; }
+.dlg-body > .field:last-child { margin-bottom: 0; }
+.dlg-foot {
+    display: flex; gap: .6rem; justify-content: flex-end; flex-wrap: wrap;
+    padding: .9rem 1.2rem; border-top: 1px solid var(--border);
+}
+
+/* Auswahlliste im Dialog — eine Zeile je Person */
+.dlg-pick { display: flex; flex-direction: column; gap: .35rem; }
+.dlg-pick button {
+    display: flex; align-items: center; gap: .6rem; width: 100%;
+    padding: .6rem .8rem; text-align: left;
+    background: var(--bg3); border: 1px solid var(--border); color: var(--text);
+    font: inherit; cursor: pointer;
+}
+.dlg-pick button:hover:not(:disabled) { border-color: var(--neon); color: var(--neon); }
+.dlg-pick button:disabled { opacity: .45; cursor: not-allowed; }
+.dlg-pick .pick-hint { margin-left: auto; font-family: var(--mono); font-size: .62rem; color: var(--muted2); }
+
 /* Emoji eines Ticket-Anliegens — gleiche Breite wie der Statuspunkt daneben,
    damit die Namen untereinander auf einer Linie stehen */
 .tk-emoji { font-size: 1rem; line-height: 1; width: 1.2rem; text-align: center; flex: 0 0 auto; }