Workspace: Suche ueber alle Bereiche (Phase 4)

Auf JEDER Seite, nicht auf einer eigenen. kopf.js baut sie selbst in die
Kopfleiste ein -- eine Suche, die man nur auf einer Extraseite findet,
benutzt niemand. Mit "/" oeffnen, mit Esc schliessen.

Durchsucht: Aufgaben, Termine, Calls, Gespraechsprotokolle, Dateien, die
fuenf Betreuungsbereiche, die Scout-Pipeline und die offenen Felder der
Creator-Profile.

Zwei Dinge machen den Unterschied zwischen einer Suche und einer
brauchbaren Suche:

1. SIE DARF NICHTS FINDEN, WAS DIE SEITE VERBERGEN WUERDE.

Eine Suche ist die verlockendste Stelle fuer ein Datenleck: Man tippt
einen Namen und bekommt Treffer aus Bereichen, die man nie oeffnen
duerfte. Jede Quelle wird deshalb mit der Sichtbarkeitsregel ihres
eigenen Moduls abgefragt -- importiert, nicht abgeschrieben.

Die management-internen Profilfelder (admin_notiz, plan_start,
naechster_review) werden GAR NICHT durchsucht, auch nicht fuer das
Management: Ein Treffer daraus taucht sonst spaeter in einer Ansicht
auf, die diese Felder nicht zeigen darf. Wer die Notiz lesen will,
oeffnet das Profil.

Geprueft mit einem eigenen Leck-Test: "GEHEIM" (Inhalt einer internen
Notiz) findet niemand, auch der Chef nicht. Die Lead-Notiz eines Scouts
findet nur er selbst und das Management, nicht der andere Scout.

2. SIE MUSS SAGEN, WO ETWAS STEHT.

Jeder Treffer traegt einen Ausschnitt RUND UM die Fundstelle, nicht die
ersten Zeichen des Feldes -- man sieht sofort, warum etwas gefunden
wurde. Bei Profiltreffern steht dabei, welches Feld getroffen hat, bei
Protokollen ob es unter "Besprochen" oder "Entscheidung" stand. Und
jeder Treffer fuehrt an die Stelle, an der man weiterarbeiten kann.

LIKE-Sonderzeichen werden maskiert. Ohne das waere die Suche nach "100%"
eine Suche nach "100 gefolgt von irgendwas" und "a_b" faende auch "axb"
-- beides falsch und beides faellt erst spaet auf. Geprueft: "100%" und
"a_b" finden genau ihren Eintrag, "axb" findet nichts.

Bewusst kein Volltextindex (FTS5): Die Datenmengen sind klein, und LIKE
braucht keinen zweiten Datenstand, der irgendwann auseinanderlaeuft.

Kleinigkeiten aus dem Test:
- Das Overlay stand auf voller Hoehe, auch bei zwei Treffern -- der
  Schleier ist flex und stand auf dem voreingestellten stretch. Jetzt
  flex-start, das Fenster waechst mit dem Inhalt (417 statt 780 px bei
  drei Treffern).
- Das eingebaute Kreuz von type="search" sass direkt neben dem
  Esc-Knopf: zwei Wege fuer dasselbe, dicht nebeneinander. Entfernt.
- Das CSS liegt in gate.css, nicht in einer Seiten-Datei -- genau der
  Fehler, der bei .knopf-still schon einmal passiert ist.

workspace/assets/css/gate.css

@@ -379,3 +379,114 @@ body.oeffnet .buehne__bild { filter: saturate(1) brightness(1); transition: filt
   }
   .buehne__bild { transform: none; transition: none; }
 }
