umbau(boxwart): neue Oberflaeche im Cockpit-Stil (Richtung A), Werkzeuge angehoben

Drei Seiten statt zehn: Start, Updates, Modelle — am PC mit Kopfnavigation, am Handy
mit Leiste unten. Umsetzung von Mockup A („Cockpit“), vom User am 23.09. gewaehlt.

- Start: Hauptwarnleuchte + 8 Warnlampen, Rundinstrumente mit Live-Werten aus dem
  Strom (Speicher, Temperatur, Platte) und Laufzeit-Zaehlwerk, Checkliste der
  Waechter-Hinweise mit ihren Knoepfen, Flugplan (heute gelaufen / geplant), Radar-Kasten.
- Updates: Bausteine mit „Laeuft → Neu“ und Zusammenfassung, laufende Auftraege,
  Verlauf der Sonntagslaeufe (neu: GET /api/updates/verlauf), Sicherungen samt
  Zurueckspielen mit Rueckfrage.
- Modelle: Speicherbalken, Rollen Hirn/Coder/Dritte Rolle, wer die Modelle nutzt
  (7 Tage + 24 h je Stunde), Modell-Radar, weitere Eintraege, Modelle selbst suchen.
- Schubladen: Dienste mit Protokoll und Neustart, Einstellungen (HF-Zugang), Hermes-Link.
- Werkzeuge: Vite 8, React 19.3 mit React Compiler 1.0 (Babel), vitest 5, Tailwind 4.3,
  shadcn 4 (Radix) fuer Dialog/Schublade/Knopf, Schriften Barlow/Barlow Condensed/
  JetBrains Mono. Entfernt: recharts, cmdk, Kraftgraph, zustand, Inter, Space Grotesk.
- Startbuendel 115 KB gzip (Budget 140); Updates/Modelle/Schubladen laden bei Bedarf.
- 16 Oberflaechen-Tests (Instrument-Bogen, Hauptleuchte, Zeitformate, Versionen).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

frontend/src/components/cockpit/Chip.tsx

@@ -0,0 +1,36 @@
+import type { ReactNode } from "react"
+import { cn } from "cn"
+
+export type ChipArt = "gruen" | "bernstein" | "cyan" | "rot" | "grau"
+
+const ART: Record<ChipArt, string> = {
+  gruen: "border-gruen-rand bg-gruen-grund text-gruen",
+  bernstein: "border-bernstein/60 bg-bernstein-grund text-bernstein",
+  cyan: "border-cyan-rand bg-cyan-grund text-cyan",
+  rot: "border-rot-rand bg-rot-grund text-rot-text",
+  grau: "border-linie bg-erhaben text-text-2",
+}
+
+/** Kleines Zustandsschild („GELADEN“, „PASST“, „FEHLGESCHLAGEN“). */
+export function Chip({ art = "grau", children }: { art?: ChipArt; children: ReactNode }) {
+  return (
+    <span className={cn("schild inline-flex h-7 items-center rounded-full border px-2.5 text-xs whitespace-nowrap", ART[art])}>
+      {children}
+    </span>
+  )
+}
+
+/** Einheitlicher Platzhalter, solange Daten laden oder wenn die Box nicht antwortet. */
+export function Zustandsfeld({ fehler, text }: { fehler?: boolean; text: string }) {
+  return (
+    <div
+      role={fehler ? "alert" : "status"}
+      className={cn(
+        "rounded-2xl border px-5 py-8 text-center text-[15px]",
+        fehler ? "border-rot-rand bg-rot-grund text-rot-text" : "border-linie bg-panel text-text-2",
+      )}
+    >
+      {text}
+    </div>
+  )
+}