Die Kopfleiste bleibt auch in einer fremden Sicht in EINER Reihe

Filipe, mit Bildschirmfoto aus der installierten App: "es ist noch
nicht alles in einer zeile und irgendwie funktionieren nicht alle
knoepfe."

DER GRUND WAR NICHT DIE BREITE SEINES GERAETS, SONDERN DER ZUSTAND.
In der eigenen Sicht klappt der Umschalter auf 36 px zusammen; sobald
man die Sicht einer anderen Person uebernimmt, stand der Name darin und
er war 152 px breit. Gemessen waren es dann zwei Zeilen bei 320, 360,
390, 412 UND 430 px -- ausnahmslos. Auf seinem Bild stand "Miesmus..."
im Umschalter und der goldene Rahmen um die Seite: er war in einer
fremden Sicht.

MEINE PRUEFUNGEN HABEN DEN FALSCHEN ZUSTAND GEMESSEN. pruef-handy lief
ausschliesslich in der eigenen Sicht und war deshalb gruen, waehrend
es beim Nutzer zweizeilig war. Ein gruener Haken sagt nur, dass die
Bedingung erfuellt war -- nicht, dass sie den Zustand geprueft hat, in
dem der Nutzer ist. Die Pruefung wechselt jetzt selbst in eine fremde
Sicht (92 -> 99 Pruefungen).

WAS SICH AENDERT
- Auf dem Handy ist der Umschalter auch in fremder Sicht ein
  Zeichenknopf: Auge + Anfangsbuchstabe, 46-48 statt 152 px, in der
  ROLLENFARBE der Person, deren Sicht laeuft. Die Farbe kommt aus
  `data-rolle` -- dieselbe Zuordnung, die gate.css ohnehin hat, keine
  zweite Farbliste.
- Der volle Name wandert in ein Band unter die Leiste, zusammen mit
  "Zurueck zu meiner Sicht" als ganzem Satz statt als 28-px-Kreuz. Er
  steht dort GANZ statt als "Miesmus...". Am Rechner bleibt alles wie
  bisher; dort ist Platz.
- Der Rahmen um die Seite nimmt dieselbe Farbe an. Man sieht damit
  nicht nur DASS eine fremde Sicht laeuft, sondern WESSEN.
- Das `:not([data-fremd="ja"])` faellt an beiden Stellen weg. Es war
  der ganze Fehler: eine Regel, die den wichtigeren Fall ausnahm.

UND DER BLOCK FUER SCHMALE GERAETE STAND AN DER FALSCHEN STELLE
Er galt bis 340 px und stand 3600 Zeilen VOR dem 560er-Block -- bei
gleicher Spezifitaet verliert er damit. Gewirkt hat er nur, weil sein
Selektor zufaellig ein `:not()` trug. Jetzt steht er direkt hinter dem
560er und gilt bis 400 px (34 px je Knopf, 4 px Abstand). Damit bleibt
auch bei 360 px auf den UNTERSEITEN alles in einer Reihe -- dort stehen
zusaetzlich der Zurueck-Knopf und die Glocke.

Gemessen nach dem Umbau, eigene und fremde Sicht, Start- und
Unterseite: 360, 390, 412 und 430 px alle einzeilig. Offen bleibt
320 px (iPhone SE 1. Generation bzw. Anzeige-Zoom) -- dort passt es
ohne das Weglassen einer Funktion nicht, das ist eine Entscheidung
und kein Handgriff.

DER SICHERE BEREICH (auf Filipes Zusage)
Jede der 20 Seiten sagt `viewport-fit=cover`, aber im ganzen Workspace
stand kein einziges `env(safe-area-inset-*)`. Sein Android ist NICHT
betroffen (im Bildschirmfoto nachgesehen), ein iPhone waere es: Von
einem 36-px-Knopf blieben unter einer 47 px hohen Statusleiste
rechnerisch 5 px zum Antippen. Einmal zentral benannt (gate.css) und an
den vier Stellen angewandt, wo etwas am Rand klebt: Kopfleiste (oben und
seitlich), Inhalt (seitlich und unten), Speichern-Leiste im Profil,
Chat-Eingabe. Auf Geraeten ohne Aussparung sind alle vier Werte 0.

Nebenbei: chat.js misst die Hoehe ueber der Chatflaeche jetzt
einschliesslich des Bandes -- sonst stuende das Eingabefeld genau um
dessen Hoehe unter dem Bildschirmrand. Derselbe Fehler wie mit den
festen 62 px, nur mit einem anderen Element.

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

workspace/assets/css/gate.css

@@ -225,6 +225,33 @@
   --r-haupt: var(--akzent);
   --r-zweit: var(--violett);
   --r-tief:  var(--akzent-tief);
+
+  /* ---- DER SICHERE BEREICH (09.09.2026) --------------------------
+
+     Jede der 20 Workspace-Seiten sagt `viewport-fit=cover` -- die Seite
+     wird also bis unter Statusleiste, Aussparung und Gestenleiste
+     gezeichnet. Das ist gewollt (randloser Hintergrund), verlangt aber,
+     dass man den belegten Rand wieder abzieht. Genau das fehlte hier:
+     im ganzen Workspace stand kein einziges `env(safe-area-inset-*)`,
+     waehrend die Webdesign-Seiten es laengst haben.
+
+     Im Browser faellt es nicht auf, weil die Adresszeile die Seite nach
+     unten schiebt. INSTALLIERT gibt es die nicht mehr -- dann liegt die
+     Kopfleiste auf einem iPhone hinter der Uhr, und von einem 36-px-Knopf
+     bleiben rechnerisch 5 px zum Antippen uebrig.
+
+     Filipes Android ist NICHT betroffen (nachgesehen im Bildschirmfoto,
+     die App beginnt dort sauber unter der Statusleiste) -- das hier ist
+     fuer die iPhones im Team.
+
+     Einmal zentral benannt statt an fuenfzehn Stellen einzeln
+     geschrieben: Wer sie einzeln schreibt, vergisst eine, und dann liegt
+     genau ein Knopf unter der Gestenleiste. Auf Geraeten ohne
+     Aussparung sind alle vier 0 -- dort aendert sich nichts. */
+  --ws-sicher-oben:   env(safe-area-inset-top, 0px);
+  --ws-sicher-unten:  env(safe-area-inset-bottom, 0px);
+  --ws-sicher-links:  env(safe-area-inset-left, 0px);
+  --ws-sicher-rechts: env(safe-area-inset-right, 0px);
 }
 
 /* Die Rolle steht am <html> (gesetzt in kopf.js) — damit gilt sie für