diff --git a/agent-linux/collector/pbs.go b/agent-linux/collector/pbs.go
index 5387169..0268f36 100644
--- a/agent-linux/collector/pbs.go
+++ b/agent-linux/collector/pbs.go
@@ -13,6 +13,7 @@ type PBSInfo struct {
 	Datastores []PBSDatastore  `json:"datastores,omitempty"`
 	Tasks      []PBSTask       `json:"tasks,omitempty"`
 	GC         []PBSGCStatus   `json:"gc,omitempty"`
+	SyncJobs   int             `json:"sync_jobs"`
 }
 
 type PBSDatastore struct {
@@ -161,6 +162,14 @@ func CollectPBS() *PBSInfo {
 		pbs.GC = append(pbs.GC, gc)
 	}
 
-	log.Printf("PBS: %d Datastores, %d Tasks gesammelt", len(pbs.Datastores), len(pbs.Tasks))
+	// Sync Jobs zählen
+	if out, err := exec.Command("/usr/sbin/proxmox-backup-manager", "sync-job", "list", "--output-format", "json").Output(); err == nil {
+		var jobs []interface{}
+		if json.Unmarshal(out, &jobs) == nil {
+			pbs.SyncJobs = len(jobs)
+		}
+	}
+
+	log.Printf("PBS: %d Datastores, %d Tasks, %d SyncJobs gesammelt", len(pbs.Datastores), len(pbs.Tasks), pbs.SyncJobs)
 	return pbs
 }
