Phase 7b: Fahrten, Tanken und Statistik

Listen mit Jahr-Monat-Aufklappung, Detailseiten, manuelles Eintragen und
Beleg-Upload. Statistik rechnet ueber die portierten Regeln.

Zwei offene Audit-Befunde des alten Panels sind hier gleich mit erledigt:

1. Loeschen war ausschliesslich per Wischgeste erreichbar. Wer mit
   Sprachausgabe oder Schaltersteuerung bedient, wischt nicht - Fahrten und
   Tankvorgaenge waren fuer diese Nutzer gar nicht loeschbar. Jede Zeile hat
   jetzt zusaetzlich ein sichtbares Menue, ein richtiger Knopf mit Tastatur.
2. Leaflet kam per CDN und blieb auf einem Handy ohne eigenen Internetzugang
   still leer. Es liegt jetzt im Buendel (eigener Abschnitt, erst bei Bedarf
   geladen).

Bewusst NICHT uebernommen: fakeTrack() aus dem alten Panel, das eine
erfundene Linie zwischen zwei Punkten zeichnete, wenn keine Route vorlag.
Solange das Fahrzeug keine Positionen liefert, sagt die Seite das - statt
eine glaubwuerdig aussehende Erfindung zu zeigen.

companion-app/src/stile/screens.css

@@ -352,3 +352,138 @@
   gap: var(--sp-2);
   margin-top: var(--sp-3);
 }
+
+/* ------------------------------------------------------- Listenzeilen */
+
+.dm-zeile {
+  display: flex;
+  align-items: stretch;
+  gap: 2px;
+}
+
+.dm-zeile__wisch {
+  flex: 1;
+  min-width: 0;
+}
+
+/* Immer sichtbarer Zugang zu denselben Aktionen wie die Wischgeste — ohne ihn
+   waere Loeschen fuer Sprachausgabe und Schaltersteuerung unerreichbar. */
+.dm-zeile__menue {
+  flex: none;
+  width: 44px;
+  border: 0;
+  background: transparent;
+  color: var(--fg3);
+  border-radius: var(--r-func);
+  cursor: pointer;
+}
+
+.dm-zeile__menue:hover {
+  background: var(--shade);
+  color: var(--fg);
+}
+
+.dm-listenzeile {
+  display: flex;
+  align-items: center;
+  gap: var(--sp-3);
+  width: 100%;
+  padding: 12px 2px;
+  border: 0;
+  background: transparent;
+  color: inherit;
+  text-align: left;
+  cursor: pointer;
+}
+
+.dm-listenzeile__haupt {
+  flex: 1;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 3px;
+}
+
+.dm-listenzeile__titel {
+  display: flex;
+  align-items: baseline;
+  gap: var(--sp-2);
+  font-size: 16px;
+  font-weight: 300;
+}
+
+.dm-listenzeile__neben {
+  font-size: 13px;
+  color: var(--fg2);
+}
+
+.dm-listenzeile__unter {
+  font-size: 12px;
+  font-weight: 300;
+  color: var(--fg3);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* -------------------------------------------------------- Detailseiten */
+
+.dm-detail__kopf {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: var(--sp-3);
+  margin: var(--sp-2) 0 var(--sp-3);
+  flex-wrap: wrap;
+}
+
+.dm-detail__zahl {
+  font-size: 40px;
+  font-weight: 300;
+  line-height: 1;
+  letter-spacing: -0.02em;
+}
+
+.dm-detail__einheit {
+  font-size: 15px;
+  color: var(--fg2);
+  margin-left: 6px;
+}
+
+.dm-detail__marken {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  align-items: center;
+}
+
+.dm-karte {
+  height: 240px;
+  width: 100%;
+  border-radius: var(--r-func);
+  overflow: hidden;
+  margin-top: var(--sp-3);
+  background: var(--tile-2);
+}
+
+/* ------------------------------------------------------------ Meldungen */
+
+.dm-fehler {
+  margin: var(--sp-3) 0 0;
+  font-size: 13px;
+  font-weight: 300;
+  line-height: 1.5;
+  color: var(--bad);
+}
+
+.dm-erfolg {
+  margin: var(--sp-3) 0 0;
+  font-size: 13px;
+  font-weight: 300;
+  line-height: 1.5;
+  color: var(--ok);
+}
+
+.dm-fussnote--warnung {
+  color: var(--warn);
+}