@eric-emg/symphiq-components 1.3.59 → 1.3.60

package/fesm2022/symphiq-components.mjs

@@ -101659,6 +101659,133 @@ class ExecutiveSummaryStatsGridComponent {
     }], null, { viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], keyStrengthsClick: [{ type: i0.Output, args: ["keyStrengthsClick"] }], criticalGapsClick: [{ type: i0.Output, args: ["criticalGapsClick"] }], quickWinsClick: [{ type: i0.Output, args: ["quickWinsClick"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ExecutiveSummaryStatsGridComponent, { className: "ExecutiveSummaryStatsGridComponent", filePath: "lib/components/shared/executive-summary-stats-grid.component.ts", lineNumber: 85 }); })();
 
+class SourceGoalsSummaryCardComponent {
+    constructor() {
+        this.viewMode = input(ViewModeEnum.LIGHT, ...(ngDevMode ? [{ debugName: "viewMode" }] : []));
+        this.shopCounts = input({ analyses: 0, goals: 0 }, ...(ngDevMode ? [{ debugName: "shopCounts" }] : []));
+        this.focusAreaCounts = input({ analyses: 0, goals: 0 }, ...(ngDevMode ? [{ debugName: "focusAreaCounts" }] : []));
+        this.metricCounts = input({ analyses: 0, goals: 0 }, ...(ngDevMode ? [{ debugName: "metricCounts" }] : []));
+        this.isLightMode = computed(() => this.viewMode() === ViewModeEnum.LIGHT, ...(ngDevMode ? [{ debugName: "isLightMode" }] : []));
+        this.totalSourceGoalsCount = computed(() => {
+            return this.shopCounts().goals + this.focusAreaCounts().goals + this.metricCounts().goals;
+        }, ...(ngDevMode ? [{ debugName: "totalSourceGoalsCount" }] : []));
+        this.totalGoalsCardClasses = computed(() => {
+            return this.isLightMode()
+                ? 'bg-gradient-to-r from-indigo-50/80 via-purple-50/40 to-transparent border border-indigo-200 text-indigo-900'
+                : 'bg-gradient-to-r from-indigo-900/30 via-purple-900/15 to-transparent border border-indigo-700/50 text-indigo-100';
+        }, ...(ngDevMode ? [{ debugName: "totalGoalsCardClasses" }] : []));
+    }
+    getSourceCountCardClasses(type) {
+        if (this.isLightMode()) {
+            switch (type) {
+                case 'SHOP': return 'bg-cyan-50 text-cyan-700 border border-cyan-200';
+                case 'FOCUS_AREA': return 'bg-amber-50 text-amber-700 border border-amber-200';
+                case 'METRIC': return 'bg-emerald-50 text-emerald-700 border border-emerald-200';
+            }
+        }
+        else {
+            switch (type) {
+                case 'SHOP': return 'bg-cyan-900/30 text-cyan-300 border border-cyan-700';
+                case 'FOCUS_AREA': return 'bg-amber-900/30 text-amber-300 border border-amber-700';
+                case 'METRIC': return 'bg-emerald-900/30 text-emerald-300 border border-emerald-700';
+            }
+        }
+    }
+    static { this.ɵfac = function SourceGoalsSummaryCardComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SourceGoalsSummaryCardComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SourceGoalsSummaryCardComponent, selectors: [["symphiq-source-goals-summary-card"]], inputs: { viewMode: [1, "viewMode"], shopCounts: [1, "shopCounts"], focusAreaCounts: [1, "focusAreaCounts"], metricCounts: [1, "metricCounts"] }, decls: 28, vars: 17, consts: [[1, "p-6", "rounded-xl", "mb-4", "flex", "items-center", "justify-between", 3, "ngClass"], [1, "text-xs", "font-semibold", "uppercase", "mb-1", "opacity-80"], [1, "text-4xl", "font-bold"], [1, "grid", "grid-cols-1", "md:grid-cols-3", "gap-4"], [1, "p-4", "rounded-xl", 3, "ngClass"], [1, "text-xs", "font-semibold", "uppercase", "mb-2"], [1, "text-sm", "opacity-80"]], template: function SourceGoalsSummaryCardComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "div")(2, "div", 1);
+            i0.ɵɵtext(3, "Total Source Goals");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(4, "div", 2);
+            i0.ɵɵtext(5);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(6, "div", 3)(7, "div", 4)(8, "div", 5);
+            i0.ɵɵtext(9, "Shop");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(10, "div", 6);
+            i0.ɵɵtext(11);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(12, "div", 6);
+            i0.ɵɵtext(13);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(14, "div", 4)(15, "div", 5);
+            i0.ɵɵtext(16, "Focus Area");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(17, "div", 6);
+            i0.ɵɵtext(18);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(19, "div", 6);
+            i0.ɵɵtext(20);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(21, "div", 4)(22, "div", 5);
+            i0.ɵɵtext(23, "Metric");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(24, "div", 6);
+            i0.ɵɵtext(25);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(26, "div", 6);
+            i0.ɵɵtext(27);
+            i0.ɵɵelementEnd()()()();
+        } if (rf & 2) {
+            i0.ɵɵproperty("ngClass", ctx.totalGoalsCardClasses());
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate(ctx.totalSourceGoalsCount());
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("ngClass", ctx.getSourceCountCardClasses("SHOP"));
+            i0.ɵɵadvance(4);
+            i0.ɵɵtextInterpolate2("", ctx.shopCounts().analyses, " ", ctx.shopCounts().analyses === 1 ? "analysis" : "analyses");
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate2("", ctx.shopCounts().goals, " ", ctx.shopCounts().goals === 1 ? "goal" : "goals");
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngClass", ctx.getSourceCountCardClasses("FOCUS_AREA"));
+            i0.ɵɵadvance(4);
+            i0.ɵɵtextInterpolate2("", ctx.focusAreaCounts().analyses, " ", ctx.focusAreaCounts().analyses === 1 ? "analysis" : "analyses");
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate2("", ctx.focusAreaCounts().goals, " ", ctx.focusAreaCounts().goals === 1 ? "goal" : "goals");
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngClass", ctx.getSourceCountCardClasses("METRIC"));
+            i0.ɵɵadvance(4);
+            i0.ɵɵtextInterpolate2("", ctx.metricCounts().analyses, " ", ctx.metricCounts().analyses === 1 ? "analysis" : "analyses");
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate2("", ctx.metricCounts().goals, " ", ctx.metricCounts().goals === 1 ? "goal" : "goals");
+        } }, dependencies: [CommonModule, i1$1.NgClass], encapsulation: 2, changeDetection: 0 }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SourceGoalsSummaryCardComponent, [{
+        type: Component,
+        args: [{
+                selector: 'symphiq-source-goals-summary-card',
+                standalone: true,
+                imports: [CommonModule],
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                template: `
+    <div [ngClass]="totalGoalsCardClasses()" class="p-6 rounded-xl mb-4 flex items-center justify-between">
+      <div>
+        <div class="text-xs font-semibold uppercase mb-1 opacity-80">Total Source Goals</div>
+        <div class="text-4xl font-bold">{{ totalSourceGoalsCount() }}</div>
+      </div>
+      <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+        <div [ngClass]="getSourceCountCardClasses('SHOP')" class="p-4 rounded-xl">
+          <div class="text-xs font-semibold uppercase mb-2">Shop</div>
+          <div class="text-sm opacity-80">{{ shopCounts().analyses }} {{ shopCounts().analyses === 1 ? 'analysis' : 'analyses' }}</div>
+          <div class="text-sm opacity-80">{{ shopCounts().goals }} {{ shopCounts().goals === 1 ? 'goal' : 'goals' }}</div>
+        </div>
+        <div [ngClass]="getSourceCountCardClasses('FOCUS_AREA')" class="p-4 rounded-xl">
+          <div class="text-xs font-semibold uppercase mb-2">Focus Area</div>
+          <div class="text-sm opacity-80">{{ focusAreaCounts().analyses }} {{ focusAreaCounts().analyses === 1 ? 'analysis' : 'analyses' }}</div>
+          <div class="text-sm opacity-80">{{ focusAreaCounts().goals }} {{ focusAreaCounts().goals === 1 ? 'goal' : 'goals' }}</div>
+        </div>
+        <div [ngClass]="getSourceCountCardClasses('METRIC')" class="p-4 rounded-xl">
+          <div class="text-xs font-semibold uppercase mb-2">Metric</div>
+          <div class="text-sm opacity-80">{{ metricCounts().analyses }} {{ metricCounts().analyses === 1 ? 'analysis' : 'analyses' }}</div>
+          <div class="text-sm opacity-80">{{ metricCounts().goals }} {{ metricCounts().goals === 1 ? 'goal' : 'goals' }}</div>
+        </div>
+      </div>
+    </div>
+  `
+            }]
+    }], null, { viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], shopCounts: [{ type: i0.Input, args: [{ isSignal: true, alias: "shopCounts", required: false }] }], focusAreaCounts: [{ type: i0.Input, args: [{ isSignal: true, alias: "focusAreaCounts", required: false }] }], metricCounts: [{ type: i0.Input, args: [{ isSignal: true, alias: "metricCounts", required: false }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SourceGoalsSummaryCardComponent, { className: "SourceGoalsSummaryCardComponent", filePath: "lib/components/shared/source-goals-summary-card.component.ts", lineNumber: 41 }); })();
+
 function UnifiedExecutiveSummaryComponent_Conditional_0_Conditional_9_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "symphiq-grade-badge", 7);
 } if (rf & 2) {
@@ -101676,42 +101803,9 @@ function UnifiedExecutiveSummaryComponent_Conditional_0_Template(rf, ctx) { if (
     i0.ɵɵelementEnd()();
     i0.ɵɵconditionalCreate(9, UnifiedExecutiveSummaryComponent_Conditional_0_Conditional_9_Template, 1, 3, "symphiq-grade-badge", 7);
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(10, "symphiq-analysis-narrative", 8);
-    i0.ɵɵelementStart(11, "div", 9)(12, "div")(13, "div", 10);
-    i0.ɵɵtext(14, "Total Source Goals");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(15, "div", 11);
-    i0.ɵɵtext(16);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(17, "div", 12)(18, "div", 13)(19, "div", 14);
-    i0.ɵɵtext(20, "Shop");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(21, "div", 15);
-    i0.ɵɵtext(22);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(23, "div", 15);
-    i0.ɵɵtext(24);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(25, "div", 13)(26, "div", 14);
-    i0.ɵɵtext(27, "Focus Area");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(28, "div", 15);
-    i0.ɵɵtext(29);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(30, "div", 15);
-    i0.ɵɵtext(31);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(32, "div", 13)(33, "div", 14);
-    i0.ɵɵtext(34, "Metric");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(35, "div", 15);
-    i0.ɵɵtext(36);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(37, "div", 15);
-    i0.ɵɵtext(38);
-    i0.ɵɵelementEnd()()()();
-    i0.ɵɵelementStart(39, "symphiq-executive-summary-stats-grid", 16);
-    i0.ɵɵlistener("keyStrengthsClick", function UnifiedExecutiveSummaryComponent_Conditional_0_Template_symphiq_executive_summary_stats_grid_keyStrengthsClick_39_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.keyStrengthsClick.emit()); })("criticalGapsClick", function UnifiedExecutiveSummaryComponent_Conditional_0_Template_symphiq_executive_summary_stats_grid_criticalGapsClick_39_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.criticalGapsClick.emit()); })("quickWinsClick", function UnifiedExecutiveSummaryComponent_Conditional_0_Template_symphiq_executive_summary_stats_grid_quickWinsClick_39_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.quickWinsClick.emit()); });
+    i0.ɵɵelement(10, "symphiq-analysis-narrative", 8)(11, "symphiq-source-goals-summary-card", 9);
+    i0.ɵɵelementStart(12, "symphiq-executive-summary-stats-grid", 10);
+    i0.ɵɵlistener("keyStrengthsClick", function UnifiedExecutiveSummaryComponent_Conditional_0_Template_symphiq_executive_summary_stats_grid_keyStrengthsClick_12_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.keyStrengthsClick.emit()); })("criticalGapsClick", function UnifiedExecutiveSummaryComponent_Conditional_0_Template_symphiq_executive_summary_stats_grid_criticalGapsClick_12_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.criticalGapsClick.emit()); })("quickWinsClick", function UnifiedExecutiveSummaryComponent_Conditional_0_Template_symphiq_executive_summary_stats_grid_quickWinsClick_12_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.quickWinsClick.emit()); });
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
     const summary_r2 = ctx;
