Der Treff: eine eigene Tür für die Community, und sie sieht nur, was dasteht

Filipe: "eine community rolle und community kategorie, wo die community
auch dann nur die sieht" · "wieso nur eine kachel — ich will mehrere,
mit mehreren optionen" · "egal welche rolle hinzugefügt wird soll immer
nur das sehen was ich erlaube".

DIE DRITTE ADRESSE. treff.dogfather-universe.com bekommt eine eigene
Weiche (treff-adresse.js), eine eigene Zugangswand, ein eigenes Manifest
und acht eigene Bühnenbilder. Ohne sie stünde dort die Wand der Agentur:
Spicy-Logo, "Creator Workspace", fünf Rollenkacheln mit den Namen Admin,
Manager, Scout, Creator — die komplette Struktur des Unternehmens, vor
der Anmeldung, für jeden mit der Adresse.

Welche Wand zu welcher Tür gehört, steht jetzt in EINER Tafel
(istFremdeWand) statt als Sonderfall im Code. Bei zwei Wänden war ein
Sonderfall richtig; bei drei wären es drei geworden, bei vier sechs.

SIEBEN BRETTER UND EIN ACHTES NUR FÜRS TEAM. Anschlagbrett, Was ansteht,
Der Treff, Wunschliste, Highlights, Regeln & Hilfe, Mitmachen — dazu
"Meldungen & Maßnahmen", das ausdrücklich NICHT in TREFF_BEREICHE steht:
dort wäre es lautlos bei der Community gelandet und hätte ausgesehen wie
die anderen sieben.

WAS AUF DEN BRETTERN PASSIERT: "Will ich auch" (eine Stimme je Person,
erzwungen durch den Schlüssel, nicht durch eine Prüfung) · Anheften,
höchstens drei, gezählt IN der Transaktion · Freigabe vor Sichtbarkeit
für Termine und Highlights, wobei Abwesenheit der Ruhezustand ist ·
Melden mit Pflicht-Grund (DSA Art. 16) · Entfernen mit Grund, der den
Beitrag ÜBERLEBT (DSA Art. 17) · drei Stufen, gerechnet statt
gespeichert · die Bannleiter: Modi bis 7 Tage, dauerhaft nur DogFather
(seine Entscheidung) · "Mitmachen" wird zum Talent, genau einmal.

Der Ausschluss wirkt in sitzungLesen() — also nicht nur beim Schreiben.
Wer ausgeschlossen ist, ist weg, nicht stumm.

ZWEI SEITEN MEHR. treff-regeln.html holt seine ZAHLEN vom Server
(Mindestalter 18, Fristen, Anschläge) — ein Regeltext, der eine andere
Zahl nennt als die Regel, ist schlimmer als keiner. rechte.html rechnet
"Wer sieht was" aus derselben Tafel aus, aus der die Schranke ihre
Entscheidung holt. Die Community steht dort bei 3 von 23.

SECHS BEFUNDE, KEINEN HAT DAS LESEN GEFUNDEN:
 · Ein Modi kam über den verborgenen Zugang in den Treff — die Bedingung
   war durch Ausschluss formuliert und nahm die neue Wand automatisch mit
 · /api/personen gab einem Mitglied Namen und Rolle von DogFather
 · Ein DELETE mit Körper wird von Nodes HTTP-Parser mit einem leeren 400
   abgewiesen, bevor Express ihn sieht (gemessen). Der Grund reist jetzt
   in der Adresse
 · Der Kommentar, der erklärt, warum die Zugangswand keine Rollennamen
   nennt, nannte selbst einen — in einer ausgelieferten Datei
 · Zwei Listen für "welche Seiten sind ohne Anmeldung offen". Sie
   stimmten, weil beide am selben Tag entstanden
 · Ein Portkonflikt, den ich selbst gebaut hatte (4391 gehört
   pruef-chat-aufloesen)

Dazu zwei feste Zahlen abgeschafft (die 20 in pruef-rechtetafel, die
Kachelzahl in pruef-treff) und zwei Werkzeuge, die jetzt SUCHEN statt
aufzuzählen: Der Versionsstempel findet seine Manifeste selbst — das
dritte hätte sonst keinen bekommen, und die neue App hätte bis zu vier
Stunden lang das falsche Zeichen getragen. Das Bildwerkzeug baut beide
Zugangswände aus einer Vorlage mit zwei Werten.

