feat: MyEasyCMS v2 — Full SaaS rebuild

Complete rebuild of 22-year-old PHP CMS as modern SaaS:

Database (15 migrations, 42+ tables):
- Foundation: account_settings, audit_log, GDPR register, cms_files
- Module Engine: modules, fields, records, permissions, relations + RPC
- Members: 45+ field member profiles, departments, roles, honors, SEPA mandates
- Courses: courses, sessions, categories, instructors, locations, attendance
- Bookings: rooms, guests, bookings with availability
- Events: events, registrations, holiday passes
- Finance: SEPA batches/items (pain.008/001 XML), invoices
- Newsletter: campaigns, templates, recipients, subscriptions
- Site Builder: site_pages (Puck JSON), site_settings, cms_posts
- Portal Auth: member_portal_invitations, user linking

Feature Packages (9):
- @kit/module-builder — dynamic low-code CRUD engine
- @kit/member-management — 31 API methods, 21 actions, 8 components
- @kit/course-management, @kit/booking-management, @kit/event-management
- @kit/finance — SEPA XML generator + IBAN validator
- @kit/newsletter — campaigns + dispatch
- @kit/document-generator — PDF/Excel/Word
- @kit/site-builder — Puck visual editor, 15 blocks, public rendering

Pages (60+):
- Dashboard with real stats from all APIs
- Full CRUD for all 8 domains with react-hook-form + Zod
- Recharts statistics
- German i18n throughout
- Member portal with auth + invitation system
- Public club websites via Puck at /club/[slug]

Infrastructure:
- Dockerfile (multi-stage, standalone output)
- docker-compose.yml (Supabase self-hosted + Next.js)
- Kong API gateway config
- .env.production.example

apps/web/app/[locale]/home/[account]/courses/statistics/page.tsx

@@ -1,10 +1,4 @@
-import {
-  GraduationCap,
-  Users,
-  Calendar,
-  TrendingUp,
-  BarChart3,
-} from 'lucide-react';
+import { GraduationCap, Users, Calendar, TrendingUp, BarChart3 } from 'lucide-react';
 
 import { getSupabaseServerClient } from '@kit/supabase/server-client';
 import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
@@ -13,6 +7,7 @@ import { createCourseManagementApi } from '@kit/course-management/api';
 
 import { CmsPageShell } from '~/components/cms-page-shell';
 import { StatsCard } from '~/components/stats-card';
+import { StatsBarChart, StatsPieChart } from '~/components/stats-charts';
 
 interface PageProps {
   params: Promise<{ account: string }>;
@@ -22,77 +17,53 @@ export default async function CourseStatisticsPage({ params }: PageProps) {
   const { account } = await params;
   const client = getSupabaseServerClient();
 
-  const { data: acct } = await client
-    .from('accounts')
-    .select('id')
-    .eq('slug', account)
-    .single();
-
+  const { data: acct } = await client.from('accounts').select('id').eq('slug', account).single();
   if (!acct) return <div>Konto nicht gefunden</div>;
 
   const api = createCourseManagementApi(client);
   const stats = await api.getStatistics(acct.id);
 
+  const statusChartData = [
+    { name: 'Aktiv', value: stats.openCourses },
+    { name: 'Abgeschlossen', value: stats.completedCourses },
+    { name: 'Gesamt', value: stats.totalCourses },
+  ];
+
   return (
     <CmsPageShell account={account} title="Kurs-Statistiken">
       <div className="flex w-full flex-col gap-6">
-        <div>
-          <h1 className="text-2xl font-bold">Statistiken</h1>
-          <p className="text-muted-foreground">Übersicht über das Kursangebot</p>
-        </div>
-
-        {/* Stat Cards */}
         <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4">
-          <StatsCard
-            title="Kurse gesamt"
-            value={stats.totalCourses}
-            icon={<GraduationCap className="h-5 w-5" />}
-          />
-          <StatsCard
-            title="Aktive Kurse"
-            value={stats.openCourses}
-            icon={<Calendar className="h-5 w-5" />}
-          />
-          <StatsCard
-            title="Teilnehmer gesamt"
-            value={stats.totalParticipants}
-            icon={<Users className="h-5 w-5" />}
-          />
-          <StatsCard
-            title="Abgeschlossen"
-            value={stats.completedCourses}
-            icon={<TrendingUp className="h-5 w-5" />}
-          />
+          <StatsCard title="Kurse gesamt" value={stats.totalCourses} icon={<GraduationCap className="h-5 w-5" />} />
+          <StatsCard title="Aktive Kurse" value={stats.openCourses} icon={<Calendar className="h-5 w-5" />} />
+          <StatsCard title="Teilnehmer" value={stats.totalParticipants} icon={<Users className="h-5 w-5" />} />
+          <StatsCard title="Abgeschlossen" value={stats.completedCourses} icon={<TrendingUp className="h-5 w-5" />} />
         </div>
 
-        {/* Chart Placeholder */}
-        <Card>
-          <CardHeader>
-            <CardTitle className="flex items-center gap-2">
-              <BarChart3 className="h-5 w-5" />
-              Kursauslastung
-            </CardTitle>
-          </CardHeader>
-          <CardContent>
-            <div className="flex h-64 items-center justify-center rounded-md border border-dashed text-muted-foreground">
-              Diagramm wird hier angezeigt
-            </div>
-          </CardContent>
-        </Card>
+        <div className="grid grid-cols-1 gap-6 lg:grid-cols-2">
+          <Card>
+            <CardHeader>
+              <CardTitle className="flex items-center gap-2">
+                <BarChart3 className="h-5 w-5" />
+                Kursauslastung
+              </CardTitle>
+            </CardHeader>
+            <CardContent>
+              <StatsBarChart data={statusChartData} />
+            </CardContent>
+          </Card>
 
-        <Card>
-          <CardHeader>
-            <CardTitle className="flex items-center gap-2">
-              <TrendingUp className="h-5 w-5" />
-              Anmeldungen pro Monat
-            </CardTitle>
-          </CardHeader>
-          <CardContent>
-            <div className="flex h-64 items-center justify-center rounded-md border border-dashed text-muted-foreground">
-              Diagramm wird hier angezeigt
-            </div>
-          </CardContent>
-        </Card>
+          <Card>
+            <CardHeader>
+              <CardTitle className="flex items-center gap-2">
+                <TrendingUp className="h-5 w-5" />
+                Verteilung
+              </CardTitle>
+            </CardHeader>
+            <CardContent>
+              <StatsPieChart data={statusChartData} />
+            </CardContent>
+          </Card>
+        </div>
       </div>
     </CmsPageShell>
   );