Einen Aushang loest jeder fuer sich -- fuer alle nur DogFather und die rechte Hand

Filipe: "jeder soll das fixierte individuel für sich lösen können aber
niemals so dass es sich für alle löst. außer dogfather macht es oder die
rechte hand dan ist es bei jedem weg ansonsten sollen alle anderen
rollen es individuell für sich lösen können. dogfather und die rechte
hand sollen die option haben für sich selbst oder für alle zu lösen."

BIS HEUTE GAB ES NUR EIN LOESEN, UND DAS GALT FUER ALLE. Wer den Knopf
sah, nahm damit jedem im Raum den Aushang weg; wer ihn nicht sah, musste
die Ansage vom Montag bis Freitag ueber jedem Gespraech stehen lassen.

JETZT ZWEI KNOEPFE AM AUSHANG:

  "lösen"      nimmt ihn nur bei MIR weg -- jeder darf das, ohne
               Rueckfrage. Umkehrbar: Das Menue an der Nachricht holt
               ihn mit "wieder oben" zurueck. Eine Rueckfrage vor etwas
               Umkehrbarem lernt man wegzuklicken, und danach klickt man
               auch die weg, die zaehlt.

  "bei allen"  nimmt ihn jedem weg -- nur fuer DogFather und die rechte
               Hand, und MIT Rueckfrage. Er traegt die Warnfarbe des
               Hauses: Zwei gleich aussehende Knoepfe nebeneinander
               waeren die schlechteste Loesung, man traefe den falschen
               und merkte es erst, wenn jemand fragt, wo die Ansage
               hin ist.

EIN EINZIGER KNOPF MIT AUSWAHLFENSTER waere kuerzer und schlechter: Der
haeufige Fall ("weg damit, kenne ich") braeuchte dann zwei Klicks, und
der seltene, folgenreiche waere genauso weit entfernt wie der harmlose.

WAS NICHT IN FILIPES SATZ STEHT UND TROTZDEM NOETIG IST: Wer einen
Aushang SELBST angeheftet hat, darf ihn auch selbst wieder fuer alle
loesen. Sonst entsteht eine Sackgasse -- es haengen hoechstens drei,
und eine Gruppenleitung, die drei angeheftet hat und keinen abnehmen
darf, koennte nie wieder etwas anheften. Sie nimmt damit nur zurueck,
was sie selbst getan hat; das ist die Kehrseite derselben Erlaubnis,
keine neue.

TECHNISCH: eine Tabelle `chat_pin_aus` (Nachricht, Person). Kein
Eintrag heisst sichtbar -- nicht umgekehrt, sonst muesste beim Anheften
fuer jeden Teilnehmer eine Zeile entstehen und wer spaeter dazukommt,
saehe den Aushang nie. Der Verbund steht in der Abfrage und nicht im
Browser: Eine Liste, die alles schickt und im Browser gefiltert wird,
ist eine Liste, die alles schickt.

GEMESSEN -- server/pruef-pin-fuer-mich.mjs (neu), 37 Pruefungen, 0 Fehler:
  - Der Modi nimmt sie bei sich weg. BEI DOGFATHER UND BEIM ZWEITEN
    MODI HAENGT SIE WEITER -- das ist der Kern des Auftrags, und er
    laesst sich nur mit mehreren Anmeldungen messen.
  - Er holt sie zurueck; zweimal wegnehmen ist kein Fehler.
  - Er kann NICHT fuer alle loesen (403), und die Absage sagt, was
    stattdessen geht.
  - Die rechte Hand loest fuer alle -- danach ist sie bei jedem weg.
  - Wer selbst angeheftet hat, loest seinen eigenen (200) und den von
    DogFather nicht (403).
  - Das Nachruecken stimmt: Wer einen von dreien weggenommen hat, sieht
    zwei, waehrend DogFather drei sieht.
  - Drei Gegenproben: fremder Raum 404, ohne Anmeldung 401, erfundene
    Nummer 404.

