Oberfläche auf das tradeo Corporate Design umstellen

Nur tradeo Blue und Weiß, Neutraltöne als Deckkraft-Abstufungen. Poppins für
Titel und Kennzeichen, Inter für Bedienelemente, beide selbst gehostet.
Kopfzeile als Markenfläche, Listen mit Trennlinien statt Kästen, Linien-SVGs
statt Emojis, Rot nur noch funktional. Design-System unter docs/DESIGN.md
abgelegt und in CLAUDE.md verankert.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

CLAUDE.md

@@ -27,3 +27,17 @@ Wofür dieses Projekt gut ist, und was jemand wissen muss, der hier weiterarbeit
 - Wenig Abhängigkeiten — was Browser und Node schon können, reicht meistens
 - Semantisches HTML, mobil zuerst, bedienbar per Tastatur, ausreichender Kontrast
 - Konfiguration über Umgebungsvariablen; keine Zugangsdaten im Quelltext
+
+## Design
+
+Die Oberfläche folgt dem tradeo Corporate Design System in `docs/DESIGN.md`. Kurzfassung für die App:
+
+- Farben: nur tradeo Blue `#122E45` und Weiß. Neutraltöne als Deckkraft-Abstufungen von tradeo Blue
+  (`--tint-*`, `--line*`, `--text-*` in `public/style.css`). Keine neuen Farben erfinden.
+- Schrift: Poppins (600/500) für Titel und Kennzeichen, Inter für alles andere; beide selbst gehostet
+  unter `public/fonts/`.
+- 8-px-Raster, Radius 6 px, linksbündig, ruhige Flächen, dezente Trennlinien statt Kästen.
+- Keine Emojis als Icons; nur schlichte Linien-SVGs mit funktionalem Zweck. Sentence case, keine
+  Ausrufezeichen.
+- Was das CDS offen lässt (Statusfarbe, Radius, Icon-Familie, Dark Mode), ist im Kopf von
+  `public/style.css` als offene Designentscheidung vermerkt und dort zentral änderbar.