feat(team): Kreisdarstellung der Belegschaft und Organigramm-Ansicht

Setzt die Referenzgrafik «Agenten_Bewirtschaftung_v2» um: die 36 digitalen
Mitarbeitenden in konzentrischen Ringen, Kernteam innen und gold gerahmt.

DATENBASIS
Alle 36 Mitarbeitenden samt Porträts sind aus dem Konzeptdokument extrahiert.
Die Stufen stecken bereits in den Quelldaten und decken sich exakt mit den
Bereichen: lvl 1 = 7 Kernteam, lvl 2 = 18 Zentrale Dienste, lvl 3 = 7 GB
Kommerziell, lvl 4 = 4 GB Wohnen. Auch die Reiterbeschriftungen sind wörtlich
übernommen — keine neuen Stufennamen erfunden.

Neu getrennt: `AgentDirectoryEntry` trägt die Stammdaten aller 36 für die
Kreisdarstellung, `TeamAgent` bleibt das vollständige Dossier der sieben
Kernteammitglieder. Für die übrigen 29 werden bewusst keine Aufgaben, Kanäle
oder Tätigkeiten erfunden; ein Klick zeigt nur eine Vorschau aus dem Verzeichnis.

ABWEICHUNG VOM AUFTRAG
Der Auftrag nennt als Kernteam Ferdi, Sami, Leo, Bruno, Reto, Milo, Nora.
Referenzgrafik und Konzeptdaten sagen übereinstimmend Ferdi, Sina, Lea, Bruno,
Reto, Livia, Nora — dort tragen genau diese sieben `kern: true` und `lvl: 1`.
Da der Auftrag die Grafik selbst als verbindlich erklärt und Namen laut §10 kein
Primärschlüssel sind, folge ich Grafik und Daten. Sami, Leo und Milo kommen in
keiner Quelle vor.

OBERFLÄCHE
- Teamübersicht: Beschreibungstext und «Demo zurücksetzen» entfernt, Kreis mit
  kumulativen Stufenreitern direkt unter dem Titel
- Personalverwaltung: Umschaltung Dossieransicht / Organigramm über ?view=,
  Organigramm als oben abgeschnittener Halbkreis mit drehbarem Agentenrad
  (Ziehen, Touch, Pfeiltasten, Klick), aktiv ist wer unten mittig einrastet
- Dossier: Untermenü direkt unter den Stammdaten, «Agentenbeschrieb» als erster
  Reiter, Zuständigkeiten auf drei gekürzt
- Kanäle & Systeme: vier Karten pro Zeile, Kategorie-Sinnbild links vor dem
  Titel, Porträtgruppe statt Namensliste, ein Regler statt Verbinden/Trennen
- Bearbeitungsverlauf: neutrale Karten, Farbe nur noch bei Ausnahmepriorität und
  abweichendem Status, mehr Weissraum

Markenlogos gibt es im Repo nicht und wurden nicht nachgezeichnet — je Kategorie
steht ein neutrales Sinnbild. Fehlendes Asset, bewusst so gelöst.

Positionsdaten stehen ausschliesslich in `agentRingConfig.ts`; Vollkreis und
Halbkreis teilen sich dieselbe Geometrie.

AUFGERÄUMT
`AgentCard` ist durch die Kreisdarstellung ersetzt und entfernt, seine Zusagen
sind in `TeamOverviewRing.test.tsx` übergegangen — inklusive der wichtigsten:
ausserhalb des Kernteams führt kein Klick in ein Dossier.

Zwei echte Fehler unterwegs behoben: jsdom kennt keinen `ResizeObserver` (jetzt
mit Rückfallebene statt Absturz), und das Rad las eine Ref im Render.

413 Tests grün, Build grün, ESLint über den Property-On-Code sauber,
check:tokens unverändert bei 2249.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

src/pages/supply/Teamuebersicht.tsx

@@ -1,89 +1,57 @@
-import { useCallback } from 'react'
-import { useNavigate } from 'react-router'
-import { Box, Button } from '@mui/material'
-import { RotateCcw } from 'lucide-react'
+import { useState } from 'react'
+import { Box } from '@mui/material'
 import {
   TeamPageHeader,
   TeamSectionHeader,
   TeamKpiSection,
-  AgentCard,
+  TeamLevelTabs,
+  TeamOverviewRing,
   ConnectionSummaryList,
 } from '../../components/team'