@@ -101729,27 +101823,7 @@ function UnifiedExecutiveSummaryComponent_Conditional_0_Template(rf, ctx) { if (
     i0.ɵɵadvance();
     i0.ɵɵproperty("viewMode", ctx_r2.viewMode())("narrative", summary_r2.synthesisNarrative)("napkinVisual", summary_r2.napkinVisual);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngClass", ctx_r2.totalGoalsCardClasses());
-    i0.ɵɵadvance(5);
-    i0.ɵɵtextInterpolate(ctx_r2.totalSourceGoalsCount());
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngClass", ctx_r2.getSourceCountCardClasses("SHOP"));
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate2("", ctx_r2.shopCounts().analyses, " ", ctx_r2.shopCounts().analyses === 1 ? "analysis" : "analyses");
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate2("", ctx_r2.shopCounts().goals, " ", ctx_r2.shopCounts().goals === 1 ? "goal" : "goals");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngClass", ctx_r2.getSourceCountCardClasses("FOCUS_AREA"));
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate2("", ctx_r2.focusAreaCounts().analyses, " ", ctx_r2.focusAreaCounts().analyses === 1 ? "analysis" : "analyses");
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate2("", ctx_r2.focusAreaCounts().goals, " ", ctx_r2.focusAreaCounts().goals === 1 ? "goal" : "goals");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngClass", ctx_r2.getSourceCountCardClasses("METRIC"));
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate2("", ctx_r2.metricCounts().analyses, " ", ctx_r2.metricCounts().analyses === 1 ? "analysis" : "analyses");
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate2("", ctx_r2.metricCounts().goals, " ", ctx_r2.metricCounts().goals === 1 ? "goal" : "goals");
+    i0.ɵɵproperty("viewMode", ctx_r2.viewMode())("shopCounts", ctx_r2.shopCounts())("focusAreaCounts", ctx_r2.focusAreaCounts())("metricCounts", ctx_r2.metricCounts());
     i0.ɵɵadvance();
     i0.ɵɵproperty("viewMode", ctx_r2.viewMode())("config", ctx_r2.statsConfig());
 } }