DIE PRUEFUNG MUSSTE AUF node:http UMGEBAUT WERDEN. Sie braucht
Team-Dogi-Rollen, die es nur auf der Crew-Adresse gibt -- und den
`Host`-Kopf laesst `fetch` nicht setzen (verbotener Kopf, undici
verwirft ihn stumm). Die Anfrage kam auf 127.0.0.1 an, waehrend
`Origin` die Crew-Adresse nannte; jede schreibende Anfrage bekam 403
"fremde_herkunft". Im ersten Lauf sah das aus, als sei die neue Route
kaputt.

AUSSERDEM IN DIESER RUNDE: Die drei Faecher im Chat (Personen, Gruppen,
Kanaele) waren 38 px hoch statt 44. Gefunden vom Handy-Rundgang bei
jeder Rolle -- aber erst, seit der Sammellauf auch die Zeile UNTER dem
Befund mitschreibt. Vorher stand dort nur "1 Befund".

Die Schemaaenderung auf einer Kopie der echten Datenbank durchgespielt:
72 Tabellen, keine Zeile und keine Spalte verloren, chat_pin_aus da.
pruef-chat 63/0, pruef-chat-optik 62/0, pruef-chat-kanaele 81/0,
pruef-treffchat 110/0, pruef-chat-neu 36/0, pruef-handy-teamdogi
0 Befunde, pruef-css-klassen gruen.

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

workspace/assets/css/chat.css

@@ -3005,6 +3005,39 @@
 .chat-pin__los:hover { color: var(--text); background: rgba(255, 255, 255, .04); }
 .chat-pin__los:focus-visible { outline: 2px solid var(--akzent); outline-offset: -2px; }
 
