Workspace: Anleitung neben beiden Import-Knoepfen

Scouts und Manager sollen nicht raten muessen, woher die Zahlen kommen.

Unter der Knopfreihe steht jetzt dauerhaft (sobald einer der beiden Knoepfe
sichtbar ist), was die beiden Quellen sind: Backstage-Tabelle = Agenturzahlen
fuer alle auf einmal, TikTok-Datei = die Datei, an die nur der Creator selbst
kommt.

Backstage-Dialog: fuenf nummerierte Schritte. Der wichtigste davon ist
"Ueberschriftenzeile mitmarkieren" -- ohne sie kann der Server die Spalten
nicht benennen, und genau das war beim Testen der haeufigste Fehlgriff.
Dazu zwei stille Absaetze: woher die Zuordnung kommt (TikTok-Name im
Steckbrief) und warum das nicht automatisch geht.

TikTok-Dialog: der fertige Text zum Weiterleiten an den Creator, mit
Kopierknopf. Nennt JSON statt TXT (eine TXT-Datei laesst sich nicht
auswerten), die 1-4 Tage Wartezeit, und dass die Datei nur gelesen und
nicht gespeichert wird.

Bewusst KEIN erfundener Klickpfad durch Backstage: TikTok dokumentiert die
Menuenamen nirgends oeffentlich, und eine erfundene Beschriftung ist beim
naechsten Umbenennen schlimmer als keine. Beschrieben wird deshalb, WORAUF
zu achten ist ("die Tabelle mit den Zahlen"), das bleibt wahr.

Der Kopierknopf meldet einen Fehlschlag, statt Erfolg vorzutaeuschen.

pruef-backstage-import: 29 -> 36 Pruefungen, alle gruen.

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

workspace/assets/css/leistung.css

@@ -348,3 +348,56 @@
   font-family: ui-monospace, "Cascadia Code", "Consolas", monospace;
   overflow-wrap: anywhere;
 }
+
+/* =====================================================================
+   DIE ANLEITUNGEN (11.09.2026)
+
+   Filipe: "ich brauch auch eine erklärung immer dabei wo die scouts und
+   manager das finden. also eine perfekte beschreibung bitte."
+
+   Zwei Ebenen, weil zwei Fragen dahinterstecken:
+
+     1. WAS IST DAS?  -- zwei Sätze, immer sichtbar unter den Knöpfen.
+        Wer davorsitzt und beide Knöpfe zum ersten Mal sieht, weiß sonst
+        nicht, welcher für ihn gemeint ist.
+     2. WIE GEHT DAS? -- die Schritte, im Fenster, wo man sie braucht.
+        Dort stören sie niemanden, der es längst weiß.
+
+   Eine Anleitung, die immer und vollständig auf der Seite steht, liest
+   nach dem dritten Mal niemand mehr -- und dann steht sie nur im Weg.
+   ===================================================================== */
+.quellen-hinweis {
+  display: flex; flex-wrap: wrap; gap: 6px 22px;
+  margin: 10px 0 0;
+  font-size: .8rem; line-height: 1.5;
+  color: var(--text-still);
+}
+.quellen-hinweis > span { flex: 1 1 320px; min-width: 0; }
+.quellen-hinweis strong { color: var(--text-leise); }
+
+/* Die Schritte im Fenster. Nummern in der Hausfarbe, damit man sie als
+   Reihenfolge liest und nicht als Aufzählung -- bei einer Anleitung ist
+   die Reihenfolge die halbe Auskunft. */
+.anleitung {
+  margin: 4px 0 14px; padding: 0 0 0 1.6em;
+  font-size: .86rem; line-height: 1.6;
+  color: var(--text-leise);
+}
+.anleitung li { margin: 0 0 7px; }
+.anleitung li::marker { color: var(--akzent); font-weight: 700; }
+.anleitung strong { color: var(--text); }
+
+/* Der fertige Text zum Weiterschicken. Als <pre>, damit die Nummerierung
+   stehen bleibt -- und mit Umbruch, damit er nicht seitlich herausläuft. */
+.anleitung-text {
+  margin: 4px 0 8px;
+  max-height: 210px; overflow-y: auto;
+  padding: 11px 13px;
+  border: 1px solid var(--rand); border-radius: 11px;
+  background: rgba(0, 0, 0, .28);
+  font-family: inherit; font-size: .81rem; line-height: 1.55;
+  color: var(--text-leise);
+  white-space: pre-wrap; overflow-wrap: anywhere;
+}
+.dialog__unter--still { font-size: .8rem; color: var(--text-still); }
+.dialog__knoepfe--links { justify-content: flex-start; margin: 0 0 10px; }