Phase 7c: restliche Screens - alle 21 Seiten stehen

Fahrzeugdaten, Batterieverlauf, Service mit Werkstatt und Servicebuch,
Reifen, die ganze Versicherungs- und Steuergruppe, Einstellungen in voller
Tiefe und die Live-Ansicht.

Portiert dazu: die eigene Oelwechsel-Prognose (rechnet ab dem letzten
Wechsel im Servicebuch neu, weil der Langzeitschnitt dafuer zu traege ist),
Kalenderdateien fuer Termine und die CSV-Ausgabe im deutschen Format.

Die Live-Ansicht ist gebaut, aber ueber einen Schalter abgeschaltet: die
Werte dafuer liefert erst der FMM003. Ein Menuepunkt mit lauter Nullen waere
schlechter als keiner.

Zwei Stellen, an denen die App bewusst zurueckhaltend ist: ein unbekannter
Pruefpunkt erscheint als hohler Ring statt als geratenes Gruen, und der
Reifen-Kilometerstand wird nie zurueckgeschrieben, weil ihn der Server
fortschreibt.

49 Tests, darunter ein Rendertest ueber alle 21 Seiten in beiden Layouts
mit Beispieldaten in der Form, die das Backend wirklich liefert.

companion-app/src/stile/screens.css

@@ -487,3 +487,84 @@
 .dm-fussnote--warnung {
   color: var(--warn);
 }
+
+/* --------------------------------------------------------- Listen, Text */
+
+.dm-liste {
+  list-style: none;
+  margin: var(--sp-2) 0 0;
+  padding: 0;
+  font-size: 13.5px;
+  font-weight: 300;
+  line-height: 1.7;
+}
+
+.dm-liste li {
+  padding-left: 14px;
+  position: relative;
+}
+
+.dm-liste li::before {
+  content: "";
+  position: absolute;
+  left: 0;
+  top: 0.72em;
+  width: 4px;
+  height: 4px;
+  border-radius: 50%;
+  background: var(--fg3);
+}
+
+.dm-liste__serie {
+  color: var(--fg2);
+}
+
+.dm-diagramm {
+  width: 100%;
+  height: 120px;
+  margin: var(--sp-3) 0;
+  display: block;
+}
+
+.dm-knopfreihe {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--sp-2);
+  margin-top: var(--sp-4);
+}
+
+.dm-waehlen {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--sp-2);
+  margin-top: var(--sp-3);
+}
+
+.dm-waehlen__knopf {
+  display: inline-flex;
+  align-items: center;
+  padding: 10px 16px;
+  border: 1px solid var(--line-strong);
+  border-radius: var(--r-pill);
+  font-size: 13.5px;
+  font-weight: 300;
+  color: var(--fg);
+  text-decoration: none;
+}
+
+.dm-waehlen__knopf:hover {
+  background: var(--shade);
+}
+
+/* Bleibt beim Scrollen unten stehen, damit ungespeicherte Aenderungen nicht
+   aus dem Blick geraten. */
+.dm-speicherleiste {
+  position: sticky;
+  bottom: 0;
+  display: flex;
+  align-items: center;
+  gap: var(--sp-3);
+  padding: var(--sp-3) 0;
+  background: var(--canvas);
+  border-top: 1px solid var(--line);
+}