+
+/* ===================================================================
+   Suche über alle Bereiche.
+
+   Liegt bewusst hier und nicht in einer Seiten-Datei: kopf.js baut die
+   Suche auf JEDER Workspace-Seite ein, also muss auch das Aussehen
+   überall geladen sein. gate.css ist die einzige Datei, die das
+   erfüllt. (Genau der Fehler, der bei .knopf-still schon einmal
+   passiert ist -- Baustein in einer Seiten-Datei, prompt fehlte er
+   woanders.)
+   =================================================================== */
+
+.suche-knopf {
+  display: inline-flex; align-items: center; gap: 7px;
+  padding: 7px 13px; cursor: pointer;
+  background: rgba(255, 255, 255, .04);
+  border: 1px solid var(--rand); border-radius: 999px;
+  color: var(--text-still); font: inherit; font-size: .82rem;
+  transition: color .16s ease, border-color .16s ease, background .16s ease;
+}
+.suche-knopf:hover {
+  color: var(--text);
+  border-color: rgba(63, 189, 245, .4);
+  background: rgba(63, 189, 245, .08);
+}
+.suche-knopf__lupe {
+  width: 15px; height: 15px; flex: none;
+  fill: none; stroke: currentColor; stroke-width: 1.8;
+  stroke-linecap: round;
+}
+@media (max-width: 620px) { .suche-knopf__text { display: none; } }
+
+.suche-schleier {
+  position: fixed; inset: 0; z-index: 80;
+  /* flex-start, nicht das voreingestellte stretch -- sonst zieht sich
+     das Fenster auf volle Hoehe, auch bei zwei Treffern. */
+  display: flex; justify-content: center; align-items: flex-start;
+  padding: 9vh 18px 18px;
+  background: rgba(3, 5, 10, .74);
+  backdrop-filter: blur(5px);
+}
+body.suche-offen { overflow: hidden; }
+
+.suche-fenster {
+  width: min(680px, 100%); max-height: 78vh;
+  display: flex; flex-direction: column;
+  background: #0b111b;
+  border: 1px solid rgba(63, 189, 245, .26);
+  border-radius: var(--radius);
+  box-shadow: 0 28px 70px -22px rgba(0, 0, 0, .85);
+  overflow: hidden;
+}
+
+.suche-zeile {
+  display: flex; align-items: center; gap: 10px;
+  padding: 14px 16px;
+  border-bottom: 1px solid var(--rand);
+}
+.suche-feld {
+  flex: 1; min-width: 0; padding: 6px 2px;
+  background: transparent; border: 0;
+  color: var(--text); font: inherit; font-size: 1.02rem;
+}
+.suche-feld:focus { outline: none; }
+.suche-feld::placeholder { color: var(--text-still); }
+/* Das eingebaute Kreuz von type="search" steht sonst direkt neben dem
+   Esc-Knopf -- zwei Wege, dasselbe zu tun, dicht nebeneinander. */
+.suche-feld::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
+.suche-zu {
+  flex: none; padding: 4px 9px; cursor: pointer;
+  background: rgba(255, 255, 255, .05);
+  border: 1px solid var(--rand); border-radius: var(--radius-klein);
+  color: var(--text-still); font: inherit; font-size: .74rem; letter-spacing: .04em;
+}
+.suche-zu:hover { color: var(--text); border-color: rgba(255, 255, 255, .22); }
+
+.suche-ergebnis { overflow-y: auto; padding: 6px 10px 12px; }
+.suche-hinweis {
+  margin: 0; padding: 26px 8px; text-align: center;
+  color: var(--text-still); font-size: .88rem;
+}
+
+.suche-gruppe { margin-top: 10px; }
+.suche-gruppe__titel {
+  margin: 0 0 5px; padding: 0 8px;
+  font-size: .71rem; font-weight: 700;
+  letter-spacing: .08em; text-transform: uppercase; color: var(--akzent);
+}
+
+.suche-treffer {
+  display: block; padding: 9px 11px; margin-bottom: 3px;
+  border-radius: var(--radius-klein);
+  color: var(--text); text-decoration: none;
+  border: 1px solid transparent;
+}
+.suche-treffer:hover, .suche-treffer:focus-visible {
+  background: rgba(255, 255, 255, .05);
+  border-color: var(--rand);
+  outline: none;
+}
+.suche-treffer__titel { display: block; font-size: .92rem; font-weight: 600; }
+.suche-treffer__zusatz {
+  display: block; margin-top: 1px;
+  font-size: .74rem; color: var(--text-still);
+}
+.suche-treffer__text {
+  display: block; margin-top: 3px;
+  font-size: .81rem; color: var(--text-leise); line-height: 1.45;
+}
+
+@media (prefers-reduced-motion: reduce) { .suche-knopf { transition: none; } }