Workspace: Zurueck-Knopf hochwertiger, auf der Startseite entfernt

Zwei Rueckmeldungen umgesetzt.

1. Auf der Startseite gibt es den Knopf jetzt gar nicht mehr im
   Dokument. Vorher erschien er dort, sobald man von einer anderen
   Workspace-Seite kam -- aber die Startseite IST die oberste Ebene, ein
   "davor" gibt es nicht.

2. Aussehen: statt des Textzeichens "<-" jetzt ein echtes SVG-Winkel-
   symbol, Pillenform, und ein Verlaufsrahmen.

   Wichtig dabei: Die Fuellung ist DECKEND. Beim ersten Versuch war sie
   halbtransparent, dadurch schien der Rahmenverlauf durch die ganze
   Flaeche und der Knopf sah aus wie eine Hauptaktion -- genau das soll
   er nicht. Jetzt bleibt vom Verlauf nur der 1px schmale Rand sichtbar.

   Ruhezustand: dunkle Pille, feine Stahlkante, gedaempfter Text.
   Ueberfahren: Cyan-Violett-Rand, heller Text, weicher Schein, und der
   Pfeil rueckt zwei Pixel nach links -- die Bewegung sagt die Richtung
   ohne zusaetzlichen Text. Bei prefers-reduced-motion faellt sie weg.

Geprueft: Start -> kein Knopf; Aufgaben -> "Zurueck", fuehrt zurueck;
Personen direkt aufgerufen -> "Uebersicht". Keine Konsolenfehler.

Nur statische Dateien, kein Neustart noetig.

workspace/assets/css/start.css

@@ -39,26 +39,57 @@ body.start {
 .kopfleiste .marke { margin: 0; font-size: .72rem; }
 
 /* Zurück-Knopf. Steht ganz links, weil dort jeder ihn erwartet -- gleiche
-   Stelle wie im Browser. Bleibt verborgen (hidden), wenn es nichts gibt,
-   wohin er führen könnte; das entscheidet kopf.js. */
+   Stelle wie im Browser. Auf der Startseite gibt es ihn gar nicht: Dort
+   ist kein "davor", und ein Knopf, der nichts tut, ist schlimmer als
+   keiner. Auf den übrigen Seiten entscheidet kopf.js, ob er erscheint. */
 .zurueck-knopf {
   flex: 0 0 auto;
-  padding: 7px 13px;
-  background: rgba(255, 255, 255, .045);
-  border: 1px solid var(--rand);
-  border-radius: 9px;
+  display: inline-flex; align-items: center; gap: 7px;
+  padding: 8px 15px 8px 12px;
+  /* Verlaufsrahmen: Die Füllung ist DECKEND, dadurch bleibt vom unteren
+     Verlauf nur der 1px schmale Rand sichtbar. Wäre sie durchsichtig,
+     schiene der Rahmenverlauf durch die ganze Fläche und der Knopf sähe
+     aus wie eine Hauptaktion -- das soll er gerade nicht. */
+  background:
+    linear-gradient(180deg, #151c28, #10161f) padding-box,
+    linear-gradient(180deg, rgba(158, 196, 230, .40), rgba(158, 196, 230, .12)) border-box;
+  border: 1px solid transparent;
+  border-radius: 999px;
   color: var(--text-leise);
-  font: inherit; font-size: .82rem;
+  font: inherit; font-size: .82rem; font-weight: 500;
+  letter-spacing: .01em;
   cursor: pointer;
   white-space: nowrap;
-  transition: background var(--tempo), border-color var(--tempo), color var(--tempo);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .06);
+  transition: color var(--tempo), box-shadow var(--tempo), background var(--tempo);
 }
+
+.zurueck-knopf__pfeil {
+  width: 15px; height: 15px; flex: 0 0 auto;
+  fill: none; stroke: currentColor;
+  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
+  transition: transform var(--tempo);
+}
+
 .zurueck-knopf:hover {
-  background: rgba(255, 255, 255, .08);
-  border-color: var(--rand-hell);
   color: var(--text);
+  background:
+    linear-gradient(180deg, #1a2431, #131b25) padding-box,
+    linear-gradient(180deg, rgba(63, 189, 245, .62), rgba(138, 118, 255, .30)) border-box;
+  box-shadow: 0 2px 12px -4px rgba(63, 189, 245, .35), inset 0 1px 0 rgba(255, 255, 255, .08);
+}
+/* Der Pfeil rückt beim Überfahren ein Stück nach links -- die Bewegung
+   sagt in welche Richtung es geht, ohne zusätzlichen Text. */
+.zurueck-knopf:hover .zurueck-knopf__pfeil { transform: translateX(-2px); }
+
+.zurueck-knopf:active { box-shadow: inset 0 1px 3px rgba(0, 0, 0, .4); }
+.zurueck-knopf:active .zurueck-knopf__pfeil { transform: translateX(-3px); }
+
+@media (prefers-reduced-motion: reduce) {
+  .zurueck-knopf__pfeil { transition: none; }
+  .zurueck-knopf:hover .zurueck-knopf__pfeil,
+  .zurueck-knopf:active .zurueck-knopf__pfeil { transform: none; }
 }
-.zurueck-knopf:active { transform: translateX(-1px); }
 
 .kopfleiste__rechts { display: flex; align-items: center; gap: 12px; }