diff --git a/frontend/src/components/ProxmoxPanel.jsx b/frontend/src/components/ProxmoxPanel.jsx
index 7ba4da8..941f382 100644
--- a/frontend/src/components/ProxmoxPanel.jsx
+++ b/frontend/src/components/ProxmoxPanel.jsx
@@ -127,7 +127,7 @@ export default function ProxmoxPanel({ agentId, customers, onClose, onReload })
         ) : tab === 'updates' ? (
           <UpdatesTab sys={sys} />
         ) : tab === 'pbs' ? (
-          <PBSTab pbs={pbs} agentId={agentId} />
+          <PBSTab pbs={pbs} agentId={agentId} sys={sys} />
         ) : tab === 'backups' ? (
           <BackupsTab sys={sys} />
         ) : tab === 'agent' ? (
@@ -953,7 +953,7 @@ function formatUptime(seconds) {
   return `${h}h ${m}m`
 }
 
-function PBSTab({ pbs, agentId }) {
+function PBSTab({ pbs, agentId, sys }) {
   const [loading, setLoading] = React.useState({})
   const [feedback, setFeedback] = React.useState({})
 
@@ -974,7 +974,6 @@ function PBSTab({ pbs, agentId }) {
     if (s < 3600) return `${Math.floor(s/60)}m ${s%60}s`
     return `${Math.floor(s/3600)}h ${Math.floor((s%3600)/60)}m`
   }
-
   const taskStatusColor = (s) => {
     if (!s) return 'text-gray-500'
     if (s === 'OK' || s.startsWith('OK')) return 'text-green-400'
@@ -1003,18 +1002,57 @@ function PBSTab({ pbs, agentId }) {
     }
   }
 
+  const totalBackups = pbs.datastores?.reduce((s, d) => s + (d.backup_count || 0), 0) || 0
+  const kernel = sys?.opnsense_version || '—'
+
+  const StatCard = ({ icon, value, label, iconColor }) => (
+    <div className="flex-1 bg-[#1a2235] rounded-xl border border-gray-700/40 p-4 flex flex-col items-center gap-2">
+      <div className={`text-2xl ${iconColor}`}>{icon}</div>
+      <div className="text-2xl font-bold text-white">{value}</div>
+      <div className="text-xs text-gray-400">{label}</div>
+    </div>
+  )
+
   return (
     <div className="space-y-6">
-      {/* Header */}
+      {/* Titel */}
       <div>
-        <div className="text-white font-semibold">Proxmox Backup Server</div>
-        {pbs.version && <div className="text-xs text-gray-500 mt-0.5">Version {pbs.version}</div>}
+        <div className="text-lg font-semibold text-white">Backup Server</div>
+        {pbs.version && <div className="text-xs text-gray-500 mt-0.5">PBS {pbs.version}</div>}
+      </div>
+
+      {/* Stat-Karten */}
+      <div className="flex gap-3">
+        <StatCard
+          icon={<svg className="w-7 h-7" fill="none" stroke="currentColor" viewBox="0 0 24 24"><ellipse cx="12" cy="5" rx="9" ry="3" strokeWidth="2"/><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M3 5v14a9 3 0 0018 0V5M3 12a9 3 0 0018 0"/></svg>}
+          value={pbs.datastores?.length || 0}
+          label="Datastores"
+          iconColor="text-orange-400"
+        />
+        <StatCard
+          icon={<svg className="w-7 h-7" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M5 8h14M5 8a2 2 0 110-4h14a2 2 0 110 4M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8"/></svg>}
+          value={totalBackups}
+          label="Backups"
+          iconColor="text-blue-400"
+        />
+        <StatCard
+          icon={<svg className="w-7 h-7" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"/></svg>}
+          value={pbs.sync_jobs ?? 0}
+          label="Sync Jobs"
+          iconColor="text-green-400"
+        />
+        <StatCard
+          icon={<svg className="w-7 h-7" fill="none" stroke="currentColor" viewBox="0 0 24 24"><rect x="2" y="6" width="20" height="4" rx="1" strokeWidth="2"/><rect x="2" y="14" width="20" height="4" rx="1" strokeWidth="2"/><line x1="6" y1="8" x2="6" y2="8" strokeWidth="3" strokeLinecap="round"/><line x1="6" y1="16" x2="6" y2="16" strokeWidth="3" strokeLinecap="round"/></svg>}
+          value={kernel !== '—' ? kernel.split('-')[0] : '—'}
+          label="Kernel"
+          iconColor="text-orange-400"
+        />
       </div>
 
       {/* Datastores */}
       {pbs.datastores?.length > 0 && (
         <div className="space-y-3">
-          <h3 className="text-sm font-medium text-gray-400">Datastores</h3>
+          <h3 className="text-sm font-semibold text-white">Datastores</h3>
           {pbs.datastores.map((ds) => {
             const usedPct = ds.total > 0 ? (ds.used / ds.total * 100) : 0
             const barColor = usedPct > 90 ? 'bg-red-500' : usedPct > 70 ? 'bg-yellow-500' : 'bg-green-500'
@@ -1035,46 +1073,35 @@ function PBSTab({ pbs, agentId }) {
             }
             return (
               <div key={ds.name} className="bg-[#1a2235] rounded-xl border border-gray-700/40 p-4 space-y-3">
-                {/* Titel + Backup-Count */}
                 <div className="flex items-center justify-between">
                   <div className="flex items-center gap-2">
-                    <div className="w-8 h-8 rounded-lg bg-orange-500/20 flex items-center justify-center">
-                      <svg className="w-4 h-4 text-orange-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 8h14M5 8a2 2 0 110-4h14a2 2 0 110 4M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8m-9 4h4" />
-                      </svg>
-                    </div>
+                    <svg className="w-4 h-4 text-orange-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 8h14M5 8a2 2 0 110-4h14a2 2 0 110 4M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8m-9 4h4" />
+                    </svg>
                     <span className="text-white font-semibold">{ds.name}</span>
                   </div>
-                  {ds.backup_count > 0 && (
-                    <span className="text-sm text-gray-400">{ds.backup_count} Backups</span>
-                  )}
+                  {ds.backup_count > 0 && <span className="text-sm text-gray-400">{ds.backup_count} Backups</span>}
                 </div>
-
-                {/* Speicher-Balken */}
                 <div>
                   <div className="flex justify-between text-xs text-gray-400 mb-1.5">
                     <span>{formatBytes(ds.used)} / {formatBytes(ds.total)}</span>
                     <span>{usedPct.toFixed(1)}%</span>
                   </div>
                   <div className="h-2 bg-gray-700 rounded-full overflow-hidden">
-                    <div className={`h-full rounded-full ${barColor} transition-all`} style={{ width: `${Math.min(usedPct, 100)}%` }} />
+                    <div className={`h-full rounded-full ${barColor}`} style={{ width: `${Math.min(usedPct, 100)}%` }} />
                   </div>
                 </div>
-
-                {/* GC-Status */}
-                {gc && gc.status && (
+                {gc?.status && (
                   <div className="text-xs text-gray-500 flex gap-3">
                     <span>GC: <span className={gc.status === 'ok' ? 'text-green-400' : gc.status === 'running' ? 'text-blue-400' : 'text-gray-500'}>{gc.status}</span></span>
                     {gc.last_run > 0 && <span>Letzter Lauf: {formatTs(gc.last_run)}</span>}
                     {gc.duration > 0 && <span>({formatDuration(gc.duration)})</span>}
                   </div>
                 )}
-
-                {/* Aktions-Buttons */}
                 <div className="flex gap-2 pt-1">
-                  <ActionBtn action="gc"     label="GC"     cls="bg-yellow-500 hover:bg-yellow-400 text-gray-900" />
+                  <ActionBtn action="gc"     label="GC"     cls="bg-yellow-600 hover:bg-yellow-500 text-white" />
                   <ActionBtn action="verify" label="Verify" cls="bg-gray-600 hover:bg-gray-500 text-white" />
-                  <ActionBtn action="prune"  label="Prune"  cls="bg-orange-600 hover:bg-orange-500 text-white" />
+                  <ActionBtn action="prune"  label="Prune"  cls="bg-orange-700 hover:bg-orange-600 text-white" />
                 </div>
               </div>
             )
@@ -1085,7 +1112,7 @@ function PBSTab({ pbs, agentId }) {
       {/* Tasks */}
       {pbs.tasks?.length > 0 && (
         <div className="space-y-2">
-          <h3 className="text-sm font-medium text-gray-400">Letzte Tasks</h3>
+          <h3 className="text-sm font-semibold text-white">Letzte Tasks</h3>
           <div className="bg-gray-800/50 rounded-lg border border-gray-700/50 overflow-hidden">
             <table className="w-full text-xs">
               <thead>