@@ -101772,45 +101846,22 @@ class UnifiedExecutiveSummaryComponent {
                 quickWinsCount: this.quickWinsCount()
             };
         }, ...(ngDevMode ? [{ debugName: "statsConfig" }] : []));
-        this.totalSourceGoalsCount = computed(() => {
-            return this.shopCounts().goals + this.focusAreaCounts().goals + this.metricCounts().goals;
-        }, ...(ngDevMode ? [{ debugName: "totalSourceGoalsCount" }] : []));
         this.bannerClasses = computed(() => this.isLightMode()
             ? 'bg-white border border-slate-200'
             : 'bg-slate-800/50 border border-slate-700/50', ...(ngDevMode ? [{ debugName: "bannerClasses" }] : []));
         this.sectionTitleClasses = computed(() => this.isLightMode() ? 'text-slate-900' : 'text-white', ...(ngDevMode ? [{ debugName: "sectionTitleClasses" }] : []));
         this.textClasses = computed(() => this.isLightMode() ? 'text-slate-700' : 'text-slate-300', ...(ngDevMode ? [{ debugName: "textClasses" }] : []));
-        this.totalGoalsCardClasses = computed(() => {
-            return this.isLightMode()
-                ? 'bg-gradient-to-r from-indigo-50/80 via-purple-50/40 to-transparent border border-indigo-200 text-indigo-900'
-                : 'bg-gradient-to-r from-indigo-900/30 via-purple-900/15 to-transparent border border-indigo-700/50 text-indigo-100';
-        }, ...(ngDevMode ? [{ debugName: "totalGoalsCardClasses" }] : []));
-    }
-    getSourceCountCardClasses(type) {
-        if (this.isLightMode()) {
-            switch (type) {
-                case 'SHOP': return 'bg-cyan-50 text-cyan-700 border border-cyan-200';
-                case 'FOCUS_AREA': return 'bg-amber-50 text-amber-700 border border-amber-200';
-                case 'METRIC': return 'bg-emerald-50 text-emerald-700 border border-emerald-200';
-            }
-        }
-        else {
-            switch (type) {
-                case 'SHOP': return 'bg-cyan-900/30 text-cyan-300 border border-cyan-700';
-                case 'FOCUS_AREA': return 'bg-amber-900/30 text-amber-300 border border-amber-700';
-                case 'METRIC': return 'bg-emerald-900/30 text-emerald-300 border border-emerald-700';
-            }
-        }
     }
     static { this.ɵfac = function UnifiedExecutiveSummaryComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || UnifiedExecutiveSummaryComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: UnifiedExecutiveSummaryComponent, selectors: [["symphiq-unified-executive-summary"]], inputs: { summary: [1, "summary"], viewMode: [1, "viewMode"], shopCounts: [1, "shopCounts"], focusAreaCounts: [1, "focusAreaCounts"], metricCounts: [1, "metricCounts"], quickWinsCount: [1, "quickWinsCount"] }, outputs: { keyStrengthsClick: "keyStrengthsClick", criticalGapsClick: "criticalGapsClick", quickWinsClick: "quickWinsClick" }, decls: 1, vars: 1, consts: [["id", "section-executive-summary", 1, "space-y-6", "scroll-mt-24"], [1, "rounded-2xl", "p-8", "shadow-xl", 3, "ngClass"], [1, "flex", "flex-col", "gap-6"], [1, "flex", "items-start", "justify-between", "gap-4"], [1, "flex-1"], [1, "text-2xl", "font-bold", "mb-3", 3, "ngClass"], [1, "text-lg", "leading-relaxed", 3, "ngClass"], [3, "grade", "gradeRationale", "viewMode"], ["title", "Synthesis Overview", 3, "viewMode", "narrative", "napkinVisual"], [1, "p-6", "rounded-xl", "mb-4", "flex", "items-center", "justify-between", 3, "ngClass"], [1, "text-xs", "font-semibold", "uppercase", "mb-1", "opacity-80"], [1, "text-4xl", "font-bold"], [1, "grid", "grid-cols-1", "md:grid-cols-3", "gap-4"], [1, "p-4", "rounded-xl", 3, "ngClass"], [1, "text-xs", "font-semibold", "uppercase", "mb-2"], [1, "text-sm", "opacity-80"], [3, "keyStrengthsClick", "criticalGapsClick", "quickWinsClick", "viewMode", "config"]], template: function UnifiedExecutiveSummaryComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵconditionalCreate(0, UnifiedExecutiveSummaryComponent_Conditional_0_Template, 40, 27, "section", 0);
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: UnifiedExecutiveSummaryComponent, selectors: [["symphiq-unified-executive-summary"]], inputs: { summary: [1, "summary"], viewMode: [1, "viewMode"], shopCounts: [1, "shopCounts"], focusAreaCounts: [1, "focusAreaCounts"], metricCounts: [1, "metricCounts"], quickWinsCount: [1, "quickWinsCount"] }, outputs: { keyStrengthsClick: "keyStrengthsClick", criticalGapsClick: "criticalGapsClick", quickWinsClick: "quickWinsClick" }, decls: 1, vars: 1, consts: [["id", "section-executive-summary", 1, "space-y-6", "scroll-mt-24"], [1, "rounded-2xl", "p-8", "shadow-xl", 3, "ngClass"], [1, "flex", "flex-col", "gap-6"], [1, "flex", "items-start", "justify-between", "gap-4"], [1, "flex-1"], [1, "text-2xl", "font-bold", "mb-3", 3, "ngClass"], [1, "text-lg", "leading-relaxed", 3, "ngClass"], [3, "grade", "gradeRationale", "viewMode"], ["title", "Synthesis Overview", 3, "viewMode", "narrative", "napkinVisual"], [3, "viewMode", "shopCounts", "focusAreaCounts", "metricCounts"], [3, "keyStrengthsClick", "criticalGapsClick", "quickWinsClick", "viewMode", "config"]], template: function UnifiedExecutiveSummaryComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵconditionalCreate(0, UnifiedExecutiveSummaryComponent_Conditional_0_Template, 13, 14, "section", 0);
         } if (rf & 2) {
             let tmp_0_0;
             i0.ɵɵconditional((tmp_0_0 = ctx.summary()) ? 0 : -1, tmp_0_0);
         } }, dependencies: [CommonModule, i1$1.NgClass, GradeBadgeComponent,
             AnalysisNarrativeComponent,
-            ExecutiveSummaryStatsGridComponent], encapsulation: 2, changeDetection: 0 }); }
+            ExecutiveSummaryStatsGridComponent,
+            SourceGoalsSummaryCardComponent], encapsulation: 2, changeDetection: 0 }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(UnifiedExecutiveSummaryComponent, [{
         type: Component,
@@ -101821,7 +101872,8 @@ class UnifiedExecutiveSummaryComponent {
                     CommonModule,
                     GradeBadgeComponent,
                     AnalysisNarrativeComponent,
-                    ExecutiveSummaryStatsGridComponent
+                    ExecutiveSummaryStatsGridComponent,
+                    SourceGoalsSummaryCardComponent
                 ],
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 template: `
@@ -101854,29 +101906,12 @@ class UnifiedExecutiveSummaryComponent {
               title="Synthesis Overview"
             />
 
-            <div [ngClass]="totalGoalsCardClasses()" class="p-6 rounded-xl mb-4 flex items-center justify-between">
-              <div>
-                <div class="text-xs font-semibold uppercase mb-1 opacity-80">Total Source Goals</div>
-                <div class="text-4xl font-bold">{{ totalSourceGoalsCount() }}</div>
-              </div>
-              <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
-                <div [ngClass]="getSourceCountCardClasses('SHOP')" class="p-4 rounded-xl">
-                  <div class="text-xs font-semibold uppercase mb-2">Shop</div>
-                  <div class="text-sm opacity-80">{{ shopCounts().analyses }} {{ shopCounts().analyses === 1 ? 'analysis' : 'analyses' }}</div>
-                  <div class="text-sm opacity-80">{{ shopCounts().goals }} {{ shopCounts().goals === 1 ? 'goal' : 'goals' }}</div>
-                </div>
-                <div [ngClass]="getSourceCountCardClasses('FOCUS_AREA')" class="p-4 rounded-xl">
-                  <div class="text-xs font-semibold uppercase mb-2">Focus Area</div>
-                  <div class="text-sm opacity-80">{{ focusAreaCounts().analyses }} {{ focusAreaCounts().analyses === 1 ? 'analysis' : 'analyses' }}</div>
-                  <div class="text-sm opacity-80">{{ focusAreaCounts().goals }} {{ focusAreaCounts().goals === 1 ? 'goal' : 'goals' }}</div>
-                </div>
-                <div [ngClass]="getSourceCountCardClasses('METRIC')" class="p-4 rounded-xl">
-                  <div class="text-xs font-semibold uppercase mb-2">Metric</div>
-                  <div class="text-sm opacity-80">{{ metricCounts().analyses }} {{ metricCounts().analyses === 1 ? 'analysis' : 'analyses' }}</div>
-                  <div class="text-sm opacity-80">{{ metricCounts().goals }} {{ metricCounts().goals === 1 ? 'goal' : 'goals' }}</div>
-                </div>
-              </div>
-            </div>
+            <symphiq-source-goals-summary-card
+              [viewMode]="viewMode()"
+              [shopCounts]="shopCounts()"
+              [focusAreaCounts]="focusAreaCounts()"
+              [metricCounts]="metricCounts()"
+            />
 
 
             <symphiq-executive-summary-stats-grid
@@ -101893,7 +101928,7 @@ class UnifiedExecutiveSummaryComponent {
   `
             }]
     }], null, { summary: [{ type: i0.Input, args: [{ isSignal: true, alias: "summary", required: false }] }], viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], shopCounts: [{ type: i0.Input, args: [{ isSignal: true, alias: "shopCounts", required: false }] }], focusAreaCounts: [{ type: i0.Input, args: [{ isSignal: true, alias: "focusAreaCounts", required: false }] }], metricCounts: [{ type: i0.Input, args: [{ isSignal: true, alias: "metricCounts", required: false }] }], quickWinsCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "quickWinsCount", required: false }] }], keyStrengthsClick: [{ type: i0.Output, args: ["keyStrengthsClick"] }], criticalGapsClick: [{ type: i0.Output, args: ["criticalGapsClick"] }], quickWinsClick: [{ type: i0.Output, args: ["quickWinsClick"] }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(UnifiedExecutiveSummaryComponent, { className: "UnifiedExecutiveSummaryComponent", filePath: "lib/components/profile-analysis-unified-dashboard/cards/unified-executive-summary.component.ts", lineNumber: 92 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(UnifiedExecutiveSummaryComponent, { className: "UnifiedExecutiveSummaryComponent", filePath: "lib/components/profile-analysis-unified-dashboard/cards/unified-executive-summary.component.ts", lineNumber: 74 }); })();
 
 const _c0$b = a0 => ({ name: "calendar", source: a0 });
 const _forTrack0$b = ($index, $item) => $item.id;
@@ -103327,7 +103362,7 @@ class SourceAnalysisTraceabilityComponent {
         }
     }
     static { this.ɵfac = function SourceAnalysisTraceabilityComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SourceAnalysisTraceabilityComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SourceAnalysisTraceabilityComponent, selectors: [["symphiq-source-analysis-traceability"]], inputs: { sourceAnalyses: [1, "sourceAnalyses"], loadedSourceAnalysisIds: [1, "loadedSourceAnalysisIds"], loadingSourceAnalysisId: [1, "loadingSourceAnalysisId"], viewMode: [1, "viewMode"], goal: [1, "goal"] }, outputs: { sourceAnalysisClick: "sourceAnalysisClick" }, decls: 1, vars: 1, consts: [[1, "p-5", "rounded-xl", "flex", "flex-col", "gap-4", 3, "ngClass"], [1, "text-sm", "font-semibold", "flex", "items-center", "gap-2", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"], [3, "score", "explanation", "viewMode"], [1, "grid", "grid-cols-1", "sm:grid-cols-2", "gap-3"], ["type", "button", 1, "p-4", "rounded-lg", "text-left", "transition-all", "hover:scale-[1.02]", "relative", 3, "ngClass"], ["type", "button", 1, "p-4", "rounded-lg", "text-left", "transition-all", "hover:scale-[1.02]", "relative", 3, "click", "ngClass"], [1, "absolute", "inset-0", "bg-black/10", "rounded-lg", "flex", "items-center", "justify-center"], [1, "absolute", "top-2", "right-2"], [1, "flex", "items-start", "gap-3"], [1, "w-8", "h-8", "rounded-lg", "flex", "items-center", "justify-center", "flex-shrink-0", 3, "ngClass"], [1, "flex-1", "min-w-0"], [1, "text-xs", "font-medium", "uppercase", "mb-0.5", 3, "ngClass"], [1, "text-sm", "font-medium", "truncate", 3, "ngClass"], [1, "text-xs", "mt-1", 3, "ngClass"], [1, "w-5", "h-5", "border-2", "border-current", "border-t-transparent", "rounded-full", "animate-spin"], ["fill", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4", "text-green-500"], ["d", "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"]], template: function SourceAnalysisTraceabilityComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SourceAnalysisTraceabilityComponent, selectors: [["symphiq-source-analysis-traceability"]], inputs: { sourceAnalyses: [1, "sourceAnalyses"], loadedSourceAnalysisIds: [1, "loadedSourceAnalysisIds"], loadingSourceAnalysisId: [1, "loadingSourceAnalysisId"], viewMode: [1, "viewMode"], goal: [1, "goal"] }, outputs: { sourceAnalysisClick: "sourceAnalysisClick" }, decls: 1, vars: 1, consts: [[1, "p-5", "rounded-xl", "flex", "flex-col", "gap-4", 3, "ngClass"], [1, "text-sm", "font-semibold", "flex", "items-center", "gap-2", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"], [3, "score", "explanation", "viewMode"], [1, "grid", "grid-cols-1", "gap-3"], ["type", "button", 1, "p-4", "rounded-lg", "text-left", "transition-all", "hover:scale-[1.02]", "relative", 3, "ngClass"], ["type", "button", 1, "p-4", "rounded-lg", "text-left", "transition-all", "hover:scale-[1.02]", "relative", 3, "click", "ngClass"], [1, "absolute", "inset-0", "bg-black/10", "rounded-lg", "flex", "items-center", "justify-center"], [1, "absolute", "top-2", "right-2"], [1, "flex", "items-start", "gap-3"], [1, "w-8", "h-8", "rounded-lg", "flex", "items-center", "justify-center", "flex-shrink-0", 3, "ngClass"], [1, "flex-1", "min-w-0"], [1, "text-xs", "font-medium", "uppercase", "mb-0.5", 3, "ngClass"], [1, "text-sm", "font-medium", "truncate", 3, "ngClass"], [1, "text-xs", "mt-1", 3, "ngClass"], [1, "w-5", "h-5", "border-2", "border-current", "border-t-transparent", "rounded-full", "animate-spin"], ["fill", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4", "text-green-500"], ["d", "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"]], template: function SourceAnalysisTraceabilityComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵconditionalCreate(0, SourceAnalysisTraceabilityComponent_Conditional_0_Template, 9, 6, "div", 0);
         } if (rf & 2) {
             let tmp_0_0;
@@ -103356,7 +103391,7 @@ class SourceAnalysisTraceabilityComponent {
             [explanation]="goal().synthesisConfidenceScoreExplanation"
             [viewMode]="viewMode()"
         />
-        <div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
+        <div class="grid grid-cols-1 gap-3">
           @for (source of sourceAnalyses(); track source.analysisId) {
             <button
               type="button"
@@ -103439,29 +103474,29 @@ function UnifiedGoalDetailModalContentComponent_Conditional_4_Template(rf, ctx)
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", ctx_r0.goal().description, " ");
 } }
-function UnifiedGoalDetailModalContentComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    const _r2 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "symphiq-related-content-button", 12);
-    i0.ɵɵlistener("buttonClicked", function UnifiedGoalDetailModalContentComponent_Conditional_7_Template_symphiq_related_content_button_buttonClicked_0_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onContributingMetricsClick()); });
+function UnifiedGoalDetailModalContentComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div");
+    i0.ɵɵelement(1, "symphiq-napkin-visual-placeholder", 12);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("count", ctx_r0.contributingMetricsCount())("svgPath", ctx_r0.metricsIconPath)("viewMode", ctx_r0.viewMode());
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("visual", ctx_r0.goal().visual)("viewMode", ctx_r0.viewMode());
 } }
 function UnifiedGoalDetailModalContentComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "symphiq-related-content-button", 8);
