chore: Projektgeruest mit Next.js, TypeScript und Tailwind

Grundgeruest der Anwendung: Next.js 15 (App Router), TypeScript im
strict-Modus, Tailwind mit shadcn/ui-Farbtokens.

Bewusste Festlegungen:
- Nur Systemschriften, keine externen Fonts, kein CDN.
- Grundschrift eine Stufe groesser, Fokusring immer sichtbar,
  Touchziele mindestens 44px.
- Ampelfarben fuer Fristen als eigene Design-Tokens.
- Betraege werden als Cent-Ganzzahl gefuehrt, damit die Rechnungslegung
  keine Rundungsfehler erbt.
- .env.example dokumentiert alle Geheimnisse; npm run schluessel erzeugt sie.

Etappe: 1
Phase: Fundament

src/app/globals.css

@@ -0,0 +1,139 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+  :root {
+    /* Helles Thema - bewusst hoher Kontrast, kein Grau-auf-Grau. */
+    --background: 0 0% 100%;
+    --foreground: 222 47% 11%;
+
+    --card: 0 0% 100%;
+    --card-foreground: 222 47% 11%;
+
+    --popover: 0 0% 100%;
+    --popover-foreground: 222 47% 11%;
+
+    --primary: 214 80% 32%;
+    --primary-foreground: 0 0% 100%;
+
+    --secondary: 214 32% 94%;
+    --secondary-foreground: 222 47% 11%;
+
+    --muted: 214 32% 95%;
+    --muted-foreground: 215 20% 35%;
+
+    --accent: 214 32% 94%;
+    --accent-foreground: 222 47% 11%;
+
+    --destructive: 0 72% 40%;
+    --destructive-foreground: 0 0% 100%;
+
+    --border: 214 20% 84%;
+    --input: 214 20% 80%;
+    --ring: 214 80% 40%;
+
+    --ampel-rot: 0 72% 42%;
+    --ampel-orange: 25 90% 38%;
+    --ampel-gelb: 43 90% 30%;
+    --ampel-gruen: 145 63% 27%;
+
+    --radius: 0.5rem;
+  }
+
+  .dark {
+    --background: 222 47% 9%;
+    --foreground: 210 40% 96%;
+
+    --card: 222 45% 12%;
+    --card-foreground: 210 40% 96%;
+
+    --popover: 222 45% 12%;
+    --popover-foreground: 210 40% 96%;
+
+    --primary: 210 90% 66%;
+    --primary-foreground: 222 47% 11%;
+
+    --secondary: 217 33% 18%;
+    --secondary-foreground: 210 40% 96%;
+
+    --muted: 217 33% 17%;
+    --muted-foreground: 215 25% 72%;
+
+    --accent: 217 33% 20%;
+    --accent-foreground: 210 40% 96%;
+
+    --destructive: 0 72% 62%;
+    --destructive-foreground: 222 47% 11%;
+
+    --border: 217 25% 26%;
+    --input: 217 25% 30%;
+    --ring: 210 90% 66%;
+
+    --ampel-rot: 0 84% 68%;
+    --ampel-orange: 25 95% 62%;
+    --ampel-gelb: 45 95% 60%;
+    --ampel-gruen: 145 60% 55%;
+  }
+}
+
+@layer base {
+  * {
+    @apply border-border;
+  }
+
+  html {
+    /* Verhindert das automatische Hochskalieren von Text in iOS-Safari. */
+    -webkit-text-size-adjust: 100%;
+  }
+
+  body {
+    @apply bg-background text-foreground antialiased;
+  }
+
+  /* Tastaturbedienung muss sichtbar sein - niemals outline:none. */
+  :focus-visible {
+    @apply outline-none ring-2 ring-ring ring-offset-2 ring-offset-background;
+  }
+
+  /* Auf Touch-Geraeten sollen Bedienelemente mindestens 44px hoch sein. */
+  @media (pointer: coarse) {
+    button,
+    [role='button'],
+    a.btn,
+    input,
+    select,
+    textarea {
+      min-height: 2.75rem;
+    }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    *,
+    *::before,
+    *::after {
+      animation-duration: 0.01ms !important;
+      transition-duration: 0.01ms !important;
+    }
+  }
+}
+
+@layer components {
+  /* Sprungmarke fuer Screenreader und Tastaturnutzer. */
+  .skip-link {
+    @apply absolute left-2 top-2 z-50 -translate-y-20 rounded-md bg-primary px-4 py-2
+           text-primary-foreground transition-transform focus:translate-y-0;
+  }
+}
+
+@media print {
+  /* Berichte werden ausgedruckt und dem Gericht vorgelegt. */
+  .no-print {
+    display: none !important;
+  }
+
+  body {
+    background: #fff;
+    color: #000;
+  }
+}