WIP Zentrale-Kachel nach VanVans Werktisch — NOCH NICHT FERTIG

Aufbau steht (Ring links, Titel mittig, Uhr rechts), aber
pruef-start-ansicht meldet 3 Befunde am MAUS-LICHT der Kacheln.
Gemessen: alter Stand 0 Befunde, dieser Stand 3 — kommt also von hier.
Kein JS-Fehler (pageerror/console sind still), also Zeitverhalten:
Die zusaetzliche Abfrage /api/zentrale verzoegert vermutlich den Aufbau
der Kacheln ueber den Zeitpunkt hinaus, an dem kopf.js lichtFolgen ruft.

Ausserdem offen: 2 Schriftgroessen unter 11,5 px (pruef-css-klassen).

NICHT ausliefern.

workspace/start.html

@@ -47,33 +47,89 @@
       <span class="willkommen__marker" id="tagesmarker" hidden></span>
     </p>
     <div class="willkommen__reihe">
-      <span class="willkommen__plakette" id="plakette" aria-hidden="true"></span>
+
+      <!-- ==== LINKS: DER RING ======================================
+           Nach dem Vorbild von VanVans Werktisch (Business Hub), auf
+           Wunsch Filipes uebernommen und weitergebaut.
+
+           Dort steht "91 % deiner Produktakten" -- ein Segment je
+           Produkt. Diese Zahl gibt es hier nicht: Nachgemessen hat der
+           Workspace 31 Termine, 9 Personen und GENAU EINE Aufgabe. Ein
+           Kranz aus einer Aufgabe ist kein Bild, sondern sieht aus wie
+           ein Ladefehler.
+
+           Filipe hat DAS TEAM gewaehlt. Fuer Creator zeigt derselbe
+           Ring den eigenen Tag -- nicht als Notloesung, sondern weil
+           ein Creator die Teamliste nicht sehen darf und die Frage
+           dieselbe bleibt: "Wie weit ist das, wofuer ich zustaendig
+           bin?" Die Entscheidung faellt im Server
+           (workspace-zentrale.js), nicht hier: Was der Browser nicht
+           bekommt, kann er auch nicht verraten.               -->
+      <div class="zring" id="zring">
+        <svg class="zring__bild" id="zring-bild" viewBox="0 0 300 300"
+             role="img" aria-labelledby="zring-titel zring-text">
+          <title id="zring-titel">Der Stand deiner Zentrale</title>
+          <desc id="zring-text">Ein Segment je Person, eingefärbt nach Lage.</desc>
+        </svg>
+        <!-- IN DER MITTE STEHT DAS SIEGEL, NICHT DAS PERSONENBILD.
+
+             Im Vorbild sitzt dort VanVans Firmenlogo, und das Bild von
+             Dogi steckt in der Anrede daneben. Das ist kein Zufall: Der
+             Ring gehoert dem BETRIEB, die Anrede der PERSON. Haette ich
+             das Personenbild in die Mitte gesetzt, staende dasselbe
+             Gesicht zweimal auf einer Kachel -- und der Ring saehe aus,
+             als messe er die Person. -->
+        <div class="zring__mitte">
+          <span class="zring__siegel" aria-hidden="true"></span>
+          <strong class="zring__prozent" id="zring-prozent">–</strong>
+          <span class="zring__unter" id="zring-unter">wird geladen</span>
+        </div>
+      </div>
+
+      <!-- ==== MITTE: WER, WO, WAS ================================== -->
       <div class="willkommen__text">
-        <h1 class="titel" id="gruss">Willkommen</h1>
+        <!-- Die Anrede sitzt in einer eigenen Fassung, wie im Vorbild:
+             Bild, Name und Rolle gehoeren zusammen und heben sich
+             dadurch vom Titel darunter ab, statt mit ihm zu ringen. -->
+        <span class="zgruss">
+          <span class="zgruss__bild willkommen__plakette" id="plakette" aria-hidden="true"></span>
+          <span class="zgruss__text">
+            <h1 class="titel" id="gruss">Willkommen</h1>
+            <span class="zgruss__datum" id="zgruss-datum"></span>
+          </span>
+          <span class="zgruss__rolle" id="zgruss-rolle" hidden></span>
+        </span>
+
+        <!-- Die Zierzeile traegt die Marke, wie "◆ VAN'S DIY ◆" im
+             Vorbild. Die Rauten sind eigene Elemente und kein Zeichen im
+             Text: Ein ◆ aus der Schriftart sitzt nie auf der Grundlinie
+             und sieht auf jedem Geraet anders aus. -->
+        <span class="zmarke">
+          <i class="zraute" aria-hidden="true"></i>
+          Dogfather Universe
+          <i class="zraute" aria-hidden="true"></i>
+        </span>
+        <p class="ztitel" id="ztitel">Die Zentrale</p>
         <p class="unterzeile">
           <span id="rollentext">…</span>
           <span class="willkommen__lage" id="lage" hidden></span>
         </p>
-      </div>
 
-      <!-- ==== Die Mitte der Konsole: drei Ablesungen ================
-           Zwischen Text und Uhr standen rund 300 px Leere -- auf einem
-           1440er Bildschirm nachgemessen, nicht geschaetzt. Eine
-           Konsole mit einem leeren Feld in der Mitte sieht nicht
-           aufgeraeumt aus, sondern unfertig.
+        <!-- ==== Die drei Ablesungen ==================================
+             Sie standen zuerst RECHTS, zwischen Text und Uhr -- dort
+             fuellten sie eine Luecke. Im Vorbild stehen sie unter dem
+             Titel in der Mitte, und das ist der bessere Ort: Sie
+             gehoeren zum Satz darueber ("253 Produkte, 100 Akten
+             fertig, 159 Angaben offen" liest sich als Fortsetzung des
+             Textes, nicht als Anzeige am Rand).
 
-           Was hier steht, ist deshalb keine Deko, sondern das, was der
-           Lagesatz daneben NICHT sagt: wie viel heute ansteht, wann das
-           Naechste losgeht, wie viel offen ist.
+             KEINE ZWEITE ZAEHLUNG. Die Zahlen kommen aus denselben
+             Quellen, die die Kacheln darunter fuellen. Zwei Rechenwege
+             fuer dieselbe Zahl laufen auseinander, und dann stehen zwei
+             Wahrheiten auf einem Bildschirm.
 
-           KEINE ZWEITE ZAEHLUNG. Die Zahlen kommen aus denselben zwei
-           Quellen, die die Kacheln darunter fuellen (`hinweise` und die
-           Tagestermine). Zwei Rechenwege fuer dieselbe Zahl laufen
-           auseinander, und dann stehen zwei Wahrheiten auf einem
-           Bildschirm.
-
-           Versteckt, solange nichts geladen ist: Drei Striche in einer
-           Fassung sehen aus wie ein Fehler.                        -->
+             Versteckt, solange nichts geladen ist: Drei Striche in
+             einer Fassung sehen aus wie ein Fehler.               -->
       <div class="willkommen__stand" id="tagesstand" hidden>
         <div class="stand" data-stand="heute">
           <span class="stand__wert" id="stand-heute">–</span>
@@ -87,7 +143,8 @@
           <span class="stand__wert" id="stand-offen">–</span>
           <span class="stand__schild">Offen</span>
         </div>
-      </div>
+        </div>
+      </div><!-- /.willkommen__text -->
 
       <!-- ==== Rechts in der Kachel: Glocke und Uhr ==================
            Die Glocke stand bisher in der Kopfleiste. Dort ist sie eine