-import { CardSkeleton, ErrorState } from '../../components/ui'
+import { ErrorState } from '../../components/ui'
+import type { AgentLevel } from '../../domain/agentDirectory'
+import { AgentLevel as Level } from '../../domain/agentDirectory'
 import { useTeamAgents } from '../../hooks/useTeamAgents'
 import { useAgentConnections } from '../../hooks/useAgentConnections'
-import { useResetTeamDemo } from '../../hooks/useTeamDemo'
 import { ROUTES } from '../../lib/constants'
 
 /**
  * Startseite des Property-On-Bereichs.
- * Verbindliche Reihenfolge: Auswertung, Kernteam, Kanäle & Systeme (§4.1).
+ *
+ * Aufbau: die Belegschaft als Kreis direkt unter dem Seitentitel, darunter die
+ * Auswertung und die Verbindungen. Der Kreis steht bewusst zuoberst — er ist die
+ * Antwort auf die Frage, mit der ein Bewirtschafter die Seite öffnet: «wer
+ * arbeitet hier eigentlich für mich?»
+ *
+ * Kopfbereich bewusst ohne Beschreibungstext und ohne «Demo zurücksetzen»: der
+ * Platz gehört der Visualisierung.
  */
 export default function Teamuebersicht() {
-  const navigate = useNavigate()
-  const { data: agents = [], isLoading, isError, refetch } = useTeamAgents()
+  const [level, setLevel] = useState<AgentLevel>(Level.CORE)
+  const { data: agents = [], isError, refetch } = useTeamAgents()
   const { data: connections = [] } = useAgentConnections()
-  const resetDemo = useResetTeamDemo()
-
-  const openAgent = useCallback(
-    (agentId: string) => navigate(`${ROUTES.SUPPLY.TEAM_PERSONNEL}/${agentId}`),
-    [navigate],
-  )
 
   return (
     <Box sx={{ display: 'flex', flexDirection: 'column', height: '100%', overflow: 'hidden' }}>
-      <TeamPageHeader
-        title="Teamübersicht"
-        description="Sieben digitale Mitarbeiter arbeiten in den Systemen der Bewirtschaftung. Sie führen aus, Sie entscheiden."
-        actions={
-          <Button
-            size="small"
-            variant="outlined"
-            startIcon={<RotateCcw size={14} />}
-            disabled={resetDemo.isPending}
-            onClick={() => resetDemo.mutate()}
-            sx={{ textTransform: 'none', fontWeight: 600 }}
-          >
-            {resetDemo.isPending ? 'Wird zurückgesetzt …' : 'Demo zurücksetzen'}
-          </Button>
-        }
-      />
+      <TeamPageHeader title="Teamübersicht" />
 
-      <Box sx={{ flex: 1, overflowY: 'auto', px: 3, py: 3 }}>
+      <Box sx={{ flex: 1, overflowY: 'auto', px: 3, pb: 5 }}>
         {isError ? (
           <ErrorState message="Das digitale Team konnte nicht geladen werden." onRetry={() => refetch()} />
         ) : (
           <>
-            <TeamKpiSection agents={agents} />
-
-            <Box component="section" sx={{ mb: 4 }}>
-              <TeamSectionHeader
-                title="Kernteam"
-                description="Alle sieben digitalen Mitarbeiter mit Zuständigkeit und aktueller Kennzahl."
-                quickLink={{ label: 'Zur Personalverwaltung', to: ROUTES.SUPPLY.TEAM_PERSONNEL }}
-              />
-
-              <Box
-                sx={{
-                  display: 'grid',
-                  gap: 1.5,
-                  gridTemplateColumns: {
-                    xs: '1fr',
-                    sm: 'repeat(2, 1fr)',
-                    lg: 'repeat(3, 1fr)',
-                    xl: 'repeat(4, 1fr)',
-                  },
-                }}
-              >
-                {isLoading
-                  ? [0, 1, 2, 3].map((i) => <CardSkeleton key={i} />)
-                  : agents.map((agent) => (
-                      <AgentCard key={agent.id} agent={agent} onOpen={openAgent} />
-                    ))}
+            <Box component="section" sx={{ pt: 3 }}>
+              <Box sx={{ display: 'flex', justifyContent: 'center', mb: 1 }}>
+                <TeamLevelTabs value={level} onChange={setLevel} />
               </Box>
+              <TeamOverviewRing level={level} />
             </Box>
 
-            <Box component="section">
+            <Box component="section" sx={{ mt: 6 }}>
+              <TeamKpiSection agents={agents} />
+            </Box>
+
+            <Box component="section" sx={{ mt: 2 }}>
               <TeamSectionHeader
                 title="Kanäle & Systeme"
                 description="Womit das digitale Team heute verbunden ist."