diff --git a/frontend/src/api/portfolio.ts b/frontend/src/api/portfolio.ts
index 9724278..edc011b 100644
--- a/frontend/src/api/portfolio.ts
+++ b/frontend/src/api/portfolio.ts
@@ -132,30 +132,47 @@ export type WealthDiagnostic = {
   action: string
   reason_code: string
   prominent: boolean
 }
 export type ModelledValueQuality = 'confirmed' | 'modelled' | 'carried' | 'incomplete' | 'unavailable'
+export type WealthChartPeriod = '1m' | '3m' | 'ytd' | '1y' | 'all'
+export type WealthComponentKey = 'postfinance' | 'truewealth' | 'crypto' | 'bank_cash' | 'other_assets'
+export type ModelledWealthPoint = {
+  date: string
+  value_chf: string
+  quality: ModelledValueQuality
+  has_confirmed_anchor: boolean
+  has_modelled_value: boolean
+  excluded_account_count: number
+  components: Array<{ key: WealthComponentKey; label: string; value_chf: string | null; quality: ModelledValueQuality; source_date: string | null }>
+  event?: string | null
+  event_label?: string | null
+  correction_event?: string | null
+  events?: string[]
+}
+export type PortfolioAnalysisStatus = 'complete' | 'partial' | 'unavailable'
+export type PortfolioAnalysis = {
+  status: PortfolioAnalysisStatus
+  allocation: Array<{ key: string; label: string; current_value_chf: string | null; current_pct: string | null; target_pct: string | null; lower_pct: string | null; upper_pct: string | null; deviation_pp: string | null; deviation_chf: string | null; status: string }>
+  concentrations: { top1_pct: string | null; top5_pct: string | null; top10_pct: string | null }
+  dimensions: Partial<Record<'currency' | 'region' | 'sector', { status: PortfolioAnalysisStatus; rows: Array<{ label: string; pct: string | null }> }>>
+  contributions: Array<{ key: string; label: string; value_chf: string | null; status?: string | null }>
+  hints: Array<string | { priority?: number; text: string }>
+}
 export type ModelledWealthDevelopment = {
   status: 'available' | 'unavailable'
-  period: { preset: 'since_anchor' | '1m' | '3m' | '1y' | 'all'; from: string; to: string }
+  period: { preset: 'since_anchor' | WealthChartPeriod; from: string; to: string }
+  last_confirmed_anchor_date?: string | null
   anchor: { date: string; value_chf: string; quality: ModelledValueQuality } | null
   baseline: { date: string; value_chf: string; quality: ModelledValueQuality } | null
   current: { date: string; value_chf: string; quality: ModelledValueQuality } | null
   change_chf: string | null
   change_pct: string | null
   chart_visible: boolean
-  points: Array<{
-    date: string
-    value_chf: string
-    quality: ModelledValueQuality
-    has_confirmed_anchor: boolean
-    has_modelled_value: boolean
-    excluded_account_count: number
-    components: Array<{ key: 'postfinance' | 'truewealth' | 'crypto' | 'bank_cash'; label: string; value_chf: string | null; quality: ModelledValueQuality; source_date: string | null }>
-  }>
-  components: Array<{ key: 'postfinance' | 'truewealth' | 'crypto' | 'bank_cash'; label: string; current_value_chf: string | null; change_chf: string | null; change_pct: string | null; quality: ModelledValueQuality; as_of: string | null; unknown_account_count: number }>
-  correction_markers: Array<{ date: string; source_key: 'postfinance' | 'truewealth'; confirmed_value_chf: string; predecessor_model_value_chf: string; difference_chf: string }>
+  points: ModelledWealthPoint[]
+  components: Array<{ key: WealthComponentKey; label: string; current_value_chf: string | null; change_chf: string | null; change_pct: string | null; quality: ModelledValueQuality; as_of: string | null; unknown_account_count: number }>
+  correction_markers: Array<{ date: string; source_key: 'postfinance' | 'truewealth' | 'bank_cash'; confirmed_value_chf: string; predecessor_model_value_chf: string; difference_chf: string }>
   unknown_accounts: Array<{ key: string; label: string; reason_code: string }>
   method: 'modelled_wealth_daily_v1'
   disclaimer: string
 }
 export type VerifiedPerformanceSummary = {
@@ -170,10 +187,11 @@ export type WealthCockpit = {
   scope_label: string
   not_net_worth: boolean
   period: { preset: 'since_anchor' | '1m' | '3m' | '1y' | 'ytd' | 'previous_year' | '12m' | 'all'; from: string; to: string }
   data_cutoff: string
   modelled_development: ModelledWealthDevelopment
+  portfolio_analysis?: PortfolioAnalysis | null
   verified_performance: VerifiedPerformanceSummary
   kpis: Array<{ key: string; label: string; value_chf?: string | null; value_pct?: string | null; value_date?: string | null; status: string }>
   totals: { captured_wealth_chf: string; investments_chf: string; bank_cash_chf: string; complete: boolean }
   history: { status: string; points: Array<{ at: string; value_chf: string }>; household_cashflow_events: Array<{ at: string; kind: string; amount_chf: string }>; investment_cashflow_events: Array<{ at: string; kind: string; amount: string }>; reason: string }
   distribution: Array<{ key: string; label: string; value_chf: string | null }>
diff --git a/frontend/src/components/wealth/WealthCockpitPanel.vue b/frontend/src/components/wealth/WealthCockpitPanel.vue
index 61d9841..fdddcec 100644
--- a/frontend/src/components/wealth/WealthCockpitPanel.vue
+++ b/frontend/src/components/wealth/WealthCockpitPanel.vue
@@ -5,19 +5,11 @@
         <div class="max-w-3xl">
           <p class="text-xs font-bold uppercase tracking-[0.18em] text-cyan-700">Vermögen</p>
           <h2 class="mt-1 text-2xl font-bold text-slate-950">Modellierte Wertentwicklung</h2>
           <p class="mt-1 text-sm text-slate-600">Geschätzte Entwicklung aus bestätigten Ankern, gespeicherten Tagesbewertungen und fortgeschriebenen bekannten Kontoständen. Keine verifizierte TTWROR oder XIRR.</p>
         </div>
-        <label class="text-sm font-semibold text-slate-700">Zeitraum
-          <select v-model="period" class="mt-1 min-h-11 rounded-lg border border-slate-300 bg-white px-3" data-testid="modelled-period" @change="load(false)">
-            <option value="since_anchor">Seit letztem Importanker</option>
-            <option value="1m">1 Monat</option>
-            <option value="3m">3 Monate</option>
-            <option value="1y">Jahr</option>
-            <option value="all">Gesamt</option>
-          </select>
-        </label>
+        <AssetRefreshControl @completed="load(true)" />
       </div>
       <AvailabilityState v-if="error" class="mt-4" state="error" title="Vermögens-Cockpit nicht verfügbar" :description="error" />
       <AvailabilityState v-else-if="loading && !cockpit" class="mt-4" state="loading" />
       <template v-else-if="modelled">
         <div class="mt-5 grid gap-3 sm:grid-cols-2 xl:grid-cols-4" data-testid="modelled-kpis">
@@ -48,30 +40,12 @@
     </section>
 
     <template v-if="cockpit && modelled">
       <section class="grid gap-5 xl:grid-cols-[1.65fr_1fr]">
         <article class="min-w-0 rounded-2xl border border-slate-200 bg-white/90 p-4 sm:p-5" data-testid="modelled-history">
-          <div class="flex flex-wrap items-start justify-between gap-2"><div><h3 class="text-lg font-semibold text-slate-950">Geschätzte Entwicklung</h3><p class="text-sm text-slate-600">Rein bestätigte Abschnitte sind durchgezogen; modellierte, fortgeschriebene oder gemischte Abschnitte gestrichelt.</p></div><span :class="qualityClass(modelled.current?.quality)">{{ qualityLabel(modelled.current?.quality) }}</span></div>
-          <div v-if="modelled.chart_visible && chartGeometry.points.length >= 2" class="mt-4 overflow-hidden rounded-xl bg-slate-950 p-3" data-testid="modelled-chart">
-            <svg viewBox="0 0 100 42" class="h-64 w-full" role="img" aria-label="Modellierte Vermögensentwicklung">
-              <line v-for="segment in chartGeometry.segments" :key="segment.key" :x1="segment.x1" :y1="segment.y1" :x2="segment.x2" :y2="segment.y2" stroke="#22d3ee" stroke-width="1.8" stroke-linecap="round" :stroke-dasharray="segment.dashed ? '4 3' : undefined" />
-              <circle v-for="point in chartGeometry.points.filter(row => row.hasConfirmedAnchor)" :key="`anchor-${point.date}`" :cx="point.x" :cy="point.y" r="1.7" fill="#f8fafc" stroke="#0891b2" stroke-width="0.8" />
-              <circle v-for="marker in chartGeometry.markers" :key="`marker-${marker.date}-${marker.source}`" :cx="marker.x" :cy="marker.y" r="2" fill="#f59e0b" stroke="#fef3c7" stroke-width="0.7" />
-            </svg>
-            <div class="flex flex-wrap gap-4 text-xs text-slate-300"><span>● Bestätigte Komponente am Stichtag</span><span>┄ Modelliert/Fortgeschrieben/Gemischt</span><span v-if="modelled.correction_markers.length" class="text-amber-300">● Importkorrektur</span></div>
-          </div>
-          <AvailabilityState v-else class="mt-4" state="partial" title="Noch keine darstellbare Reihe" description="Die Grafik erscheint, sobald mindestens zwei bestätigte oder modellierte Tageswerte vorliegen." />
-          <details class="mt-4 rounded-xl border border-slate-200 bg-slate-50/70 p-3" data-testid="modelled-chart-data">
-            <summary class="min-h-11 cursor-pointer py-2 text-sm font-semibold text-slate-800">Barrierefreie Datentabelle zur Grafik</summary>
-            <p class="mb-3 text-xs text-slate-600">Die Tabelle nennt Datum, Wert und Qualitätsstatus jedes dargestellten Punkts. Korrekturen ersetzen keinen historischen Modellwert, sondern markieren die Differenz zu einem später bestätigten Anker.</p>
-            <div class="overflow-x-auto">
-              <table class="min-w-full text-left text-xs">
-                <thead><tr class="border-b border-slate-200"><th class="p-2">Datum</th><th class="p-2">Wert</th><th class="p-2">Qualität</th><th class="p-2">Evidenz</th></tr></thead>
-                <tbody><tr v-for="point in modelled.points" :key="`data-${point.date}`" class="border-b border-slate-100"><td class="p-2">{{ dateLabel(point.date) }}</td><td class="p-2">{{ money(point.value_chf) }}</td><td class="p-2">{{ qualityLabel(point.quality) }}</td><td class="p-2">{{ pointEvidence(point) }}</td></tr></tbody>
-              </table>
-            </div>
-          </details>
+          <div class="flex flex-wrap items-start justify-between gap-2"><div><h3 class="text-lg font-semibold text-slate-950">Geschätzte Entwicklung</h3><p class="text-sm text-slate-600">Historie bis zum letzten bestätigten Anker durchgezogen; nur der anschliessende Abschnitt gestrichelt. Gemischte Komponentenqualität segmentiert die Gesamtlinie nicht.</p></div><span :class="qualityClass(modelled.current?.quality)">{{ qualityLabel(modelled.current?.quality) }}</span></div>
+          <WealthDevelopmentChart class="mt-4" :model="modelled" :period="period" @period-change="changePeriod" />
           <ul v-if="modelled.correction_markers.length" class="mt-3 space-y-2 text-sm" data-testid="correction-markers"><li v-for="marker in modelled.correction_markers" :key="`${marker.date}-${marker.source_key}`" class="rounded-lg border border-amber-200 bg-amber-50 p-2">Importkorrektur · neuer bestätigter Anker {{ dateLabel(marker.date) }} · Abgleich {{ signedMoney(marker.difference_chf) }}</li></ul>
         </article>
 
         <article class="rounded-2xl border border-slate-200 bg-white/90 p-4 sm:p-5" data-testid="modelled-components">
           <h3 class="text-lg font-semibold text-slate-950">Aufteilung</h3>
@@ -79,17 +53,19 @@
           <div class="mt-4 grid gap-3 sm:grid-cols-2 xl:grid-cols-1">
             <article v-for="item in modelled.components" :key="item.key" class="rounded-xl border border-slate-200 p-3" :data-testid="`modelled-component-${item.key}`">
               <div class="flex items-start justify-between gap-2"><div><h4 class="font-semibold text-slate-950">{{ item.label }}</h4><p class="text-xs text-slate-500">{{ item.key === 'bank_cash' ? 'Kontostandentwicklung' : 'Geschätzte Entwicklung' }}</p></div><span :class="qualityClass(item.quality)">{{ qualityLabel(item.quality) }}</span></div>
               <p class="mt-2 text-lg font-bold">{{ moneyOrUnavailable(item.current_value_chf) }}</p>
               <p class="text-xs text-slate-600">{{ signedMoney(item.change_chf) }} · {{ signedPercent(item.change_pct) }}</p>
-              <svg v-if="componentSparkline(item.key)" viewBox="0 0 100 24" class="mt-2 h-8 w-full" aria-hidden="true"><polyline :points="componentSparkline(item.key)" fill="none" stroke="#0891b2" stroke-width="2" stroke-linecap="round" /></svg>
               <p class="mt-1 text-xs text-slate-500">Stand {{ item.as_of ? dateLabel(item.as_of) : 'nicht verfügbar' }}<template v-if="item.unknown_account_count"> · {{ item.unknown_account_count }} Position(en)/Konto/Konten nicht enthalten</template></p>
             </article>
           </div>
         </article>
       </section>
 
+      <PortfolioAnalysisPanel v-if="cockpit.portfolio_analysis" :analysis="cockpit.portfolio_analysis" />
+      <section v-else class="rounded-2xl border border-slate-200 bg-white/90 p-5" data-testid="portfolio-analysis-unavailable"><h3 class="font-semibold text-slate-950">Portfolioanalyse v1</h3><p class="mt-2 text-sm text-slate-600">Portfolioanalyse nicht beurteilbar.</p></section>
+
       <details class="rounded-2xl border border-cyan-200 bg-cyan-50/60 p-4 sm:p-5" data-testid="verified-performance">
         <summary class="flex min-h-11 cursor-pointer items-center justify-between gap-3 font-semibold"><span>Verifizierte Anlagerendite</span><span>{{ cockpit.verified_performance.label }}</span></summary>
         <p class="mt-3 text-sm text-slate-700">Die bestehende strenge TTWROR-/XIRR-Berechnung bleibt unabhängig von der modellierten Standardansicht.</p>
         <div class="mt-3 grid gap-3 sm:grid-cols-2"><article class="rounded-xl bg-white p-3"><strong>TTWROR</strong><p>{{ cockpit.verified_performance.ttwror_status === 'ready' ? percentRatio(cockpit.verified_performance.ttwror_pct) : 'Noch nicht verifiziert' }}</p></article><article class="rounded-xl bg-white p-3"><strong>XIRR</strong><p>{{ cockpit.verified_performance.xirr_status === 'ready' ? percentRatio(cockpit.verified_performance.xirr_pct) : 'Noch nicht verifiziert' }}</p></article></div>
       </details>
@@ -112,14 +88,17 @@
 </template>
 
 <script setup lang="ts">
 import { computed, onMounted, ref, watch } from 'vue'
 import AvailabilityState from '@/components/ui/AvailabilityState.vue'
-import { getWealthCockpit, type ModelledValueQuality, type WealthCockpit } from '@/api/portfolio'
+import AssetRefreshControl from './AssetRefreshControl.vue'
+import PortfolioAnalysisPanel from './PortfolioAnalysisPanel.vue'
+import WealthDevelopmentChart from './WealthDevelopmentChart.vue'
+import { getWealthCockpit, type ModelledValueQuality, type WealthChartPeriod, type WealthCockpit } from '@/api/portfolio'
 
 const props = defineProps<{ refreshKey?: number }>()
-const period = ref<'since_anchor' | '1m' | '3m' | '1y' | 'all'>('1m')
+const period = ref<WealthChartPeriod>('1m')
 const cockpit = ref<WealthCockpit | null>(null)
 const loading = ref(false)
 const error = ref<string | null>(null)
 const modelled = computed(() => cockpit.value?.modelled_development ?? null)
 
@@ -130,23 +109,11 @@ function signedPercent(value: string | null | undefined) { const n=Number(value)
 function percentRatio(value: string | null | undefined) { const n=Number(value); return value!=null&&Number.isFinite(n)?signedPercent(String(n*100)):'Noch nicht verifiziert' }
 function dateLabel(value: string) { const parsed=new Date(value.length===10?`${value}T00:00:00Z`:value); return Number.isNaN(parsed.valueOf())?value:new Intl.DateTimeFormat('de-CH',{dateStyle:'medium',timeZone:'Europe/Zurich'}).format(parsed) }
 function qualityLabel(value: ModelledValueQuality | undefined) { return ({confirmed:'Bestätigt',modelled:'Modelliert',carried:'Fortgeschrieben',incomplete:'Unvollständig',unavailable:'Nicht verfügbar'} as Record<string,string>)[value??'unavailable'] }
 function qualityClass(value: ModelledValueQuality | undefined) { const base='inline-flex rounded-full px-2 py-1 text-xs font-semibold'; return `${base} ${value==='confirmed'?'bg-emerald-100 text-emerald-800':value==='modelled'?'bg-cyan-100 text-cyan-800':value==='carried'?'bg-blue-100 text-blue-800':value==='incomplete'?'bg-amber-100 text-amber-900':'bg-slate-100 text-slate-700'}` }
 function coverageLabel(value:string){return value==='complete'?'vollständig':value==='partial'?'teilweise':value==='stale'?'veraltet':'nicht verfügbar'}
-function pointEvidence(point:{date:string;has_confirmed_anchor:boolean;has_modelled_value:boolean}) { const labels:string[]=[];if(point.has_confirmed_anchor)labels.push('bestätigter Komponentenanker');if(point.has_modelled_value)labels.push('tagesspezifisch modelliert');if(modelled.value?.correction_markers.some(marker=>marker.date===point.date))labels.push('Importkorrektur');return labels.length?labels.join(', '):'fortgeschrieben oder unvollständig' }
-
-const chartGeometry = computed(() => {
-  const rows=modelled.value?.points??[]
-  const values=rows.map(row=>Number(row.value_chf));const times=rows.map(row=>Date.parse(row.date))
-  if(rows.length<2||values.some(value=>!Number.isFinite(value))||times.some(value=>!Number.isFinite(value)))return{points:[],segments:[],markers:[]}
-  const minV=Math.min(...values),maxV=Math.max(...values),spanV=maxV-minV||1,minT=Math.min(...times),maxT=Math.max(...times),spanT=maxT-minT||1
-  const points=rows.map((row,index)=>({date:row.date,quality:row.quality,hasConfirmedAnchor:row.has_confirmed_anchor,hasModelledValue:row.has_modelled_value,x:2+(times[index]-minT)/spanT*96,y:38-(values[index]-minV)/spanV*34}))
-  const segments=points.slice(1).map((point,index)=>({key:`${points[index].date}-${point.date}`,x1:points[index].x,y1:points[index].y,x2:point.x,y2:point.y,dashed:points[index].quality!=='confirmed'||point.quality!=='confirmed'}))
-  const markers=(modelled.value?.correction_markers??[]).map(marker=>{const match=points.find(point=>point.date===marker.date);return match?{date:marker.date,source:marker.source_key,x:match.x,y:match.y}:null}).filter((row):row is NonNullable<typeof row>=>row!==null)
-  return{points,segments,markers}
-})
-function componentSparkline(key:'postfinance'|'truewealth'|'crypto'|'bank_cash') { const rows=(modelled.value?.points??[]).map(row=>({date:row.date,value:row.components.find(item=>item.key===key)?.value_chf})).filter((row):row is {date:string;value:string}=>row.value!=null);if(rows.length<2)return'';const values=rows.map(row=>Number(row.value)),min=Math.min(...values),max=Math.max(...values),span=max-min||1;return rows.map((row,index)=>`${index/(rows.length-1)*100},${22-(Number(row.value)-min)/span*20}`).join(' ') }
+async function changePeriod(value: WealthChartPeriod) { if (period.value === value) return; period.value = value; await load(false) }
 async function load(refresh=false){loading.value=true;error.value=null;try{cockpit.value=await getWealthCockpit(period.value,refresh)}catch(err){error.value=err instanceof Error?err.message:'Vermögensdaten konnten nicht geladen werden'}finally{loading.value=false}}
 watch(()=>props.refreshKey,()=>{void load(true)})
 onMounted(()=>{void load()})
 defineExpose({load,cockpit})
 </script>
diff --git a/frontend/src/components/wealth/WealthDevelopmentChart.vue b/frontend/src/components/wealth/WealthDevelopmentChart.vue
new file mode 100644
index 0000000..816caa5
--- /dev/null
+++ b/frontend/src/components/wealth/WealthDevelopmentChart.vue
@@ -0,0 +1,100 @@
+<template>
+  <section class="wealth-chart" data-testid="wealth-development-chart">
+    <div class="flex flex-wrap items-center justify-between gap-3">
+      <div class="flex flex-wrap gap-1" role="group" aria-label="Zeitraum" data-testid="wealth-chart-periods">
+        <button v-for="item in periods" :key="item.value" type="button" :aria-pressed="period === item.value" :data-testid="`wealth-period-${item.value}`" :class="controlClass(period === item.value)" @click="$emit('period-change', item.value)">{{ item.label }}</button>
+      </div>
+      <div class="flex flex-wrap gap-1" role="group" aria-label="Darstellung" data-testid="wealth-chart-modes">
+        <button v-for="item in modes" :key="item.value" type="button" :aria-pressed="mode === item.value" :data-testid="`wealth-mode-${item.value}`" :class="controlClass(mode === item.value)" @click="mode = item.value">{{ item.label }}</button>
+      </div>
+    </div>
+
+    <div v-if="points.length >= 2" class="mt-4 rounded-xl border border-slate-200 bg-white p-2 sm:p-3" data-testid="modelled-chart">
+      <div tabindex="0" role="application" aria-label="Vermögensentwicklung. Mit Pfeil links und rechts Datenpunkte lesen." class="h-72 outline-none focus-visible:ring-2 focus-visible:ring-cyan-600 sm:h-80" data-testid="wealth-chart-keyboard" @keydown.left.prevent="moveSelection(-1)" @keydown.right.prevent="moveSelection(1)">
+        <Chart type="line" :data="chartData" :options="chartOptions" class="h-full w-full" data-testid="wealth-chart-canvas" />
+      </div>
+      <p class="sr-only" aria-live="polite" data-testid="wealth-chart-live">{{ selectedSummary }}</p>
+      <div class="mt-2 flex flex-wrap gap-x-4 gap-y-1 text-xs text-slate-600" data-testid="wealth-chart-legend">
+        <span><span class="font-bold text-cyan-700">━</span> Historie bestätigt</span>
+        <span><span class="font-bold text-cyan-700">┄</span> Nach letztem bestätigten Anker</span>
+        <span>● Bestätigter Snapshot / Importanker</span>
+        <span class="text-amber-800">◆ Korrektur</span>
+      </div>
+    </div>
+    <AvailabilityState v-else class="mt-4" state="partial" title="Noch keine darstellbare Reihe" description="Die Grafik erscheint, sobald mindestens zwei bestätigte oder modellierte Tageswerte vorliegen." />
+
+    <details class="mt-4 rounded-xl border border-slate-200 bg-slate-50/70 p-3" data-testid="modelled-chart-data">
+      <summary class="min-h-11 cursor-pointer py-2 text-sm font-semibold text-slate-800">Barrierefreie Datentabelle zur Grafik</summary>
+      <p class="mb-3 text-xs text-slate-600">Alternative zur Grafik mit Datum, Gesamtwert, Veränderung, Komponenten, Qualität und Ereignissen.</p>
+      <div class="overflow-x-auto">
+        <table class="min-w-[52rem] w-full text-left text-xs" data-testid="wealth-data-table">
+          <thead><tr class="border-b border-slate-300"><th class="p-2">Datum</th><th class="p-2">Gesamtwert</th><th class="p-2">Veränderung</th><th v-for="component in componentKeys" :key="component" class="p-2">{{ componentLabel(component) }}</th><th class="p-2">Qualität</th><th class="p-2">Ereignis</th></tr></thead>
+          <tbody><tr v-for="(point, index) in points" :key="point.date" class="border-b border-slate-200"><td class="p-2">{{ dateLabel(point.date) }}</td><td class="p-2">{{ money(point.value_chf) }}</td><td class="p-2">{{ changeLabel(index) }}</td><td v-for="component in componentKeys" :key="component" class="p-2">{{ moneyOrDash(componentValue(point, component)) }}</td><td class="p-2">{{ qualityLabel(point.quality) }}</td><td class="p-2">{{ eventLabel(point) }}</td></tr></tbody>
+        </table>
+      </div>
+    </details>
+  </section>
+</template>
+
+<script setup lang="ts">
+import { computed, ref } from 'vue'
+import Chart from 'primevue/chart'
+import type { ChartData, ChartOptions } from 'chart.js'
+import AvailabilityState from '@/components/ui/AvailabilityState.vue'
+import type { ModelledWealthDevelopment, ModelledWealthPoint, WealthChartPeriod } from '@/api/portfolio'
+
+const props = defineProps<{ model: ModelledWealthDevelopment; period: WealthChartPeriod }>()
+defineEmits<{ 'period-change': [period: WealthChartPeriod] }>()
+type Mode = 'total' | 'components' | 'performance'
+type ComponentKey = ModelledWealthPoint['components'][number]['key']
+const mode = ref<Mode>('total')
+const selectedIndex = ref(0)
+const periods: Array<{ value: WealthChartPeriod; label: string }> = [{ value: '1m', label: '1M' }, { value: '3m', label: '3M' }, { value: 'ytd', label: 'YTD' }, { value: '1y', label: '1J' }, { value: 'all', label: 'Max' }]
+const modes: Array<{ value: Mode; label: string }> = [{ value: 'total', label: 'Gesamt' }, { value: 'components', label: 'Komponenten' }, { value: 'performance', label: 'Wertentwicklung (modelliert)' }]
+const palette: Record<string, string> = { total: '#0e7490', postfinance: '#2563eb', truewealth: '#7c3aed', crypto: '#c2410c', bank_cash: '#0f766e', other_assets: '#64748b' }
+const points = computed(() => props.model.points)
+const componentKeys = computed<ComponentKey[]>(() => {
+  const preferred: ComponentKey[] = ['postfinance', 'truewealth', 'crypto', 'bank_cash', 'other_assets']
+  return preferred.filter(key => points.value.some(point => point.components.some(component => component.key === key)))
+})
+
+function controlClass(active: boolean) { return ['min-h-11 rounded-lg border px-3 py-2 text-sm font-semibold', active ? 'border-cyan-600 bg-cyan-50 text-cyan-900' : 'border-slate-300 bg-white text-slate-700 hover:bg-slate-50'] }
+function number(value: string | null | undefined) { const parsed = Number(value); return value == null || !Number.isFinite(parsed) ? null : parsed }
+function money(value: string | number | null | undefined) { const parsed = number(value == null ? null : String(value)); return parsed == null ? 'Nicht verfügbar' : new Intl.NumberFormat('de-CH', { style: 'currency', currency: 'CHF' }).format(parsed) }
+function moneyOrDash(value: string | null | undefined) { return value == null ? '—' : money(value) }
+function dateLabel(value: string) { const parsed = new Date(`${value.slice(0, 10)}T00:00:00Z`); return Number.isNaN(parsed.valueOf()) ? value : new Intl.DateTimeFormat('de-CH', { dateStyle: 'medium', timeZone: 'Europe/Zurich' }).format(parsed) }
+function qualityLabel(value: string) { return ({ confirmed: 'Bestätigt', modelled: 'Modelliert', carried: 'Fortgeschrieben', incomplete: 'Unvollständig', unavailable: 'Nicht verfügbar' } as Record<string, string>)[value] ?? value }
+function componentLabel(key: ComponentKey) { return ({ postfinance: 'PostFinance', truewealth: 'True Wealth', crypto: 'Krypto', bank_cash: 'Bank', other_assets: 'Weitere Anlagen' } as Record<string, string>)[key] ?? key }
+function componentValue(point: ModelledWealthPoint, key: ComponentKey) { return point.components.find(item => item.key === key)?.value_chf ?? null }
+function change(index: number) { if (index === 0) return null; const current = number(points.value[index]?.value_chf); const previous = number(points.value[index - 1]?.value_chf); return current == null || previous == null ? null : current - previous }
+function changeLabel(index: number) { const value = change(index); return value == null ? '—' : `${value > 0 ? '+' : ''}${money(value)}` }
+function pointEvents(point: ModelledWealthPoint) { return [point.event, point.event_label, point.correction_event, ...(point.events ?? [])].filter((value): value is string => typeof value === 'string' && value.trim().length > 0) }
+function eventLabel(point: ModelledWealthPoint) { const labels = [...pointEvents(point)]; if (point.has_confirmed_anchor) labels.unshift('Bestätigter Snapshot / Importanker'); if (props.model.correction_markers.some(marker => marker.date === point.date)) labels.push('Importkorrektur'); return [...new Set(labels)].join(' · ') || '—' }
+function performanceValue(value: string | null, base: number | null) { const current = number(value); return current == null || base == null || base === 0 ? null : (current / base - 1) * 100 }
+function valuesFor(key: 'total' | ComponentKey) { const raw = points.value.map(point => key === 'total' ? point.value_chf : componentValue(point, key)); if (mode.value !== 'performance') return raw.map(number); const base = raw.map(number).find(value => value != null) ?? null; return raw.map(value => performanceValue(value, base)) }
+function split(values: Array<number | null>) {
+  const anchor = props.model.last_confirmed_anchor_date ?? props.model.anchor?.date ?? null
+  const before = values.map((value, index) => !anchor || points.value[index].date <= anchor ? value : null)
+  const after = values.map((value, index) => !anchor || points.value[index].date >= anchor ? value : null)
+  return { before, after, hasProjection: Boolean(anchor && points.value.some(point => point.date > anchor)) }
+}
+function lineDatasets(key: 'total' | ComponentKey, label: string) {
+  const color = palette[key] ?? '#64748b'; const { before, after, hasProjection } = split(valuesFor(key))
+  const common = { label, borderColor: color, backgroundColor: key === 'total' ? 'rgba(14,116,144,.10)' : 'transparent', borderWidth: key === 'total' ? 2.5 : 2, pointRadius: 0, pointHoverRadius: 4, tension: 0.25, spanGaps: false }
+  return [
+    { ...common, data: before, fill: key === 'total' && mode.value === 'total' ? 'origin' : false, borderDash: [] },
+    ...(hasProjection ? [{ ...common, label: `${label} nach Anker`, data: after, fill: false, borderDash: [6, 5] }] : []),
+  ]
+}
+const chartData = computed<ChartData<'line'>>(() => {
+  const lines = mode.value === 'components' ? componentKeys.value.flatMap(key => lineDatasets(key, componentLabel(key))) : lineDatasets('total', mode.value === 'performance' ? 'Wertentwicklung' : 'Gesamtwert')
+  const confirmed = points.value.map(point => point.has_confirmed_anchor || point.quality === 'confirmed' ? (mode.value === 'performance' ? performanceValue(point.value_chf, number(points.value[0]?.value_chf)) : number(point.value_chf)) : null)
+  const corrections = points.value.map(point => props.model.correction_markers.some(marker => marker.date === point.date) ? (mode.value === 'performance' ? performanceValue(point.value_chf, number(points.value[0]?.value_chf)) : number(point.value_chf)) : null)
+  return { labels: points.value.map(point => point.date), datasets: [...lines, { label: 'Bestätigte Snapshots / Importanker', data: confirmed, showLine: false, pointRadius: 4, pointHoverRadius: 6, pointBackgroundColor: '#ffffff', pointBorderColor: '#0e7490', pointBorderWidth: 2 }, { label: 'Korrekturen', data: corrections, showLine: false, pointStyle: 'rectRot', pointRadius: 6, pointBackgroundColor: '#f59e0b', pointBorderColor: '#92400e' }] }
+})
+function tooltipLines(index: number) { const point = points.value[index]; if (!point) return []; return [`Gesamtwert: ${money(point.value_chf)}`, `Veränderung: ${changeLabel(index)}`, ...componentKeys.value.map(key => `${componentLabel(key)}: ${moneyOrDash(componentValue(point, key))}`), `Qualität: ${qualityLabel(point.quality)}`, `Ereignis: ${eventLabel(point)}`] }
+const chartOptions = computed<ChartOptions<'line'>>(() => ({ responsive: true, maintainAspectRatio: false, interaction: { intersect: false, mode: 'index' }, animation: false, plugins: { legend: { display: mode.value === 'components', position: 'bottom', labels: { usePointStyle: true, boxWidth: 8, filter: item => !item.text.includes('nach Anker') && !['Korrekturen', 'Bestätigte Snapshots / Importanker'].includes(item.text) } }, tooltip: { callbacks: { title: items => items[0] ? dateLabel(String(items[0].label)) : '', label: () => '', afterBody: items => items[0] ? tooltipLines(items[0].dataIndex) : [] } } }, scales: { x: { grid: { display: false }, ticks: { maxTicksLimit: 8 } }, y: { ticks: { callback: value => mode.value === 'performance' ? `${new Intl.NumberFormat('de-CH', { maximumFractionDigits: 1 }).format(Number(value))} % modelliert` : new Intl.NumberFormat('de-CH', { style: 'currency', currency: 'CHF', maximumFractionDigits: 0 }).format(Number(value)) } } } }))
+function moveSelection(delta: number) { selectedIndex.value = Math.max(0, Math.min(points.value.length - 1, selectedIndex.value + delta)) }
+const selectedSummary = computed(() => { const point = points.value[selectedIndex.value]; return point ? `${dateLabel(point.date)}, ${tooltipLines(selectedIndex.value).join(', ')}` : '' })
+defineExpose({ chartData, chartOptions, mode })
+</script>
diff --git a/src/jarvis_finance/api/schemas/wealth_cockpit.py b/src/jarvis_finance/api/schemas/wealth_cockpit.py
index d3ceb7a..3261635 100644
--- a/src/jarvis_finance/api/schemas/wealth_cockpit.py
+++ b/src/jarvis_finance/api/schemas/wealth_cockpit.py
@@ -20,11 +20,11 @@ class WealthPeriod(BaseModel):
 
 
 class ModelledWealthPeriod(BaseModel):
     model_config = ConfigDict(extra="forbid", populate_by_name=True)
 
-    preset: Literal["since_anchor", "1m", "3m", "1y", "all"]
+    preset: Literal["since_anchor", "1m", "3m", "ytd", "1y", "all"]
     from_: str = Field(alias="from")
     to: str
 
 
 ModelledValueQuality = Literal[
@@ -41,11 +41,11 @@ class ModelledValueSummary(BaseModel):
 
 
 class ModelledPointComponent(BaseModel):
     model_config = ConfigDict(extra="forbid")
 
-    key: Literal["postfinance", "truewealth", "crypto", "bank_cash"]
+    key: Literal["postfinance", "truewealth", "crypto", "bank_cash", "other_assets"]
     label: str
     value_chf: str | None
     quality: ModelledValueQuality
     source_date: str | None
 
@@ -63,11 +63,11 @@ class ModelledDailyPoint(BaseModel):
 
 
 class ModelledComponentSummary(BaseModel):
     model_config = ConfigDict(extra="forbid")
 
-    key: Literal["postfinance", "truewealth", "crypto", "bank_cash"]
+    key: Literal["postfinance", "truewealth", "crypto", "bank_cash", "other_assets"]
     label: str
     current_value_chf: str | None
     change_chf: str | None
     change_pct: str | None
     quality: ModelledValueQuality
@@ -77,11 +77,11 @@ class ModelledComponentSummary(BaseModel):
 
 class ModelledCorrectionMarker(BaseModel):
     model_config = ConfigDict(extra="forbid")
 
     date: str
-    source_key: Literal["postfinance", "truewealth"]
+    source_key: Literal["postfinance", "truewealth", "bank_cash"]
     confirmed_value_chf: str
     predecessor_model_value_chf: str
     difference_chf: str
 
 
@@ -96,10 +96,11 @@ class ModelledUnknownAccount(BaseModel):
 class ModelledWealthDevelopment(BaseModel):
     model_config = ConfigDict(extra="forbid")
 
     status: Literal["available", "unavailable"]
     period: ModelledWealthPeriod
+    last_confirmed_anchor_date: str | None
     anchor: ModelledValueSummary | None
     baseline: ModelledValueSummary | None
     current: ModelledValueSummary | None
     change_chf: str | None
     change_pct: str | None
@@ -121,10 +122,60 @@ class VerifiedPerformanceSummary(BaseModel):
     xirr_status: ReadinessStatus
     ttwror_pct: str | None
     xirr_pct: str | None
 
 
+class PortfolioAnalysisAllocation(BaseModel):
+    model_config = ConfigDict(extra="forbid")
+    key: str
+    label: str
+    current_value_chf: str | None
+    current_pct: str | None
+    target_pct: str | None
+    lower_pct: str | None
+    upper_pct: str | None
+    deviation_pp: str | None
+    deviation_chf: str | None
+    status: Literal["below_corridor", "within_corridor", "above_corridor", "unavailable"]
+
+
+class PortfolioAnalysisDimensionRow(BaseModel):
+    model_config = ConfigDict(extra="forbid")
+    label: str
+    pct: str | None
+
+
+class PortfolioAnalysisDimension(BaseModel):
+    model_config = ConfigDict(extra="forbid")
+    status: Literal["complete", "partial", "unavailable"]
+    rows: list[PortfolioAnalysisDimensionRow]
+
+
+class PortfolioAnalysisContribution(BaseModel):
+    model_config = ConfigDict(extra="forbid")
+    key: str
+    label: str
+    value_chf: str | None
+    status: str | None = None
+
+
+class PortfolioAnalysisHint(BaseModel):
+    model_config = ConfigDict(extra="forbid")
+    priority: int
+    text: str
+
+
+class PortfolioAnalysisV1(BaseModel):
+    model_config = ConfigDict(extra="forbid")
+    status: Literal["complete", "partial", "unavailable"]
+    allocation: list[PortfolioAnalysisAllocation]
+    concentrations: dict[str, str | None]
+    dimensions: dict[str, PortfolioAnalysisDimension]
+    contributions: list[PortfolioAnalysisContribution]
+    hints: list[PortfolioAnalysisHint]
+
+
 class WealthDimensionStatus(BaseModel):
     model_config = ConfigDict(extra="forbid")
 
     status: ReadinessStatus
     reason_code: str | None
@@ -217,10 +268,11 @@ class WealthCockpitResponse(BaseModel):
     scope_label: str
     not_net_worth: bool
     period: WealthPeriod
     data_cutoff: str
     modelled_development: ModelledWealthDevelopment
+    portfolio_analysis: PortfolioAnalysisV1
     verified_performance: VerifiedPerformanceSummary
     kpis: list[dict[str, Any]]
     totals: dict[str, Any]
     history: dict[str, Any]
     distribution: list[dict[str, Any]]
diff --git a/src/jarvis_finance/services/wealth_cockpit.py b/src/jarvis_finance/services/wealth_cockpit.py
index a30390d..824fdf1 100644
--- a/src/jarvis_finance/services/wealth_cockpit.py
+++ b/src/jarvis_finance/services/wealth_cockpit.py
@@ -18,10 +18,11 @@ from jarvis_finance.services.budget_planning import get_annual_budget_assistant
 from jarvis_finance.services.cash_service import get_cash_summary
 from jarvis_finance.services.crypto_service import list_crypto_positions
 from jarvis_finance.services.equity_service import get_equity_summary
 from jarvis_finance.services.household_import import source_reference_hash
 from jarvis_finance.services.modelled_wealth import build_modelled_wealth_development
+from jarvis_finance.services.portfolio_analysis_v1 import build_portfolio_analysis_v1
 from jarvis_finance.services.portfolio_performance import (
     build_performance_coverage,
     build_portfolio_performance,
     load_scope_activities,
 )
@@ -1223,10 +1224,13 @@ def build_wealth_cockpit(
         else "all"
     )
     modelled_development = build_modelled_wealth_development(
         conn, period=model_period, as_of=reference.isoformat()
     )
+    portfolio_analysis = build_portfolio_analysis_v1(
+        conn, as_of=reference.isoformat(), modelled=modelled_development
+    )
     current = _current_values(conn, as_of=reference)
     valuation_end = _latest_valuation_date(conn, requested_end)
     performance: dict[str, Any] | None = None
     if start < valuation_end:
         performance = build_portfolio_performance(
@@ -1414,10 +1418,11 @@ def build_wealth_cockpit(
         "scope_label": "Erfasstes Vermögen",
         "not_net_worth": True,
         "period": period_payload,
         "data_cutoff": cutoff,
         "modelled_development": modelled_development,
+        "portfolio_analysis": portfolio_analysis,
         "verified_performance": verified_performance,
         "kpis": [
             {"key": "captured_wealth", "label": "Erfasstes Vermögen heute", "value_chf": _money(current["total"]), "status": "complete" if current["complete"] else "approximate"},
             {"key": "wealth_change", "label": "Veränderung im Zeitraum", "value_chf": household_change, "status": household_change_status},
             {"key": "investment_result", "label": "Anlageergebnis ohne Einzahlungen", "value_chf": investment_result, "status": "available" if investment_result is not None else "not_calculable"},

__HERMES_CWD_8d46a20096ed__/home/agent/.hermes/worktrees/FinanceManager-sprint23__HERMES_CWD_8d46a20096ed__