+    const _r2 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "symphiq-related-content-button", 13);
+    i0.ɵɵlistener("buttonClicked", function UnifiedGoalDetailModalContentComponent_Conditional_8_Template_symphiq_related_content_button_buttonClicked_0_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onContributingMetricsClick()); });
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("count", ctx_r0.contributingFocusAreasCount())("svgPath", ctx_r0.focusAreaIconPath)("viewMode", ctx_r0.viewMode())("showChevron", false)("tooltipContent", ctx_r0.focusAreasTooltipContent());
+    i0.ɵɵproperty("count", ctx_r0.contributingMetricsCount())("svgPath", ctx_r0.metricsIconPath)("viewMode", ctx_r0.viewMode());
 } }
-function UnifiedGoalDetailModalContentComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div");
-    i0.ɵɵelement(1, "symphiq-napkin-visual-placeholder", 13);
-    i0.ɵɵelementEnd();
+function UnifiedGoalDetailModalContentComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "symphiq-related-content-button", 8);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("visual", ctx_r0.goal().visual)("viewMode", ctx_r0.viewMode());
+    i0.ɵɵproperty("count", ctx_r0.contributingFocusAreasCount())("svgPath", ctx_r0.focusAreaIconPath)("viewMode", ctx_r0.viewMode())("showChevron", false)("tooltipContent", ctx_r0.focusAreasTooltipContent());
 } }
 function UnifiedGoalDetailModalContentComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
