@memberjunction/ng-dashboards 6.1.2 → 6.2.0-edge.0

package/dist/PredictiveStudio/components/ps-predictions-grid.component.js

@@ -0,0 +1,1902 @@
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, inject, } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { BaseAngularComponent } from '@memberjunction/ng-base-types';
+import { NavigationService } from '@memberjunction/ng-shared';
+import { MJButtonDirective, MJViewToggleComponent, MjSlidePanelComponent, } from '@memberjunction/ng-ui-components';
+import { SharedGenericModule } from '@memberjunction/ng-shared-generic';
+import { CompositeKey, LogError, RunView } from '@memberjunction/core';
+import { NormalizeUUID, UUIDsEqual } from '@memberjunction/global';
+import { UserInfoEngine } from '@memberjunction/core-entities';
+import { AgGridModule } from 'ag-grid-angular';
+import { AllCommunityModule, ModuleRegistry, themeAlpine, } from 'ag-grid-community';
+import { parseAtRiskRows, resolveRenewalPolarity, } from '../at-risk.view-models';
+import { resolveOutcomeConfig, resolveScoreBand, resolveOutcomeStyle, formatPredictionScore, } from '@memberjunction/predictive-studio-core';
+import { PredictiveStudioScoreHistoryService, } from '../predictive-studio-score-history.service';
+import { PredictiveStudioEngine } from '../engine/predictive-studio.engine';
+import * as i0 from "@angular/core";
+import * as i1 from "@memberjunction/ng-shared-generic";
+import * as i2 from "ag-grid-angular";
+import * as i3 from "@angular/common";
+const _forTrack0 = ($index, $item) => $item.key;
+const _forTrack1 = ($index, $item) => $item.label;
+const _forTrack2 = ($index, $item) => $item.name;
+const _forTrack3 = ($index, $item) => $item.runId;
+function PSPredictionsGridComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 21);
+    i0.ɵɵlistener("click", function PSPredictionsGridComponent_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.clearSearch()); });
+    i0.ɵɵelement(1, "i", 22);
+    i0.ɵɵelementEnd();
+} }
+function PSPredictionsGridComponent_For_14_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 8);
+    i0.ɵɵlistener("click", function PSPredictionsGridComponent_For_14_Template_button_click_0_listener() { const b_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setTier(b_r4.key)); });
+    i0.ɵɵtext(1);
+    i0.ɵɵelementStart(2, "span", 9);
+    i0.ɵɵtext(3);
+    i0.ɵɵpipe(4, "number");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const b_r4 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("active", ctx_r1.selectedTier === b_r4.key);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", b_r4.label, " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1("(", i0.ɵɵpipeBind1(4, 4, b_r4.count), ")");
+} }
+function PSPredictionsGridComponent_Conditional_15_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 11);
+    i0.ɵɵelement(1, "i", 23);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "button", 24);
+    i0.ɵɵlistener("click", function PSPredictionsGridComponent_Conditional_15_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.clearDecileFilter()); });
+    i0.ɵɵelement(5, "i", 22);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1("Decile ", ctx_r1.selectedDecileLabel);
+} }
+function PSPredictionsGridComponent_Conditional_22_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-loading", 17);
+} }
+function PSPredictionsGridComponent_Conditional_23_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 18);
+    i0.ɵɵelement(1, "i", 25);
+    i0.ɵɵelementStart(2, "div", 26)(3, "strong");
+    i0.ɵɵtext(4, "Couldn't load predictions");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "span", 27);
+    i0.ɵɵtext(6);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(7, "button", 28);
+    i0.ɵɵlistener("click", function PSPredictionsGridComponent_Conditional_23_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.reload()); });
+    i0.ɵɵelement(8, "i", 29);
+    i0.ɵɵtext(9, " Try again");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate(ctx_r1.loadError);
+} }
+function PSPredictionsGridComponent_Conditional_24_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 19)(1, "span", 30);
+    i0.ɵɵelement(2, "i", 31);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "h3");
+    i0.ɵɵtext(4, "No predictions available");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "p");
+    i0.ɵɵtext(6, "Run this model from Models in Production or wait for the scheduled job to produce predictions.");
+    i0.ɵɵelementEnd()();
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_0_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 35);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate2("Filtered by ", ctx_r1.selectedTier !== "all" ? ctx_r1.selectedTier + " risk" : "", "", ctx_r1.searchText ? " query \"" + ctx_r1.searchText + "\"" : "");
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "ag-grid-angular", 33);
+    i0.ɵɵlistener("gridReady", function PSPredictionsGridComponent_Conditional_25_Conditional_0_Template_ag_grid_angular_gridReady_0_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onGridReady($event)); })("rowClicked", function PSPredictionsGridComponent_Conditional_25_Conditional_0_Template_ag_grid_angular_rowClicked_0_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onRowClicked($event)); })("cellClicked", function PSPredictionsGridComponent_Conditional_25_Conditional_0_Template_ag_grid_angular_cellClicked_0_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onCellClicked($event)); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(1, "div", 34)(2, "span");
+    i0.ɵɵtext(3, "Showing ");
+    i0.ɵɵelementStart(4, "strong");
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtext(6);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(7, PSPredictionsGridComponent_Conditional_25_Conditional_0_Conditional_7_Template, 2, 2, "span", 35);
+    i0.ɵɵelementStart(8, "span", 35);
+    i0.ɵɵtext(9, "Click any row to inspect details & score history");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("theme", ctx_r1.Theme)("columnDefs", ctx_r1.columnDefs)("defaultColDef", ctx_r1.defaultColDef)("gridOptions", ctx_r1.GridOptions)("rowData", ctx_r1.filteredRows);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(ctx_r1.filteredRows.length);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" of ", ctx_r1.allRows.length, " predictions");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.selectedTier !== "all" || ctx_r1.searchText ? 7 : -1);
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_1_For_12_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i");
+} if (rf & 2) {
+    const b_r9 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵclassMap(i0.ɵɵinterpolate1("fa-solid ", b_r9.icon));
+    i0.ɵɵstyleProp("color", ctx_r1.getBadgeColorVar(b_r9.badgeColor));
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_1_For_12_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 54);
+    i0.ɵɵlistener("click", function PSPredictionsGridComponent_Conditional_25_Conditional_1_For_12_Template_div_click_0_listener() { const b_r9 = i0.ɵɵrestoreView(_r8).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.setTierAndGrid(b_r9.key)); });
+    i0.ɵɵelementStart(1, "span", 38);
+    i0.ɵɵconditionalCreate(2, PSPredictionsGridComponent_Conditional_25_Conditional_1_For_12_Conditional_2_Template, 1, 5, "i", 55);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "span", 40);
+    i0.ɵɵtext(5);
+    i0.ɵɵpipe(6, "number");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "span", 41);
+    i0.ɵɵtext(8);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const b_r9 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵclassMap("tier-" + b_r9.key);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(b_r9.icon ? 2 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", b_r9.label, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵstyleProp("color", ctx_r1.getBadgeColorVar(b_r9.badgeColor));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(6, 10, b_r9.count), " ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate3("", b_r9.pct, "% of cohort (avg ", b_r9.avgScoreFormatted, " ", ctx_r1.outcomeConfig.ScoreLabel, ")");
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_24_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 56);
+    i0.ɵɵlistener("click", function PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_24_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.clearDecileFilter()); });
+    i0.ɵɵelement(1, "i", 22);
+    i0.ɵɵtext(2, " Clear Decile Filter ");
+    i0.ɵɵelementEnd();
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_1_For_28_Template(rf, ctx) { if (rf & 1) {
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 57);
+    i0.ɵɵlistener("click", function PSPredictionsGridComponent_Conditional_25_Conditional_1_For_28_Template_div_click_0_listener() { const b_r12 = i0.ɵɵrestoreView(_r11).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.selectDecile(b_r12.idx)); });
+    i0.ɵɵelementStart(1, "span", 58);
+    i0.ɵɵtext(2);
+    i0.ɵɵpipe(3, "number");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "div", 59);
+    i0.ɵɵelement(5, "div", 60);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "div", 61)(7, "span", 62);
+    i0.ɵɵtext(8);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "span", 63);
+    i0.ɵɵtext(10);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(11, "div", 64)(12, "div", 65);
+    i0.ɵɵtext(13);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(14, "div", 66)(15, "span", 67);
+    i0.ɵɵtext(16);
+    i0.ɵɵpipe(17, "number");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(18, "span", 68);
+    i0.ɵɵtext(19);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(20, "div", 69);
+    i0.ɵɵtext(21);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(22, "div", 70);
+    i0.ɵɵtext(23);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const b_r12 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵclassProp("active", ctx_r1.selectedDecileIndex === b_r12.idx)("empty", b_r12.count === 0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("title", b_r12.count + " records");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", b_r12.count > 0 ? i0.ɵɵpipeBind1(3, 20, b_r12.count) : "0", " ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵstyleProp("height", b_r12.height, "px")("background", b_r12.color);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(b_r12.shortLabel);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(b_r12.pctFormatted);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate2("", b_r12.label, " ", ctx_r1.outcomeConfig.ScoreLabel);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(17, 22, b_r12.count), " records");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1("(", b_r12.pctFormatted, " of cohort)");
+    i0.ɵɵadvance();
+    i0.ɵɵstyleProp("color", b_r12.color);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(b_r12.riskLabel);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r1.selectedDecileIndex === b_r12.idx ? "Click to clear filter" : "Click to filter grid");
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_29_For_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "div", 76);
+} if (rf & 2) {
+    const c_r13 = ctx.$implicit;
+    i0.ɵɵstyleProp("width", c_r13.pct, "%")("background", c_r13.color);
+    i0.ɵɵproperty("title", c_r13.name + ": " + c_r13.count + " (" + c_r13.pct + "%)");
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_29_For_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 75);
+    i0.ɵɵelement(1, "span", 77);
+    i0.ɵɵelementStart(2, "strong");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "span", 35);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const c_r14 = ctx.$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵstyleProp("background", c_r14.color);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(c_r14.name);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate2("", c_r14.count, " (", c_r14.pct, "%)");
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_29_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 43)(1, "div", 44)(2, "span");
+    i0.ɵɵelement(3, "i", 71);
+    i0.ɵɵtext(4, " Predicted Outcome Classes");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(5, "div", 72);
+    i0.ɵɵrepeaterCreate(6, PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_29_For_7_Template, 1, 5, "div", 73, _forTrack2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "div", 74);
+    i0.ɵɵrepeaterCreate(9, PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_29_For_10_Template, 6, 5, "div", 75, _forTrack2);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(6);
+    i0.ɵɵrepeater(ctx_r1.classBreakdown);
+    i0.ɵɵadvance(3);
+    i0.ɵɵrepeater(ctx_r1.classBreakdown);
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_30_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 84);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(4);
+    i0.ɵɵstyleProp("color", ctx_r1.histogramBins[ctx_r1.selectedDecileIndex].color);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.histogramBins[ctx_r1.selectedDecileIndex].riskLabel, " ");
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_30_Template(rf, ctx) { if (rf & 1) {
+    const _r15 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 53)(1, "div", 44)(2, "div", 45);
+    i0.ɵɵelement(3, "i", 78);
+    i0.ɵɵelementStart(4, "span");
+    i0.ɵɵtext(5, " Decile Drill-Down: ");
+    i0.ɵɵelementStart(6, "strong", 79);
+    i0.ɵɵtext(7);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtext(8);
+    i0.ɵɵconditionalCreate(9, PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_30_Conditional_9_Template, 2, 3, "span", 80);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(10, "div", 47)(11, "span", 48);
+    i0.ɵɵtext(12, " Showing ");
+    i0.ɵɵelementStart(13, "strong");
+    i0.ɵɵtext(14);
+    i0.ɵɵpipe(15, "number");
+    i0.ɵɵelementEnd();
+    i0.ɵɵtext(16);
+    i0.ɵɵpipe(17, "number");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(18, "button", 56);
+    i0.ɵɵlistener("click", function PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_30_Template_button_click_18_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.clearDecileFilter()); });
+    i0.ɵɵelement(19, "i", 22);
+    i0.ɵɵtext(20, " Show All Deciles ");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(21, "div", 81)(22, "ag-grid-angular", 82);
+    i0.ɵɵlistener("gridReady", function PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_30_Template_ag_grid_angular_gridReady_22_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onChartGridReady($event)); })("rowClicked", function PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_30_Template_ag_grid_angular_rowClicked_22_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onRowClicked($event)); })("cellClicked", function PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_30_Template_ag_grid_angular_cellClicked_22_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onCellClicked($event)); });
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(23, "div", 83)(24, "span", 35);
+    i0.ɵɵtext(25, "Click any row to inspect explainability drivers and score history in the slide-in drawer");
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(7);
+    i0.ɵɵtextInterpolate(ctx_r1.selectedDecileLabel);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.outcomeConfig.ScoreLabel, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.histogramBins[ctx_r1.selectedDecileIndex] ? 9 : -1);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(15, 10, ctx_r1.filteredRows.length));
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" of ", i0.ɵɵpipeBind1(17, 12, ctx_r1.allRows.length), " records ");
+    i0.ɵɵadvance(6);
+    i0.ɵɵproperty("theme", ctx_r1.Theme)("columnDefs", ctx_r1.columnDefs)("defaultColDef", ctx_r1.defaultColDef)("gridOptions", ctx_r1.chartGridOptions)("rowData", ctx_r1.filteredRows);
+} }
+function PSPredictionsGridComponent_Conditional_25_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 32)(1, "div", 36)(2, "div", 37)(3, "span", 38);
+    i0.ɵɵelement(4, "i", 39);
+    i0.ɵɵtext(5, " Scored Cohort");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "span", 40);
+    i0.ɵɵtext(7);
+    i0.ɵɵpipe(8, "number");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "span", 41);
+    i0.ɵɵtext(10, "Total records");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵrepeaterCreate(11, PSPredictionsGridComponent_Conditional_25_Conditional_1_For_12_Template, 9, 12, "div", 42, _forTrack0);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(13, "div", 43)(14, "div", 44)(15, "div", 45);
+    i0.ɵɵelement(16, "i", 46);
+    i0.ɵɵelementStart(17, "span");
+    i0.ɵɵtext(18);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(19, "div", 47)(20, "span", 48);
+    i0.ɵɵtext(21, "Cohort Mean: ");
+    i0.ɵɵelementStart(22, "strong");
+    i0.ɵɵtext(23);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(24, PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_24_Template, 3, 0, "button", 49);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(25, "div", 50)(26, "div", 51);
+    i0.ɵɵrepeaterCreate(27, PSPredictionsGridComponent_Conditional_25_Conditional_1_For_28_Template, 24, 24, "div", 52, _forTrack1);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵconditionalCreate(29, PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_29_Template, 11, 0, "div", 43);
+    i0.ɵɵconditionalCreate(30, PSPredictionsGridComponent_Conditional_25_Conditional_1_Conditional_30_Template, 26, 14, "div", 53);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(7);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(8, 6, ctx_r1.allRows.length));
+    i0.ɵɵadvance(4);
+    i0.ɵɵrepeater(ctx_r1.visibleBands);
+    i0.ɵɵadvance(7);
+    i0.ɵɵtextInterpolate1("", ctx_r1.outcomeConfig.ScoreLabel, " Distribution (10 Bins)");
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(ctx_r1.meanScoreFormatted);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.selectedDecileIndex !== null ? 24 : -1);
+    i0.ɵɵadvance(3);
+    i0.ɵɵrepeater(ctx_r1.histogramBins);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.classBreakdown.length > 0 ? 29 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.selectedDecileIndex !== null ? 30 : -1);
+} }
+function PSPredictionsGridComponent_Conditional_25_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, PSPredictionsGridComponent_Conditional_25_Conditional_0_Template, 10, 8);
+    i0.ɵɵconditionalCreate(1, PSPredictionsGridComponent_Conditional_25_Conditional_1_Template, 31, 8, "div", 32);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵconditional(ctx_r1.activeView === "grid" ? 0 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.activeView === "chart" ? 1 : -1);
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_15_Template(rf, ctx) { if (rf & 1) {
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 110);
+    i0.ɵɵlistener("click", function PSPredictionsGridComponent_Conditional_26_Conditional_15_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.openSubjectRecord()); });
+    i0.ɵɵelement(1, "i", 111);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate2(" Open ", ctx_r1.subjectEntityName.replace("MJ_BizApps_Common: ", "").replace("MJ_BizApps_", ""), " (", ctx_r1.subjectRecordName || "Profile", ") ");
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_24_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i");
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵclassMap(i0.ɵɵinterpolate1("fa-solid ", ctx_r1.selectedRow.icon));
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_26_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 98)(1, "strong");
+    i0.ɵɵtext(2, "Predicted Outcome:");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "span", 112);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(3);
+    i0.ɵɵclassMap(ctx_r1.getOutcomeBadgeClass(ctx_r1.selectedRow.class));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.selectedRow.class, " ");
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_39_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 48);
+    i0.ɵɵtext(1, "No individual driver breakdown was recorded for this row.");
+    i0.ɵɵelementEnd();
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_40_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 113)(1, "div", 114);
+    i0.ɵɵelement(2, "i", 115);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "span", 112);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const d_r18 = ctx.$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵstyleProp("color", d_r18.up ? "var(--mj-status-error)" : "var(--mj-status-success)");
+    i0.ɵɵclassProp("fa-arrow-up", d_r18.up)("fa-arrow-down", !d_r18.up);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", d_r18.label, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(d_r18.up ? "red" : "green");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", d_r18.up ? "Increases Risk" : "Lowers Risk", " ");
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_40_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 105);
+    i0.ɵɵrepeaterCreate(1, PSPredictionsGridComponent_Conditional_26_Conditional_40_For_2_Template, 6, 10, "div", 113, _forTrack1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.selectedRow.drivers);
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_48_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-loading", 109);
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_49_For_13_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵnamespaceSVG();
+    i0.ɵɵelementStart(0, "circle", 126)(1, "title");
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(3, "text", 127);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const p_r19 = ctx.$implicit;
+    i0.ɵɵattribute("cx", p_r19.x)("cy", p_r19.y)("fill", p_r19.color);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate3("", p_r19.dateStr, ": ", p_r19.scoreFormatted, " (", p_r19.class || "No class", ")");
+    i0.ɵɵadvance();
+    i0.ɵɵattribute("cx", p_r19.x)("cy", p_r19.y - 9);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", p_r19.scoreFormatted, " ");
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_49_For_29_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 129);
+    i0.ɵɵtext(1, "Baseline");
+    i0.ɵɵelementEnd();
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_49_For_29_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 130);
+    i0.ɵɵelement(1, "i", 132);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const pt_r20 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" +", (pt_r20.delta * 100).toFixed(1), "%");
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_49_For_29_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 131);
+    i0.ɵɵelement(1, "i", 133);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const pt_r20 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", (pt_r20.delta * 100).toFixed(1), "%");
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_49_For_29_Conditional_14_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 129);
+    i0.ɵɵtext(1, "0%");
+    i0.ɵɵelementEnd();
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_49_For_29_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr")(1, "td");
+    i0.ɵɵtext(2);
+    i0.ɵɵpipe(3, "date");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "td")(5, "span", 112);
+    i0.ɵɵtext(6);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(7, "td")(8, "strong", 128);
+    i0.ɵɵtext(9);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(10, "td");
+    i0.ɵɵconditionalCreate(11, PSPredictionsGridComponent_Conditional_26_Conditional_49_For_29_Conditional_11_Template, 2, 0, "span", 129)(12, PSPredictionsGridComponent_Conditional_26_Conditional_49_For_29_Conditional_12_Template, 3, 1, "span", 130)(13, PSPredictionsGridComponent_Conditional_26_Conditional_49_For_29_Conditional_13_Template, 3, 1, "span", 131)(14, PSPredictionsGridComponent_Conditional_26_Conditional_49_For_29_Conditional_14_Template, 2, 0, "span", 129);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(15, "td");
+    i0.ɵɵtext(16);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const pt_r20 = ctx.$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(3, 7, pt_r20.runDate, "short"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵclassMap(pt_r20.status === "Succeeded" ? "green" : "gray");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(pt_r20.status);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(pt_r20.scoreFormatted);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(pt_r20.delta == null ? 11 : pt_r20.delta > 0.005 ? 12 : pt_r20.delta < -0.005 ? 13 : 14);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(pt_r20.class || "\u2014");
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_49_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵnamespaceSVG();
+    i0.ɵɵelementStart(0, "svg", 116);
+    i0.ɵɵelement(1, "line", 117)(2, "line", 118)(3, "line", 119);
+    i0.ɵɵelementStart(4, "text", 120);
+    i0.ɵɵtext(5, "100%");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "text", 121);
+    i0.ɵɵtext(7, "50%");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "text", 122);
+    i0.ɵɵtext(9, "0%");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelement(10, "polygon", 123)(11, "polyline", 124);
+    i0.ɵɵrepeaterCreate(12, PSPredictionsGridComponent_Conditional_26_Conditional_49_For_13_Template, 5, 9, null, null, _forTrack3);
+    i0.ɵɵelementEnd();
+    i0.ɵɵnamespaceHTML();
+    i0.ɵɵelementStart(14, "table", 125)(15, "thead")(16, "tr")(17, "th");
+    i0.ɵɵtext(18, "When");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(19, "th");
+    i0.ɵɵtext(20, "Status");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(21, "th");
+    i0.ɵɵtext(22, "Score");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(23, "th");
+    i0.ɵɵtext(24, "Change");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(25, "th");
+    i0.ɵɵtext(26, "Class");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(27, "tbody");
+    i0.ɵɵrepeaterCreate(28, PSPredictionsGridComponent_Conditional_26_Conditional_49_For_29_Template, 17, 10, "tr", null, _forTrack3);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(10);
+    i0.ɵɵattribute("points", ctx_r1.trendlineAreaPoints);
+    i0.ɵɵadvance();
+    i0.ɵɵattribute("points", ctx_r1.trendlineLinePoints);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.trendlinePlotPoints);
+    i0.ɵɵadvance(16);
+    i0.ɵɵrepeater(ctx_r1.historyPoints);
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_50_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 48);
+    i0.ɵɵtext(1);
+    i0.ɵɵpipe(2, "date");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" This record has been scored once so far (", i0.ɵɵpipeBind2(2, 1, ctx_r1.historyPoints[0].runDate, "medium"), "). As more runs occur over time, the score trendline will track changes here. ");
+} }
+function PSPredictionsGridComponent_Conditional_26_Conditional_51_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 48);
+    i0.ɵɵtext(1, "No historical runs found for this record.");
+    i0.ɵɵelementEnd();
+} }
+function PSPredictionsGridComponent_Conditional_26_Template(rf, ctx) { if (rf & 1) {
+    const _r16 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-slide-panel", 85);
+    i0.ɵɵlistener("WidthChanged", function PSPredictionsGridComponent_Conditional_26_Template_mj_slide_panel_WidthChanged_0_listener($event) { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDrawerWidthChanged($event)); })("Closed", function PSPredictionsGridComponent_Conditional_26_Template_mj_slide_panel_Closed_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeDetail()); });
+    i0.ɵɵelementStart(1, "div", 86)(2, "div", 87)(3, "div", 88)(4, "h3");
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "div", 45)(7, "span", 89);
+    i0.ɵɵtext(8);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "span", 90);
+    i0.ɵɵtext(10);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(11, "div", 91)(12, "button", 92);
+    i0.ɵɵlistener("click", function PSPredictionsGridComponent_Conditional_26_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.drillThrough(ctx_r1.selectedRow)); });
+    i0.ɵɵelement(13, "i", 93);
+    i0.ɵɵtext(14);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(15, PSPredictionsGridComponent_Conditional_26_Conditional_15_Template, 3, 2, "button", 94);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(16, "div", 95)(17, "div", 96);
+    i0.ɵɵtext(18);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(19, "div", 97)(20, "div", 98)(21, "strong");
+    i0.ɵɵtext(22);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(23, "span", 84);
+    i0.ɵɵconditionalCreate(24, PSPredictionsGridComponent_Conditional_26_Conditional_24_Template, 1, 3, "i", 99);
+    i0.ɵɵtext(25);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(26, PSPredictionsGridComponent_Conditional_26_Conditional_26_Template, 5, 3, "div", 98);
+    i0.ɵɵelementStart(27, "div", 98)(28, "strong");
+    i0.ɵɵtext(29);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(30, "span", 100);
+    i0.ɵɵtext(31);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(32, "div", 101);
+    i0.ɵɵtext(33);
+    i0.ɵɵpipe(34, "date");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(35, "div", 102)(36, "div", 103);
+    i0.ɵɵelement(37, "i", 104);
+    i0.ɵɵtext(38, " Key Decision Drivers (Explainability) ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(39, PSPredictionsGridComponent_Conditional_26_Conditional_39_Template, 2, 0, "div", 48)(40, PSPredictionsGridComponent_Conditional_26_Conditional_40_Template, 3, 0, "div", 105);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(41, "div", 106)(42, "div", 107)(43, "span");
+    i0.ɵɵelement(44, "i", 108);
+    i0.ɵɵtext(45, " Historical Score Trendline");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(46, "span", 48);
+    i0.ɵɵtext(47);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(48, PSPredictionsGridComponent_Conditional_26_Conditional_48_Template, 1, 0, "mj-loading", 109)(49, PSPredictionsGridComponent_Conditional_26_Conditional_49_Template, 30, 2)(50, PSPredictionsGridComponent_Conditional_26_Conditional_50_Template, 3, 4, "div", 48)(51, PSPredictionsGridComponent_Conditional_26_Conditional_51_Template, 2, 0, "div", 48);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("Resizable", true)("WidthPx", ctx_r1.drawerWidthPx);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(ctx_r1.selectedRow.recordName || ctx_r1.selectedRow.recordId);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ctx_r1.entityDisplayName || "Entity Record");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r1.selectedRow.recordId);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" Open ", ctx_r1.entityDisplayName || "Record", " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.subjectEntityName && ctx_r1.subjectRecordId ? 15 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassMap("badge-" + (ctx_r1.selectedRow.badgeColor || "gray"));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.selectedRow.scoreFormatted, " ");
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1("", ctx_r1.outcomeConfig.StatusLabel, ":");
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r1.selectedRow.badgeColor || "gray");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.selectedRow.icon ? 24 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.selectedRow.status || ctx_r1.selectedRow.band, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.selectedRow.class ? 26 : -1);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1("", ctx_r1.outcomeConfig.ScoreLabel, ":");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r1.selectedRow.scoreFormatted);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" Scored: ", ctx_r1.selectedRow.scoredAtDate ? i0.ɵɵpipeBind2(34, 23, ctx_r1.selectedRow.scoredAtDate, "medium") : "\u2014", " ");
+    i0.ɵɵadvance(6);
+    i0.ɵɵconditional(!ctx_r1.selectedRow.drivers || ctx_r1.selectedRow.drivers.length === 0 ? 39 : 40);
+    i0.ɵɵadvance(8);
+    i0.ɵɵtextInterpolate2("", ctx_r1.historyPoints.length, " run", ctx_r1.historyPoints.length === 1 ? "" : "s", " recorded");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.historyLoading ? 48 : ctx_r1.historyPoints.length > 1 ? 49 : ctx_r1.historyPoints.length === 1 ? 50 : 51);
+} }
+ModuleRegistry.registerModules([AllCommunityModule]);
+/**
+ * **PSPredictionsGridComponent** — Unified enterprise grid and analytics component for
+ * model predictions. Shared between:
+ *   1. **Predictions tab** (`PSPredictionsResourceComponent`) — business view of all at-risk records.
+ *   2. **Models tab** (`PSProductionComponent`) — analyst run drill-in view.
+ *
+ * Supports:
+ *   - Virtualized AG Grid scrolling for thousands of rows (no artificial 50/200 cap).
+ *   - Automatic target entity record display name resolution (e.g. member/customer names).
+ *   - Direct drill-through to the entity record in MemberJunction Explorer.
+ *   - Slide-in detail drawer (`mj-slide-panel`) with local explainability and historical trendlines across runs.
+ *   - Segmented view toggle (`mj-view-toggle`) between Grid View and Chart View (10-decile histogram + risk tiers).
+ */
+export class PSPredictionsGridComponent extends BaseAngularComponent {
+    modelId = null;
+    runId = null;
+    entityName = null;
+    problemType = 'classification';
+    title = null;
+    height = '560px';
+    readOnly = false;
+    cdr = inject(ChangeDetectorRef);
+    navigationService = inject(NavigationService);
+    scoreHistoryService = inject(PredictiveStudioScoreHistoryService);
+    Math = Math;
+    isLoading = false;
+    loadError = null;
+    allRows = [];
+    filteredRows = [];
+    searchText = '';
+    selectedTier = 'all';
+    outcomeConfig = resolveOutcomeConfig();
+    visibleBands = [];
+    activeView = 'grid';
+    viewOptions = [
+        { key: 'grid', icon: 'fa-solid fa-table', title: 'Grid View' },
+        { key: 'chart', icon: 'fa-solid fa-chart-column', title: 'Chart View' },
+    ];
+    // Slide-in detail state
+    detailOpen = false;
+    drawerWidthPx = 640;
+    selectedRow = null;
+    historyLoading = false;
+    historyPoints = [];
+    resolvedEntityId = null;
+    resolvedEntityName = null;
+    subjectEntityName = null;
+    subjectRecordId = null;
+    subjectRecordName = null;
+    gridApi = null;
+    chartGridApi = null;
+    // Viewport-visible record name lookup cache and state
+    recordNameCache = new Map();
+    inFlightLookups = new Set();
+    visibleLookupDebounceTimer = null;
+    // ── AG Grid Configuration ──
+    Theme = themeAlpine.withParams({
+        backgroundColor: 'var(--mj-bg-surface)',
+        foregroundColor: 'var(--mj-text-primary)',
+        textColor: 'var(--mj-text-primary)',
+        borderColor: 'var(--mj-border-default)',
+        chromeBackgroundColor: 'var(--mj-bg-surface-card)',
+        headerBackgroundColor: 'var(--mj-bg-surface-card)',
+        headerTextColor: 'var(--mj-text-secondary)',
+        cellTextColor: 'var(--mj-text-primary)',
+        subtleTextColor: 'var(--mj-text-muted)',
+        dataBackgroundColor: 'var(--mj-bg-surface)',
+        oddRowBackgroundColor: 'var(--mj-bg-surface-card)',
+        rowHoverColor: 'var(--mj-bg-surface-hover, color-mix(in srgb, var(--mj-brand-primary) 5%, var(--mj-bg-surface)))',
+        selectedRowBackgroundColor: 'color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface))',
+        accentColor: 'var(--mj-brand-primary)',
+        borderRadius: 'var(--mj-radius-sm)',
+        browserColorScheme: 'inherit',
+    });
+    GridOptions = {
+        animateRows: true,
+        rowHeight: 46,
+        headerHeight: 40,
+        suppressCellFocus: true,
+        enableCellTextSelection: true,
+        suppressNoRowsOverlay: true,
+        rowSelection: { mode: 'singleRow', enableClickSelection: false },
+        getRowId: (params) => params.data.recordId,
+        onBodyScrollEnd: () => this.scheduleVisibleRowsLookup(),
+        onViewportChanged: () => this.scheduleVisibleRowsLookup(),
+        onFirstDataRendered: () => this.scheduleVisibleRowsLookup(),
+        onModelUpdated: () => this.scheduleVisibleRowsLookup(),
+        onCellClicked: (event) => this.onCellClicked(event),
+    };
+    chartGridOptions = {
+        animateRows: true,
+        rowHeight: 46,
+        headerHeight: 40,
+        suppressCellFocus: true,
+        enableCellTextSelection: true,
+        suppressNoRowsOverlay: true,
+        rowSelection: { mode: 'singleRow', enableClickSelection: false },
+        getRowId: (params) => params.data.recordId,
+        onBodyScrollEnd: () => this.scheduleVisibleRowsLookup(),
+        onViewportChanged: () => this.scheduleVisibleRowsLookup(),
+        onFirstDataRendered: () => this.scheduleVisibleRowsLookup(),
+        onModelUpdated: () => this.scheduleVisibleRowsLookup(),
+        onCellClicked: (event) => this.onCellClicked(event),
+    };
+    defaultColDef = {
+        sortable: true,
+        resizable: true,
+        minWidth: 80,
+    };
+    isRenewalModel = false;
+    selectedDecileIndex = null;
+    get isRegression() {
+        return ((this.problemType ?? '').toLowerCase() === 'regression' ||
+            this.outcomeConfig?.Format === 'currency' ||
+            this.outcomeConfig?.Format === 'number');
+    }
+    columnDefs = [];
+    setupColumnDefs() {
+        const scoreLabel = this.outcomeConfig.ScoreLabel || 'Prediction Score';
+        const statusLabel = this.outcomeConfig.StatusLabel || 'Risk Level';
+        this.columnDefs = [
+            {
+                field: 'recordName',
+                headerName: 'Record',
+                flex: 2,
+                minWidth: 220,
+                cellRenderer: (params) => {
+                    if (!params.data)
+                        return '';
+                    const hasCustomName = Boolean(params.data.recordName && params.data.recordName !== params.data.recordId);
+                    const name = this.escapeHtml(params.data.recordName || params.data.recordId);
+                    const id = this.escapeHtml(params.data.recordId);
+                    return `
+            <div class="pg-record-cell">
+              <div class="pg-record-title-row">
+                <a class="pg-record-link" data-action="open-record" href="javascript:void(0)" title="Open record in Explorer">
+                  <span class="pg-record-name">${name}</span>
+                  <i class="fa-solid fa-arrow-up-right-from-square pg-record-open-icon"></i>
+                </a>
+              </div>
+              ${hasCustomName ? `<span class="pg-record-id ps-mono" title="${id}">${id}</span>` : ''}
+            </div>
+          `;
+                },
+            },
+            {
+                field: 'score',
+                headerName: scoreLabel,
+                width: 175,
+                cellRenderer: (params) => {
+                    if (!params.data)
+                        return '';
+                    const badgeColor = params.data.badgeColor || 'gray';
+                    const colorClass = `badge-${badgeColor}`;
+                    const formatted = this.escapeHtml(params.data.scoreFormatted);
+                    if (this.isRegression) {
+                        return `
+              <div class="pg-score-cell">
+                <span class="pg-score-val ${colorClass}" style="font-weight: 600; font-size: 13.5px;">${formatted}</span>
+              </div>
+            `;
+                    }
+                    const pct = Math.min(100, Math.max(0, Math.round(params.data.score * 100)));
+                    return `
+            <div class="pg-score-cell">
+              <span class="pg-score-val ${colorClass}">${formatted}</span>
+              <div class="pg-score-bar">
+                <div class="pg-score-fill ${colorClass}" style="width: ${pct}%"></div>
+              </div>
+            </div>
+          `;
+                },
+            },
+            {
+                field: 'riskPct',
+                headerName: statusLabel,
+                width: 155,
+                cellRenderer: (params) => {
+                    if (!params.data)
+                        return '';
+                    const badgeColor = params.data.badgeColor || 'gray';
+                    const icon = params.data.icon ? `<i class="fa-solid ${this.escapeHtml(params.data.icon)}"></i> ` : '';
+                    const label = this.escapeHtml(params.data.status || params.data.band);
+                    if (this.isRegression) {
+                        return `<span class="ps-badge ${badgeColor}" title="${scoreLabel}: ${this.escapeHtml(params.data.scoreFormatted)}">${icon}${label}</span>`;
+                    }
+                    const pct = Math.round(params.data.score * 100);
+                    return `<span class="ps-badge ${badgeColor}" title="${pct}% ${scoreLabel}">${icon}${label} (${pct}%)</span>`;
+                },
+            },
+            {
+                field: 'class',
+                headerName: 'Predicted Outcome',
+                width: 135,
+                cellRenderer: (params) => {
+                    if (!params.data || !params.data.class)
+                        return '<span class="ps-muted">—</span>';
+                    const cls = this.escapeHtml(params.data.class);
+                    const style = resolveOutcomeStyle(params.data.class, this.outcomeConfig);
+                    const icon = style.Icon ? `<i class="fa-solid ${style.Icon}"></i> ` : '';
+                    return `<span class="ps-badge ${style.BadgeColor}">${icon}${cls}</span>`;
+                },
+            },
+            {
+                field: 'drivers',
+                headerName: 'Key Factors',
+                flex: 2,
+                minWidth: 220,
+                sortable: false,
+                cellDataType: false,
+                cellRenderer: (params) => {
+                    if (!params.data || !params.data.drivers || params.data.drivers.length === 0) {
+                        return '<span class="ps-muted">—</span>';
+                    }
+                    const chips = params.data.drivers.slice(0, 2).map((d) => {
+                        const cls = d.up ? 'up' : 'down';
+                        const icon = d.up ? 'fa-arrow-up' : 'fa-arrow-down';
+                        const label = this.escapeHtml(d.label);
+                        return `<span class="ps-why-chip ${cls}" title="${label}"><i class="fa-solid ${icon}"></i> ${label}</span>`;
+                    }).join('');
+                    return `<div class="pg-drivers-cell">${chips}</div>`;
+                },
+            },
+            {
+                field: 'scoredAtDate',
+                headerName: 'Scored At',
+                width: 145,
+                comparator: (_a, _b, nodeA, nodeB) => (nodeA.data?.scoredAtDate?.getTime() ?? 0) - (nodeB.data?.scoredAtDate?.getTime() ?? 0),
+                cellRenderer: (params) => {
+                    if (!params.data || !params.data.scoredAtDate)
+                        return '<span class="ps-muted">—</span>';
+                    const d = params.data.scoredAtDate;
+                    return `<span class="ps-small ps-muted">${d.toLocaleDateString()} ${d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}</span>`;
+                },
+            },
+            {
+                headerName: '',
+                width: 50,
+                sortable: false,
+                resizable: false,
+                cellRenderer: () => {
+                    return `<button class="pg-action-btn" title="View details & score history"><i class="fa-solid fa-chevron-right"></i></button>`;
+                },
+            },
+        ];
+        if (this.gridApi) {
+            this.gridApi.setGridOption('columnDefs', this.columnDefs);
+        }
+        if (this.chartGridApi) {
+            this.chartGridApi.setGridOption('columnDefs', this.columnDefs);
+        }
+    }
+    ngOnInit() {
+        const pref = UserInfoEngine.Instance.GetSetting('mj.predictiveStudio.predictions.drawerWidth');
+        if (pref) {
+            const w = parseInt(pref, 10);
+            if (!isNaN(w) && w >= 360 && w <= 1400) {
+                this.drawerWidthPx = w;
+            }
+        }
+        this.setupColumnDefs();
+        void this.loadPredictions();
+    }
+    ngOnChanges(changes) {
+        if ((changes['modelId'] && !changes['modelId'].firstChange) ||
+            (changes['runId'] && !changes['runId'].firstChange) ||
+            (changes['entityName'] && !changes['entityName'].firstChange)) {
+            void this.loadPredictions();
+        }
+    }
+    ngOnDestroy() {
+        if (this.visibleLookupDebounceTimer) {
+            clearTimeout(this.visibleLookupDebounceTimer);
+            this.visibleLookupDebounceTimer = null;
+        }
+        this.recordNameCache.clear();
+        this.inFlightLookups.clear();
+        this.gridApi = null;
+        this.chartGridApi = null;
+    }
+    // ── Data Loading & Name Resolution ──
+    async reload() {
+        await this.loadPredictions();
+    }
+    async loadPredictions() {
+        if (!this.modelId && !this.runId) {
+            this.allRows = [];
+            this.applyFilter();
+            return;
+        }
+        this.isLoading = true;
+        this.loadError = null;
+        this.cdr.markForCheck();
+        try {
+            const provider = this.ProviderToUse;
+            const user = provider.CurrentUser ?? undefined;
+            // 1. Resolve effective run ID and model entity
+            let effectiveRunId = this.runId;
+            let model = null;
+            if (this.modelId) {
+                const modelsRes = await RunView.FromMetadataProvider(provider).RunView({
+                    EntityName: 'MJ: ML Models',
+                    ExtraFilter: `ID = '${this.modelId.replace(/'/g, "''")}'`,
+                    MaxRows: 1,
+                    ResultType: 'entity_object',
+                }, user);
+                model = modelsRes.Success && modelsRes.Results ? modelsRes.Results[0] : null;
+            }
+            if (!effectiveRunId && this.modelId) {
+                // Query latest process run for this model using engine
+                try {
+                    const engine = PredictiveStudioEngine.Instance;
+                    const runs = await engine.LoadRecentRunsForModel(this.modelId, provider, user, { maxRows: 1 });
+                    if (runs && runs.length > 0) {
+                        effectiveRunId = runs[0].ID;
+                    }
+                }
+                catch {
+                    // Fallback if engine is not yet primed
+                }
+            }
+            if (!effectiveRunId) {
+                this.allRows = [];
+                this.applyFilter();
+                this.isLoading = false;
+                this.cdr.markForCheck();
+                return;
+            }
+            // 2. Resolve target entity
+            await this.resolveTargetEntity(model);
+            // 3. Load full process run details (removing 50/200 cap)
+            const detailsRes = await RunView.FromMetadataProvider(provider).RunView({
+                EntityName: 'MJ: Process Run Details',
+                ExtraFilter: `ProcessRunID = '${effectiveRunId.replace(/'/g, "''")}'`,
+                OrderBy: '__mj_CreatedAt ASC',
+                MaxRows: 10000,
+                ResultType: 'entity_object',
+            }, user);
+            if (!detailsRes.Success || !detailsRes.Results) {
+                this.allRows = [];
+                this.applyFilter();
+                this.isLoading = false;
+                this.cdr.markForCheck();
+                return;
+            }
+            // 4. Resolve OutcomeConfig and determine polarity
+            if (model?.ProblemType) {
+                this.problemType = model.ProblemType.toLowerCase();
+            }
+            this.outcomeConfig = resolveOutcomeConfig(model ?? undefined);
+            this.isRenewalModel = this.outcomeConfig.Polarity === 'positive' && !this.isRegression;
+            this.setupColumnDefs();
+            const polarity = resolveRenewalPolarity(detailsRes.Results.map((d) => d.ResultPayload), model?.TargetVariable);
+            // When the model outputs P(Renewed) (scoreIsLapseRisk = false), adverse risk is inverted (1 - score).
+            // When the model outputs P(Lapse) (scoreIsLapseRisk = true), adverse risk is ALREADY score (invertedRisk = false).
+            const shouldInvertRisk = polarity.isRenewalModel ? !polarity.scoreIsLapseRisk : false;
+            const parsedAtRisk = parseAtRiskRows(detailsRes.Results.map((d) => ({ recordId: d.RecordID, ResultPayload: d.ResultPayload })), { invertedRisk: shouldInvertRisk, outcomeConfig: this.outcomeConfig });
+            // Map details into indexed lookup for scoredAt timestamp
+            const detailByRecord = new Map();
+            for (const d of detailsRes.Results) {
+                detailByRecord.set(NormalizeUUID(d.RecordID), d);
+            }
+            this.allRows = parsedAtRisk.map((r) => {
+                const detail = detailByRecord.get(NormalizeUUID(r.recordId));
+                const dt = detail?.CompletedAt ?? detail?.__mj_CreatedAt ?? null;
+                // For renewal models, the primary displayed score is Renewal Probability (0–1).
+                // If the raw score was lapse risk, renewal probability is 1 - r.score.
+                // Otherwise, raw score is already renewal probability.
+                const displayScore = polarity.isRenewalModel
+                    ? (polarity.scoreIsLapseRisk ? Math.max(0, Math.min(1, 1 - r.score)) : r.score)
+                    : r.score;
+                const resolved = this.outcomeConfig
+                    ? resolveScoreBand(displayScore, this.outcomeConfig)
+                    : null;
+                const formatted = formatPredictionScore(displayScore, this.outcomeConfig, this.problemType);
+                return {
+                    recordId: r.recordId,
+                    recordName: r.label ?? r.recordId,
+                    score: displayScore,
+                    scoreFormatted: formatted,
+                    riskPct: r.riskPct,
+                    band: resolved?.Key ?? r.band,
+                    badgeColor: resolved?.BadgeColor ?? r.badgeColor,
+                    icon: resolved?.Icon ?? r.icon,
+                    class: r.class,
+                    drivers: r.drivers ?? [],
+                    status: resolved?.Label ?? r.status ?? detail?.Status ?? 'Succeeded',
+                    scoredAtDate: dt instanceof Date ? dt : dt ? new Date(dt) : null,
+                };
+            });
+            this.computeVisibleBands();
+            this.applyFilter();
+            // 5. Schedule lazy lookup of record names for visible rows
+            this.scheduleVisibleRowsLookup(0);
+        }
+        catch (err) {
+            this.loadError = err instanceof Error ? err.message : String(err);
+            LogError(`PSPredictionsGridComponent.loadPredictions: ${this.loadError}`);
+        }
+        finally {
+            this.isLoading = false;
+            this.cdr.markForCheck();
+        }
+    }
+    async resolveTargetEntity(model) {
+        const provider = this.ProviderToUse;
+        if (this.entityName) {
+            const e = provider.EntityByName(this.entityName);
+            if (e) {
+                this.resolvedEntityId = e.ID;
+                this.resolvedEntityName = e.Name;
+                return;
+            }
+        }
+        if (model?.PipelineID) {
+            const pRes = await RunView.FromMetadataProvider(provider).RunView({
+                EntityName: 'MJ: ML Training Pipelines',
+                ExtraFilter: `ID = '${model.PipelineID.replace(/'/g, "''")}'`,
+                MaxRows: 1,
+                ResultType: 'simple',
+                Fields: ['TargetEntityID'],
+            }, provider.CurrentUser ?? undefined);
+            if (pRes.Success && pRes.Results && pRes.Results.length > 0) {
+                const tId = pRes.Results[0]['TargetEntityID'];
+                if (typeof tId === 'string' && tId) {
+                    const e = provider.Entities.find((ent) => UUIDsEqual(ent.ID, tId));
+                    if (e) {
+                        this.resolvedEntityId = e.ID;
+                        this.resolvedEntityName = e.Name;
+                        return;
+                    }
+                }
+            }
+        }
+    }
+    /**
+     * Returns row nodes currently rendered in the AG Grid viewport.
+     * Virtualized grids only render rows visible on screen (plus a small buffer).
+     */
+    getVisibleRowNodes() {
+        const apis = [this.gridApi, this.chartGridApi].filter((api) => Boolean(api));
+        if (apis.length === 0)
+            return [];
+        const nodes = [];
+        for (const api of apis) {
+            const rendered = api.getRenderedNodes();
+            if (rendered && rendered.length > 0) {
+                nodes.push(...rendered);
+                continue;
+            }
+            const firstIdx = api.getFirstDisplayedRowIndex();
+            const lastIdx = api.getLastDisplayedRowIndex();
+            if (firstIdx < 0 || lastIdx < 0)
+                continue;
+            for (let i = firstIdx; i <= lastIdx; i++) {
+                const node = api.getDisplayedRowAtIndex(i);
+                if (node) {
+                    nodes.push(node);
+                }
+            }
+        }
+        return nodes;
+    }
+    /**
+     * Schedule lazy lookup of record names for rows currently visible in the AG Grid viewport.
+     * Debounced so rapid scrolling does not trigger redundant batches.
+     */
+    scheduleVisibleRowsLookup(delayMs = 60) {
+        if (this.visibleLookupDebounceTimer) {
+            clearTimeout(this.visibleLookupDebounceTimer);
+        }
+        this.visibleLookupDebounceTimer = setTimeout(() => {
+            void this.resolveVisibleRecordNames();
+        }, delayMs);
+    }
+    /**
+     * Resolve display names (e.g. member name, company name) ONLY for visible rows in the viewport
+     * using ProviderToUse.GetEntityRecordNames.
+     */
+    async resolveVisibleRecordNames() {
+        if ((!this.gridApi && !this.chartGridApi) || !this.resolvedEntityName) {
+            return;
+        }
+        const provider = this.ProviderToUse;
+        const entity = provider.EntityByName(this.resolvedEntityName);
+        if (!entity) {
+            return;
+        }
+        const visibleNodes = this.getVisibleRowNodes();
+        if (visibleNodes.length === 0) {
+            return;
+        }
+        const needed = [];
+        const cachedToUpdate = [];
+        for (const node of visibleNodes) {
+            const data = node.data;
+            if (!data || !data.recordId)
+                continue;
+            const normId = NormalizeUUID(data.recordId);
+            if (this.recordNameCache.has(normId)) {
+                const cachedName = this.recordNameCache.get(normId);
+                if (cachedName && data.recordName !== cachedName) {
+                    data.recordName = cachedName;
+                    cachedToUpdate.push(node);
+                }
+                continue;
+            }
+            if (this.inFlightLookups.has(normId)) {
+                continue;
+            }
+            needed.push({ normId, recordId: data.recordId, node });
+        }
+        if (cachedToUpdate.length > 0) {
+            if (this.gridApi) {
+                this.gridApi.refreshCells({ rowNodes: cachedToUpdate, columns: ['recordName'], force: true });
+            }
+            if (this.chartGridApi) {
+                this.chartGridApi.refreshCells({ rowNodes: cachedToUpdate, columns: ['recordName'], force: true });
+            }
+        }
+        if (needed.length === 0) {
+            return;
+        }
+        // Mark as in-flight
+        for (const item of needed) {
+            this.inFlightLookups.add(item.normId);
+        }
+        try {
+            const inputs = needed.map((item) => ({
+                EntityName: entity.Name,
+                CompositeKey: CompositeKey.FromURLSegment(entity, item.recordId),
+            }));
+            const results = await provider.GetEntityRecordNames(inputs, provider.CurrentUser ?? undefined);
+            const nodesToRefresh = [];
+            for (let i = 0; i < results.length; i++) {
+                const res = results[i];
+                const item = needed[i];
+                if (!item)
+                    continue;
+                if (res && res.Success && res.RecordName) {
+                    this.recordNameCache.set(item.normId, res.RecordName);
+                    if (item.node.data) {
+                        item.node.data.recordName = res.RecordName;
+                        nodesToRefresh.push(item.node);
+                    }
+                }
+                else {
+                    // Fallback: cache the recordId to avoid repeatedly re-querying failed records
+                    this.recordNameCache.set(item.normId, item.recordId);
+                }
+            }
+            // Keep allRows in sync so client-side filter and view toggle retain resolved names
+            for (const row of this.allRows) {
+                const cached = this.recordNameCache.get(NormalizeUUID(row.recordId));
+                if (cached && row.recordName !== cached) {
+                    row.recordName = cached;
+                }
+            }
+            if (nodesToRefresh.length > 0) {
+                if (this.gridApi) {
+                    this.gridApi.refreshCells({ rowNodes: nodesToRefresh, columns: ['recordName'], force: true });
+                }
+                if (this.chartGridApi) {
+                    this.chartGridApi.refreshCells({ rowNodes: nodesToRefresh, columns: ['recordName'], force: true });
+                }
+            }
+            this.cdr.markForCheck();
+        }
+        catch (err) {
+            LogError(`PSPredictionsGridComponent.resolveVisibleRecordNames failed: ${err instanceof Error ? err.message : String(err)}`);
+        }
+        finally {
+            for (const item of needed) {
+                this.inFlightLookups.delete(item.normId);
+            }
+        }
+    }
+    // ── Grid & Toolbar Event Handlers ──
+    onGridReady(event) {
+        this.gridApi = event.api;
+        this.scheduleVisibleRowsLookup(50);
+    }
+    onChartGridReady(event) {
+        this.chartGridApi = event.api;
+        this.scheduleVisibleRowsLookup(50);
+    }
+    onCellClicked(event) {
+        const target = event.event?.target;
+        if (target && target.closest('[data-action="open-record"]')) {
+            if (event.data) {
+                this.drillThrough(event.data);
+            }
+        }
+    }
+    onRowClicked(event) {
+        const target = event.event?.target;
+        if (target && target.closest('[data-action="open-record"]')) {
+            return; // Handled by cell link click; do not open detail drawer
+        }
+        if (event.data) {
+            this.openDetail(event.data);
+        }
+    }
+    onSearchInput(event) {
+        const target = event.target;
+        this.searchText = target.value ?? '';
+        this.applyFilter();
+    }
+    setTier(tier) {
+        this.selectedTier = tier;
+        this.applyFilter();
+    }
+    setTierAndGrid(tier) {
+        this.selectedTier = tier;
+        this.activeView = 'grid';
+        this.applyFilter();
+    }
+    getOutcomeBadgeClass(className) {
+        return resolveOutcomeStyle(className, this.outcomeConfig).BadgeColor;
+    }
+    getBadgeColorVar(color) {
+        switch (color) {
+            case 'green':
+                return 'var(--mj-status-success)';
+            case 'red':
+                return 'var(--mj-status-error)';
+            case 'amber':
+                return 'var(--mj-status-warning)';
+            case 'blue':
+                return 'var(--mj-brand-primary)';
+            default:
+                return 'var(--mj-text-muted)';
+        }
+    }
+    computeVisibleBands() {
+        const total = this.allRows.length;
+        const bands = this.outcomeConfig.Bands ?? [];
+        this.visibleBands = bands.map((b) => {
+            const matching = this.allRows.filter((r) => r.band === b.Key);
+            const count = matching.length;
+            const pct = total > 0 ? Math.round((count / total) * 100) : 0;
+            const rawAvg = count > 0 ? matching.reduce((sum, r) => sum + r.score, 0) / count : 0;
+            const avgScore = Math.round(rawAvg * 100);
+            const avgScoreFormatted = formatPredictionScore(rawAvg, this.outcomeConfig, this.problemType);
+            return {
+                key: b.Key,
+                label: b.Label,
+                count,
+                pct,
+                avgScore,
+                avgScoreFormatted,
+                badgeColor: b.BadgeColor,
+                icon: b.Icon,
+                description: b.Description,
+            };
+        });
+        const knownKeys = new Set(bands.map((b) => b.Key));
+        const extraKeys = new Set(this.allRows.map((r) => r.band).filter((k) => !knownKeys.has(k)));
+        for (const k of extraKeys) {
+            const matching = this.allRows.filter((r) => r.band === k);
+            const count = matching.length;
+            const pct = total > 0 ? Math.round((count / total) * 100) : 0;
+            const rawAvg = count > 0 ? matching.reduce((sum, r) => sum + r.score, 0) / count : 0;
+            const avgScore = Math.round(rawAvg * 100);
+            const avgScoreFormatted = formatPredictionScore(rawAvg, this.outcomeConfig, this.problemType);
+            this.visibleBands.push({
+                key: k,
+                label: k.charAt(0).toUpperCase() + k.slice(1),
+                count,
+                pct,
+                avgScore,
+                avgScoreFormatted,
+                badgeColor: 'gray',
+            });
+        }
+    }
+    onViewToggle(key) {
+        this.activeView = key === 'chart' ? 'chart' : 'grid';
+        this.cdr.markForCheck();
+    }
+    clearSearch() {
+        this.searchText = '';
+        this.applyFilter();
+    }
+    selectDecile(idx) {
+        if (this.selectedDecileIndex === idx) {
+            this.selectedDecileIndex = null;
+        }
+        else {
+            this.selectedDecileIndex = idx;
+        }
+        this.applyFilter();
+        if (this.selectedDecileIndex !== null) {
+            setTimeout(() => {
+                const el = document.getElementById('pg-drilldown-anchor');
+                if (el) {
+                    el.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
+                }
+            }, 50);
+        }
+    }
+    clearDecileFilter() {
+        this.selectedDecileIndex = null;
+        this.applyFilter();
+    }
+    get selectedDecileLabel() {
+        if (this.selectedDecileIndex === null)
+            return '';
+        return `${this.selectedDecileIndex * 10}%–${(this.selectedDecileIndex + 1) * 10}%`;
+    }
+    applyFilter() {
+        let rows = this.allRows;
+        if (this.selectedTier !== 'all') {
+            rows = rows.filter((r) => r.band === this.selectedTier);
+        }
+        if (this.selectedDecileIndex !== null) {
+            const minScore = this.selectedDecileIndex * 0.10;
+            const maxScore = this.selectedDecileIndex === 9 ? 1.01 : (this.selectedDecileIndex + 1) * 0.10;
+            rows = rows.filter((r) => r.score >= minScore && r.score < maxScore);
+        }
+        if (this.searchText.trim()) {
+            const q = this.searchText.trim().toLowerCase();
+            rows = rows.filter((r) => r.recordName.toLowerCase().includes(q) ||
+                r.recordId.toLowerCase().includes(q) ||
+                (r.class && r.class.toLowerCase().includes(q)) ||
+                r.drivers.some((d) => d.label.toLowerCase().includes(q)));
+        }
+        this.filteredRows = rows;
+        this.cdr.markForCheck();
+        this.scheduleVisibleRowsLookup(30);
+    }
+    // ── Drill-Through Navigation ──
+    drillThrough(row) {
+        const entName = this.resolvedEntityName || this.entityName;
+        if (!entName)
+            return;
+        try {
+            const entity = this.ProviderToUse.EntityByName(entName);
+            const ck = CompositeKey.FromURLSegment(entity, row.recordId);
+            this.navigationService.OpenEntityRecord(entName, ck);
+        }
+        catch (err) {
+            LogError(`PSPredictionsGridComponent.drillThrough failed: ${err instanceof Error ? err.message : String(err)}`);
+        }
+    }
+    // ── Slide-In Detail & Score History ──
+    onDrawerWidthChanged(width) {
+        this.drawerWidthPx = width;
+        UserInfoEngine.Instance.SetSettingDebounced('mj.predictiveStudio.predictions.drawerWidth', width.toString());
+    }
+    openDetail(row) {
+        this.selectedRow = row;
+        this.detailOpen = true;
+        this.historyPoints = [];
+        this.historyLoading = true;
+        this.subjectEntityName = null;
+        this.subjectRecordId = null;
+        this.subjectRecordName = null;
+        this.cdr.markForCheck();
+        void this.loadScoreHistory(row.recordId);
+        const entName = this.resolvedEntityName || this.entityName;
+        if (entName) {
+            void this.resolveSubjectRecord(entName, row.recordId);
+        }
+    }
+    closeDetail() {
+        this.detailOpen = false;
+        this.selectedRow = null;
+        this.historyPoints = [];
+        this.subjectEntityName = null;
+        this.subjectRecordId = null;
+        this.subjectRecordName = null;
+        this.cdr.markForCheck();
+    }
+    openSubjectRecord() {
+        if (!this.subjectEntityName || !this.subjectRecordId)
+            return;
+        try {
+            const entity = this.ProviderToUse.EntityByName(this.subjectEntityName);
+            if (!entity)
+                return;
+            const ck = CompositeKey.FromURLSegment(entity, this.subjectRecordId);
+            this.navigationService.OpenEntityRecord(this.subjectEntityName, ck);
+        }
+        catch (err) {
+            LogError(`PSPredictionsGridComponent.openSubjectRecord failed: ${err instanceof Error ? err.message : String(err)}`);
+        }
+    }
+    async resolveSubjectRecord(targetEntityName, recordId) {
+        try {
+            const provider = this.ProviderToUse;
+            const entity = provider.EntityByName(targetEntityName);
+            if (!entity)
+                return;
+            const candidates = [
+                { field: 'PersonID', entity: 'MJ_BizApps_Common: People' },
+                { field: 'MemberID', entity: 'MoreCheese: Member Profiles' },
+                { field: 'ContactID', entity: 'MJ_BizApps_Common: Contacts' },
+                { field: 'AccountID', entity: 'MJ_BizApps_Common: Accounts' },
+                { field: 'CustomerID', entity: 'MJ_BizApps_Common: Customers' },
+            ];
+            let matchedField = null;
+            let targetRelatedEntityName = null;
+            for (const c of candidates) {
+                const f = entity.Fields.find((fld) => fld.Name.toLowerCase() === c.field.toLowerCase());
+                if (f) {
+                    matchedField = f.Name;
+                    targetRelatedEntityName = f.RelatedEntity || c.entity;
+                    break;
+                }
+            }
+            if (!matchedField || !targetRelatedEntityName) {
+                const personField = entity.Fields.find((fld) => fld.RelatedEntity && fld.RelatedEntity.toLowerCase().includes('people'));
+                if (personField) {
+                    matchedField = personField.Name;
+                    targetRelatedEntityName = personField.RelatedEntity;
+                }
+            }
+            if (!matchedField || !targetRelatedEntityName)
+                return;
+            const recRes = await RunView.FromMetadataProvider(provider).RunView({
+                EntityName: entity.Name,
+                ExtraFilter: `${entity.FirstPrimaryKey.Name} = '${recordId.replace(/'/g, "''")}'`, // first-pk-ok: Single-key entity lookup by recordId
+                MaxRows: 1,
+                ResultType: 'simple',
+                Fields: [matchedField],
+            }, provider.CurrentUser ?? undefined);
+            if (recRes.Success && recRes.Results && recRes.Results.length > 0) {
+                const subjectId = recRes.Results[0][matchedField];
+                if (typeof subjectId === 'string' && subjectId) {
+                    this.subjectEntityName = targetRelatedEntityName;
+                    this.subjectRecordId = subjectId;
+                    const relatedEntity = provider.EntityByName(targetRelatedEntityName);
+                    if (relatedEntity) {
+                        const names = await provider.GetEntityRecordNames([
+                            {
+                                EntityName: targetRelatedEntityName,
+                                CompositeKey: CompositeKey.FromURLSegment(relatedEntity, subjectId),
+                            },
+                        ], provider.CurrentUser ?? undefined);
+                        if (names && names.length > 0 && names[0].Success) {
+                            this.subjectRecordName = names[0].RecordName ?? null;
+                        }
+                    }
+                    this.cdr.markForCheck();
+                }
+            }
+        }
+        catch (err) {
+            LogError(`PSPredictionsGridComponent.resolveSubjectRecord failed: ${err instanceof Error ? err.message : String(err)}`);
+        }
+    }
+    async loadScoreHistory(recordId) {
+        this.historyLoading = true;
+        try {
+            this.historyPoints = await this.scoreHistoryService.LoadRecordScoreHistory({
+                provider: this.ProviderToUse,
+                user: this.ProviderToUse.CurrentUser ?? undefined,
+                entityId: this.resolvedEntityId,
+                recordId,
+                modelId: this.modelId,
+                outcomeConfig: this.outcomeConfig,
+                problemType: this.problemType,
+            });
+        }
+        finally {
+            this.historyLoading = false;
+            this.cdr.markForCheck();
+        }
+    }
+    get entityDisplayName() {
+        return this.resolvedEntityName || this.entityName || 'Entity Record';
+    }
+    // ── KPI & Chart Computations ──
+    get highCount() {
+        return this.allRows.filter((r) => r.band === 'high').length;
+    }
+    get mediumCount() {
+        return this.allRows.filter((r) => r.band === 'medium').length;
+    }
+    get lowCount() {
+        return this.allRows.filter((r) => r.band === 'low').length;
+    }
+    get highPct() {
+        return this.allRows.length > 0 ? Math.round((this.highCount / this.allRows.length) * 100) : 0;
+    }
+    get mediumPct() {
+        return this.allRows.length > 0 ? Math.round((this.mediumCount / this.allRows.length) * 100) : 0;
+    }
+    get lowPct() {
+        return this.allRows.length > 0 ? Math.round((this.lowCount / this.allRows.length) * 100) : 0;
+    }
+    get highAvg() {
+        return this.highAvgRisk;
+    }
+    get mediumAvg() {
+        return this.mediumAvgRisk;
+    }
+    get lowAvg() {
+        return this.lowAvgRisk;
+    }
+    get highAvgRisk() {
+        const list = this.allRows.filter((r) => r.band === 'high');
+        return list.length > 0 ? Math.round(list.reduce((acc, r) => acc + r.riskPct, 0) / list.length) : 0;
+    }
+    get mediumAvgRisk() {
+        const list = this.allRows.filter((r) => r.band === 'medium');
+        return list.length > 0 ? Math.round(list.reduce((acc, r) => acc + r.riskPct, 0) / list.length) : 0;
+    }
+    get lowAvgRisk() {
+        const list = this.allRows.filter((r) => r.band === 'low');
+        return list.length > 0 ? Math.round(list.reduce((acc, r) => acc + r.riskPct, 0) / list.length) : 0;
+    }
+    get meanScorePct() {
+        if (this.allRows.length === 0)
+            return 0;
+        const total = this.allRows.reduce((acc, r) => acc + r.score, 0);
+        return Math.round((total / this.allRows.length) * 100);
+    }
+    get meanScoreFormatted() {
+        if (this.allRows.length === 0)
+            return '—';
+        const total = this.allRows.reduce((acc, r) => acc + r.score, 0);
+        const avg = total / this.allRows.length;
+        return formatPredictionScore(avg, this.outcomeConfig, this.problemType);
+    }
+    get histogramBins() {
+        const total = this.allRows.length;
+        if (total === 0)
+            return [];
+        const isReg = this.isRegression;
+        let minScore = 0;
+        let maxScore = 1;
+        if (isReg) {
+            const scores = this.allRows.map((r) => r.score);
+            minScore = Math.min(...scores);
+            maxScore = Math.max(...scores);
+            if (maxScore <= minScore) {
+                maxScore = minScore + 1;
+            }
+        }
+        const range = maxScore - minScore;
+        const step = range / 10;
+        const counts = new Array(10).fill(0);
+        for (const r of this.allRows) {
+            const normalized = isReg ? (r.score - minScore) / range : r.score;
+            const idx = Math.min(9, Math.max(0, Math.floor(normalized * 10)));
+            counts[idx]++;
+        }
+        const maxCount = Math.max(...counts, 1);
+        return counts.map((count, idx) => {
+            const binMin = minScore + idx * step;
+            const binMax = minScore + (idx + 1) * step;
+            const pct = (count / total) * 100;
+            const pctFormatted = pct < 0.1 && count > 0 ? '<0.1%' : pct.toFixed(1) + '%';
+            // Power scale height so smaller decile bins (e.g. 2, 21, 35) are visible alongside 5,390
+            const height = count === 0 ? 0 : Math.round(14 + Math.pow(count / maxCount, 0.45) * 116);
+            const centerScore = (binMin + binMax) / 2;
+            const band = resolveScoreBand(centerScore, this.outcomeConfig);
+            const color = band ? this.getBadgeColorVar(band.BadgeColor) : 'var(--mj-brand-primary)';
+            let label;
+            let shortLabel;
+            if (isReg) {
+                const fmtMin = formatPredictionScore(binMin, this.outcomeConfig, this.problemType);
+                const fmtMax = formatPredictionScore(binMax, this.outcomeConfig, this.problemType);
+                label = `${fmtMin}–${fmtMax}`;
+                shortLabel = fmtMin;
+            }
+            else {
+                const lower = idx * 10;
+                const upper = (idx + 1) * 10;
+                label = `${lower}%–${upper}%`;
+                shortLabel = `${lower}%`;
+            }
+            const riskLabel = band ? band.Label : label;
+            return {
+                idx,
+                label,
+                shortLabel,
+                count,
+                pct: Math.round(pct),
+                pctFormatted,
+                height,
+                color,
+                riskLabel,
+            };
+        });
+    }
+    get classBreakdown() {
+        const total = this.allRows.length;
+        if (total === 0)
+            return [];
+        const counts = new Map();
+        for (const r of this.allRows) {
+            if (r.class) {
+                counts.set(r.class, (counts.get(r.class) ?? 0) + 1);
+            }
+        }
+        const palette = [
+            'var(--mj-brand-primary)',
+            'var(--mj-status-error)',
+            'var(--mj-status-warning)',
+            'var(--mj-status-success)',
+            '#7b3ff0',
+            '#d98213',
+        ];
+        return [...counts.entries()]
+            .sort((a, b) => b[1] - a[1])
+            .map(([name, count], i) => ({
+            name,
+            count,
+            pct: Math.round((count / total) * 100),
+            color: palette[i % palette.length],
+        }));
+    }
+    // ── Trendline SVG Plotting ──
+    get trendlinePlotPoints() {
+        const pts = this.historyPoints;
+        if (pts.length === 0)
+            return [];
+        const isReg = this.isRegression;
+        let minScore = 0;
+        let maxScore = 1;
+        if (isReg) {
+            const scores = pts.map((p) => p.score);
+            minScore = Math.min(...scores);
+            maxScore = Math.max(...scores);
+            if (maxScore <= minScore) {
+                maxScore = minScore + 1;
+            }
+        }
+        const range = maxScore - minScore;
+        const xStart = 60;
+        const xEnd = 500;
+        const yTop = 20;
+        const yBottom = 130;
+        const ySpan = yBottom - yTop;
+        const step = pts.length > 1 ? (xEnd - xStart) / (pts.length - 1) : 0;
+        return pts.map((pt, i) => {
+            const x = pts.length === 1 ? (xStart + xEnd) / 2 : Math.round(xStart + i * step);
+            const clampedScore = isReg
+                ? Math.max(0, Math.min(1, (pt.score - minScore) / range))
+                : Math.max(0, Math.min(1, pt.score));
+            const y = Math.round(yBottom - clampedScore * ySpan);
+            const band = resolveScoreBand(pt.score, this.outcomeConfig);
+            const color = band ? this.getBadgeColorVar(band.BadgeColor) : 'var(--mj-brand-primary)';
+            return {
+                runId: pt.runId,
+                x,
+                y,
+                scoreFormatted: pt.scoreFormatted,
+                dateStr: pt.runDate.toLocaleDateString(),
+                class: pt.class,
+                color,
+            };
+        });
+    }
+    get trendlineLinePoints() {
+        return this.trendlinePlotPoints.map((p) => `${p.x},${p.y}`).join(' ');
+    }
+    get trendlineAreaPoints() {
+        const plot = this.trendlinePlotPoints;
+        if (plot.length === 0)
+            return '';
+        const first = plot[0];
+        const last = plot[plot.length - 1];
+        return `${first.x},130 ` + plot.map((p) => `${p.x},${p.y}`).join(' ') + ` ${last.x},130`;
+    }
+    // ── CSV Export ──
+    exportCSV() {
+        if (this.allRows.length === 0)
+            return;
+        const scoreHeader = this.outcomeConfig.ScoreLabel || 'Prediction Score';
+        const statusHeader = this.outcomeConfig.StatusLabel || 'Risk Level';
+        const headers = ['Record ID', 'Record Name', scoreHeader, statusHeader, 'Predicted Class', 'Top Drivers', 'Scored At'];
+        const lines = [headers.join(',')];
+        for (const r of this.filteredRows) {
+            const driversStr = r.drivers.map((d) => `${d.up ? '+' : '-'}${d.label}`).join('; ');
+            const statusStr = `${r.status || r.band} (${r.scoreFormatted})`;
+            const rowData = [
+                `"${r.recordId.replace(/"/g, '""')}"`,
+                `"${(r.recordName || r.recordId).replace(/"/g, '""')}"`,
+                r.scoreFormatted,
+                statusStr,
+                `"${(r.class || '').replace(/"/g, '""')}"`,
+                `"${driversStr.replace(/"/g, '""')}"`,
+                `"${r.scoredAtDate ? r.scoredAtDate.toISOString() : ''}"`,
+            ];
+            lines.push(rowData.join(','));
+        }
+        const blob = new Blob([lines.join('\n')], { type: 'text/csv;charset=utf-8;' });
+        const url = URL.createObjectURL(blob);
+        const a = document.createElement('a');
+        a.href = url;
+        a.download = `predictions_${this.resolvedEntityName || 'records'}_${new Date().toISOString().slice(0, 10)}.csv`;
+        a.click();
+        URL.revokeObjectURL(url);
+    }
+    escapeHtml(str) {
+        return str
+            .replace(/&/g, '&amp;')
+            .replace(/</g, '&lt;')
+            .replace(/>/g, '&gt;')
+            .replace(/"/g, '&quot;')
+            .replace(/'/g, '&#039;');
+    }
+    static ɵfac = /*@__PURE__*/ (() => { let ɵPSPredictionsGridComponent_BaseFactory; return function PSPredictionsGridComponent_Factory(__ngFactoryType__) { return (ɵPSPredictionsGridComponent_BaseFactory || (ɵPSPredictionsGridComponent_BaseFactory = i0.ɵɵgetInheritedFactory(PSPredictionsGridComponent)))(__ngFactoryType__ || PSPredictionsGridComponent); }; })();
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PSPredictionsGridComponent, selectors: [["ps-predictions-grid"]], inputs: { modelId: "modelId", runId: "runId", entityName: "entityName", problemType: "problemType", title: "title", height: "height", readOnly: "readOnly" }, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 27, vars: 15, consts: [[1, "ps-pred-grid-host"], [1, "pg-toolbar"], [1, "pg-toolbar-left"], [1, "pg-search-box"], [1, "fa-solid", "fa-magnifying-glass"], ["type", "text", "placeholder", "Filter records, outcome, factors...", 1, "pg-search-input", 3, "input", "value"], ["type", "button", "title", "Clear filter", 1, "pg-search-clear"], [1, "pg-tier-filters"], ["type", "button", 1, "pg-tier-btn", 3, "click"], [1, "pg-count-pill"], ["type", "button", 1, "pg-tier-btn", 3, "active"], [1, "pg-decile-pill"], [1, "pg-toolbar-right"], [3, "KeyChange", "Options", "ActiveKey"], ["mjButton", "", "variant", "secondary", "size", "sm", 3, "click", "disabled"], [1, "fa-solid", "fa-file-export"], [1, "pg-view-container"], ["text", "Loading predictions...", "size", "medium"], ["role", "alert", 1, "ps-load-error"], [1, "ps-empty", 2, "padding", "32px"], ["Mode", "slide", "Title", "Record Prediction & Score History", 3, "Resizable", "WidthPx"], ["type", "button", "title", "Clear filter", 1, "pg-search-clear", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "fa-solid", "fa-filter"], ["type", "button", "title", "Clear decile filter", 3, "click"], [1, "fa-solid", "fa-triangle-exclamation"], [1, "ps-load-error-text"], [1, "ps-load-error-detail"], ["mjButton", "", "variant", "secondary", "size", "sm", 3, "click"], [1, "fa-solid", "fa-rotate-right"], [1, "ps-empty-ico"], [1, "fa-solid", "fa-chart-line"], [1, "pg-chart-container"], [1, "pg-grid", 3, "gridReady", "rowClicked", "cellClicked", "theme", "columnDefs", "defaultColDef", "gridOptions", "rowData"], [1, "pg-footer"], [1, "ps-muted"], [1, "pg-chart-cards"], [1, "pg-chart-card", "total"], [1, "pg-chart-card-lbl"], [1, "fa-solid", "fa-users", "ps-muted"], [1, "pg-chart-card-val"], [1, "pg-chart-card-sub"], [1, "pg-chart-card", 3, "class"], [1, "pg-chart-section"], [1, "pg-chart-section-title"], [2, "display", "flex", "align-items", "center", "gap", "8px"], [1, "fa-solid", "fa-chart-simple", "ps-muted"], [1, "pg-chart-meta"], [1, "ps-small", "ps-muted"], ["type", "button", 1, "pg-clear-decile-btn"], [1, "pg-histogram"], [1, "pg-h-columns"], [1, "pg-h-col", 3, "active", "empty"], ["id", "pg-drilldown-anchor", 1, "pg-chart-section", "pg-chart-drilldown-section"], [1, "pg-chart-card", 3, "click"], [3, "class", "color"], ["type", "button", 1, "pg-clear-decile-btn", 3, "click"], [1, "pg-h-col", 3, "click"], [1, "pg-h-count", 3, "title"], [1, "pg-h-bar-track"], [1, "pg-h-bar"], [1, "pg-h-footer"], [1, "pg-h-range"], [1, "pg-h-pct"], [1, "pg-h-tooltip"], [1, "pg-h-tt-head"], [1, "pg-h-tt-row"], [1, "pg-h-tt-val"], [1, "pg-h-tt-pct"], [1, "pg-h-tt-badge"], [1, "pg-h-tt-hint"], [1, "fa-solid", "fa-layer-group", "ps-muted"], [2, "display", "flex", "height", "24px", "border-radius", "var(--mj-radius-full)", "overflow", "hidden", "background", "var(--mj-bg-surface-sunken)", "margin-bottom", "8px"], [3, "width", "background", "title"], [2, "display", "flex", "gap", "16px", "flex-wrap", "wrap"], [2, "display", "flex", "align-items", "center", "gap", "6px", "font-size", "var(--mj-text-xs)"], [3, "title"], [2, "width", "10px", "height", "10px", "border-radius", "2px", "display", "inline-block"], [1, "fa-solid", "fa-table-list", "ps-muted"], [2, "color", "var(--mj-brand-primary)"], [1, "ps-badge", 2, "margin-left", "6px", 3, "color"], [1, "pg-chart-grid-host"], [1, "pg-grid", "pg-chart-ag-grid", 3, "gridReady", "rowClicked", "cellClicked", "theme", "columnDefs", "defaultColDef", "gridOptions", "rowData"], [1, "pg-drilldown-footer"], [1, "ps-badge", 2, "margin-left", "6px"], ["Mode", "slide", "Title", "Record Prediction & Score History", 3, "WidthChanged", "Closed", "Resizable", "WidthPx"], [1, "pg-detail-body"], [1, "pg-detail-record-head"], [1, "pg-detail-record-info"], [1, "ps-badge", "blue"], [1, "ps-mono", "ps-small", "ps-muted"], [1, "pg-detail-record-actions", 2, "display", "flex", "gap", "8px", "align-items", "center", "flex-wrap", "wrap"], ["mjButton", "", "variant", "primary", "size", "sm", "title", "Open record in Explorer", 3, "click"], [1, "fa-solid", "fa-arrow-up-right-from-square"], ["mjButton", "", "variant", "secondary", "size", "sm", "title", "Open subject record (e.g. Person, Account) in Explorer"], [1, "pg-detail-pred-card"], [1, "pg-detail-score-circle"], [1, "pg-detail-meta"], [1, "pg-detail-meta-line"], [3, "class"], [2, "font-weight", "700", "color", "var(--mj-text-primary)"], [1, "pg-detail-meta-sub"], [1, "pg-detail-drivers-wrap"], [1, "ps-section-title"], [1, "fa-solid", "fa-lightbulb", 2, "color", "var(--mj-status-warning)"], [1, "pg-detail-drivers-list"], [1, "pg-trendline-wrap"], [1, "ps-section-title", 2, "display", "flex", "align-items", "center", "justify-content", "space-between"], [1, "fa-solid", "fa-clock-rotate-left", "ps-muted"], ["text", "Loading score history...", "size", "small"], ["mjButton", "", "variant", "secondary", "size", "sm", "title", "Open subject record (e.g. Person, Account) in Explorer", 3, "click"], [1, "fa-solid", "fa-user"], [1, "ps-badge"], [1, "pg-detail-driver-item"], [1, "pg-detail-driver-label"], [1, "fa-solid"], ["viewBox", "0 0 540 160", "preserveAspectRatio", "none", 1, "pg-trendline-svg"], ["x1", "40", "y1", "20", "x2", "520", "y2", "20", "stroke", "var(--mj-border-subtle)", "stroke-dasharray", "3,3"], ["x1", "40", "y1", "75", "x2", "520", "y2", "75", "stroke", "var(--mj-border-subtle)", "stroke-dasharray", "3,3"], ["x1", "40", "y1", "130", "x2", "520", "y2", "130", "stroke", "var(--mj-border-default)"], ["x", "32", "y", "24", "font-size", "10", "text-anchor", "end", "fill", "var(--mj-text-muted)"], ["x", "32", "y", "79", "font-size", "10", "text-anchor", "end", "fill", "var(--mj-text-muted)"], ["x", "32", "y", "134", "font-size", "10", "text-anchor", "end", "fill", "var(--mj-text-muted)"], ["fill", "color-mix(in srgb, var(--mj-brand-primary) 12%, transparent)"], ["fill", "none", "stroke", "var(--mj-brand-primary)", "stroke-width", "2.5"], [1, "pg-history-table"], ["r", "5", "stroke", "var(--mj-bg-surface)", "stroke-width", "2"], ["font-size", "10", "font-weight", "700", "text-anchor", "middle", "fill", "var(--mj-text-primary)"], [1, "ps-mono"], [1, "pg-delta-pill", "neutral"], [1, "pg-delta-pill", "up"], [1, "pg-delta-pill", "down"], [1, "fa-solid", "fa-arrow-up"], [1, "fa-solid", "fa-arrow-down"]], template: function PSPredictionsGridComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2)(3, "div", 3);
+            i0.ɵɵelement(4, "i", 4);
+            i0.ɵɵelementStart(5, "input", 5);
+            i0.ɵɵlistener("input", function PSPredictionsGridComponent_Template_input_input_5_listener($event) { return ctx.onSearchInput($event); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(6, PSPredictionsGridComponent_Conditional_6_Template, 2, 0, "button", 6);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(7, "div", 7)(8, "button", 8);
+            i0.ɵɵlistener("click", function PSPredictionsGridComponent_Template_button_click_8_listener() { return ctx.setTier("all"); });
+            i0.ɵɵtext(9, " All ");
+            i0.ɵɵelementStart(10, "span", 9);
+            i0.ɵɵtext(11);
+            i0.ɵɵpipe(12, "number");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵrepeaterCreate(13, PSPredictionsGridComponent_For_14_Template, 5, 6, "button", 10, _forTrack0);
+            i0.ɵɵconditionalCreate(15, PSPredictionsGridComponent_Conditional_15_Template, 6, 1, "div", 11);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(16, "div", 12)(17, "mj-view-toggle", 13);
+            i0.ɵɵlistener("KeyChange", function PSPredictionsGridComponent_Template_mj_view_toggle_KeyChange_17_listener($event) { return ctx.onViewToggle($event); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(18, "button", 14);
+            i0.ɵɵlistener("click", function PSPredictionsGridComponent_Template_button_click_18_listener() { return ctx.exportCSV(); });
+            i0.ɵɵelement(19, "i", 15);
+            i0.ɵɵtext(20, " Export ");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(21, "div", 16);
+            i0.ɵɵconditionalCreate(22, PSPredictionsGridComponent_Conditional_22_Template, 1, 0, "mj-loading", 17)(23, PSPredictionsGridComponent_Conditional_23_Template, 10, 1, "div", 18)(24, PSPredictionsGridComponent_Conditional_24_Template, 7, 0, "div", 19)(25, PSPredictionsGridComponent_Conditional_25_Template, 2, 2);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(26, PSPredictionsGridComponent_Conditional_26_Template, 52, 26, "mj-slide-panel", 20);
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵstyleProp("height", ctx.height);
+            i0.ɵɵadvance(5);
+            i0.ɵɵproperty("value", ctx.searchText);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.searchText ? 6 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵclassProp("active", ctx.selectedTier === "all");
+            i0.ɵɵadvance(3);
+            i0.ɵɵtextInterpolate1("(", i0.ɵɵpipeBind1(12, 13, ctx.allRows.length), ")");
+            i0.ɵɵadvance(2);
+            i0.ɵɵrepeater(ctx.visibleBands);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.selectedDecileIndex !== null ? 15 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("Options", ctx.viewOptions)("ActiveKey", ctx.activeView);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("disabled", ctx.allRows.length === 0);
+            i0.ɵɵadvance(4);
+            i0.ɵɵconditional(ctx.isLoading ? 22 : ctx.loadError ? 23 : ctx.allRows.length === 0 ? 24 : 25);
+            i0.ɵɵadvance(4);
+            i0.ɵɵconditional(ctx.detailOpen && ctx.selectedRow ? 26 : -1);
+        } }, dependencies: [CommonModule,
+            FormsModule,
+            SharedGenericModule, i1.LoadingComponent, MJButtonDirective,
+            MJViewToggleComponent,
+            MjSlidePanelComponent,
+            AgGridModule, i2.AgGridAngular, i3.DecimalPipe, i3.DatePipe], styles: ["\n\n\n\n\n\n\n\n\n\n\n\n\n.ps-panel[_ngcontent-%COMP%] {\n  --ps-node-source: #6b7280;\n  --ps-node-feature: #2050c8;\n  --ps-node-embedding: #7b3ff0;\n  --ps-node-target: #1f9d57;\n  --ps-node-algorithm: #d98213;\n  \n  --ps-gauge-cost: var(--ps-node-algorithm);\n  --ps-gauge-iterations: var(--ps-node-feature);\n}\n\n.ps-panel[_ngcontent-%COMP%] {\n  display: block;\n  height: 100%;\n}\n\n\n.ps-row[_ngcontent-%COMP%] { display: flex; gap: 16px; }\n.ps-col[_ngcontent-%COMP%] { display: flex; flex-direction: column; gap: 16px; }\n.ps-wrap[_ngcontent-%COMP%] { flex-wrap: wrap; }\n.ps-spacer[_ngcontent-%COMP%] { flex: 1; }\n.ps-muted[_ngcontent-%COMP%] { color: var(--mj-text-muted); }\n.ps-small[_ngcontent-%COMP%] { font-size: 12.5px; }\n.ps-mono[_ngcontent-%COMP%] { font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace; font-size: 12.5px; }\n.ps-section-title[_ngcontent-%COMP%] {\n  font-size: 12px; text-transform: uppercase; letter-spacing: .06em;\n  color: var(--mj-text-muted); margin: 4px 0 2px; font-weight: 700;\n}\n\n\n.ps-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  overflow: hidden;\n}\n.ps-card-head[_ngcontent-%COMP%] {\n  display: flex; align-items: center; gap: 10px;\n  padding: 14px 16px; border-bottom: 1px solid var(--mj-border-subtle);\n}\n.ps-card-head[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] { font-size: 14.5px; margin: 0; font-weight: 650; color: var(--mj-text-primary); }\n.ps-card-body[_ngcontent-%COMP%] { padding: 16px; }\n\n\n.ps-kpi[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface); border: 1px solid var(--mj-border-default);\n  border-radius: 8px; padding: 16px 18px;\n}\n.ps-kpi[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%] { font-size: 12px; color: var(--mj-text-muted); font-weight: 600; }\n.ps-kpi[_ngcontent-%COMP%]   .val[_ngcontent-%COMP%] { font-size: 26px; font-weight: 720; letter-spacing: -.02em; margin-top: 2px; color: var(--mj-text-primary); }\n\n\n.ps-badge[_ngcontent-%COMP%] {\n  display: inline-flex; align-items: center; gap: 5px;\n  padding: 2px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 650; line-height: 1.7;\n}\n.ps-badge.gray[_ngcontent-%COMP%] { background: var(--mj-bg-surface-sunken); color: var(--mj-text-secondary); }\n.ps-badge.blue[_ngcontent-%COMP%] { background: var(--mj-status-info-bg); color: var(--mj-status-info-text); }\n.ps-badge.green[_ngcontent-%COMP%] { background: var(--mj-status-success-bg); color: var(--mj-status-success-text); }\n.ps-badge.amber[_ngcontent-%COMP%] { background: var(--mj-status-warning-bg); color: var(--mj-status-warning-text); }\n.ps-badge.red[_ngcontent-%COMP%] { background: var(--mj-status-error-bg); color: var(--mj-status-error-text); }\n.ps-dot[_ngcontent-%COMP%] { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }\n\n\n.ps-lvl[_ngcontent-%COMP%] {\n  display: inline-flex; align-items: center; justify-content: center;\n  min-width: 92px; padding: 4px 10px; border-radius: 7px;\n  font-weight: 650; font-size: 11.5px; color: var(--mj-text-inverse);\n}\n.ps-lvl-Primary[_ngcontent-%COMP%] { background: var(--mj-status-success); }\n.ps-lvl-Strong[_ngcontent-%COMP%] { background: var(--mj-status-info); }\n.ps-lvl-Viable[_ngcontent-%COMP%] { background: var(--mj-status-warning); }\n.ps-lvl-Weak[_ngcontent-%COMP%] { background: var(--mj-text-disabled); }\n.ps-lvl-NotRecommended[_ngcontent-%COMP%] { background: var(--mj-bg-surface-sunken); color: var(--mj-text-muted); }\n\n\n.ps-tag[_ngcontent-%COMP%] {\n  display: inline-block; padding: 2px 8px; border-radius: 6px;\n  background: var(--mj-bg-surface-sunken); color: var(--mj-text-secondary);\n  font-size: 11.5px; font-weight: 600;\n}\n.ps-tag.muted[_ngcontent-%COMP%] { opacity: .6; }\n.ps-divider[_ngcontent-%COMP%] { height: 1px; background: var(--mj-border-subtle); margin: 8px 0; }\n\n\n.ps-table[_ngcontent-%COMP%] { width: 100%; border-collapse: collapse; font-size: 13px; }\n.ps-table[_ngcontent-%COMP%]   th[_ngcontent-%COMP%] {\n  text-align: left; font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em;\n  color: var(--mj-text-muted); font-weight: 700; padding: 9px 12px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n.ps-table[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] { padding: 11px 12px; border-bottom: 1px solid var(--mj-border-subtle); color: var(--mj-text-primary); }\n.ps-table[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]:hover   td[_ngcontent-%COMP%] { background: var(--mj-bg-surface-hover); }\n.ps-table[_ngcontent-%COMP%]   .num[_ngcontent-%COMP%] { text-align: right; font-variant-numeric: tabular-nums; }\n\n.ps-rank[_ngcontent-%COMP%] {\n  width: 22px; height: 22px; border-radius: 6px; background: var(--mj-bg-surface-sunken);\n  display: inline-grid; place-items: center; font-weight: 700; font-size: 11.5px; color: var(--mj-text-secondary);\n}\n.ps-rank.gold[_ngcontent-%COMP%] { background: var(--mj-status-warning-bg); color: var(--mj-status-warning-text); }\n\n\n.ps-bar[_ngcontent-%COMP%] { height: 8px; border-radius: 999px; background: var(--mj-bg-surface-sunken); overflow: hidden; }\n.ps-bar[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] { display: block; height: 100%; border-radius: 999px; background: var(--mj-brand-primary); }\n.ps-bar.warn[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] { background: var(--mj-status-warning); }\n.ps-bar.run[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] { background: var(--mj-brand-primary); }\n\n.ps-fbar[_ngcontent-%COMP%] { display: grid; grid-template-columns: minmax(150px, 1.3fr) 2fr 56px; align-items: center; gap: 14px; padding: 8px 0; }\n.ps-fbar[_ngcontent-%COMP%]    + .ps-fbar[_ngcontent-%COMP%] { border-top: 1px solid var(--mj-border-subtle); }\n.ps-fbar[_ngcontent-%COMP%]   .track[_ngcontent-%COMP%] { height: 10px; border-radius: var(--mj-radius-full); background: var(--mj-bg-surface-sunken); overflow: hidden; }\n.ps-fbar[_ngcontent-%COMP%]   .track[_ngcontent-%COMP%]    > span[_ngcontent-%COMP%] { display: block; height: 100%; border-radius: var(--mj-radius-full); background: var(--mj-brand-primary); }\n.ps-fbar[_ngcontent-%COMP%]   .track[_ngcontent-%COMP%]    > span.warn[_ngcontent-%COMP%] { background: var(--mj-status-warning); }\n.ps-fbar[_ngcontent-%COMP%]   .name[_ngcontent-%COMP%] { color: var(--mj-text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.ps-fbar[_ngcontent-%COMP%]    > .ps-mono[_ngcontent-%COMP%] { text-align: right; color: var(--mj-text-secondary); font-variant-numeric: tabular-nums; }\n\n\n.ps-gauge[_ngcontent-%COMP%] {\n  position: relative; width: 64px; height: 64px; border-radius: 50%; flex: 0 0 auto;\n  background: conic-gradient(var(--ps-gauge-color, var(--mj-brand-primary)) calc(var(--ps-p, 40) * 1%), var(--mj-bg-surface-sunken) 0);\n  display: grid; place-items: center;\n}\n.ps-gauge[_ngcontent-%COMP%]::after { content: ''; position: absolute; inset: 9px; background: var(--mj-bg-surface); border-radius: 50%; }\n.ps-gauge[_ngcontent-%COMP%]   .g-val[_ngcontent-%COMP%] { position: relative; font-weight: 720; font-size: 14px; color: var(--mj-text-primary); }\n\n\n.ps-callout[_ngcontent-%COMP%] { display: flex; gap: 11px; padding: 12px 14px; border-radius: 10px; border: 1px solid; }\n.ps-callout.warn[_ngcontent-%COMP%] { background: var(--mj-status-warning-bg); border-color: var(--mj-status-warning-border); color: var(--mj-status-warning-text); }\n.ps-callout.info[_ngcontent-%COMP%] { background: var(--mj-status-info-bg); border-color: var(--mj-status-info-border); color: var(--mj-status-info-text); }\n.ps-callout.success[_ngcontent-%COMP%] { background: var(--mj-status-success-bg); border-color: var(--mj-status-success-border); color: var(--mj-status-success-text); }\n.ps-callout[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 16px; margin-top: 1px; }\n\n\n.ps-stepper[_ngcontent-%COMP%] { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }\n.ps-step[_ngcontent-%COMP%] { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--mj-text-muted); }\n.ps-step[_ngcontent-%COMP%]   .pip[_ngcontent-%COMP%] {\n  width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--mj-border-strong);\n  display: grid; place-items: center; font-size: 11px;\n}\n.ps-step.done[_ngcontent-%COMP%] { color: var(--mj-status-success-text); }\n.ps-step.done[_ngcontent-%COMP%]   .pip[_ngcontent-%COMP%] { background: var(--mj-status-success); border-color: var(--mj-status-success); color: var(--mj-text-inverse); }\n.ps-step.curr[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n.ps-step.curr[_ngcontent-%COMP%]   .pip[_ngcontent-%COMP%] { border-color: var(--mj-brand-primary); color: var(--mj-brand-primary); }\n.ps-step[_ngcontent-%COMP%]   .ln[_ngcontent-%COMP%] { width: 26px; height: 2px; background: var(--mj-border-strong); }\n\n\n.ps-flow[_ngcontent-%COMP%] {\n  position: relative;\n  background:\n    linear-gradient(var(--mj-border-subtle) 1px, transparent 1px) 0 0 / 22px 22px,\n    linear-gradient(90deg, var(--mj-border-subtle) 1px, transparent 1px) 0 0 / 22px 22px,\n    var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default); border-radius: 10px;\n  min-height: 620px; overflow: hidden;\n}\n.ps-node[_ngcontent-%COMP%] {\n  position: absolute; width: 190px; background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-strong); border-left-width: 3px; border-radius: 8px;\n  cursor: pointer;\n}\n.ps-node[_ngcontent-%COMP%]   .nh[_ngcontent-%COMP%] {\n  display: flex; align-items: center; gap: 8px; padding: 9px 11px;\n  border-bottom: 1px solid var(--mj-border-subtle); font-weight: 650; font-size: 12.5px; color: var(--mj-text-primary);\n}\n.ps-node[_ngcontent-%COMP%]   .nh[_ngcontent-%COMP%]   i.tile[_ngcontent-%COMP%] {\n  width: 24px; height: 24px; border-radius: 6px; display: grid; place-items: center;\n  color: var(--mj-text-inverse); font-size: 12px; flex: 0 0 auto;\n}\n.ps-node[_ngcontent-%COMP%]   .nh[_ngcontent-%COMP%]   .ps-tag[_ngcontent-%COMP%] { margin-left: auto; }\n.ps-node[_ngcontent-%COMP%]   .nb[_ngcontent-%COMP%] { padding: 9px 11px; font-size: 12px; color: var(--mj-text-secondary); }\n.ps-node[_ngcontent-%COMP%]   .nb-row[_ngcontent-%COMP%] { display: flex; justify-content: space-between; gap: 8px; padding: 2px 0; }\n.ps-node[_ngcontent-%COMP%]   .nb-row[_ngcontent-%COMP%]   .k[_ngcontent-%COMP%] { color: var(--mj-text-muted); }\n.ps-node.src[_ngcontent-%COMP%] { border-left-color: var(--ps-node-source); }\n.ps-node.src[_ngcontent-%COMP%]   .nh[_ngcontent-%COMP%]   i.tile[_ngcontent-%COMP%] { background: var(--ps-node-source); }\n.ps-node.feat[_ngcontent-%COMP%] { border-left-color: var(--ps-node-feature); }\n.ps-node.feat[_ngcontent-%COMP%]   .nh[_ngcontent-%COMP%]   i.tile[_ngcontent-%COMP%] { background: var(--ps-node-feature); }\n.ps-node.emb[_ngcontent-%COMP%] { border-left-color: var(--ps-node-embedding); }\n.ps-node.emb[_ngcontent-%COMP%]   .nh[_ngcontent-%COMP%]   i.tile[_ngcontent-%COMP%] { background: var(--ps-node-embedding); }\n.ps-node.target[_ngcontent-%COMP%] { border-left-color: var(--ps-node-target); }\n.ps-node.target[_ngcontent-%COMP%]   .nh[_ngcontent-%COMP%]   i.tile[_ngcontent-%COMP%] { background: var(--ps-node-target); }\n.ps-node.algo[_ngcontent-%COMP%] { border-left-color: var(--ps-node-algorithm); }\n.ps-node.algo[_ngcontent-%COMP%]   .nh[_ngcontent-%COMP%]   i.tile[_ngcontent-%COMP%] { background: var(--ps-node-algorithm); }\n.ps-node.output[_ngcontent-%COMP%] { border-left-color: var(--mj-status-success); }\n.ps-node.output[_ngcontent-%COMP%]   .nh[_ngcontent-%COMP%]   i.tile[_ngcontent-%COMP%] { background: var(--mj-status-success); }\n.ps-node.selected[_ngcontent-%COMP%] {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 18%, transparent);\n}\n.ps-node[_ngcontent-%COMP%]   .port[_ngcontent-%COMP%] {\n  position: absolute; width: 11px; height: 11px; border-radius: 50%;\n  background: var(--mj-bg-surface); border: 2px solid var(--mj-brand-primary);\n  top: 50%; transform: translateY(-50%);\n}\n.ps-node[_ngcontent-%COMP%]   .port.in[_ngcontent-%COMP%] { left: -6px; }\n.ps-node[_ngcontent-%COMP%]   .port.out[_ngcontent-%COMP%] { right: -6px; }\nsvg.ps-edges[_ngcontent-%COMP%] { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }\nsvg.ps-edges[_ngcontent-%COMP%]   path[_ngcontent-%COMP%] { stroke: color-mix(in srgb, var(--mj-brand-primary) 45%, transparent); stroke-width: 2; fill: none; }\n\n\n.ps-pchip[_ngcontent-%COMP%] {\n  display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; border-radius: 8px;\n  border: 1px dashed var(--mj-border-strong); background: var(--mj-bg-surface);\n  font-size: 12.5px; font-weight: 600; color: var(--mj-text-secondary); cursor: grab;\n}\n.ps-pchip[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 12px; color: var(--mj-text-inverse); width: 20px; height: 20px; border-radius: 5px; display: grid; place-items: center; }\n.ps-pchip.s[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { background: var(--ps-node-source); }\n.ps-pchip.f[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { background: var(--ps-node-feature); }\n.ps-pchip.e[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { background: var(--ps-node-embedding); }\n.ps-pchip.t[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { background: var(--ps-node-target); }\n.ps-pchip.a[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { background: var(--ps-node-algorithm); }\n\n\n.ps-seg[_ngcontent-%COMP%] { display: inline-flex; border: 1px solid var(--mj-border-default); border-radius: 8px; overflow: hidden; }\n.ps-seg[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  border: none; background: var(--mj-bg-surface); color: var(--mj-text-secondary);\n  padding: 6px 12px; font-size: 12.5px; font-weight: 600; cursor: pointer;\n  border-right: 1px solid var(--mj-border-default);\n}\n.ps-seg[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:last-child { border-right: none; }\n.ps-seg[_ngcontent-%COMP%]   button.on[_ngcontent-%COMP%] { background: var(--mj-brand-primary); color: var(--mj-text-inverse); }\n\n\n.ps-field[_ngcontent-%COMP%] { margin-bottom: 14px; }\n.ps-field[_ngcontent-%COMP%]    > label[_ngcontent-%COMP%] {\n  display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .04em;\n  color: var(--mj-text-muted); font-weight: 700; margin-bottom: 6px;\n}\n.ps-input[_ngcontent-%COMP%] {\n  width: 100%; padding: 8px 10px; border: 1px solid var(--mj-border-default);\n  border-radius: 6px; font-size: 13px; background: var(--mj-bg-surface); color: var(--mj-text-primary);\n  box-sizing: border-box;\n}\n.ps-input[_ngcontent-%COMP%]:focus { outline: none; border-color: var(--mj-brand-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 12%, transparent); }\n\n\n.ps-loading[_ngcontent-%COMP%] { display: flex; align-items: center; justify-content: center; padding: 60px 0; }\n\n\n.ps-empty[_ngcontent-%COMP%] {\n  display: flex; flex-direction: column; align-items: center; justify-content: center;\n  text-align: center; gap: 10px; padding: 56px 24px; color: var(--mj-text-muted);\n}\n.ps-empty[_ngcontent-%COMP%]   .ps-empty-ico[_ngcontent-%COMP%] {\n  width: 60px; height: 60px; border-radius: 16px; display: grid; place-items: center;\n  background: var(--mj-bg-surface-sunken); color: var(--mj-text-disabled); font-size: 24px;\n}\n.ps-empty[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] { margin: 4px 0 0; font-size: 16px; font-weight: 650; color: var(--mj-text-secondary); }\n.ps-empty[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] { margin: 0; max-width: 420px; font-size: 13px; line-height: 1.5; }\n\n\n.ps-modal-backdrop[_ngcontent-%COMP%] {\n  position: fixed; inset: 0; z-index: 1000;\n  background: var(--mj-bg-overlay);\n  display: flex; align-items: center; justify-content: center; padding: 24px;\n}\n.ps-modal[_ngcontent-%COMP%] {\n  width: 100%; max-width: 480px; background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default); border-radius: 14px;\n  box-shadow: var(--mj-shadow-lg, var(--mj-shadow-sm)); overflow: hidden;\n}\n.ps-modal-head[_ngcontent-%COMP%] {\n  display: flex; align-items: center; gap: 12px; padding: 18px 20px;\n  border-bottom: 1px solid var(--mj-border-subtle);\n}\n.ps-modal-head[_ngcontent-%COMP%]   .ico[_ngcontent-%COMP%] {\n  width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center;\n  font-size: 16px; flex: 0 0 auto;\n  background: var(--mj-status-info-bg); color: var(--mj-status-info-text);\n}\n.ps-modal-head.warn[_ngcontent-%COMP%]   .ico[_ngcontent-%COMP%] { background: var(--mj-status-warning-bg); color: var(--mj-status-warning-text); }\n.ps-modal-head.danger[_ngcontent-%COMP%]   .ico[_ngcontent-%COMP%] { background: var(--mj-status-error-bg); color: var(--mj-status-error-text); }\n.ps-modal-head[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] { margin: 0; font-size: 15.5px; font-weight: 650; color: var(--mj-text-primary); }\n.ps-modal-body[_ngcontent-%COMP%] { padding: 18px 20px; font-size: 13.5px; line-height: 1.55; color: var(--mj-text-secondary); }\n.ps-modal-body[_ngcontent-%COMP%]   .ps-field[_ngcontent-%COMP%] { margin-top: 14px; margin-bottom: 0; }\n.ps-modal-foot[_ngcontent-%COMP%] {\n  display: flex; align-items: center; gap: 10px; padding: 14px 20px;\n  border-top: 1px solid var(--mj-border-subtle); background: var(--mj-bg-surface-card);\n}\n.ps-modal-foot[_ngcontent-%COMP%]   .ps-spacer[_ngcontent-%COMP%] { flex: 1; }", "\n\n\n\n\n.ps-pred-grid-host[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n}\n\n\n.pg-toolbar[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  padding: 8px 12px;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  margin-bottom: 12px;\n  flex-wrap: wrap;\n}\n\n.pg-toolbar-left[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n  min-width: 240px;\n}\n\n.pg-search-box[_ngcontent-%COMP%] {\n  position: relative;\n  display: flex;\n  align-items: center;\n  max-width: 260px;\n  width: 100%;\n}\n\n.pg-search-box[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  position: absolute;\n  left: 10px;\n  color: var(--mj-text-muted);\n  font-size: 12px;\n  pointer-events: none;\n}\n\n.pg-search-input[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 6px 10px 6px 30px;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-sm);\n  background: var(--mj-bg-surface);\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-primary);\n  outline: none;\n  transition: border-color .15s;\n}\n\n.pg-search-input[_ngcontent-%COMP%]:focus {\n  border-color: var(--mj-brand-primary);\n}\n\n.pg-search-clear[_ngcontent-%COMP%] {\n  position: absolute;\n  right: 8px;\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  padding: 2px 4px;\n  color: var(--mj-text-muted);\n  font-size: 11px;\n}\n\n.pg-search-clear[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-primary);\n}\n\n.pg-decile-pill[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 2px 8px;\n  border-radius: var(--mj-radius-full);\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, transparent);\n  border: 1px solid var(--mj-brand-primary);\n  font-size: var(--mj-text-xs);\n  font-weight: 600;\n  color: var(--mj-brand-primary);\n}\n\n.pg-decile-pill[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  padding: 0;\n  color: var(--mj-brand-primary);\n  font-size: 10px;\n}\n\n.pg-tier-filters[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  flex-wrap: wrap;\n}\n\n.pg-tier-btn[_ngcontent-%COMP%] {\n  cursor: pointer;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-full);\n  padding: 3px 10px;\n  font-size: var(--mj-text-xs);\n  font-weight: 600;\n  color: var(--mj-text-secondary);\n  transition: all .15s;\n  display: inline-flex;\n  align-items: center;\n  gap: 5px;\n}\n\n.pg-tier-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n  color: var(--mj-text-primary);\n}\n\n.pg-tier-btn.active[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n}\n\n.pg-tier-btn.tier-high.active[_ngcontent-%COMP%] {\n  background: var(--mj-status-error);\n  border-color: var(--mj-status-error);\n}\n\n.pg-tier-btn.tier-medium.active[_ngcontent-%COMP%] {\n  background: var(--mj-status-warning);\n  border-color: var(--mj-status-warning);\n}\n\n.pg-tier-btn.tier-low.active[_ngcontent-%COMP%] {\n  background: var(--mj-status-success);\n  border-color: var(--mj-status-success);\n}\n\n.pg-count-pill[_ngcontent-%COMP%] {\n  font-size: 10px;\n  opacity: .85;\n}\n\n.pg-toolbar-right[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n\n.pg-view-container[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n}\n\n.pg-grid[_ngcontent-%COMP%] {\n  width: 100%;\n  flex: 1;\n  min-height: 380px;\n}\n\n\n.pg-record-cell[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  gap: 2px;\n  height: 100%;\n  min-width: 0;\n  line-height: 1.2;\n}\n\n.pg-record-title-row[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  min-width: 0;\n}\n\n.pg-record-link[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  max-width: 100%;\n  text-decoration: none;\n  cursor: pointer;\n  min-width: 0;\n}\n\n.pg-record-name[_ngcontent-%COMP%] {\n  font-weight: 600;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-link);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.pg-record-link[_ngcontent-%COMP%]:hover   .pg-record-name[_ngcontent-%COMP%] {\n  text-decoration: underline;\n}\n\n.pg-record-open-icon[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n  flex-shrink: 0;\n  transition: transform .15s, color .15s;\n}\n\n.pg-record-link[_ngcontent-%COMP%]:hover   .pg-record-open-icon[_ngcontent-%COMP%] {\n  transform: translateY(-1px) translateX(1px);\n  color: var(--mj-text-primary);\n}\n\n.pg-record-id[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.pg-score-cell[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  height: 100%;\n  min-width: 0;\n}\n\n.pg-score-bar[_ngcontent-%COMP%] {\n  flex: 1;\n  height: 8px;\n  border-radius: var(--mj-radius-full);\n  background: var(--mj-bg-surface-sunken);\n  overflow: hidden;\n}\n\n.pg-score-fill[_ngcontent-%COMP%] {\n  display: block;\n  height: 100%;\n  border-radius: var(--mj-radius-full);\n}\n\n.pg-score-fill.risk-high[_ngcontent-%COMP%], \n.pg-score-fill.badge-red[_ngcontent-%COMP%] { background: var(--mj-status-error); }\n.pg-score-fill.risk-medium[_ngcontent-%COMP%], \n.pg-score-fill.badge-amber[_ngcontent-%COMP%] { background: var(--mj-status-warning); }\n.pg-score-fill.risk-low[_ngcontent-%COMP%], \n.pg-score-fill.badge-green[_ngcontent-%COMP%] { background: var(--mj-status-success); }\n.pg-score-fill.badge-blue[_ngcontent-%COMP%] { background: var(--mj-brand-primary); }\n.pg-score-fill.badge-gray[_ngcontent-%COMP%] { background: var(--mj-text-muted); }\n\n.pg-score-val[_ngcontent-%COMP%] {\n  font-weight: 700;\n  font-size: var(--mj-text-xs);\n  font-variant-numeric: tabular-nums;\n  min-width: 44px;\n  text-align: right;\n}\n\n.pg-score-val.risk-high[_ngcontent-%COMP%], \n.pg-score-val.badge-red[_ngcontent-%COMP%] { color: var(--mj-status-error-text, var(--mj-status-error)); }\n.pg-score-val.risk-medium[_ngcontent-%COMP%], \n.pg-score-val.badge-amber[_ngcontent-%COMP%] { color: var(--mj-status-warning-text, var(--mj-status-warning)); }\n.pg-score-val.risk-low[_ngcontent-%COMP%], \n.pg-score-val.badge-green[_ngcontent-%COMP%] { color: var(--mj-status-success-text, var(--mj-status-success)); }\n.pg-score-val.badge-blue[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n.pg-score-val.badge-gray[_ngcontent-%COMP%] { color: var(--mj-text-muted); }\n\n.pg-drivers-cell[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  height: 100%;\n  overflow: hidden;\n  flex-wrap: nowrap;\n}\n\n.pg-action-btn[_ngcontent-%COMP%] {\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  padding: 6px 8px;\n  border-radius: 6px;\n  color: var(--mj-text-muted);\n  font-size: 12px;\n  transition: all .15s;\n}\n\n.pg-action-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n  color: var(--mj-brand-primary);\n}\n\n\n.pg-footer[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 8px 12px;\n  background: var(--mj-bg-surface-card);\n  border-top: 1px solid var(--mj-border-subtle);\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n}\n\n\n.pg-chart-container[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  overflow-y: auto;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 4px 0 12px;\n}\n\n.pg-chart-cards[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n  gap: 12px;\n}\n\n.pg-chart-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  padding: 14px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  cursor: pointer;\n  transition: all .15s;\n}\n\n.pg-chart-card[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.pg-chart-card.total[_ngcontent-%COMP%] { border-left: 4px solid var(--mj-brand-primary); }\n.pg-chart-card.tier-high[_ngcontent-%COMP%] { border-left: 4px solid var(--mj-status-error); }\n.pg-chart-card.tier-medium[_ngcontent-%COMP%] { border-left: 4px solid var(--mj-status-warning); }\n.pg-chart-card.tier-low[_ngcontent-%COMP%] { border-left: 4px solid var(--mj-status-success); }\n\n.pg-chart-card-val[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-xl);\n  font-weight: 700;\n  color: var(--mj-text-primary);\n}\n\n.pg-chart-card-lbl[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n  font-weight: 600;\n}\n\n.pg-chart-card-sub[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n}\n\n.pg-chart-section[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  padding: 18px 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.pg-chart-section-title[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-sm);\n  font-weight: 650;\n  color: var(--mj-text-primary);\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.pg-chart-meta[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.pg-clear-decile-btn[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-full);\n  padding: 2px 10px;\n  font-size: 11px;\n  font-weight: 600;\n  cursor: pointer;\n  color: var(--mj-text-secondary);\n  transition: all .15s;\n}\n\n.pg-clear-decile-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n  color: var(--mj-text-primary);\n  border-color: var(--mj-border-subtle);\n}\n\n\n.pg-histogram[_ngcontent-%COMP%] {\n  position: relative;\n  width: 100%;\n  padding-top: 8px;\n  padding-bottom: 28px;\n}\n\n.pg-h-columns[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-end;\n  justify-content: space-between;\n  gap: 8px;\n  height: 200px;\n  padding: 0 4px;\n  border-bottom: 2px solid var(--mj-border-default);\n}\n\n.pg-h-col[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: flex-end;\n  height: 100%;\n  cursor: pointer;\n  position: relative;\n  transition: transform .15s;\n  user-select: none;\n}\n\n.pg-h-col[_ngcontent-%COMP%]:hover {\n  transform: translateY(-2px);\n}\n\n.pg-h-count[_ngcontent-%COMP%] {\n  font-size: 11px;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  margin-bottom: 6px;\n  white-space: nowrap;\n  font-variant-numeric: tabular-nums;\n}\n\n.pg-h-bar-track[_ngcontent-%COMP%] {\n  width: 100%;\n  max-width: 52px;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n}\n\n.pg-h-bar[_ngcontent-%COMP%] {\n  width: 100%;\n  border-radius: 4px 4px 0 0;\n  transition: height .3s cubic-bezier(0.4, 0, 0.2, 1), opacity .15s, box-shadow .15s;\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);\n}\n\n.pg-h-col[_ngcontent-%COMP%]:hover   .pg-h-bar[_ngcontent-%COMP%] {\n  filter: brightness(1.1);\n  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);\n}\n\n.pg-h-col.active[_ngcontent-%COMP%]   .pg-h-bar[_ngcontent-%COMP%] {\n  outline: 3px solid var(--mj-brand-primary);\n  outline-offset: 1px;\n}\n\n.pg-h-footer[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin-top: 8px;\n  position: absolute;\n  top: 100%;\n  left: 0;\n  right: 0;\n}\n\n.pg-h-range[_ngcontent-%COMP%] {\n  font-size: 10px;\n  font-weight: 600;\n  color: var(--mj-text-secondary);\n}\n\n.pg-h-pct[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n}\n\n\n.pg-h-tooltip[_ngcontent-%COMP%] {\n  position: absolute;\n  bottom: calc(100% + 4px);\n  left: 50%;\n  transform: translateX(-50%);\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);\n  border-radius: var(--mj-radius-md);\n  padding: 8px 12px;\n  white-space: nowrap;\n  pointer-events: none;\n  opacity: 0;\n  visibility: hidden;\n  transition: opacity .15s, visibility .15s;\n  z-index: 50;\n}\n\n.pg-h-col[_ngcontent-%COMP%]:hover   .pg-h-tooltip[_ngcontent-%COMP%] {\n  opacity: 1;\n  visibility: visible;\n}\n\n.pg-h-tt-head[_ngcontent-%COMP%] {\n  font-size: 11px;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  margin-bottom: 2px;\n}\n\n.pg-h-tt-row[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 6px;\n  align-items: center;\n  font-size: 11px;\n}\n\n.pg-h-tt-val[_ngcontent-%COMP%] {\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.pg-h-tt-pct[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n}\n\n.pg-h-tt-badge[_ngcontent-%COMP%] {\n  font-size: 10px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  margin-top: 3px;\n}\n\n.pg-h-tt-hint[_ngcontent-%COMP%] {\n  font-size: 9px;\n  color: var(--mj-text-muted);\n  font-style: italic;\n  margin-top: 4px;\n}\n\n\n.pg-detail-body[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  padding: 18px 20px 32px;\n}\n\n.pg-detail-record-head[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 14px;\n  padding-bottom: 14px;\n  border-bottom: 1px solid var(--mj-border-subtle);\n}\n\n.pg-detail-record-info[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0 0 4px;\n  font-size: var(--mj-text-lg);\n  font-weight: 700;\n  color: var(--mj-text-primary);\n}\n\n.pg-detail-pred-card[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 20px;\n  padding: 16px 18px;\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n}\n\n.pg-detail-score-circle[_ngcontent-%COMP%] {\n  width: 72px;\n  height: 72px;\n  border-radius: 50%;\n  display: grid;\n  place-items: center;\n  font-size: 19px;\n  font-weight: 800;\n  color: var(--mj-text-inverse);\n  flex-shrink: 0;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, .12);\n}\n\n.pg-detail-score-circle.risk-high[_ngcontent-%COMP%], \n.pg-detail-score-circle.badge-red[_ngcontent-%COMP%] { background: var(--mj-status-error); }\n.pg-detail-score-circle.risk-medium[_ngcontent-%COMP%], \n.pg-detail-score-circle.badge-amber[_ngcontent-%COMP%] { background: var(--mj-status-warning); }\n.pg-detail-score-circle.risk-low[_ngcontent-%COMP%], \n.pg-detail-score-circle.badge-green[_ngcontent-%COMP%] { background: var(--mj-status-success); }\n.pg-detail-score-circle.badge-blue[_ngcontent-%COMP%] { background: var(--mj-brand-primary); }\n.pg-detail-score-circle.badge-gray[_ngcontent-%COMP%] { background: var(--mj-text-muted); }\n\n.pg-detail-meta[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  flex: 1;\n}\n\n.pg-detail-meta-line[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-primary);\n}\n\n.pg-detail-meta-sub[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n}\n\n.pg-detail-drivers-wrap[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.pg-detail-drivers-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.pg-detail-driver-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 8px 12px;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: var(--mj-radius-sm);\n}\n\n.pg-detail-driver-label[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-xs);\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n\n.pg-trendline-wrap[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  padding: 16px;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n}\n\n.pg-trendline-svg[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 180px;\n  overflow: visible;\n}\n\n.pg-history-table[_ngcontent-%COMP%] {\n  width: 100%;\n  border-collapse: collapse;\n  font-size: var(--mj-text-xs);\n  margin-top: 6px;\n}\n\n.pg-history-table[_ngcontent-%COMP%]   th[_ngcontent-%COMP%] {\n  text-align: left;\n  padding: 6px 8px;\n  border-bottom: 1px solid var(--mj-border-default);\n  color: var(--mj-text-muted);\n  font-weight: 600;\n  font-size: 11px;\n  text-transform: uppercase;\n  letter-spacing: .03em;\n}\n\n.pg-history-table[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] {\n  padding: 7px 8px;\n  border-bottom: 1px solid var(--mj-border-subtle);\n  color: var(--mj-text-secondary);\n}\n\n.pg-history-table[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]:last-child   td[_ngcontent-%COMP%] {\n  border-bottom: none;\n}\n\n.pg-delta-pill[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 3px;\n  font-weight: 700;\n  font-size: 11px;\n  padding: 1px 6px;\n  border-radius: var(--mj-radius-full);\n}\n\n.pg-delta-pill.up[_ngcontent-%COMP%] { background: var(--mj-status-error-bg); color: var(--mj-status-error-text); }\n.pg-delta-pill.down[_ngcontent-%COMP%] { background: var(--mj-status-success-bg); color: var(--mj-status-success-text); }\n.pg-delta-pill.neutral[_ngcontent-%COMP%] { background: var(--mj-bg-surface-sunken); color: var(--mj-text-muted); }\n\n\n.pg-chart-drilldown-section[_ngcontent-%COMP%] {\n  padding: 16px 18px;\n  gap: 12px;\n}\n\n.pg-chart-grid-host[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 440px;\n  min-height: 320px;\n  border-radius: var(--mj-radius-sm);\n  overflow: hidden;\n  border: 1px solid var(--mj-border-default);\n}\n\n.pg-chart-ag-grid[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n}\n\n.pg-drilldown-footer[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: flex-end;\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n  padding-top: 2px;\n}"], changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PSPredictionsGridComponent, [{
+        type: Component,
+        args: [{ standalone: true, selector: 'ps-predictions-grid', imports: [
+                    CommonModule,
+                    FormsModule,
+                    SharedGenericModule,
+                    MJButtonDirective,
+                    MJViewToggleComponent,
+                    MjSlidePanelComponent,
+                    AgGridModule,
+                ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ps-pred-grid-host\" [style.height]=\"height\">\n  <!-- \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 TOOLBAR \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n  <div class=\"pg-toolbar\">\n    <div class=\"pg-toolbar-left\">\n      <div class=\"pg-search-box\">\n        <i class=\"fa-solid fa-magnifying-glass\"></i>\n        <input\n          type=\"text\"\n          class=\"pg-search-input\"\n          placeholder=\"Filter records, outcome, factors...\"\n          [value]=\"searchText\"\n          (input)=\"onSearchInput($event)\" />\n        @if (searchText) {\n          <button type=\"button\" class=\"pg-search-clear\" (click)=\"clearSearch()\" title=\"Clear filter\">\n            <i class=\"fa-solid fa-xmark\"></i>\n          </button>\n        }\n      </div>\n\n      <div class=\"pg-tier-filters\">\n        <button\n          type=\"button\"\n          class=\"pg-tier-btn\"\n          [class.active]=\"selectedTier === 'all'\"\n          (click)=\"setTier('all')\">\n          All <span class=\"pg-count-pill\">({{ allRows.length | number }})</span>\n        </button>\n        @for (b of visibleBands; track b.key) {\n          <button\n            type=\"button\"\n            class=\"pg-tier-btn\"\n            [class.active]=\"selectedTier === b.key\"\n            (click)=\"setTier(b.key)\">\n            {{ b.label }} <span class=\"pg-count-pill\">({{ b.count | number }})</span>\n          </button>\n        }\n\n        @if (selectedDecileIndex !== null) {\n          <div class=\"pg-decile-pill\">\n            <i class=\"fa-solid fa-filter\"></i>\n            <span>Decile {{ selectedDecileLabel }}</span>\n            <button type=\"button\" (click)=\"clearDecileFilter()\" title=\"Clear decile filter\"><i class=\"fa-solid fa-xmark\"></i></button>\n          </div>\n        }\n      </div>\n    </div>\n\n    <div class=\"pg-toolbar-right\">\n      <mj-view-toggle\n        [Options]=\"viewOptions\"\n        [ActiveKey]=\"activeView\"\n        (KeyChange)=\"onViewToggle($event)\">\n      </mj-view-toggle>\n\n      <button\n        mjButton\n        variant=\"secondary\"\n        size=\"sm\"\n        [disabled]=\"allRows.length === 0\"\n        (click)=\"exportCSV()\">\n        <i class=\"fa-solid fa-file-export\"></i> Export\n      </button>\n    </div>\n  </div>\n\n  <!-- \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 MAIN VIEW CONTAINER \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n  <div class=\"pg-view-container\">\n    @if (isLoading) {\n      <mj-loading text=\"Loading predictions...\" size=\"medium\"></mj-loading>\n    } @else if (loadError) {\n      <div class=\"ps-load-error\" role=\"alert\">\n        <i class=\"fa-solid fa-triangle-exclamation\"></i>\n        <div class=\"ps-load-error-text\">\n          <strong>Couldn't load predictions</strong>\n          <span class=\"ps-load-error-detail\">{{ loadError }}</span>\n        </div>\n        <button mjButton variant=\"secondary\" size=\"sm\" (click)=\"reload()\"><i class=\"fa-solid fa-rotate-right\"></i> Try again</button>\n      </div>\n    } @else if (allRows.length === 0) {\n      <div class=\"ps-empty\" style=\"padding: 32px\">\n        <span class=\"ps-empty-ico\"><i class=\"fa-solid fa-chart-line\"></i></span>\n        <h3>No predictions available</h3>\n        <p>Run this model from Models in Production or wait for the scheduled job to produce predictions.</p>\n      </div>\n    } @else {\n      <!-- GRID VIEW -->\n      @if (activeView === 'grid') {\n        <ag-grid-angular\n          class=\"pg-grid\"\n          [theme]=\"Theme\"\n          [columnDefs]=\"columnDefs\"\n          [defaultColDef]=\"defaultColDef\"\n          [gridOptions]=\"GridOptions\"\n          [rowData]=\"filteredRows\"\n          (gridReady)=\"onGridReady($event)\"\n          (rowClicked)=\"onRowClicked($event)\"\n          (cellClicked)=\"onCellClicked($event)\">\n        </ag-grid-angular>\n\n        <div class=\"pg-footer\">\n          <span>Showing <strong>{{ filteredRows.length }}</strong> of {{ allRows.length }} predictions</span>\n          @if (selectedTier !== 'all' || searchText) {\n            <span class=\"ps-muted\">Filtered by {{ selectedTier !== 'all' ? selectedTier + ' risk' : '' }}{{ searchText ? ' query \"' + searchText + '\"' : '' }}</span>\n          }\n          <span class=\"ps-muted\">Click any row to inspect details & score history</span>\n        </div>\n      }\n\n      <!-- CHART VIEW -->\n      @if (activeView === 'chart') {\n        <div class=\"pg-chart-container\">\n          <!-- KPI Summary Cards -->\n          <div class=\"pg-chart-cards\">\n            <div class=\"pg-chart-card total\">\n              <span class=\"pg-chart-card-lbl\"><i class=\"fa-solid fa-users ps-muted\"></i> Scored Cohort</span>\n              <span class=\"pg-chart-card-val\">{{ allRows.length | number }}</span>\n              <span class=\"pg-chart-card-sub\">Total records</span>\n            </div>\n            @for (b of visibleBands; track b.key) {\n              <div class=\"pg-chart-card\" [class]=\"'tier-' + b.key\" (click)=\"setTierAndGrid(b.key)\">\n                <span class=\"pg-chart-card-lbl\">\n                  @if (b.icon) {\n                    <i class=\"fa-solid {{ b.icon }}\" [style.color]=\"getBadgeColorVar(b.badgeColor)\"></i>\n                  }\n                  {{ b.label }}\n                </span>\n                <span class=\"pg-chart-card-val\" [style.color]=\"getBadgeColorVar(b.badgeColor)\">\n                  {{ b.count | number }}\n                </span>\n                <span class=\"pg-chart-card-sub\">{{ b.pct }}% of cohort (avg {{ b.avgScoreFormatted }} {{ outcomeConfig.ScoreLabel }})</span>\n              </div>\n            }\n          </div>\n\n          <!-- Score Distribution Histogram -->\n          <div class=\"pg-chart-section\">\n            <div class=\"pg-chart-section-title\">\n              <div style=\"display:flex;align-items:center;gap:8px\">\n                <i class=\"fa-solid fa-chart-simple ps-muted\"></i>\n                <span>{{ outcomeConfig.ScoreLabel }} Distribution (10 Bins)</span>\n              </div>\n              <div class=\"pg-chart-meta\">\n                <span class=\"ps-small ps-muted\">Cohort Mean: <strong>{{ meanScoreFormatted }}</strong></span>\n                @if (selectedDecileIndex !== null) {\n                  <button type=\"button\" class=\"pg-clear-decile-btn\" (click)=\"clearDecileFilter()\">\n                    <i class=\"fa-solid fa-xmark\"></i> Clear Decile Filter\n                  </button>\n                }\n              </div>\n            </div>\n\n            <!-- Modern Interactive Flex Histogram -->\n            <div class=\"pg-histogram\">\n              <div class=\"pg-h-columns\">\n                @for (b of histogramBins; track b.label) {\n                  <div\n                    class=\"pg-h-col\"\n                    [class.active]=\"selectedDecileIndex === b.idx\"\n                    [class.empty]=\"b.count === 0\"\n                    (click)=\"selectDecile(b.idx)\">\n\n                    <!-- Count label above bar -->\n                    <span class=\"pg-h-count\" [title]=\"b.count + ' records'\">\n                      {{ b.count > 0 ? (b.count | number) : '0' }}\n                    </span>\n\n                    <!-- Bar track & fill -->\n                    <div class=\"pg-h-bar-track\">\n                      <div\n                        class=\"pg-h-bar\"\n                        [style.height.px]=\"b.height\"\n                        [style.background]=\"b.color\">\n                      </div>\n                    </div>\n\n                    <!-- Footer labels -->\n                    <div class=\"pg-h-footer\">\n                      <span class=\"pg-h-range\">{{ b.shortLabel }}</span>\n                      <span class=\"pg-h-pct\">{{ b.pctFormatted }}</span>\n                    </div>\n\n                    <!-- Tooltip card -->\n                    <div class=\"pg-h-tooltip\">\n                      <div class=\"pg-h-tt-head\">{{ b.label }} {{ outcomeConfig.ScoreLabel }}</div>\n                      <div class=\"pg-h-tt-row\">\n                        <span class=\"pg-h-tt-val\">{{ b.count | number }} records</span>\n                        <span class=\"pg-h-tt-pct\">({{ b.pctFormatted }} of cohort)</span>\n                      </div>\n                      <div class=\"pg-h-tt-badge\" [style.color]=\"b.color\">{{ b.riskLabel }}</div>\n                      <div class=\"pg-h-tt-hint\">{{ selectedDecileIndex === b.idx ? 'Click to clear filter' : 'Click to filter grid' }}</div>\n                    </div>\n                  </div>\n                }\n              </div>\n            </div>\n          </div>\n\n          <!-- Predicted Class Breakdown (for Classification) -->\n          @if (classBreakdown.length > 0) {\n            <div class=\"pg-chart-section\">\n              <div class=\"pg-chart-section-title\">\n                <span><i class=\"fa-solid fa-layer-group ps-muted\"></i> Predicted Outcome Classes</span>\n              </div>\n              <div style=\"display:flex;height:24px;border-radius:var(--mj-radius-full);overflow:hidden;background:var(--mj-bg-surface-sunken);margin-bottom:8px\">\n                @for (c of classBreakdown; track c.name) {\n                  <div\n                    [style.width.%]=\"c.pct\"\n                    [style.background]=\"c.color\"\n                    [title]=\"c.name + ': ' + c.count + ' (' + c.pct + '%)'\">\n                  </div>\n                }\n              </div>\n              <div style=\"display:flex;gap:16px;flex-wrap:wrap\">\n                @for (c of classBreakdown; track c.name) {\n                  <div style=\"display:flex;align-items:center;gap:6px;font-size:var(--mj-text-xs)\">\n                    <span [style.background]=\"c.color\" style=\"width:10px;height:10px;border-radius:2px;display:inline-block\"></span>\n                    <strong>{{ c.name }}</strong>\n                    <span class=\"ps-muted\">{{ c.count }} ({{ c.pct }}%)</span>\n                  </div>\n                }\n              </div>\n            </div>\n          }\n\n          <!-- Segment Drilldown Grid Section \u2014 Only shown when a decile segment is selected -->\n          @if (selectedDecileIndex !== null) {\n            <div id=\"pg-drilldown-anchor\" class=\"pg-chart-section pg-chart-drilldown-section\">\n              <div class=\"pg-chart-section-title\">\n                <div style=\"display:flex;align-items:center;gap:8px\">\n                  <i class=\"fa-solid fa-table-list ps-muted\"></i>\n                  <span>\n                    Decile Drill-Down:\n                    <strong style=\"color:var(--mj-brand-primary)\">{{ selectedDecileLabel }}</strong>\n                    {{ outcomeConfig.ScoreLabel }}\n                    @if (histogramBins[selectedDecileIndex]) {\n                      <span class=\"ps-badge\" [style.color]=\"histogramBins[selectedDecileIndex].color\" style=\"margin-left:6px\">\n                        {{ histogramBins[selectedDecileIndex].riskLabel }}\n                      </span>\n                    }\n                  </span>\n                </div>\n                <div class=\"pg-chart-meta\">\n                  <span class=\"ps-small ps-muted\">\n                    Showing <strong>{{ filteredRows.length | number }}</strong> of {{ allRows.length | number }} records\n                  </span>\n                  <button type=\"button\" class=\"pg-clear-decile-btn\" (click)=\"clearDecileFilter()\">\n                    <i class=\"fa-solid fa-xmark\"></i> Show All Deciles\n                  </button>\n                </div>\n              </div>\n\n              <!-- Drill-Down AG Grid -->\n              <div class=\"pg-chart-grid-host\">\n                <ag-grid-angular\n                  class=\"pg-grid pg-chart-ag-grid\"\n                  [theme]=\"Theme\"\n                  [columnDefs]=\"columnDefs\"\n                  [defaultColDef]=\"defaultColDef\"\n                  [gridOptions]=\"chartGridOptions\"\n                  [rowData]=\"filteredRows\"\n                  (gridReady)=\"onChartGridReady($event)\"\n                  (rowClicked)=\"onRowClicked($event)\"\n                  (cellClicked)=\"onCellClicked($event)\">\n                </ag-grid-angular>\n              </div>\n\n              <div class=\"pg-drilldown-footer\">\n                <span class=\"ps-muted\">Click any row to inspect explainability drivers and score history in the slide-in drawer</span>\n              </div>\n            </div>\n          }\n        </div>\n      }\n    }\n  </div>\n\n  <!-- \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 SLIDE-IN DETAIL PANEL \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n  @if (detailOpen && selectedRow) {\n    <mj-slide-panel\n      Mode=\"slide\"\n      Title=\"Record Prediction & Score History\"\n      [Resizable]=\"true\"\n      [WidthPx]=\"drawerWidthPx\"\n      (WidthChanged)=\"onDrawerWidthChanged($event)\"\n      (Closed)=\"closeDetail()\">\n\n      <div class=\"pg-detail-body\">\n        <!-- Record header -->\n        <div class=\"pg-detail-record-head\">\n          <div class=\"pg-detail-record-info\">\n            <h3>{{ selectedRow.recordName || selectedRow.recordId }}</h3>\n            <div style=\"display:flex;align-items:center;gap:8px\">\n              <span class=\"ps-badge blue\">{{ entityDisplayName || 'Entity Record' }}</span>\n              <span class=\"ps-mono ps-small ps-muted\">{{ selectedRow.recordId }}</span>\n            </div>\n          </div>\n          <div class=\"pg-detail-record-actions\" style=\"display:flex;gap:8px;align-items:center;flex-wrap:wrap\">\n            <button\n              mjButton\n              variant=\"primary\"\n              size=\"sm\"\n              (click)=\"drillThrough(selectedRow)\"\n              title=\"Open record in Explorer\">\n              <i class=\"fa-solid fa-arrow-up-right-from-square\"></i> Open {{ entityDisplayName || 'Record' }}\n            </button>\n            @if (subjectEntityName && subjectRecordId) {\n              <button\n                mjButton\n                variant=\"secondary\"\n                size=\"sm\"\n                (click)=\"openSubjectRecord()\"\n                title=\"Open subject record (e.g. Person, Account) in Explorer\">\n                <i class=\"fa-solid fa-user\"></i> Open {{ subjectEntityName.replace('MJ_BizApps_Common: ', '').replace('MJ_BizApps_', '') }} ({{ subjectRecordName || 'Profile' }})\n              </button>\n            }\n          </div>\n        </div>\n\n        <!-- Prediction Summary Card -->\n        <div class=\"pg-detail-pred-card\">\n          <div class=\"pg-detail-score-circle\" [class]=\"'badge-' + (selectedRow.badgeColor || 'gray')\">\n            {{ selectedRow.scoreFormatted }}\n          </div>\n          <div class=\"pg-detail-meta\">\n            <div class=\"pg-detail-meta-line\">\n              <strong>{{ outcomeConfig.StatusLabel }}:</strong>\n              <span class=\"ps-badge\" [class]=\"selectedRow.badgeColor || 'gray'\" style=\"margin-left:6px\">\n                @if (selectedRow.icon) {\n                  <i class=\"fa-solid {{ selectedRow.icon }}\"></i>\n                }\n                {{ selectedRow.status || selectedRow.band }}\n              </span>\n            </div>\n            @if (selectedRow.class) {\n              <div class=\"pg-detail-meta-line\">\n                <strong>Predicted Outcome:</strong>\n                <span class=\"ps-badge\" [class]=\"getOutcomeBadgeClass(selectedRow.class)\">\n                  {{ selectedRow.class }}\n                </span>\n              </div>\n            }\n            <div class=\"pg-detail-meta-line\">\n              <strong>{{ outcomeConfig.ScoreLabel }}:</strong>\n              <span style=\"font-weight:700;color:var(--mj-text-primary)\">{{ selectedRow.scoreFormatted }}</span>\n            </div>\n            <div class=\"pg-detail-meta-sub\">\n              Scored: {{ selectedRow.scoredAtDate ? (selectedRow.scoredAtDate | date:'medium') : '\u2014' }}\n            </div>\n          </div>\n        </div>\n\n        <!-- Explainability: Local Feature Drivers -->\n        <div class=\"pg-detail-drivers-wrap\">\n          <div class=\"ps-section-title\">\n            <i class=\"fa-solid fa-lightbulb\" style=\"color:var(--mj-status-warning)\"></i> Key Decision Drivers (Explainability)\n          </div>\n          @if (!selectedRow.drivers || selectedRow.drivers.length === 0) {\n            <div class=\"ps-small ps-muted\">No individual driver breakdown was recorded for this row.</div>\n          } @else {\n            <div class=\"pg-detail-drivers-list\">\n              @for (d of selectedRow.drivers; track d.label) {\n                <div class=\"pg-detail-driver-item\">\n                  <div class=\"pg-detail-driver-label\">\n                    <i class=\"fa-solid\" [class.fa-arrow-up]=\"d.up\" [class.fa-arrow-down]=\"!d.up\" [style.color]=\"d.up ? 'var(--mj-status-error)' : 'var(--mj-status-success)'\"></i>\n                    {{ d.label }}\n                  </div>\n                  <span class=\"ps-badge\" [class]=\"d.up ? 'red' : 'green'\">\n                    {{ d.up ? 'Increases Risk' : 'Lowers Risk' }}\n                  </span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n\n        <!-- Historical Trendline across Runs -->\n        <div class=\"pg-trendline-wrap\">\n          <div class=\"ps-section-title\" style=\"display:flex;align-items:center;justify-content:space-between\">\n            <span><i class=\"fa-solid fa-clock-rotate-left ps-muted\"></i> Historical Score Trendline</span>\n            <span class=\"ps-small ps-muted\">{{ historyPoints.length }} run{{ historyPoints.length === 1 ? '' : 's' }} recorded</span>\n          </div>\n\n          @if (historyLoading) {\n            <mj-loading text=\"Loading score history...\" size=\"small\"></mj-loading>\n          } @else if (historyPoints.length > 1) {\n            <!-- Interactive SVG Trendline -->\n            <svg class=\"pg-trendline-svg\" viewBox=\"0 0 540 160\" preserveAspectRatio=\"none\">\n              <!-- Background grid lines -->\n              <line x1=\"40\" y1=\"20\" x2=\"520\" y2=\"20\" stroke=\"var(--mj-border-subtle)\" stroke-dasharray=\"3,3\" />\n              <line x1=\"40\" y1=\"75\" x2=\"520\" y2=\"75\" stroke=\"var(--mj-border-subtle)\" stroke-dasharray=\"3,3\" />\n              <line x1=\"40\" y1=\"130\" x2=\"520\" y2=\"130\" stroke=\"var(--mj-border-default)\" />\n\n              <!-- Y-axis labels -->\n              <text x=\"32\" y=\"24\" font-size=\"10\" text-anchor=\"end\" fill=\"var(--mj-text-muted)\">100%</text>\n              <text x=\"32\" y=\"79\" font-size=\"10\" text-anchor=\"end\" fill=\"var(--mj-text-muted)\">50%</text>\n              <text x=\"32\" y=\"134\" font-size=\"10\" text-anchor=\"end\" fill=\"var(--mj-text-muted)\">0%</text>\n\n              <!-- Filled area under curve -->\n              <polygon [attr.points]=\"trendlineAreaPoints\" fill=\"color-mix(in srgb, var(--mj-brand-primary) 12%, transparent)\" />\n\n              <!-- Trend line path -->\n              <polyline [attr.points]=\"trendlineLinePoints\" fill=\"none\" stroke=\"var(--mj-brand-primary)\" stroke-width=\"2.5\" />\n\n              <!-- Data points -->\n              @for (p of trendlinePlotPoints; track p.runId) {\n                <circle\n                  [attr.cx]=\"p.x\"\n                  [attr.cy]=\"p.y\"\n                  r=\"5\"\n                  [attr.fill]=\"p.color\"\n                  stroke=\"var(--mj-bg-surface)\"\n                  stroke-width=\"2\">\n                  <title>{{ p.dateStr }}: {{ p.scoreFormatted }} ({{ p.class || 'No class' }})</title>\n                </circle>\n                <text\n                  [attr.cx]=\"p.x\"\n                  [attr.cy]=\"p.y - 9\"\n                  font-size=\"10\"\n                  font-weight=\"700\"\n                  text-anchor=\"middle\"\n                  fill=\"var(--mj-text-primary)\">\n                  {{ p.scoreFormatted }}\n                </text>\n              }\n            </svg>\n\n            <!-- Runs Table -->\n            <table class=\"pg-history-table\">\n              <thead>\n                <tr>\n                  <th>When</th>\n                  <th>Status</th>\n                  <th>Score</th>\n                  <th>Change</th>\n                  <th>Class</th>\n                </tr>\n              </thead>\n              <tbody>\n                @for (pt of historyPoints; track pt.runId) {\n                  <tr>\n                    <td>{{ pt.runDate | date:'short' }}</td>\n                    <td><span class=\"ps-badge\" [class]=\"pt.status === 'Succeeded' ? 'green' : 'gray'\">{{ pt.status }}</span></td>\n                    <td><strong class=\"ps-mono\">{{ pt.scoreFormatted }}</strong></td>\n                    <td>\n                      @if (pt.delta == null) {\n                        <span class=\"pg-delta-pill neutral\">Baseline</span>\n                      } @else if (pt.delta > 0.005) {\n                        <span class=\"pg-delta-pill up\"><i class=\"fa-solid fa-arrow-up\"></i> +{{ (pt.delta * 100).toFixed(1) }}%</span>\n                      } @else if (pt.delta < -0.005) {\n                        <span class=\"pg-delta-pill down\"><i class=\"fa-solid fa-arrow-down\"></i> {{ (pt.delta * 100).toFixed(1) }}%</span>\n                      } @else {\n                        <span class=\"pg-delta-pill neutral\">0%</span>\n                      }\n                    </td>\n                    <td>{{ pt.class || '\u2014' }}</td>\n                  </tr>\n                }\n              </tbody>\n            </table>\n          } @else if (historyPoints.length === 1) {\n            <div class=\"ps-small ps-muted\">\n              This record has been scored once so far ({{ historyPoints[0].runDate | date:'medium' }}). As more runs occur over time, the score trendline will track changes here.\n            </div>\n          } @else {\n            <div class=\"ps-small ps-muted\">No historical runs found for this record.</div>\n          }\n        </div>\n      </div>\n    </mj-slide-panel>\n  }\n</div>\n", styles: ["/* ============================================================================\n   Predictive Studio \u2014 shared panel styles (design-token compliant)\n   Maps the mockup design system onto MemberJunction semantic --mj-* tokens.\n   Loaded by every PS panel component (styleUrls) under ViewEncapsulation.None,\n   so the class names are global within the PS dashboard subtree.\n   No hardcoded colors except the intentional categorical node/algorithm palette\n   (declared once as --ps-* custom props below) which must stay distinct across\n   light/dark to remain readable as diagram accents.\n   ============================================================================ */\n\n/* Categorical accents for DAG node types + algorithm chips. These are\n   data-visualization colors that must remain distinct regardless of theme\n   (allowed exception #3 in the design-token rules). */\n.ps-panel {\n  --ps-node-source: #6b7280;\n  --ps-node-feature: #2050c8;\n  --ps-node-embedding: #7b3ff0;\n  --ps-node-target: #1f9d57;\n  --ps-node-algorithm: #d98213;\n  /* budget-gauge categorical accents (reuse the node palette so light/dark stay distinct) */\n  --ps-gauge-cost: var(--ps-node-algorithm);\n  --ps-gauge-iterations: var(--ps-node-feature);\n}\n\n.ps-panel {\n  display: block;\n  height: 100%;\n}\n\n/* ---- generic layout helpers ---- */\n.ps-row { display: flex; gap: 16px; }\n.ps-col { display: flex; flex-direction: column; gap: 16px; }\n.ps-wrap { flex-wrap: wrap; }\n.ps-spacer { flex: 1; }\n.ps-muted { color: var(--mj-text-muted); }\n.ps-small { font-size: 12.5px; }\n.ps-mono { font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace; font-size: 12.5px; }\n.ps-section-title {\n  font-size: 12px; text-transform: uppercase; letter-spacing: .06em;\n  color: var(--mj-text-muted); margin: 4px 0 2px; font-weight: 700;\n}\n\n/* ---- cards ---- */\n.ps-card {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  overflow: hidden;\n}\n.ps-card-head {\n  display: flex; align-items: center; gap: 10px;\n  padding: 14px 16px; border-bottom: 1px solid var(--mj-border-subtle);\n}\n.ps-card-head h3 { font-size: 14.5px; margin: 0; font-weight: 650; color: var(--mj-text-primary); }\n.ps-card-body { padding: 16px; }\n\n/* ---- KPI tiles ---- */\n.ps-kpi {\n  background: var(--mj-bg-surface); border: 1px solid var(--mj-border-default);\n  border-radius: 8px; padding: 16px 18px;\n}\n.ps-kpi .label { font-size: 12px; color: var(--mj-text-muted); font-weight: 600; }\n.ps-kpi .val { font-size: 26px; font-weight: 720; letter-spacing: -.02em; margin-top: 2px; color: var(--mj-text-primary); }\n\n/* ---- badges ---- */\n.ps-badge {\n  display: inline-flex; align-items: center; gap: 5px;\n  padding: 2px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 650; line-height: 1.7;\n}\n.ps-badge.gray { background: var(--mj-bg-surface-sunken); color: var(--mj-text-secondary); }\n.ps-badge.blue { background: var(--mj-status-info-bg); color: var(--mj-status-info-text); }\n.ps-badge.green { background: var(--mj-status-success-bg); color: var(--mj-status-success-text); }\n.ps-badge.amber { background: var(--mj-status-warning-bg); color: var(--mj-status-warning-text); }\n.ps-badge.red { background: var(--mj-status-error-bg); color: var(--mj-status-error-text); }\n.ps-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }\n\n/* recommendation-level chips (the ranking matrix payoff) */\n.ps-lvl {\n  display: inline-flex; align-items: center; justify-content: center;\n  min-width: 92px; padding: 4px 10px; border-radius: 7px;\n  font-weight: 650; font-size: 11.5px; color: var(--mj-text-inverse);\n}\n.ps-lvl-Primary { background: var(--mj-status-success); }\n.ps-lvl-Strong { background: var(--mj-status-info); }\n.ps-lvl-Viable { background: var(--mj-status-warning); }\n.ps-lvl-Weak { background: var(--mj-text-disabled); }\n.ps-lvl-NotRecommended { background: var(--mj-bg-surface-sunken); color: var(--mj-text-muted); }\n\n/* ---- tags ---- */\n.ps-tag {\n  display: inline-block; padding: 2px 8px; border-radius: 6px;\n  background: var(--mj-bg-surface-sunken); color: var(--mj-text-secondary);\n  font-size: 11.5px; font-weight: 600;\n}\n.ps-tag.muted { opacity: .6; }\n.ps-divider { height: 1px; background: var(--mj-border-subtle); margin: 8px 0; }\n\n/* ---- tables ---- */\n.ps-table { width: 100%; border-collapse: collapse; font-size: 13px; }\n.ps-table th {\n  text-align: left; font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em;\n  color: var(--mj-text-muted); font-weight: 700; padding: 9px 12px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n.ps-table td { padding: 11px 12px; border-bottom: 1px solid var(--mj-border-subtle); color: var(--mj-text-primary); }\n.ps-table tr:hover td { background: var(--mj-bg-surface-hover); }\n.ps-table .num { text-align: right; font-variant-numeric: tabular-nums; }\n\n.ps-rank {\n  width: 22px; height: 22px; border-radius: 6px; background: var(--mj-bg-surface-sunken);\n  display: inline-grid; place-items: center; font-weight: 700; font-size: 11.5px; color: var(--mj-text-secondary);\n}\n.ps-rank.gold { background: var(--mj-status-warning-bg); color: var(--mj-status-warning-text); }\n\n/* ---- progress bars ---- */\n.ps-bar { height: 8px; border-radius: 999px; background: var(--mj-bg-surface-sunken); overflow: hidden; }\n.ps-bar > span { display: block; height: 100%; border-radius: 999px; background: var(--mj-brand-primary); }\n.ps-bar.warn > span { background: var(--mj-status-warning); }\n.ps-bar.run > span { background: var(--mj-brand-primary); }\n\n.ps-fbar { display: grid; grid-template-columns: minmax(150px, 1.3fr) 2fr 56px; align-items: center; gap: 14px; padding: 8px 0; }\n.ps-fbar + .ps-fbar { border-top: 1px solid var(--mj-border-subtle); }\n.ps-fbar .track { height: 10px; border-radius: var(--mj-radius-full); background: var(--mj-bg-surface-sunken); overflow: hidden; }\n.ps-fbar .track > span { display: block; height: 100%; border-radius: var(--mj-radius-full); background: var(--mj-brand-primary); }\n.ps-fbar .track > span.warn { background: var(--mj-status-warning); }\n.ps-fbar .name { color: var(--mj-text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.ps-fbar > .ps-mono { text-align: right; color: var(--mj-text-secondary); font-variant-numeric: tabular-nums; }\n\n/* gauge */\n.ps-gauge {\n  position: relative; width: 64px; height: 64px; border-radius: 50%; flex: 0 0 auto;\n  background: conic-gradient(var(--ps-gauge-color, var(--mj-brand-primary)) calc(var(--ps-p, 40) * 1%), var(--mj-bg-surface-sunken) 0);\n  display: grid; place-items: center;\n}\n.ps-gauge::after { content: ''; position: absolute; inset: 9px; background: var(--mj-bg-surface); border-radius: 50%; }\n.ps-gauge .g-val { position: relative; font-weight: 720; font-size: 14px; color: var(--mj-text-primary); }\n\n/* warning / info callouts */\n.ps-callout { display: flex; gap: 11px; padding: 12px 14px; border-radius: 10px; border: 1px solid; }\n.ps-callout.warn { background: var(--mj-status-warning-bg); border-color: var(--mj-status-warning-border); color: var(--mj-status-warning-text); }\n.ps-callout.info { background: var(--mj-status-info-bg); border-color: var(--mj-status-info-border); color: var(--mj-status-info-text); }\n.ps-callout.success { background: var(--mj-status-success-bg); border-color: var(--mj-status-success-border); color: var(--mj-status-success-text); }\n.ps-callout i { font-size: 16px; margin-top: 1px; }\n\n/* lifecycle stepper */\n.ps-stepper { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }\n.ps-step { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--mj-text-muted); }\n.ps-step .pip {\n  width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--mj-border-strong);\n  display: grid; place-items: center; font-size: 11px;\n}\n.ps-step.done { color: var(--mj-status-success-text); }\n.ps-step.done .pip { background: var(--mj-status-success); border-color: var(--mj-status-success); color: var(--mj-text-inverse); }\n.ps-step.curr { color: var(--mj-brand-primary); }\n.ps-step.curr .pip { border-color: var(--mj-brand-primary); color: var(--mj-brand-primary); }\n.ps-step .ln { width: 26px; height: 2px; background: var(--mj-border-strong); }\n\n/* ---- DAG flow canvas ---- */\n.ps-flow {\n  position: relative;\n  background:\n    linear-gradient(var(--mj-border-subtle) 1px, transparent 1px) 0 0 / 22px 22px,\n    linear-gradient(90deg, var(--mj-border-subtle) 1px, transparent 1px) 0 0 / 22px 22px,\n    var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default); border-radius: 10px;\n  min-height: 620px; overflow: hidden;\n}\n.ps-node {\n  position: absolute; width: 190px; background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-strong); border-left-width: 3px; border-radius: 8px;\n  cursor: pointer;\n}\n.ps-node .nh {\n  display: flex; align-items: center; gap: 8px; padding: 9px 11px;\n  border-bottom: 1px solid var(--mj-border-subtle); font-weight: 650; font-size: 12.5px; color: var(--mj-text-primary);\n}\n.ps-node .nh i.tile {\n  width: 24px; height: 24px; border-radius: 6px; display: grid; place-items: center;\n  color: var(--mj-text-inverse); font-size: 12px; flex: 0 0 auto;\n}\n.ps-node .nh .ps-tag { margin-left: auto; }\n.ps-node .nb { padding: 9px 11px; font-size: 12px; color: var(--mj-text-secondary); }\n.ps-node .nb-row { display: flex; justify-content: space-between; gap: 8px; padding: 2px 0; }\n.ps-node .nb-row .k { color: var(--mj-text-muted); }\n.ps-node.src { border-left-color: var(--ps-node-source); }\n.ps-node.src .nh i.tile { background: var(--ps-node-source); }\n.ps-node.feat { border-left-color: var(--ps-node-feature); }\n.ps-node.feat .nh i.tile { background: var(--ps-node-feature); }\n.ps-node.emb { border-left-color: var(--ps-node-embedding); }\n.ps-node.emb .nh i.tile { background: var(--ps-node-embedding); }\n.ps-node.target { border-left-color: var(--ps-node-target); }\n.ps-node.target .nh i.tile { background: var(--ps-node-target); }\n.ps-node.algo { border-left-color: var(--ps-node-algorithm); }\n.ps-node.algo .nh i.tile { background: var(--ps-node-algorithm); }\n.ps-node.output { border-left-color: var(--mj-status-success); }\n.ps-node.output .nh i.tile { background: var(--mj-status-success); }\n.ps-node.selected {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 18%, transparent);\n}\n.ps-node .port {\n  position: absolute; width: 11px; height: 11px; border-radius: 50%;\n  background: var(--mj-bg-surface); border: 2px solid var(--mj-brand-primary);\n  top: 50%; transform: translateY(-50%);\n}\n.ps-node .port.in { left: -6px; }\n.ps-node .port.out { right: -6px; }\nsvg.ps-edges { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }\nsvg.ps-edges path { stroke: color-mix(in srgb, var(--mj-brand-primary) 45%, transparent); stroke-width: 2; fill: none; }\n\n/* palette chips */\n.ps-pchip {\n  display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; border-radius: 8px;\n  border: 1px dashed var(--mj-border-strong); background: var(--mj-bg-surface);\n  font-size: 12.5px; font-weight: 600; color: var(--mj-text-secondary); cursor: grab;\n}\n.ps-pchip i { font-size: 12px; color: var(--mj-text-inverse); width: 20px; height: 20px; border-radius: 5px; display: grid; place-items: center; }\n.ps-pchip.s i { background: var(--ps-node-source); }\n.ps-pchip.f i { background: var(--ps-node-feature); }\n.ps-pchip.e i { background: var(--ps-node-embedding); }\n.ps-pchip.t i { background: var(--ps-node-target); }\n.ps-pchip.a i { background: var(--ps-node-algorithm); }\n\n/* segmented control */\n.ps-seg { display: inline-flex; border: 1px solid var(--mj-border-default); border-radius: 8px; overflow: hidden; }\n.ps-seg button {\n  border: none; background: var(--mj-bg-surface); color: var(--mj-text-secondary);\n  padding: 6px 12px; font-size: 12.5px; font-weight: 600; cursor: pointer;\n  border-right: 1px solid var(--mj-border-default);\n}\n.ps-seg button:last-child { border-right: none; }\n.ps-seg button.on { background: var(--mj-brand-primary); color: var(--mj-text-inverse); }\n\n/* field control */\n.ps-field { margin-bottom: 14px; }\n.ps-field > label {\n  display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .04em;\n  color: var(--mj-text-muted); font-weight: 700; margin-bottom: 6px;\n}\n.ps-input {\n  width: 100%; padding: 8px 10px; border: 1px solid var(--mj-border-default);\n  border-radius: 6px; font-size: 13px; background: var(--mj-bg-surface); color: var(--mj-text-primary);\n  box-sizing: border-box;\n}\n.ps-input:focus { outline: none; border-color: var(--mj-brand-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 12%, transparent); }\n\n/* loading container */\n.ps-loading { display: flex; align-items: center; justify-content: center; padding: 60px 0; }\n\n/* ---- empty / prompt states ---- */\n.ps-empty {\n  display: flex; flex-direction: column; align-items: center; justify-content: center;\n  text-align: center; gap: 10px; padding: 56px 24px; color: var(--mj-text-muted);\n}\n.ps-empty .ps-empty-ico {\n  width: 60px; height: 60px; border-radius: 16px; display: grid; place-items: center;\n  background: var(--mj-bg-surface-sunken); color: var(--mj-text-disabled); font-size: 24px;\n}\n.ps-empty h3 { margin: 4px 0 0; font-size: 16px; font-weight: 650; color: var(--mj-text-secondary); }\n.ps-empty p { margin: 0; max-width: 420px; font-size: 13px; line-height: 1.5; }\n\n/* ---- confirm modal ---- */\n.ps-modal-backdrop {\n  position: fixed; inset: 0; z-index: 1000;\n  background: var(--mj-bg-overlay);\n  display: flex; align-items: center; justify-content: center; padding: 24px;\n}\n.ps-modal {\n  width: 100%; max-width: 480px; background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default); border-radius: 14px;\n  box-shadow: var(--mj-shadow-lg, var(--mj-shadow-sm)); overflow: hidden;\n}\n.ps-modal-head {\n  display: flex; align-items: center; gap: 12px; padding: 18px 20px;\n  border-bottom: 1px solid var(--mj-border-subtle);\n}\n.ps-modal-head .ico {\n  width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center;\n  font-size: 16px; flex: 0 0 auto;\n  background: var(--mj-status-info-bg); color: var(--mj-status-info-text);\n}\n.ps-modal-head.warn .ico { background: var(--mj-status-warning-bg); color: var(--mj-status-warning-text); }\n.ps-modal-head.danger .ico { background: var(--mj-status-error-bg); color: var(--mj-status-error-text); }\n.ps-modal-head h3 { margin: 0; font-size: 15.5px; font-weight: 650; color: var(--mj-text-primary); }\n.ps-modal-body { padding: 18px 20px; font-size: 13.5px; line-height: 1.55; color: var(--mj-text-secondary); }\n.ps-modal-body .ps-field { margin-top: 14px; margin-bottom: 0; }\n.ps-modal-foot {\n  display: flex; align-items: center; gap: 10px; padding: 14px 20px;\n  border-top: 1px solid var(--mj-border-subtle); background: var(--mj-bg-surface-card);\n}\n.ps-modal-foot .ps-spacer { flex: 1; }\n", "/* ============================================================================\n   Predictive Studio \u2014 Unified Predictions Grid & Detail Panel styles\n   Design-token compliant (all --mj-* semantic tokens).\n   ============================================================================ */\n\n.ps-pred-grid-host {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 TOOLBAR \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-toolbar {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  padding: 8px 12px;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  margin-bottom: 12px;\n  flex-wrap: wrap;\n}\n\n.pg-toolbar-left {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n  min-width: 240px;\n}\n\n.pg-search-box {\n  position: relative;\n  display: flex;\n  align-items: center;\n  max-width: 260px;\n  width: 100%;\n}\n\n.pg-search-box i {\n  position: absolute;\n  left: 10px;\n  color: var(--mj-text-muted);\n  font-size: 12px;\n  pointer-events: none;\n}\n\n.pg-search-input {\n  width: 100%;\n  padding: 6px 10px 6px 30px;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-sm);\n  background: var(--mj-bg-surface);\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-primary);\n  outline: none;\n  transition: border-color .15s;\n}\n\n.pg-search-input:focus {\n  border-color: var(--mj-brand-primary);\n}\n\n.pg-search-clear {\n  position: absolute;\n  right: 8px;\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  padding: 2px 4px;\n  color: var(--mj-text-muted);\n  font-size: 11px;\n}\n\n.pg-search-clear:hover {\n  color: var(--mj-text-primary);\n}\n\n.pg-decile-pill {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 2px 8px;\n  border-radius: var(--mj-radius-full);\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, transparent);\n  border: 1px solid var(--mj-brand-primary);\n  font-size: var(--mj-text-xs);\n  font-weight: 600;\n  color: var(--mj-brand-primary);\n}\n\n.pg-decile-pill button {\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  padding: 0;\n  color: var(--mj-brand-primary);\n  font-size: 10px;\n}\n\n.pg-tier-filters {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  flex-wrap: wrap;\n}\n\n.pg-tier-btn {\n  cursor: pointer;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-full);\n  padding: 3px 10px;\n  font-size: var(--mj-text-xs);\n  font-weight: 600;\n  color: var(--mj-text-secondary);\n  transition: all .15s;\n  display: inline-flex;\n  align-items: center;\n  gap: 5px;\n}\n\n.pg-tier-btn:hover {\n  background: var(--mj-bg-surface-hover);\n  color: var(--mj-text-primary);\n}\n\n.pg-tier-btn.active {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n}\n\n.pg-tier-btn.tier-high.active {\n  background: var(--mj-status-error);\n  border-color: var(--mj-status-error);\n}\n\n.pg-tier-btn.tier-medium.active {\n  background: var(--mj-status-warning);\n  border-color: var(--mj-status-warning);\n}\n\n.pg-tier-btn.tier-low.active {\n  background: var(--mj-status-success);\n  border-color: var(--mj-status-success);\n}\n\n.pg-count-pill {\n  font-size: 10px;\n  opacity: .85;\n}\n\n.pg-toolbar-right {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 GRID CONTAINER \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-view-container {\n  flex: 1;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n}\n\n.pg-grid {\n  width: 100%;\n  flex: 1;\n  min-height: 380px;\n}\n\n/* AG Grid cell styling overrides */\n.pg-record-cell {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  gap: 2px;\n  height: 100%;\n  min-width: 0;\n  line-height: 1.2;\n}\n\n.pg-record-title-row {\n  display: flex;\n  align-items: center;\n  min-width: 0;\n}\n\n.pg-record-link {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  max-width: 100%;\n  text-decoration: none;\n  cursor: pointer;\n  min-width: 0;\n}\n\n.pg-record-name {\n  font-weight: 600;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-link);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.pg-record-link:hover .pg-record-name {\n  text-decoration: underline;\n}\n\n.pg-record-open-icon {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n  flex-shrink: 0;\n  transition: transform .15s, color .15s;\n}\n\n.pg-record-link:hover .pg-record-open-icon {\n  transform: translateY(-1px) translateX(1px);\n  color: var(--mj-text-primary);\n}\n\n.pg-record-id {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.pg-score-cell {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  height: 100%;\n  min-width: 0;\n}\n\n.pg-score-bar {\n  flex: 1;\n  height: 8px;\n  border-radius: var(--mj-radius-full);\n  background: var(--mj-bg-surface-sunken);\n  overflow: hidden;\n}\n\n.pg-score-fill {\n  display: block;\n  height: 100%;\n  border-radius: var(--mj-radius-full);\n}\n\n.pg-score-fill.risk-high,\n.pg-score-fill.badge-red { background: var(--mj-status-error); }\n.pg-score-fill.risk-medium,\n.pg-score-fill.badge-amber { background: var(--mj-status-warning); }\n.pg-score-fill.risk-low,\n.pg-score-fill.badge-green { background: var(--mj-status-success); }\n.pg-score-fill.badge-blue { background: var(--mj-brand-primary); }\n.pg-score-fill.badge-gray { background: var(--mj-text-muted); }\n\n.pg-score-val {\n  font-weight: 700;\n  font-size: var(--mj-text-xs);\n  font-variant-numeric: tabular-nums;\n  min-width: 44px;\n  text-align: right;\n}\n\n.pg-score-val.risk-high,\n.pg-score-val.badge-red { color: var(--mj-status-error-text, var(--mj-status-error)); }\n.pg-score-val.risk-medium,\n.pg-score-val.badge-amber { color: var(--mj-status-warning-text, var(--mj-status-warning)); }\n.pg-score-val.risk-low,\n.pg-score-val.badge-green { color: var(--mj-status-success-text, var(--mj-status-success)); }\n.pg-score-val.badge-blue { color: var(--mj-brand-primary); }\n.pg-score-val.badge-gray { color: var(--mj-text-muted); }\n\n.pg-drivers-cell {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  height: 100%;\n  overflow: hidden;\n  flex-wrap: nowrap;\n}\n\n.pg-action-btn {\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  padding: 6px 8px;\n  border-radius: 6px;\n  color: var(--mj-text-muted);\n  font-size: 12px;\n  transition: all .15s;\n}\n\n.pg-action-btn:hover {\n  background: var(--mj-bg-surface-hover);\n  color: var(--mj-brand-primary);\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 FOOTER \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-footer {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 8px 12px;\n  background: var(--mj-bg-surface-card);\n  border-top: 1px solid var(--mj-border-subtle);\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 CHART VIEW \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-chart-container {\n  flex: 1;\n  min-height: 0;\n  overflow-y: auto;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 4px 0 12px;\n}\n\n.pg-chart-cards {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n  gap: 12px;\n}\n\n.pg-chart-card {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  padding: 14px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  cursor: pointer;\n  transition: all .15s;\n}\n\n.pg-chart-card:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.pg-chart-card.total { border-left: 4px solid var(--mj-brand-primary); }\n.pg-chart-card.tier-high { border-left: 4px solid var(--mj-status-error); }\n.pg-chart-card.tier-medium { border-left: 4px solid var(--mj-status-warning); }\n.pg-chart-card.tier-low { border-left: 4px solid var(--mj-status-success); }\n\n.pg-chart-card-val {\n  font-size: var(--mj-text-xl);\n  font-weight: 700;\n  color: var(--mj-text-primary);\n}\n\n.pg-chart-card-lbl {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n  font-weight: 600;\n}\n\n.pg-chart-card-sub {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n}\n\n.pg-chart-section {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  padding: 18px 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.pg-chart-section-title {\n  font-size: var(--mj-text-sm);\n  font-weight: 650;\n  color: var(--mj-text-primary);\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.pg-chart-meta {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.pg-clear-decile-btn {\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-full);\n  padding: 2px 10px;\n  font-size: 11px;\n  font-weight: 600;\n  cursor: pointer;\n  color: var(--mj-text-secondary);\n  transition: all .15s;\n}\n\n.pg-clear-decile-btn:hover {\n  background: var(--mj-bg-surface-hover);\n  color: var(--mj-text-primary);\n  border-color: var(--mj-border-subtle);\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 MODERN HISTOGRAM \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-histogram {\n  position: relative;\n  width: 100%;\n  padding-top: 8px;\n  padding-bottom: 28px;\n}\n\n.pg-h-columns {\n  display: flex;\n  align-items: flex-end;\n  justify-content: space-between;\n  gap: 8px;\n  height: 200px;\n  padding: 0 4px;\n  border-bottom: 2px solid var(--mj-border-default);\n}\n\n.pg-h-col {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: flex-end;\n  height: 100%;\n  cursor: pointer;\n  position: relative;\n  transition: transform .15s;\n  user-select: none;\n}\n\n.pg-h-col:hover {\n  transform: translateY(-2px);\n}\n\n.pg-h-count {\n  font-size: 11px;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  margin-bottom: 6px;\n  white-space: nowrap;\n  font-variant-numeric: tabular-nums;\n}\n\n.pg-h-bar-track {\n  width: 100%;\n  max-width: 52px;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n}\n\n.pg-h-bar {\n  width: 100%;\n  border-radius: 4px 4px 0 0;\n  transition: height .3s cubic-bezier(0.4, 0, 0.2, 1), opacity .15s, box-shadow .15s;\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);\n}\n\n.pg-h-col:hover .pg-h-bar {\n  filter: brightness(1.1);\n  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);\n}\n\n.pg-h-col.active .pg-h-bar {\n  outline: 3px solid var(--mj-brand-primary);\n  outline-offset: 1px;\n}\n\n.pg-h-footer {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin-top: 8px;\n  position: absolute;\n  top: 100%;\n  left: 0;\n  right: 0;\n}\n\n.pg-h-range {\n  font-size: 10px;\n  font-weight: 600;\n  color: var(--mj-text-secondary);\n}\n\n.pg-h-pct {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n}\n\n/* Tooltip card */\n.pg-h-tooltip {\n  position: absolute;\n  bottom: calc(100% + 4px);\n  left: 50%;\n  transform: translateX(-50%);\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);\n  border-radius: var(--mj-radius-md);\n  padding: 8px 12px;\n  white-space: nowrap;\n  pointer-events: none;\n  opacity: 0;\n  visibility: hidden;\n  transition: opacity .15s, visibility .15s;\n  z-index: 50;\n}\n\n.pg-h-col:hover .pg-h-tooltip {\n  opacity: 1;\n  visibility: visible;\n}\n\n.pg-h-tt-head {\n  font-size: 11px;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  margin-bottom: 2px;\n}\n\n.pg-h-tt-row {\n  display: flex;\n  gap: 6px;\n  align-items: center;\n  font-size: 11px;\n}\n\n.pg-h-tt-val {\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.pg-h-tt-pct {\n  color: var(--mj-text-muted);\n}\n\n.pg-h-tt-badge {\n  font-size: 10px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  margin-top: 3px;\n}\n\n.pg-h-tt-hint {\n  font-size: 9px;\n  color: var(--mj-text-muted);\n  font-style: italic;\n  margin-top: 4px;\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 SLIDE PANEL DETAIL \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-detail-body {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  padding: 18px 20px 32px;\n}\n\n.pg-detail-record-head {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 14px;\n  padding-bottom: 14px;\n  border-bottom: 1px solid var(--mj-border-subtle);\n}\n\n.pg-detail-record-info h3 {\n  margin: 0 0 4px;\n  font-size: var(--mj-text-lg);\n  font-weight: 700;\n  color: var(--mj-text-primary);\n}\n\n.pg-detail-pred-card {\n  display: flex;\n  align-items: center;\n  gap: 20px;\n  padding: 16px 18px;\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n}\n\n.pg-detail-score-circle {\n  width: 72px;\n  height: 72px;\n  border-radius: 50%;\n  display: grid;\n  place-items: center;\n  font-size: 19px;\n  font-weight: 800;\n  color: var(--mj-text-inverse);\n  flex-shrink: 0;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, .12);\n}\n\n.pg-detail-score-circle.risk-high,\n.pg-detail-score-circle.badge-red { background: var(--mj-status-error); }\n.pg-detail-score-circle.risk-medium,\n.pg-detail-score-circle.badge-amber { background: var(--mj-status-warning); }\n.pg-detail-score-circle.risk-low,\n.pg-detail-score-circle.badge-green { background: var(--mj-status-success); }\n.pg-detail-score-circle.badge-blue { background: var(--mj-brand-primary); }\n.pg-detail-score-circle.badge-gray { background: var(--mj-text-muted); }\n\n.pg-detail-meta {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  flex: 1;\n}\n\n.pg-detail-meta-line {\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-primary);\n}\n\n.pg-detail-meta-sub {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n}\n\n.pg-detail-drivers-wrap {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.pg-detail-drivers-list {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.pg-detail-driver-item {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 8px 12px;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: var(--mj-radius-sm);\n}\n\n.pg-detail-driver-label {\n  font-size: var(--mj-text-xs);\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 TRENDLINE CHART & TABLE \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-trendline-wrap {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  padding: 16px;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n}\n\n.pg-trendline-svg {\n  width: 100%;\n  height: 180px;\n  overflow: visible;\n}\n\n.pg-history-table {\n  width: 100%;\n  border-collapse: collapse;\n  font-size: var(--mj-text-xs);\n  margin-top: 6px;\n}\n\n.pg-history-table th {\n  text-align: left;\n  padding: 6px 8px;\n  border-bottom: 1px solid var(--mj-border-default);\n  color: var(--mj-text-muted);\n  font-weight: 600;\n  font-size: 11px;\n  text-transform: uppercase;\n  letter-spacing: .03em;\n}\n\n.pg-history-table td {\n  padding: 7px 8px;\n  border-bottom: 1px solid var(--mj-border-subtle);\n  color: var(--mj-text-secondary);\n}\n\n.pg-history-table tr:last-child td {\n  border-bottom: none;\n}\n\n.pg-delta-pill {\n  display: inline-flex;\n  align-items: center;\n  gap: 3px;\n  font-weight: 700;\n  font-size: 11px;\n  padding: 1px 6px;\n  border-radius: var(--mj-radius-full);\n}\n\n.pg-delta-pill.up { background: var(--mj-status-error-bg); color: var(--mj-status-error-text); }\n.pg-delta-pill.down { background: var(--mj-status-success-bg); color: var(--mj-status-success-text); }\n.pg-delta-pill.neutral { background: var(--mj-bg-surface-sunken); color: var(--mj-text-muted); }\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 CHART DRILLDOWN GRID \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-chart-drilldown-section {\n  padding: 16px 18px;\n  gap: 12px;\n}\n\n.pg-chart-grid-host {\n  width: 100%;\n  height: 440px;\n  min-height: 320px;\n  border-radius: var(--mj-radius-sm);\n  overflow: hidden;\n  border: 1px solid var(--mj-border-default);\n}\n\n.pg-chart-ag-grid {\n  width: 100%;\n  height: 100%;\n}\n\n.pg-drilldown-footer {\n  display: flex;\n  justify-content: flex-end;\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n  padding-top: 2px;\n}\n"] }]
+    }], null, { modelId: [{
+            type: Input
+        }], runId: [{
+            type: Input
+        }], entityName: [{
+            type: Input
+        }], problemType: [{
+            type: Input
+        }], title: [{
+            type: Input
+        }], height: [{
+            type: Input
+        }], readOnly: [{
+            type: Input
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PSPredictionsGridComponent, { className: "PSPredictionsGridComponent", filePath: "src/PredictiveStudio/components/ps-predictions-grid.component.ts", lineNumber: 151 }); })();
+//# sourceMappingURL=ps-predictions-grid.component.js.map