Interne Bestellverwaltung mit Status-Übersicht + Auswertung (/verwaltung/)

Neue Seite, dauerhaft nur für qciga/vanvan sichtbar (functions/_middleware.js
schützt /verwaltung/* jetzt IMMER — unabhängig vom SITE_PUBLIC-Schalter, mit
dem der Rest der Seite später öffentlich geschaltet wird):

- Status-Kacheln: Offen / In Bearbeitung / Versendet / Abgeschlossen (klickbar
  als Filter) + Gesamtumsatz-Kachel
- Filterbare Bestellliste (nutzt dieselben Status-Badges/-Farben wie die
  Kunden-Kontoseite)
- Auswertung "Meistverkaufte Produkte je Kategorie" (Balken nach verkaufter
  Menge, aus den echten Produktdaten berechnet)
- Auswertung "Bestellungen nach Land" (DE/AT/CH/LU, Balken + Prozent)

Wie an anderer Stelle im Projekt: es gibt noch keine echte, geräteüber-
greifende Bestell-Datenbank (Phase 1) — die Seite zeigt realistische
Beispieldaten in exakt der Struktur, die echte Bestellungen später haben
werden (Cloudflare Worker + D1), klar als solche gekennzeichnet.

Co-Authored-By: Claude Sonnet 5 <[email protected]>

src/styles/global.css

@@ -2697,3 +2697,49 @@ a:focus-visible, button:focus-visible {
 }
 #vandiy-preview-panel button[data-preview]:hover { background: color-mix(in srgb, var(--c-accent) 14%, transparent); }
 @media (max-width: 500px) { #vandiy-preview-switcher { right: 0.7rem; bottom: 0.7rem; } }
+
+/* Interne Bestellverwaltung (/verwaltung/) — Status-Kacheln, Filterleiste, Auswertungs-Balken. */
+.verwaltung-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 0.9rem; margin: 1.2rem 0; }
+.verwaltung-stat-tile {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 0.3rem;
+  padding: 1.1rem 1.2rem;
+  text-align: left;
+  border: 1.5px solid rgba(244, 241, 247, 0.12);
+  cursor: pointer;
+  transition: transform 0.2s var(--ease), border-color 0.2s var(--ease);
+  font: inherit;
+  color: inherit;
+}
+.verwaltung-stat-tile:hover { transform: translateY(-3px); border-color: var(--c-accent); }
+.verwaltung-stat-tile-highlight { border-color: color-mix(in srgb, #e3b23c 45%, transparent); background: color-mix(in srgb, #e3b23c 10%, var(--c-anthracite-light)); cursor: default; }
+.verwaltung-stat-tile-highlight:hover { transform: none; border-color: color-mix(in srgb, #e3b23c 45%, transparent); }
+.verwaltung-stat-icon { font-size: 1.6rem; }
+.verwaltung-stat-value { font-family: var(--font-head); font-size: 1.9rem; font-weight: 700; line-height: 1; }
+.verwaltung-stat-label { font-size: 0.85rem; color: var(--c-text-muted); }
+
+.verwaltung-filter { display: flex; gap: 0.6rem; flex-wrap: wrap; margin: 1.2rem 0; }
+.verwaltung-filter-btn {
+  padding: 0.5em 1em;
+  border-radius: 999px;
+  border: 1.5px solid rgba(244, 241, 247, 0.16);
+  background: transparent;
+  color: var(--c-text-muted);
+  font-size: 0.88rem;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all 0.15s var(--ease);
+}
+.verwaltung-filter-btn:hover { border-color: var(--c-accent); color: var(--c-text); }
+.verwaltung-filter-btn.is-active { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-black); }
+
+.verwaltung-auswertung-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; margin-top: 1.2rem; }
+.verwaltung-kat-card { display: flex; flex-direction: column; gap: 0.9rem; }
+.verwaltung-kat-card h3 { margin: 0; }
+.verwaltung-bar-list { display: flex; flex-direction: column; gap: 0.8rem; }
+.verwaltung-bar-head { display: flex; justify-content: space-between; gap: 1rem; font-size: 0.9rem; margin-bottom: 0.3rem; }
+.verwaltung-bar-track { height: 9px; border-radius: 999px; background: rgba(244, 241, 247, 0.08); overflow: hidden; }
+.verwaltung-bar-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--c-accent), #9b7fd6); transition: width 0.6s var(--ease); }
+.verwaltung-bar-fill-land { background: linear-gradient(90deg, #e3b23c, #f6dda0); }