@@ -103528,19 +103563,19 @@ class UnifiedGoalDetailModalContentComponent {
         this.contributingMetricsClick.emit();
     }
     static { this.ɵfac = function UnifiedGoalDetailModalContentComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || UnifiedGoalDetailModalContentComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: UnifiedGoalDetailModalContentComponent, selectors: [["symphiq-unified-goal-detail-modal-content"]], inputs: { goal: [1, "goal"], allMetrics: [1, "allMetrics"], allCharts: [1, "allCharts"], loadedSourceAnalysisIds: [1, "loadedSourceAnalysisIds"], loadingSourceAnalysisId: [1, "loadingSourceAnalysisId"], viewMode: [1, "viewMode"], currentModalState: [1, "currentModalState"] }, outputs: { sourceAnalysisClick: "sourceAnalysisClick", metricClick: "metricClick", contributingMetricsClick: "contributingMetricsClick", showObjectives: "showObjectives", close: "close" }, decls: 12, vars: 14, consts: [[1, "flex", "flex-col", "gap-6"], [1, "flex", "flex-col", "lg:flex-row", "gap-6"], [1, "flex-1"], [1, "mb-3"], [1, "text-base", "leading-relaxed", "whitespace-pre-line", 3, "ngClass"], [1, "lg:w-80", "flex-shrink-0", "flex", "flex-col", "gap-4"], ["layout", "vertical", 3, "expectedImpact", "viewMode", "showTitleIcon"], ["label", "CONTRIBUTING METRIC", "labelPlural", "CONTRIBUTING METRICS", 3, "count", "svgPath", "viewMode"], ["label", "CONTRIBUTING FOCUS AREA", "labelPlural", "CONTRIBUTING FOCUS AREAS", 3, "count", "svgPath", "viewMode", "showChevron", "tooltipContent"], [3, "sourceAnalysisClick", "sourceAnalyses", "loadedSourceAnalysisIds", "loadingSourceAnalysisId", "viewMode", "goal"], [3, "viewMode", "subLabel"], [3, "category", "viewMode"], ["label", "CONTRIBUTING METRIC", "labelPlural", "CONTRIBUTING METRICS", 3, "buttonClicked", "count", "svgPath", "viewMode"], [3, "visual", "viewMode"], [3, "buttonClick", "viewMode", "subLabel"]], template: function UnifiedGoalDetailModalContentComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: UnifiedGoalDetailModalContentComponent, selectors: [["symphiq-unified-goal-detail-modal-content"]], inputs: { goal: [1, "goal"], allMetrics: [1, "allMetrics"], allCharts: [1, "allCharts"], loadedSourceAnalysisIds: [1, "loadedSourceAnalysisIds"], loadingSourceAnalysisId: [1, "loadingSourceAnalysisId"], viewMode: [1, "viewMode"], currentModalState: [1, "currentModalState"] }, outputs: { sourceAnalysisClick: "sourceAnalysisClick", metricClick: "metricClick", contributingMetricsClick: "contributingMetricsClick", showObjectives: "showObjectives", close: "close" }, decls: 12, vars: 14, consts: [[1, "flex", "flex-col", "gap-6"], [1, "flex", "flex-col", "lg:flex-row", "gap-6"], [1, "flex-1"], [1, "mb-3"], [1, "text-base", "leading-relaxed", "whitespace-pre-line", 3, "ngClass"], [1, "lg:w-100", "flex-shrink-0", "flex", "flex-col", "gap-4"], ["layout", "vertical", 3, "expectedImpact", "viewMode", "showTitleIcon"], ["label", "CONTRIBUTING METRIC", "labelPlural", "CONTRIBUTING METRICS", 3, "count", "svgPath", "viewMode"], ["label", "CONTRIBUTING FOCUS AREA", "labelPlural", "CONTRIBUTING FOCUS AREAS", 3, "count", "svgPath", "viewMode", "showChevron", "tooltipContent"], [3, "sourceAnalysisClick", "sourceAnalyses", "loadedSourceAnalysisIds", "loadingSourceAnalysisId", "viewMode", "goal"], [3, "viewMode", "subLabel"], [3, "category", "viewMode"], [3, "visual", "viewMode"], ["label", "CONTRIBUTING METRIC", "labelPlural", "CONTRIBUTING METRICS", 3, "buttonClicked", "count", "svgPath", "viewMode"], [3, "buttonClick", "viewMode", "subLabel"]], template: function UnifiedGoalDetailModalContentComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2);
             i0.ɵɵconditionalCreate(3, UnifiedGoalDetailModalContentComponent_Conditional_3_Template, 2, 2, "div", 3);
             i0.ɵɵconditionalCreate(4, UnifiedGoalDetailModalContentComponent_Conditional_4_Template, 2, 2, "p", 4);