Zwei neue Kacheltöne, gemessen statt gewählt: #2f2f7f (Abstand 31,4 in
Lab) und #7c2771 (29,7). Das schwächste Paar der vorhandenen 34 liegt
bei 24,9.

Geprüft: treff 69 · treff-werkzeuge 60 · rollen 312 · start-ansicht 147 ·
crew-adresse 129 · sicht 84 · modi-verborgen 80 · haus-trennung 62 ·
bereiche-lesend 37 · css-klassen 30 · zwischenspeicher 21 · alle-wege 19 ·
rechtetafel 19 — alles grün.

Co-Authored-By: Claude Opus 5 <[email protected]>

workspace/assets/css/bereich.css

@@ -46,6 +46,68 @@
 }
 .eintrag-knoepfe { display: flex; gap: 6px; margin-left: auto; flex-wrap: wrap; }
 
+/* =====================================================================
+   DER TREFF (11.09.2026)
+
+   Drei Zusaetze, und nur auf den sieben Brettern der Community.
+
+   SIE STEHEN IN EINER EIGENEN ZEILE UNTER DEM FUSS und nicht darin.
+   Der Fuss ist eine Auskunft (Datum, wer, Stand); hier stehen Dinge,
+   die man TUT. Zusammen in einer Reihe waere "von Frida" so breit wie
+   "Will ich auch" -- und auf einem Handy laege beides ineinander.
+   ===================================================================== */
+.treff-knoepfe {
+  display: flex; gap: 7px; flex-wrap: wrap; align-items: center;
+  margin-top: 10px; padding-top: 10px;
+  border-top: 1px solid var(--rand);
+}
+
+/* Der Rollenname am Beitrag. Leise, aber nicht versteckt: Er soll
+   beim Lesen auffallen, ohne den Beitrag zu ueberschreiben. Deshalb
+   dieselbe Groesse wie der Fuss und nur ein kraeftigerer Ton. */
+.treff-rolle {
+  color: var(--text-leise);
+  font-weight: 600;
+  letter-spacing: .01em;
+}
+
+/* "Will ich auch". Der einzige Knopf auf diesen Brettern, der keine
+   Verwaltung ist, sondern eine Meinung -- er darf deshalb als
+   einziger einen Ton tragen.
+
+   GEDRUECKT WIRD ER RUHIGER, NICHT LAUTER. Der naheliegende Entwurf
+   waere ein kraeftiges Leuchten fuer "ich bin dabei". Nur sieht man
+   auf einer Wunschliste meist ZEHN Karten gleichzeitig, und wer bei
+   der Haelfte mitgestimmt hat, saehe zehn leuchtende Flaechen
+   untereinander. Das ist genau das, was diese Seite nicht sein soll
+   (Hausregel: augenschonend). Der gedrueckte Zustand bekommt deshalb
+   eine gefuellte Flaeche in gedecktem Ton, der ungedrueckte bleibt
+   ein Umriss -- unterscheidbar, ohne zu blenden. */
+.treff-will {
+  font: inherit; font-size: .8rem; font-weight: 600;
+  padding: 6px 12px; border-radius: 999px; cursor: pointer;
+  color: var(--text-leise);
+  background: transparent;
+  border: 1px solid var(--rand-hell);
+  transition: background .16s ease, color .16s ease, border-color .16s ease;
+}
+.treff-will:hover:not(:disabled) {
+  color: var(--text);
+  border-color: color-mix(in srgb, var(--akzent) 45%, transparent);
+}
+.treff-will[aria-pressed="true"] {
+  color: var(--text);
+  background: color-mix(in srgb, var(--akzent) 14%, transparent);
+  border-color: color-mix(in srgb, var(--akzent) 42%, transparent);
+}
+.treff-will:disabled { opacity: .55; cursor: default; }
+
+/* Dieselbe Ruecksicht wie ueberall: Wer Bewegung abbestellt hat,
+   bekommt keine. */
+@media (prefers-reduced-motion: reduce) {
+  .treff-will { transition: none; }
+}
+
 .filter { display: flex; gap: 8px; margin: 0 0 20px; flex-wrap: wrap; }
 .filter .schritt[aria-pressed="true"] {
   /* Gedrueckt = der "voll"-Auftritt des Knopf-Systems. Vorher stand

workspace/assets/css/start.css

@@ -1030,6 +1030,68 @@ body.start > main { position: relative; z-index: 1; }
 [data-ton="26"] { --ton: #7fd4a8; }   /* Entwicklung */
 [data-ton="27"] { --ton: #8f7bd6; }   /* Talente */
 
+/* =====================================================================
+   DIE SIEBEN TOENE DES TREFFS (11.09.2026)
+
+   Bei 27 Kacheln war der Farbkreis voll -- das stand seit dem 11.09. als
+   Notiz im Code. Sieben weitere von Hand zu waehlen haette Toene
+   ergeben, die sich nur noch der Messung nach unterscheiden.
+
+   Sie sind deshalb GERECHNET: ein Gitter aus Farbton, Saettigung und
+   Helligkeit, umgerechnet in den Lab-Raum (dort entspricht Abstand dem,
+   was das Auge als Unterschied sieht), und daraus gierig die sieben mit
+   dem groessten kleinsten Abstand zu allen 27 vorhandenen UND
+   zueinander.
+
+   Zwei Bereiche sind ausgeschlossen, und beide aus einem Grund:
+     * ROT (unter 22 und ueber 338 Grad) gehoert Spicy Media. Eine
+       Community-Kachel in deren Farbe waere ein falsches Signal.
+     * NEON (Buntheit ueber 62) verstoesst gegen die Hausregel
+       "augenschonend". Dasselbe gilt nach unten: unter 24 wird es grau,
+       und grau liest sich als "abgeschaltet".
+
+   Ergebnis: schwaechster Abstand 24,9 -- zum Vergleich lag eine von
+   Hand gewaehlte Farbfamilie im selben Blau bei 12,6. Die Rechnung war
+   also nicht Genauigkeitsspielerei, sondern der Unterschied zwischen
+   unterscheidbar und nicht. */
+[data-ton="28"] { --ton: #8e784f; }   /* Regeln & Hilfe */
+[data-ton="29"] { --ton: #8e5b77; }   /* Highlights */
+[data-ton="30"] { --ton: #b2bc78; }   /* Wunschliste */
+[data-ton="31"] { --ton: #656a9e; }   /* Was ansteht */
+[data-ton="32"] { --ton: #668e6e; }   /* Mitmachen */
+[data-ton="33"] { --ton: #cc9451; }   /* Anschlagbrett */
+[data-ton="34"] { --ton: #cc92c6; }   /* Der Treff */
+
+/* DER 35. TON (11.09.2026) — für „Wer sieht was".
+
+   GEMESSEN, NICHT GEWÄHLT. Gesucht war der Punkt im Farbraum, der von
+   ALLEN 34 vorhandenen Tönen am weitesten entfernt liegt — Abstand in
+   Lab, nicht in HSL, weil zwei Töne mit gleichem HSL-Abstand
+   unterschiedlich verschieden AUSSEHEN können.
+
+   Zwei Bereiche waren dabei ausgeschlossen, und beide aus einem Grund
+   und nicht aus Geschmack:
+     * Rot (Farbton unter 22° / über 338°) gehört Spicy Media.
+     * Neon (Sättigung über 52 %) verstößt gegen die Hausregel
+       „augenschonend" — die gilt hier wie überall.
+
+   Ergebnis: #2f2f7f, Abstand 31,4 zum nächsten Nachbarn (#656a9e, „Was
+   ansteht"). Zum Vergleich: Das schwächste Paar unter den vorhandenen
+   34 liegt bei 24,9. Der neue Ton ist also unterscheidbarer als das,
+   was ohnehin nebeneinander steht — und die beiden nächsten Nachbarn
+   stehen in verschiedenen Gruppen, treffen sich auf dem Bildschirm
+   also gar nicht.
+
+   WARUM ÜBERHAUPT EIN NEUER: Die 35. Kachel hätte sich sonst einen Ton
+   mit einer anderen geteilt. Zwei Dinge in einer Farbe heißt, dass die
+   Farbe nichts mehr sagt — und pruef-start-ansicht zählt genau das
+   nach ("34 Farben auf 35 Kacheln" war ihre Meldung). */
+[data-ton="35"] { --ton: #2f2f7f; }   /* Wer sieht was */
+/* Der 36., nach derselben Rechnung: #7c2771, Abstand 29,7 zu den beiden
+   nächsten (#8e5b77 „Highlights", #2f2f7f „Wer sieht was"). Auch das
+   liegt über dem schwächsten Paar der vorhandenen Töne (24,9). */
+[data-ton="36"] { --ton: #7c2771; }   /* Meldungen & Maßnahmen */
+
 /* Rückfallwert für alles, was einen Ton braucht, aber keine Nummer hat.
    Steht bewusst in :where() -- damit zählt die Zeile beim Wettstreit der
    Regeln als NICHT vorhanden und die Nummer oben gewinnt immer. Ohne

workspace/assets/css/treff.css

@@ -0,0 +1,269 @@
+/* =====================================================================
+   Der Treff — die beiden Textseiten (11.09.2026)
+
+   Regeln & Hilfe (für die Community) und „Wer sieht was" (für
+   DogFather). Beides sind LESESEITEN: langer, zusammenhängender Text
+   und eine Tabelle, keine Kartenwand.
+
+   ---------------------------------------------------------------------
+   WARUM SIE KEINE MODULKARTEN SIND
+
+   Die naheliegende Wahl wäre `.eintrag-karte` oder ein neuer Eintrag in
+   der MODULLISTE gewesen — dann sähen die Abschnitte aus wie alles
+   andere im Haus: geschliffene Fase, Kantenlicht, Sternenfeld.
+
+   Dagegen sprechen zwei Dinge, und das zweite wiegt schwerer:
+
+   1. Die MODULLISTE steht siebenmal in module.css und wird von
+      pruef-css-klassen Zeichen für Zeichen verglichen. Eine achte Klasse
+      hätte an sieben Stellen dasselbe ergänzen müssen — machbar, aber
+      jede dieser sieben ist eine Gelegenheit für einen Unterschied.
+
+   2. Karten zerteilen. Ein Regeltext ist ein Text, den man von oben
+      nach unten liest; sieben Karten daraus zu machen heißt, sieben
+      Anfänge zu machen. Genau das ist bei Regeln der Fehler: Wer nach
+      der dritten Karte aufhört, hat vier Regeln nicht gelesen und
+      glaubt trotzdem, er kenne sie.
+
+   Deshalb hier nur so viel Trennung, dass man die Abschnitte findet —
+   eine Linie und Abstand, keine Kante.
+   ===================================================================== */
+
+.treff-abschnitt {
+  margin: 0 0 26px;
+  padding: 0 0 22px;
+  border-bottom: 1px solid var(--rand);
+}
+.treff-abschnitt:last-of-type { border-bottom: 0; }
+
+.treff-abschnitt__titel {
+  margin: 0 0 10px;
+  font-size: 1.06rem;
+  font-weight: 650;
+  letter-spacing: .005em;
+  color: var(--text);
+}
+
+/* Der Lesefluss ist hier die eigentliche Aufgabe.
+
+   1,72 statt der üblichen 1,55: Auf einem Handy stehen in einer Zeile
+   etwa 42 Zeichen; bei engem Zeilenabstand verliert man beim Sprung an
+   den Zeilenanfang die Zeile. Das merkt niemand als „schlechter
+   Zeilenabstand" — man liest den Absatz einfach zweimal und hält den
+   Text für kompliziert.
+
+   Und eine Breitengrenze: Über etwa 70 Zeichen je Zeile wird derselbe
+   Sprung wieder schwierig, nur von der anderen Seite. Auf einem breiten
+   Bildschirm liefe der Regeltext sonst über 1100 Pixel. */
+.treff-abschnitt__inhalt { max-width: 68ch; }
+.treff-abschnitt__inhalt p {
+  margin: 0 0 12px;
+  font-size: .92rem;
+  line-height: 1.72;
+  color: var(--text-leise);
+}
+.treff-abschnitt__inhalt p:last-child { margin-bottom: 0; }
+.treff-abschnitt__inhalt strong { color: var(--text); font-weight: 640; }
+
+/* Die Aufzählungen. Die Zahl bzw. der Punkt steht AUSSERHALB des
+   Textblocks — so beginnt jede Zeile einer mehrzeiligen Regel an
+   derselben Stelle, und die Liste bleibt als Liste lesbar. */
+.regel-liste {
+  margin: 0 0 12px;
+  padding-left: 1.35em;
+  font-size: .92rem;
+  line-height: 1.72;
+  color: var(--text-leise);
+}
+.regel-liste li { margin: 0 0 9px; padding-left: .2em; }
+.regel-liste li:last-child { margin-bottom: 0; }
+.regel-liste li::marker { color: var(--text-still); }
+.regel-liste strong { color: var(--text); font-weight: 640; }
+
+/* =====================================================================
+   „WER SIEHT WAS" — die Rechtetafel als Tabelle
+
+   Sie wird aus der echten Tafel gerechnet (rechte.js), nicht gepflegt.
+   Was sie leisten muss: Man soll eine LÜCKE sehen, ohne zu suchen.
+   ===================================================================== */
+
+.rechte-tafel { overflow-x: auto; margin: 0 0 26px; }
+
+.rechte-tafel table {
+  border-collapse: collapse;
+  width: 100%;
+  font-size: .82rem;
+}
+
+/* Die Kopfzeile bleibt stehen. Bei 22 Zeilen und acht Spalten hat man
+   sonst nach dem halben Scrollen vergessen, welche Spalte welche Rolle
+   ist — und rät. Bei einer Rechteübersicht ist Raten das Gegenteil des
+   Zwecks. */
+.rechte-tafel thead th {
+  position: sticky; top: 0; z-index: 1;
+  background: var(--flaeche);
+  padding: 9px 8px;
+  text-align: center;
+  font-weight: 600;
+  color: var(--text-leise);
+  border-bottom: 1px solid var(--rand-hell);
+  white-space: nowrap;
+}
+.rechte-tafel thead th:first-child { text-align: left; }
+
+.rechte-tafel td {
+  padding: 7px 8px;
+  border-bottom: 1px solid var(--rand);
+  text-align: center;
+  color: var(--text-still);
+}
+.rechte-tafel td:first-child {
+  text-align: left;
+  color: var(--text-leise);
+  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
+  font-size: .79rem;
+  white-space: nowrap;
+}
+.rechte-tafel tbody tr:hover td { background: rgba(255, 255, 255, .025); }
+
+/* JA UND NEIN SIND NICHT GRÜN UND ROT.
+
+   Das wäre die naheliegende Wahl und hier die falsche: In dieser
+   Tabelle ist ein „nein" nichts Schlechtes — es ist der Normalfall und
+   genau das, was Filipe wollte. Grün/Rot würde eine Tafel mit 140
+   roten Feldern erzeugen, die aussieht wie ein Schadensbericht.
+
+   Stattdessen: sichtbar gegen leise. Ein Punkt, wo es erlaubt ist,
+   nichts, wo nicht. Man sieht die Zeilen mit vielen Punkten sofort —
+   und das ist die Frage, die man an diese Tabelle hat. */
+.rechte-ja {
+  display: inline-block; width: 7px; height: 7px; border-radius: 50%;
+  background: var(--akzent);
+  box-shadow: 0 0 8px -2px var(--akzent);
+}
+.rechte-nein { color: var(--text-still); opacity: .3; }
+
+/* Die Zählzeile über der Tabelle: „Community — 3 von 22 Seiten". Das
+   ist die eine Zahl, die die ganze Frage beantwortet. */
+.rechte-zahlen {
+  display: flex; flex-wrap: wrap; gap: 8px;
+  margin: 0 0 18px; padding: 0; list-style: none;
+}
+.rechte-zahlen li {
+  padding: 6px 11px;
+  border: 1px solid var(--rand-hell);
+  border-radius: 999px;
+  font-size: .8rem;
+  color: var(--text-leise);
+}
+.rechte-zahlen li b { color: var(--text); font-weight: 650; }
+
+@media (max-width: 620px) {
+  .treff-abschnitt__inhalt p, .regel-liste { font-size: .95rem; }
+  .rechte-tafel table { font-size: .78rem; }
+}
+
+/* =====================================================================
+   DER WEG ZU DEN REGELN — auf jedem Brett des Treffs
+
+   Er steht direkt unter der Unterzeile und sieht aus wie ein Link,
+   nicht wie ein Knopf. Das ist Absicht: Ein Knopf verspricht, dass
+   etwas PASSIERT; hier wechselt man nur die Seite. Wer auf jedem Brett
+   einen zusätzlichen Knopf sieht, zählt ihn nach zwei Tagen zum
+   Hintergrund.
+   ===================================================================== */
+.treff-regelweg {
+  display: inline-block;
+  margin-top: 6px;
+  font-size: .82rem;
+  color: var(--text-leise);
+  text-decoration: none;
+  border-bottom: 1px solid var(--rand-hell);
+  padding-bottom: 1px;
+}
+.treff-regelweg:hover, .treff-regelweg:focus-visible {
+  color: var(--text);
+  border-bottom-color: color-mix(in srgb, var(--akzent) 55%, transparent);
+}
+
+/* Links im Fließtext der Regelseite. Unterstrichen, weil Farbe allein
+   kein Unterschied ist, den jeder sieht (WCAG 1.4.1). */
+.treff-abschnitt__inhalt a {
+  color: var(--text);
+  text-decoration: underline;
+  text-underline-offset: 2px;
+  text-decoration-color: color-mix(in srgb, var(--akzent) 55%, transparent);
+}
+.treff-abschnitt__inhalt a:hover {
+  text-decoration-color: var(--akzent);
+}
+
+/* =====================================================================
+   MELDUNGEN & MASSNAHMEN — ein Fall je Karte
+
+   Karten sind hier richtig, wo sie beim Regeltext falsch waren: Es sind
+   EINZELNE Vorgänge, die man einzeln entscheidet. Jeder Anfang ist ein
+   neuer Fall, und das soll man sehen.
+   ===================================================================== */
+.treff-fall {
+  margin: 0 0 12px;
+  padding: 13px 15px;
+  border: 1px solid var(--rand);
+  border-left: 2px solid color-mix(in srgb, var(--akzent) 45%, transparent);
+  background: rgba(255, 255, 255, .018);
+}
+
+/* Was schon entschieden ist, tritt zurück -- aber es verschwindet
+   nicht. Ausblenden wäre bequemer und wäre falsch: Man muss nachsehen
+   können, wie ein ähnlicher Fall damals entschieden wurde. */
+.treff-fall[data-vorbei="ja"] {
+  opacity: .62;
+  border-left-color: var(--rand);
+}
+
+.treff-fall__titel {
+  margin: 0 0 8px;
+  font-size: .95rem;
+  font-weight: 640;
+  color: var(--text);
+}
+
+.treff-fall__zeile {
+  margin: 0 0 5px;
+  font-size: .85rem;
+  line-height: 1.6;
+  color: var(--text-leise);
+  display: flex;
+  gap: 8px;
+}
+.treff-fall__zeile:last-of-type { margin-bottom: 0; }
+
+/* Das Schild steht in fester Breite links. Ohne sie beginnt jede Zeile
+   woanders, und man liest die Liste als Fließtext statt als Angaben --
+   bei fünf Zeilen je Fall ist das der Unterschied zwischen Überfliegen
+   und Lesenmüssen. */
+.treff-fall__schild {
+  flex: 0 0 7.5em;
+  color: var(--text-still);
+  font-size: .78rem;
+  text-transform: lowercase;
+  padding-top: .1em;
+}
+
+.treff-fall__knoepfe {
+  display: flex; gap: 7px; flex-wrap: wrap;
+  margin-top: 11px; padding-top: 10px;
+  border-top: 1px solid var(--rand);
+}
+/* Der Link "zum Brett" sieht aus wie die Knöpfe daneben -- er tut ja
+   dasselbe: Er bringt einen woandershin. Ein Link, der zwischen zwei
+   Knöpfen anders aussieht, wird für Text gehalten. */
+.treff-fall__knoepfe a.schritt { text-decoration: none; }
+
+@media (max-width: 620px) {
+  /* Untereinander statt nebeneinander: Bei 7,5em Schild und 42 Zeichen
+     Zeilenbreite blieben für den Wert noch etwa 20 Zeichen -- ein Grund
+     in zwei Wörtern je Zeile. */
+  .treff-fall__zeile { display: block; }
+  .treff-fall__schild { display: block; padding: 0 0 1px; }
+}