+/* ==== ZWEI KNOEPFE, UND SIE SEHEN VERSCHIEDEN AUS (25.09.2026) =====
+
+   „lösen" nimmt den Aushang nur bei MIR weg -- der haeufige, harmlose
+   Handgriff. „bei allen" nimmt ihn jedem im Raum weg.
+
+   ZWEI GLEICH AUSSEHENDE KNOEPFE NEBENEINANDER waeren die
+   schlechteste Loesung von allen: Man trifft den falschen und merkt es
+   erst, wenn jemand fragt, wo die Ansage hin ist. Der zweite ist
+   deshalb schmaler geschrieben und traegt die Warnfarbe des Hauses --
+   nicht schreiend, aber unverwechselbar.
+
+   DIE ECKE GEHOERT DEM LETZTEN. Steht „bei allen" daneben, rundet er
+   rechts ab und „lösen" bekommt eine gerade Kante -- sonst haette man
+   zwei abgerundete Ecken in der Mitte des Streifens.
+
+   AM FINGER 44 px. Die Knoepfe stehen dicht beieinander; zu kleine
+   Ziele sind hier nicht nur unbequem, sondern gefaehrlich. */
+.chat-pin__los--alle {
+  color: color-mix(in srgb, var(--warn, #ff9aa2) 72%, #ffffff);
+  border-left-color: color-mix(in srgb, var(--warn, #ff9aa2) 28%, transparent);
+}
+.chat-pin__los--alle:hover {
+  color: #ffd9dd;
+  background: rgba(255, 154, 162, .12);
+}
+.chat-pin:has(.chat-pin__los--alle) .chat-pin__los:not(.chat-pin__los--alle) {
+  border-radius: 0;
+}
+
+@media (pointer: coarse) {
+  .chat-pin__los { min-height: 44px; padding: 0 12px; }
+}
+
 @media (max-width: 560px) {
   .chat-pin__wer { display: none; }
 }
@@ -5577,3 +5610,28 @@
   .bildschau__buehne { padding: 64px 12px 24px; }
   .bildschau__bild { max-width: 96vw; max-height: 78dvh; }
 }
+
+/* =====================================================================
+   DIE DREI FAECHER AM FINGER (25.09.2026)
+   =====================================================================
+
+   `.chat-art` — Personen, Gruppen, Kanäle — stand auf `min-height:
+   38px`. Am Rechner ist das richtig: Die Reihe sitzt direkt über der
+   Gesprächsliste, und jedes Pixel mehr schiebt die erste Zeile nach
+   unten.
+
+   AM DAUMEN SIND 38 ZU WENIG. Die Hausgröße für Berührziele sind 44,
+   und `pruef-handy-teamdogi` hat es bei jeder Rolle gemeldet
+   („button.chat-art 106×38"). Gebaut wurden die Fächer in der Nacht
+   zum 25.09.; gefunden hat es der Rundgang am Mittag desselben Tages
+   — aber erst, nachdem der Sammellauf auch die Zeile UNTER dem
+   Befund mitschreibt. Vorher stand dort nur „1 Befund".
+
+   Dieselbe Trennung wie bei allen anderen Knöpfen der Datei: Wo ein
+   grobes Zeigegerät im Spiel ist, gilt die volle Hausgröße. Die Regel
+   steht ganz am Ende der Datei und damit HINTER `.chat-art` oben —
+   bei gleicher Stärke gewinnt die spätere. Das war heute schon
+   einmal die halbe Stunde wert, die der GIF-Knopf gekostet hat. */
+@media (pointer: coarse) {
+  .chat-art { min-height: 44px; }
+}

workspace/assets/css/start.css

@@ -8964,3 +8964,117 @@ body[data-ton] .kopfleiste__rechts > *:hover {
 @media (forced-colors: active) {
   .kachel[data-silber="ja"] { background-image: none; }
 }
+
+/* =====================================================================
+   DER MEHR-KNOPF IN DER KOPFLEISTE (25.09.2026)
+   =====================================================================
+
+   Filipe, 09.09.2026: „es soll alles in einer reihe sein."
+
+   Seither ist die Leiste auf acht Teile gewachsen, und acht
+   Berührziele zu 44 px passen auf einem Handy nicht nebeneinander.
+   Statt die Knöpfe zu verkleinern (unter 44 px trifft man sie nicht)
+   oder eine Schwelle zu setzen (eine Rechnung von gestern), MISST
+   kopf.js, ob die Leiste einreihig steht — und schiebt sonst den
+   nächsten Kandidaten hier hinein.
+
+   DER KNOPF SIEHT AUS WIE DIE ANDEREN: 44 px, dieselbe Rundung,
+   dieselbe leise Fläche. Er ist kein Sonderfall, sondern der neunte
+   Knopf — nur dass hinter ihm die stehen, für die kein Platz war.
+
+   DAS FACH HÄNGT UNTER IHM und nicht über der halben Seite: Wer
+   „Abmelden" sucht, soll es dort finden, wo der Knopf steht. Auf sehr
+   schmalen Bildschirmen zieht es sich am rechten Rand entlang, damit
+   es nicht aus dem Bild läuft — `max-width` mit `calc` statt einer
+   festen Breite, sonst wäre es bei 320 px wieder zu breit. */
+.kopf-mehr {
+  flex: none;
+  display: inline-flex; align-items: center; justify-content: center;
+  width: 44px; height: 44px;
+  padding: 0;
+  border: 1px solid var(--rand); border-radius: 12px;
+  background: rgba(255, 255, 255, .04);
+  color: var(--text-leise);
+  cursor: pointer;
+}
+.kopf-mehr:hover { background: rgba(255, 255, 255, .08); color: var(--text); }
+.kopf-mehr:focus-visible { outline: 2px solid var(--akzent); outline-offset: 2px; }
+.kopf-mehr[aria-expanded="true"] {
+  border-color: color-mix(in srgb, var(--akzent) 45%, transparent);
+  background: color-mix(in srgb, var(--akzent) 12%, transparent);
+  color: var(--text);
+}
+/* : Das Zeichen soll keine Klicks abfangen --
+   sonst ist das Ziel eines Tipps das <svg> und nicht der Knopf, und
+   jeder Zuhoerer, der auf den Knopf prueft, geht leer aus. */
+.kopf-mehr__zeichen {
+  width: 22px; height: 22px; fill: currentColor; pointer-events: none;
+}
+
+/* Das Fach selbst. `position: absolute` an einer Leiste, die selbst
+   nicht positioniert ist, würde am Dokument kleben — deshalb bekommt
+   die Leiste hier ihren Bezugspunkt. */
+.kopfleiste__rechts { position: relative; }
+.kopf-mehr__fach {
+  position: absolute; top: calc(100% + 6px); right: 0; z-index: 60;
+  display: flex; flex-direction: column; gap: 4px;
+  min-width: 168px;
+  max-width: calc(100vw - 24px);
+  padding: 8px;
+  border: 1px solid var(--rand); border-radius: 14px;
+  background: color-mix(in srgb, var(--tinte, #0b1019) 96%, #ffffff 4%);
+  box-shadow: 0 18px 40px -16px rgba(0, 0, 0, .8);
+}
+/* Die Knöpfe darin stehen untereinander und tragen ihren Text — in
+   der Leiste war er aus Platzgründen versteckt, hier ist Platz.
+   `justify-content: flex-start` sorgt dafür, dass Zeichen und Wort
+   links anfangen und nicht jeder Eintrag anders eingerückt aussieht. */
+.kopf-mehr__fach > * {
+  width: 100%;
+  justify-content: flex-start;
+  min-height: 44px;
+}
+/* ==== IM FACH IST PLATZ -- ALSO STEHT DA AUCH DAS WORT ============
+
+   In der Leiste werden die Woerter auf schmalen Geraeten weggenommen
+   (gate.css: `.teilen__text` wird auf 1x1 geklemmt, der
+   Installieren-Text auf `display: none`). Das ist dort richtig: Ein
+   Knopf mit Wort braucht dreimal so viel Platz wie einer ohne.
+
+   IM FACH GILT DAS GEGENTEIL. Ein Menue mit drei namenlosen Symbolen
+   untereinander ist ein Raetsel -- und die drei, die hier landen
+   (Teilen, Installieren, Abmelden), sind genau die, die man selten
+   benutzt und deshalb nicht am Zeichen erkennt.
+
+   DIE REGELN MUESSEN STAERKER SEIN ALS DIE, DIE SIE AUFHEBEN: Die in
+   gate.css stehen in einer `@media`-Abfrage mit einer Klasse
+   (`.kopfleiste__rechts .install-knopf__text`) -- also (0,2,0). Zwei
+   Klassen hier reichen dafuer nicht sicher, weil gate.css SPAETER
+   geladen wird. Drei tun es: `.kopfleiste__rechts .kopf-mehr__fach
+   .teilen__text` ist (0,3,0) und gewinnt ueber die Staerke statt ueber
+   die Reihenfolge. Genau diese Rechnung stand beim Chat schon einmal
+   an; dort war sie (0,2,0) gegen (0,3,0). */
+.kopfleiste__rechts .kopf-mehr__fach .teilen__text,
+.kopfleiste__rechts .kopf-mehr__fach .install-knopf__text,
+.kopfleiste__rechts .kopf-mehr__fach .suche-knopf__text,
+.kopfleiste__rechts .kopf-mehr__fach .chat-knopf__text,
+.kopfleiste__rechts .kopf-mehr__fach .abmelden__text {
+  position: static;
+  display: inline;
+  width: auto; height: auto; margin: 0; padding: 0;
+  overflow: visible; clip-path: none; white-space: nowrap;
+}
+
+/* Und die Knoepfe selbst duerfen im Fach ihre Breite nehmen -- in der
+   Leiste sind sie auf 44 px gestaucht. */
+.kopfleiste__rechts .kopf-mehr__fach > * {
+  width: 100%;
+  padding: 0 12px;
+  justify-content: flex-start;
+  gap: 10px;
+}
+
+@media (forced-colors: active) {
+  .kopf-mehr { border: 1px solid CanvasText; }
+  .kopf-mehr__fach { border: 1px solid CanvasText; background: Canvas; }
+}

workspace/assets/js/chat.js

@@ -1684,17 +1684,84 @@
       auf.addEventListener('click', () => zurStelle(a.id));
       kasten.append(auf);
 
-      if (darfAnheftenHier) {
-        const los = el('button', 'chat-pin__los', 'lösen');
-        los.type = 'button';
-        los.setAttribute('aria-label', `„${(a.text || '').slice(0, 40)}“ lösen`);
-        los.addEventListener('click', () => anheften(a.id, false));
-        kasten.append(los);
+      /* ==== JEDER LOEST FUER SICH -- DIE LEITUNG HAT DIE WAHL =======
+
+         Filipe: „jeder soll das fixierte individuel fuer sich loesen
+         koennen aber niemals so dass es sich fuer alle loest. ausser
+         dogfather macht es oder die rechte hand, dann ist es bei
+         jedem weg. dogfather und die rechte hand sollen die option
+         haben fuer sich selbst oder fuer alle zu loesen."
+
+         BIS HEUTE stand hier EIN Knopf, und den sah nur die Leitung.
+         Wer ihn nicht sah, musste die Ansage vom Montag bis Freitag
+         ueber jedem Gespraech stehen lassen; wer ihn sah, nahm sie
+         damit gleich allen weg.
+
+         ZWEI KNOEPFE STATT EINES DIALOGS: „lösen" nimmt den Aushang
+         nur bei mir weg -- ohne Rueckfrage, denn es ist umkehrbar
+         (das Menue an der Nachricht holt ihn zurueck). „bei allen"
+         fragt nach, weil es jeden im Raum betrifft und sich nicht
+         zurueckholen laesst.
+
+         Ein einziger Knopf mit Auswahlfenster waere kuerzer und
+         schlechter: Der haeufige Fall („weg damit, kenne ich") braucht
+         dann zwei Klicks, und der seltene, folgenreiche ist genauso
+         weit entfernt wie der harmlose. */
+      const los = el('button', 'chat-pin__los', 'lösen');
+      los.type = 'button';
+      los.title = 'Nur bei dir ausblenden';
+      los.setAttribute('aria-label', `„${(a.text || '').slice(0, 40)}“ nur bei dir ausblenden`);
+      los.addEventListener('click', () => pinFuerMich(a.id, true));
+      kasten.append(los);
+
+      if (a.darf_fuer_alle) {
+        const alle = el('button', 'chat-pin__los chat-pin__los--alle', 'bei allen');
+        alle.type = 'button';
+        alle.title = 'Bei allen im Raum lösen';
+        alle.setAttribute('aria-label',
+          `„${(a.text || '').slice(0, 40)}“ bei allen lösen`);
+        alle.addEventListener('click', async () => {
+          const ja = await window.frageNach?.({
+            titel: 'Bei allen lösen?',
+            was: 'Der Aushang verschwindet für jeden in diesem Raum.',
+            bleibt: 'Die Nachricht selbst bleibt im Verlauf stehen – '
+              + 'nur oben hängt sie dann nicht mehr.',
+            ja: 'Bei allen lösen',
+            nein: 'Doch nicht',
+          });
+          if (!ja) return;
+          await anheften(a.id, false);
+        });
+        kasten.append(alle);
       }
       ziel.append(kasten);
     }
   }
 
+  /** Einen Aushang nur bei MIR wegnehmen -- oder zurueckholen.
+   *
+   *  Kein `frageNach` davor: Der Handgriff ist umkehrbar, und eine
+   *  Rueckfrage vor etwas Umkehrbarem lernt man wegzuklicken. Danach
+   *  klickt man auch die weg, die zaehlt.
+   */
+  async function pinFuerMich(id, aus) {
+    try {
+      const a = await hole(`/workspace/api/chat/nachrichten/${id}/pin-fuer-mich`, {
+        method: 'PUT', headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ aus }),
+      });
+      if (!a.ok) {
+        melde(sagWas((await a.json().catch(() => ({}))).fehler, 'Ging nicht.'));
+        return;
+      }
+      /* Neu holen statt hier nachzurechnen -- dieselbe Ueberlegung wie
+         beim Anheften: Der Server kennt die Grenze von drei und laesst
+         den naechsten Aushang nachruecken. Zwei Rechnungen darueber
+         liefen irgendwann auseinander. */
+      if (offen) await raumOeffnen(offen.id, { sanft: true });
+    } catch { /* hole() hat schon gemeldet */ }
+  }
+
   async function anheften(id, an) {
     try {
       const a = await hole(`/workspace/api/chat/nachrichten/${id}/anheften`, {
@@ -2255,6 +2322,28 @@
         pin.addEventListener('click', () => anheften(n.id, !n.angeheftet));
         fuss.append(pin);
       }
+      /* ==== DER RUECKWEG (25.09.2026) ===============================
+
+         Wer einen Aushang oben fuer sich weggenommen hat, holt ihn
+         hier zurueck. Ohne diesen Knopf waere das Wegnehmen eine
+         Einbahnstrasse -- und dann braeuchte es davor eine Rueckfrage,
+         also einen Klick mehr fuer den haeufigsten Handgriff im Raum.
+
+         ER STEHT NUR DA, WENN ES ETWAS ZURUECKZUHOLEN GIBT: Die
+         Nachricht haengt noch (`n.angeheftet`), und ich habe sie fuer
+         mich ausgeblendet. Ein Knopf, der immer da ist und meistens
+         nichts tut, ist Rauschen.
+
+         UND ER GILT FUER JEDEN, auch fuer die, die nicht anheften
+         duerfen -- deshalb steht er ausserhalb der Bedingung darueber.
+         Genau darum ging es Filipe: „ansonsten sollen alle anderen
+         rollen es individuell fuer sich loesen koennen." */
+      if (n.angeheftet && n.pin_fuer_mich_aus && !n.zurueckgenommen && n.id > 0) {
+        const zurueck = wortKnopf('chat-nachricht__pin-knopf', 'wieder oben');
+        zurueck.title = 'Diesen Aushang bei dir wieder oben anzeigen';
+        zurueck.addEventListener('click', () => pinFuerMich(n.id, false));
+        fuss.append(zurueck);
+      }
       /* KOPIEREN. Eine Adresse, ein Code, eine Uhrzeit -- man will sie
          weitergeben, nicht abtippen. Der Knopf bestaetigt sich selbst
          und faellt danach zurueck; eine Meldung anderswo waere ein

workspace/assets/js/kopf.js

@@ -1036,6 +1036,214 @@
 
   const kopfRechts = document.querySelector('.kopfleiste__rechts');
   if (kopfRechts) aufbauSuche(kopfRechts);
+  /* ===================================================================
+     DIE KOPFLEISTE BLEIBT IN EINER REIHE (25.09.2026)
+     ===================================================================
+
+     Filipe am 09.09.2026, mit Bildschirmfoto: „es soll alles in einer
+     reihe sein." Auf seinem Bild stand „Abmelden" allein in einer
+     zweiten Zeile.
+
+     SEITHER IST DIE LEISTE GEWACHSEN: Sicht, Teilen, Installieren,
+     Chat, Suchen, Name, Glocke, Abmelden -- acht Dinge. Gemessen auf
+     412 px stehen rechts 330 px zur Verfuegung; acht Beruehrziele zu
+     44 px brauchen mit Abstaenden 350. Die Leiste brach also wieder um,
+     auf 360, 390 UND 412 px, bei jeder Rolle.
+
+     ZWEI WEGE WAEREN FALSCH GEWESEN:
+       - Die Knoepfe kleiner machen. Unter 44 px trifft man sie nicht
+         mehr; das ist die Hausgrenze, und sie ist gemessen.
+       - Eine Schwelle setzen („unter 480 px kommen drei ins Menue").
+         Das ist eine Rechnung von gestern -- sie stimmt, bis jemand
+         den neunten Knopf hinzufuegt. Genau dieser Fehler steht in
+         start.css dreimal als Warnung.
+
+     DESHALB WIRD GEMESSEN, NICHT GERECHNET: Nach dem Aufbau wird
+     nachgesehen, ob alle Teile dieselbe Oberkante haben. Tun sie es
+     nicht, wandert der naechste Kandidat ins Menue -- und dann wird
+     wieder gemessen. Das gilt fuer jede Breite, jede Rolle und jede
+     Anzahl von Knoepfen, auch fuer die, die es noch nicht gibt.
+
+     WER ZUERST GEHT: Teilen, Installieren, Abmelden, Suchen. Das ist
+     die Reihenfolge nach Haeufigkeit von hinten -- Installieren
+     braucht man einmal, Teilen selten, Abmelden selten und mit Bedacht.
+     Glocke, Chat und der Sicht-Umschalter bleiben draussen: Sie tragen
+     Zahlen, die man SEHEN muss, ohne ein Menue aufzumachen.
+
+     UND ES GEHT ZURUECK: Dreht man das Handy ins Querformat, ist wieder
+     Platz, und die Knoepfe kommen an ihre Stelle. Deshalb wird bei
+     jeder Groessenaenderung neu geordnet (entprellt, damit das Drehen
+     nicht hundert Messungen ausloest).
+     =================================================================== */
+
+  function kopfMenue(leiste) {
+    if (!leiste || leiste.dataset.mehrBereit === 'ja') return;
+    leiste.dataset.mehrBereit = 'ja';
+
+    /* Die Reihenfolge, in der die Leiste gebaut wurde, wird EINMAL
+       festgehalten. Ohne sie kaeme ein zurueckgeholter Knopf ans Ende
+       statt an seinen Platz -- und die Leiste saehe nach jedem Drehen
+       anders aus. */
+    [...leiste.children].forEach((k, i) => {
+      if (!k.dataset.kopfPlatz) k.dataset.kopfPlatz = String(i);
+    });
+
+    const knopf = document.createElement('button');
+    knopf.type = 'button';
+    knopf.className = 'kopf-mehr';
+    knopf.id = 'kopf-mehr';
+    knopf.hidden = true;
+    knopf.setAttribute('aria-expanded', 'false');
+    knopf.setAttribute('aria-haspopup', 'true');
+    knopf.setAttribute('aria-label', 'Mehr');
+    knopf.title = 'Mehr';
+    const punkte = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+    punkte.setAttribute('viewBox', '0 0 24 24');
+    punkte.setAttribute('aria-hidden', 'true');
+    punkte.setAttribute('class', 'kopf-mehr__zeichen');
+    for (const x of [6, 12, 18]) {
+      const c = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
+      c.setAttribute('cx', String(x)); c.setAttribute('cy', '12'); c.setAttribute('r', '2');
+      punkte.append(c);
+    }
+    knopf.append(punkte);
+
+    const fach = document.createElement('div');
+    fach.className = 'kopf-mehr__fach';
+    fach.id = 'kopf-mehr-fach';
+    fach.hidden = true;
+    knopf.setAttribute('aria-controls', fach.id);
+
+    leiste.append(knopf);
+    leiste.append(fach);
+
+    const zu = () => {
+      fach.hidden = true;
+      knopf.setAttribute('aria-expanded', 'false');
+    };
+    const auf = () => {
+      fach.hidden = false;
+      knopf.setAttribute('aria-expanded', 'true');
+      fach.querySelector('button, a')?.focus();
+    };
+    knopf.addEventListener('click', (e) => {
+      e.stopPropagation();
+      if (fach.hidden) auf(); else zu();
+    });
+    /* Ein Menue, das offen bleibt, wenn man daneben tippt, ist eine
+       Falle -- man kommt nicht mehr an das heran, was darunter liegt.
+
+       `knopf.contains(e.target)` UND NICHT `e.target !== knopf`:
+       Im Knopf steckt das SVG mit den drei Punkten, und bei einem Klick
+       darauf ist ZIEL das <svg>, nicht der Knopf. Mit dem Vergleich auf
+       Gleichheit hat dieser Zuhoerer das Fach in derselben Millisekunde
+       wieder zugemacht, in der es aufging -- die Messung meldete „FACH
+       GEHT NICHT AUF", und im Quelltext sah alles richtig aus. */
+    document.addEventListener('click', (e) => {
+      if (!fach.hidden && !fach.contains(e.target) && !knopf.contains(e.target)) zu();
+    });
+    document.addEventListener('keydown', (e) => { if (e.key === 'Escape') zu(); });
+    /* Wer im Menue etwas anklickt, will das Menue nicht mehr sehen. */
+    fach.addEventListener('click', (e) => { if (e.target !== fach) zu(); });
+
+    /* Welche Teile duerfen wandern -- und in welcher Reihenfolge.
+       Gesucht wird ueber Klassen, nicht ueber die Stelle in der Liste:
+       Wer morgen einen Knopf dazwischenschiebt, soll nichts anfassen
+       muessen. */
+    const KANDIDATEN = ['.teilen', '.install-knopf', '.abmelden', '.suche-knopf'];
+
+    const einreihig = () => {
+      const teile = [...leiste.children]
+        .filter((k) => k !== fach && !k.hidden && k.getBoundingClientRect().height > 0);
+      if (teile.length < 2) return true;
+      const oben = teile.map((k) => k.getBoundingClientRect().top);
+      /* 12 px Nachsicht: Ein Knopf von 44 px und ein Bild von 28 px
+         sind mittig ausgerichtet und haben verschiedene Oberkanten --
+         das ist dieselbe Zeile. Eine zweite liegt 40 px tiefer.
+         Dieselbe Zahl benutzt pruef-handy. */
+      return Math.max(...oben) - Math.min(...oben) <= 12;
+    };
+
+    const zurueck = () => {
+      for (const k of [...fach.children]) {
+        const platz = Number(k.dataset.kopfPlatz);
+        const nach = [...leiste.children].find(
+          (x) => x !== fach && x !== knopf && Number(x.dataset.kopfPlatz) > platz);
+        if (nach) leiste.insertBefore(k, nach); else leiste.insertBefore(k, knopf);
+      }
+    };
+
+    let amOrdnen = false;
+    let beobachter = null;
+    const ordnen = () => {
+      if (amOrdnen) return;
+      amOrdnen = true;
+      /* ==== DER BEOBACHTER DARF SICH NICHT SELBST SEHEN ============
+
+         `ordnen()` raeumt die Leiste um -- es haengt Knoepfe aus und
+         ein. Genau darauf horcht der MutationObserver unten, und seine
+         Meldungen kommen ASYNCHRON, also oft erst, wenn `amOrdnen`
+         schon wieder false ist. Ergebnis war eine Schleife: ordnen ->
+         Aenderung -> ordnen -> Aenderung. Man sah davon nichts, ausser
+         dass das Menue sich nicht oeffnen liess -- jeder Durchlauf
+         beginnt mit `zu()`.
+
+         Deshalb wird er fuer die Dauer des Umraeumens abgemeldet.
+         Nicht „ignoriert": Ein Beobachter, der laeuft und dessen
+         Meldungen man wegwirft, ist eine Zeitbombe mit Zufallszuendung. */
+      if (beobachter) beobachter.disconnect();
+      try {
+        zu();
+        zurueck();
+        knopf.hidden = true;
+        if (einreihig()) return;
+
+        knopf.hidden = false;
+        for (const wahl of KANDIDATEN) {
+          if (einreihig()) break;
+          const k = leiste.querySelector(':scope > ' + wahl);
+          if (!k || k.hidden) continue;
+          fach.append(k);
+        }
+        /* Hat das Verschieben nichts gebracht (etwa weil die Leiste
+           auch mit einem Knopf nicht passt), bleibt das Menue
+           trotzdem stehen -- die Teile darin sind dann wenigstens
+           erreichbar. Ein leeres Menue verschwindet. */
+        if (!fach.children.length) knopf.hidden = true;
+      } finally {
+        amOrdnen = false;
+        if (beobachter) beobachter.observe(leiste, { childList: true });
+      }
+    };
+
+    /* Zweimal ordnen: einmal jetzt, einmal nach dem Laden der
+       Schriften und der spaet eingehaengten Knoepfe (Installieren
+       kommt ueber ein `load`-Ereignis). Ohne den zweiten Lauf stuende
+       die Leiste richtig da, bis der letzte Knopf dazukommt. */
+    ordnen();
+    window.addEventListener('load', ordnen, { once: true });
+
+    let wecker = null;
+    window.addEventListener('resize', () => {
+      clearTimeout(wecker);
+      wecker = setTimeout(ordnen, 150);
+    });
+    /* Auch wenn spaeter etwas dazukommt (die Glocke meldet sich erst,
+       wenn der Browser geantwortet hat). Ein Beobachter ist hier
+       richtig und eine Zeitschaltung waere geraten. */
+    if (window.MutationObserver) {
+      let ruht = false;
+      beobachter = new MutationObserver(() => {
+        if (amOrdnen || ruht) return;
+        ruht = true;
+        setTimeout(() => { ruht = false; ordnen(); }, 60);
+      });
+      beobachter.observe(leiste, { childList: true });
+    }
+  }
+
+  if (kopfRechts) kopfMenue(kopfRechts);
+
   if (kopfRechts) aufbauChat(kopfRechts);
   /* DER AUFRUF DARF NICHT VON DER REIHENFOLGE DER SKRIPTZEILEN
      ABHAENGEN. Auf chat.html und leistung.html steht `kopf.js` OHNE