+            i0.ɵɵconditionalCreate(5, UnifiedGoalDetailModalContentComponent_Conditional_5_Template, 2, 2, "div");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(5, "div", 5);
-            i0.ɵɵelement(6, "symphiq-expected-impact-section", 6);
-            i0.ɵɵconditionalCreate(7, UnifiedGoalDetailModalContentComponent_Conditional_7_Template, 1, 3, "symphiq-related-content-button", 7);
-            i0.ɵɵconditionalCreate(8, UnifiedGoalDetailModalContentComponent_Conditional_8_Template, 1, 5, "symphiq-related-content-button", 8);
-            i0.ɵɵelementStart(9, "symphiq-source-analysis-traceability", 9);
-            i0.ɵɵlistener("sourceAnalysisClick", function UnifiedGoalDetailModalContentComponent_Template_symphiq_source_analysis_traceability_sourceAnalysisClick_9_listener($event) { return ctx.onSourceAnalysisClick($event); });
+            i0.ɵɵelementStart(6, "div", 5);
+            i0.ɵɵelement(7, "symphiq-expected-impact-section", 6);
+            i0.ɵɵconditionalCreate(8, UnifiedGoalDetailModalContentComponent_Conditional_8_Template, 1, 3, "symphiq-related-content-button", 7);
+            i0.ɵɵconditionalCreate(9, UnifiedGoalDetailModalContentComponent_Conditional_9_Template, 1, 5, "symphiq-related-content-button", 8);
+            i0.ɵɵelementStart(10, "symphiq-source-analysis-traceability", 9);
+            i0.ɵɵlistener("sourceAnalysisClick", function UnifiedGoalDetailModalContentComponent_Template_symphiq_source_analysis_traceability_sourceAnalysisClick_10_listener($event) { return ctx.onSourceAnalysisClick($event); });
             i0.ɵɵelementEnd()()();
-            i0.ɵɵconditionalCreate(10, UnifiedGoalDetailModalContentComponent_Conditional_10_Template, 2, 2, "div");
             i0.ɵɵconditionalCreate(11, UnifiedGoalDetailModalContentComponent_Conditional_11_Template, 1, 2, "symphiq-show-objectives-button", 10);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
@@ -103548,17 +103583,17 @@ class UnifiedGoalDetailModalContentComponent {
             i0.ɵɵconditional(ctx.goal().thematicCategory ? 3 : -1);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.goal().description ? 4 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.goal().visual ? 5 : -1);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("expectedImpact", ctx.goal().expectedImpact)("viewMode", ctx.viewMode())("showTitleIcon", false);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.contributingMetricsCount() > 0 ? 7 : -1);
+            i0.ɵɵconditional(ctx.contributingMetricsCount() > 0 ? 8 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.contributingFocusAreasCount() > 0 ? 8 : -1);
+            i0.ɵɵconditional(ctx.contributingFocusAreasCount() > 0 ? 9 : -1);
             i0.ɵɵadvance();
             i0.ɵɵproperty("sourceAnalyses", ctx.goal().sourceAnalyses)("loadedSourceAnalysisIds", ctx.loadedSourceAnalysisIds())("loadingSourceAnalysisId", ctx.loadingSourceAnalysisId())("viewMode", ctx.viewMode())("goal", ctx.goal());
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.goal().visual ? 10 : -1);
-            i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.goal().objectives && ctx.goal().objectives.length > 0 ? 11 : -1);
         } }, dependencies: [CommonModule, i1$1.NgClass, ExpectedImpactSectionComponent, NapkinVisualPlaceholderComponent, ShowObjectivesButtonComponent, SourceAnalysisTraceabilityComponent, RelatedContentButtonComponent, ThematicCategoryBadgeComponent], encapsulation: 2, changeDetection: 0 }); }
 }
@@ -103587,8 +103622,17 @@ class UnifiedGoalDetailModalContentComponent {
               {{ goal().description }}
             </p>
           }
+          <!-- Napkin Visual -->
+          @if (goal().visual) {
+            <div>
+              <symphiq-napkin-visual-placeholder
+                  [visual]="goal().visual"
+                  [viewMode]="viewMode()"
+              />
+            </div>
+          }
         </div>
-        <div class="lg:w-80 flex-shrink-0 flex flex-col gap-4">
+        <div class="lg:w-100 flex-shrink-0 flex flex-col gap-4">
           <symphiq-expected-impact-section
               [expectedImpact]="goal().expectedImpact"
               [viewMode]="viewMode()"
@@ -103627,17 +103671,7 @@ class UnifiedGoalDetailModalContentComponent {
           />
         </div>
       </div>
-
-      <!-- Napkin Visual -->
-      @if (goal().visual) {
-        <div>
-          <symphiq-napkin-visual-placeholder
-              [visual]="goal().visual"
-              [viewMode]="viewMode()"
-          />
-        </div>
-      }
-
+      
       <!-- Objectives Button -->
       @if (goal().objectives && goal().objectives!.length > 0) {
         <symphiq-show-objectives-button
@@ -103651,7 +103685,7 @@ class UnifiedGoalDetailModalContentComponent {
   `
             }]
     }], null, { goal: [{ type: i0.Input, args: [{ isSignal: true, alias: "goal", required: true }] }], allMetrics: [{ type: i0.Input, args: [{ isSignal: true, alias: "allMetrics", required: false }] }], allCharts: [{ type: i0.Input, args: [{ isSignal: true, alias: "allCharts", required: false }] }], loadedSourceAnalysisIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadedSourceAnalysisIds", required: false }] }], loadingSourceAnalysisId: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingSourceAnalysisId", required: false }] }], viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], currentModalState: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentModalState", required: false }] }], sourceAnalysisClick: [{ type: i0.Output, args: ["sourceAnalysisClick"] }], metricClick: [{ type: i0.Output, args: ["metricClick"] }], contributingMetricsClick: [{ type: i0.Output, args: ["contributingMetricsClick"] }], showObjectives: [{ type: i0.Output, args: ["showObjectives"] }], close: [{ type: i0.Output, args: ["close"] }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(UnifiedGoalDetailModalContentComponent, { className: "UnifiedGoalDetailModalContentComponent", filePath: "lib/components/profile-analysis-unified-dashboard/modals/unified-goal-detail-modal-content.component.ts", lineNumber: 99 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(UnifiedGoalDetailModalContentComponent, { className: "UnifiedGoalDetailModalContentComponent", filePath: "lib/components/profile-analysis-unified-dashboard/modals/unified-goal-detail-modal-content.component.ts", lineNumber: 98 }); })();
 
 const _forTrack0$7 = ($index, $item) => $item.metric;
 function UnifiedGoalRelatedMetricsModalContentComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
@@ -104344,7 +104378,7 @@ class UnifiedDashboardModalComponent {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.modalContent = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.modalWrapper = _t.first);
-        } }, inputs: { viewMode: [1, "viewMode"] }, decls: 1, vars: 1, consts: [["modalWrapper", ""], ["modalContent", ""], [1, "fixed", "inset-0", "flex", "items-center", "justify-center", "p-4", "overflow-y-auto", 3, "z-index", "visibility"], [1, "fixed", "inset-0", "flex", "items-center", "justify-center", "p-4", "overflow-y-auto"], ["aria-hidden", "true", 1, "fixed", "inset-0", "backdrop-blur-sm", 3, "click", "ngClass"], [1, "relative", "w-full", "max-w-4xl", "rounded-2xl", "text-left", "overflow-hidden", "shadow-xl", "border", "backdrop-blur-xl", 3, "click", "ngClass"], [1, "px-6", "py-5", "border-b", "backdrop-blur-sm", 3, "ngClass"], [1, "flex", "items-start", "justify-between"], [1, "flex", "items-start", "gap-3", "flex-1", "min-w-0"], ["type", "button", 1, "mt-0.5", "p-1.5", "rounded-lg", "transition-all", "hover:scale-105", "active:scale-95", "cursor-pointer", "flex-shrink-0", 3, "ngClass"], [1, "flex-1", "min-w-0"], [1, "flex", "items-center", "gap-1.5", "mb-2", "text-xs"], [1, "flex", "items-center", "gap-2", "mb-2"], [1, "text-xl", "font-bold", "leading-tight", 3, "ngClass"], [1, "flex", "items-center", "gap-2", "ml-4", "flex-shrink-0"], [3, "priority", "viewMode"], [3, "timeframe", "viewMode"], ["type", "button", 1, "transition-all", "rounded-lg", "p-1", "hover:scale-110", "active:scale-90", "cursor-pointer", "relative", "ml-4", "flex-shrink-0", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M6 18L18 6M6 6l12 12"], [1, "px-6", "py-8", "max-h-[80vh]", "overflow-y-auto", "backdrop-blur-sm", 3, "ngClass"], [3, "goal", "allMetrics", "allCharts", "loadedSourceAnalysisIds", "loadingSourceAnalysisId", "viewMode", "currentModalState"], [3, "objectives", "goalTitle", "viewMode"], [3, "goal", "contributingMetrics", "viewMode"], [3, "objective", "viewMode"], [3, "strategy", "viewMode", "allMetrics", "allCharts", "allInsights", "goalTitle", "objectiveTitle", "currentModalState"], ["type", "button", 1, "mt-0.5", "p-1.5", "rounded-lg", "transition-all", "hover:scale-105", "active:scale-95", "cursor-pointer", "flex-shrink-0", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M15 19l-7-7 7-7"], [1, "font-medium", 3, "ngClass"], ["type", "button", 1, "hover:underline", "cursor-pointer", "transition-colors", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-3", "h-3", "flex-shrink-0", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 5l7 7-7 7"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wider", 3, "ngClass"], [3, "sourceAnalysisClick", "metricClick", "contributingMetricsClick", "showObjectives", "close", "goal", "allMetrics", "allCharts", "loadedSourceAnalysisIds", "loadingSourceAnalysisId", "viewMode", "currentModalState"], [3, "metricClick", "goal", "contributingMetrics", "viewMode"]], template: function UnifiedDashboardModalComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { viewMode: [1, "viewMode"] }, decls: 1, vars: 1, consts: [["modalWrapper", ""], ["modalContent", ""], [1, "fixed", "inset-0", "flex", "items-center", "justify-center", "p-4", "overflow-y-auto", 3, "z-index", "visibility"], [1, "fixed", "inset-0", "flex", "items-center", "justify-center", "p-4", "overflow-y-auto"], ["aria-hidden", "true", 1, "fixed", "inset-0", "backdrop-blur-sm", 3, "click", "ngClass"], [1, "relative", "w-full", "max-w-6xl", "rounded-2xl", "text-left", "overflow-hidden", "shadow-xl", "border", "backdrop-blur-xl", 3, "click", "ngClass"], [1, "px-6", "py-5", "border-b", "backdrop-blur-sm", 3, "ngClass"], [1, "flex", "items-start", "justify-between"], [1, "flex", "items-start", "gap-3", "flex-1", "min-w-0"], ["type", "button", 1, "mt-0.5", "p-1.5", "rounded-lg", "transition-all", "hover:scale-105", "active:scale-95", "cursor-pointer", "flex-shrink-0", 3, "ngClass"], [1, "flex-1", "min-w-0"], [1, "flex", "items-center", "gap-1.5", "mb-2", "text-xs"], [1, "flex", "items-center", "gap-2", "mb-2"], [1, "text-xl", "font-bold", "leading-tight", 3, "ngClass"], [1, "flex", "items-center", "gap-2", "ml-4", "flex-shrink-0"], [3, "priority", "viewMode"], [3, "timeframe", "viewMode"], ["type", "button", 1, "transition-all", "rounded-lg", "p-1", "hover:scale-110", "active:scale-90", "cursor-pointer", "relative", "ml-4", "flex-shrink-0", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M6 18L18 6M6 6l12 12"], [1, "px-6", "py-8", "max-h-[80vh]", "overflow-y-auto", "backdrop-blur-sm", 3, "ngClass"], [3, "goal", "allMetrics", "allCharts", "loadedSourceAnalysisIds", "loadingSourceAnalysisId", "viewMode", "currentModalState"], [3, "objectives", "goalTitle", "viewMode"], [3, "goal", "contributingMetrics", "viewMode"], [3, "objective", "viewMode"], [3, "strategy", "viewMode", "allMetrics", "allCharts", "allInsights", "goalTitle", "objectiveTitle", "currentModalState"], ["type", "button", 1, "mt-0.5", "p-1.5", "rounded-lg", "transition-all", "hover:scale-105", "active:scale-95", "cursor-pointer", "flex-shrink-0", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M15 19l-7-7 7-7"], [1, "font-medium", 3, "ngClass"], ["type", "button", 1, "hover:underline", "cursor-pointer", "transition-colors", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-3", "h-3", "flex-shrink-0", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 5l7 7-7 7"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wider", 3, "ngClass"], [3, "sourceAnalysisClick", "metricClick", "contributingMetricsClick", "showObjectives", "close", "goal", "allMetrics", "allCharts", "loadedSourceAnalysisIds", "loadingSourceAnalysisId", "viewMode", "currentModalState"], [3, "metricClick", "goal", "contributingMetrics", "viewMode"]], template: function UnifiedDashboardModalComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵconditionalCreate(0, UnifiedDashboardModalComponent_Conditional_0_Template, 26, 28, "div", 2);
         } if (rf & 2) {
             i0.ɵɵconditional(ctx.isOpen() ? 0 : -1);
@@ -104407,7 +104441,7 @@ class UnifiedDashboardModalComponent {
         <div
           (click)="$event.stopPropagation()"
           [ngClass]="isLightMode() ? 'bg-white/90 border-slate-200/50' : 'bg-slate-800/90 border-slate-700/50'"
-          class="relative w-full max-w-4xl rounded-2xl text-left overflow-hidden shadow-xl border backdrop-blur-xl"
+          class="relative w-full max-w-6xl rounded-2xl text-left overflow-hidden shadow-xl border backdrop-blur-xl"
           [style.z-index]="contentZIndex()"
           @slideUpFade>