import { ChangeDetectorRef, Component, EventEmitter, Input, Output, ViewEncapsulation, inject } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MJButtonDirective } from '@memberjunction/ng-ui-components';
import { PS_AGENT_STARTER_PROMPT } from './ps-agent-starter-prompt';
import { buildActivityFeed, computeHomeKpis, deriveModelEvents, } from '../predictive-studio.view-models';
import * as i0 from "@angular/core";
const _forTrack0 = ($index, $item) => $item.title + $item.when;
function PSHomeComponent_Conditional_73_For_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 39)(1, "div", 40);
    i0.ɵɵelement(2, "i");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(3, "div")(4, "div", 41);
    i0.ɵɵtext(5);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(6, "div", 37);
    i0.ɵɵtext(7);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(8, "div", 42);
    i0.ɵɵtext(9);
    i0.ɵɵelementEnd()()();
} if (rf & 2) {
    const item_r1 = ctx.$implicit;
    i0.ɵɵadvance();
    i0.ɵɵclassMap(item_r1.kind);
    i0.ɵɵadvance();
    i0.ɵɵclassMap(item_r1.icon);
    i0.ɵɵadvance(3);
    i0.ɵɵtextInterpolate(item_r1.title);
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(item_r1.detail);
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(item_r1.when);
} }
function PSHomeComponent_Conditional_73_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 32);
    i0.ɵɵrepeaterCreate(1, PSHomeComponent_Conditional_73_For_2_Template, 10, 7, "div", 39, _forTrack0);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵadvance();
    i0.ɵɵrepeater(ctx_r1.activity);
} }
function PSHomeComponent_Conditional_74_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 33)(1, "span", 43);
    i0.ɵɵelement(2, "i", 44);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(3, "p");
    i0.ɵɵtext(4, "No activity yet. Promote a model or run a scoring batch and it'll show up here.");
    i0.ɵɵelementEnd()();
} }
export { PS_AGENT_STARTER_PROMPT } from './ps-agent-starter-prompt';
/**
 * Home panel — the action-forward landing: a hero "Build a predictive model" band with three entry
 * paths, a vertical recent-activity timeline, and a side rail of weekly KPIs. Fully live:
 *
 * - **KPIs** (published count, active experiments, best holdout AUC, scored-this-week) come from the
 *   cached models/sessions + recent ML scoring runs loaded on demand, via {@link computeHomeKpis}.
 * - **Recent activity** merges recent ML scoring process runs and recent model promotions/archives
 *   into one reverse-chronological feed via {@link buildActivityFeed}.
 *
 * Recent scoring runs are loaded once on init (cheap, capped) — `MJ: Process Runs` isn't bulk-cached
 * because it grows unbounded. 100% entity-agnostic.
 *
 * **"Ask the agent" entry path.** The hero CTA and the agent entry-path card emit {@link askAgent} with a
 * starter prompt string. The host resource (the Studio door's `PSStudioResourceComponent`) reveals the
 * docked Model Development Agent chat seeded with that prompt. The prompt is a deliberately entity-agnostic template
 * ({@link PS_AGENT_STARTER_PROMPT}) — it never names a specific entity/target, so Predictive Studio stays
 * 100% domain-neutral and the agent leads the user through choosing what to predict.
 */
export class PSHomeComponent {
    engine;
    /** Provider to load recent scoring runs through (multi-provider correctness). */
    provider = null;
    /** Acting user for the on-demand scoring-runs load. */
    currentUser = null;
    navigate = new EventEmitter();
    /**
     * Emitted when the user clicks an "Ask the agent" entry path. The payload is the starter prompt to seed
     * the Model Development Agent chat with — the entity-agnostic {@link PS_AGENT_STARTER_PROMPT} by default.
     */
    askAgent = new EventEmitter();
    cdr = inject(ChangeDetectorRef);
    /** Entry-path handler — emits {@link askAgent} with the default entity-agnostic starter prompt. */
    onAskAgent() {
        this.askAgent.emit(PS_AGENT_STARTER_PROMPT);
    }
    /** Derived KPI strip. Starts from the synchronously-available counts, refined once runs load. */
    kpis = { publishedCount: 0, activeExperiments: 0, bestHoldout: '—', scoredThisWeek: '0', experimentRuns: 0 };
    /** Recent-activity timeline. */
    activity = [];
    /** Cached recent scoring runs (loaded on demand). */
    scoringRuns = [];
    async ngOnInit() {
        // Render immediately from cached data, then refine with the on-demand scoring-run load.
        this.rebuild();
        await this.loadScoringRuns();
        this.rebuild();
        this.cdr.detectChanges();
    }
    /** Load the recent ML scoring runs once (cheap, capped) for the KPI + activity feed. */
    async loadScoringRuns() {
        if (!this.provider)
            return;
        try {
            this.scoringRuns = await this.engine.LoadRecentScoringRuns(this.provider, this.currentUser ?? undefined, {
                sinceDays: 7,
                maxRows: 50,
            });
        }
        catch {
            this.scoringRuns = [];
        }
    }
    /** Recompute the KPI strip + activity feed from the current cached data + scoring runs. */
    rebuild() {
        const models = this.engine?.Models ?? [];
        const runningSessions = this.engine?.RunningSessions.length ?? 0;
        const experimentRuns = this.engine?.Iterations.length ?? 0;
        this.kpis = computeHomeKpis(models, runningSessions, this.scoringRuns, experimentRuns);
        const eventSources = models.map((m) => ({
            Name: this.engine.ModelDisplayName(m),
            Algorithm: this.engine.AlgorithmName(m.AlgorithmID),
            Status: m.Status,
            Metrics: m.Metrics,
            HoldoutMetrics: m.HoldoutMetrics,
            UpdatedAt: m.__mj_UpdatedAt,
        }));
        this.activity = buildActivityFeed(this.scoringRuns, deriveModelEvents(eventSources), new Date(), 6);
    }
    static ɵfac = function PSHomeComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PSHomeComponent)(); };
    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PSHomeComponent, selectors: [["ps-home"]], inputs: { engine: "engine", provider: "provider", currentUser: "currentUser" }, outputs: { navigate: "navigate", askAgent: "askAgent" }, decls: 102, vars: 9, consts: [["data-testid", "ps-home-panel", 1, "ps-panel", "ps-home"], ["data-testid", "ps-home-hero", 1, "hero"], [1, "sub"], [1, "hero-stats"], [1, "s"], [1, "n"], [1, "l"], [1, "hero-actions"], ["mjButton", "", "variant", "secondary", "size", "sm", 3, "click"], [1, "fa-solid", "fa-diagram-project"], [1, "hero-ghost", 3, "click"], [1, "fa-solid", "fa-robot"], ["data-testid", "ps-home-paths", 1, "paths"], ["data-testid", "ps-home-path-data", 1, "path", 3, "click"], [1, "ic"], [1, "fa-solid", "fa-table-cells-large"], ["mjButton", "", "variant", "primary", "size", "sm"], [1, "fa-solid", "fa-arrow-right-to-bracket"], ["data-testid", "ps-home-path-template", 1, "path", 3, "click"], [1, "ic", "green"], [1, "fa-solid", "fa-layer-group"], ["mjButton", "", "variant", "secondary", "size", "sm"], [1, "fa-solid", "fa-clone"], ["data-testid", "ps-home-path-agent", 1, "path", 3, "click"], [1, "ic", "purple"], [1, "fa-solid", "fa-comment-dots"], [1, "lower"], [1, "ps-card"], [1, "ps-card-head"], [1, "fa-solid", "fa-clock-rotate-left", 2, "color", "var(--mj-brand-primary)"], [1, "ps-spacer"], [1, "ps-card-body"], [1, "feed"], [1, "ps-empty", 2, "padding", "32px 16px"], [1, "ps-col"], [1, "fa-solid", "fa-gauge-high", 2, "color", "var(--mj-brand-primary)"], [1, "mini-kpi"], [1, "ps-muted", "ps-small"], [1, "v"], [1, "fitem"], [1, "ev"], [1, "ftitle"], [1, "when"], [1, "ps-empty-ico"], [1, "fa-solid", "fa-clock-rotate-left"]], template: function PSHomeComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "h2");
            i0.ɵɵtext(3, "Build a predictive model");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(4, "div", 2);
            i0.ɵɵtext(5, " Train a model on your own data, start from a proven template, or let the Model Dev Agent design the pipeline for you. ");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(6, "div", 3)(7, "div", 4)(8, "div", 5);
            i0.ɵɵtext(9);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(10, "div", 6);
            i0.ɵɵtext(11, "Published");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(12, "div", 4)(13, "div", 5);
            i0.ɵɵtext(14);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(15, "div", 6);
            i0.ɵɵtext(16, "Active Experiments");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(17, "div", 4)(18, "div", 5);
            i0.ɵɵtext(19);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(20, "div", 6);
            i0.ɵɵtext(21, "Best Holdout AUC");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(22, "div", 4)(23, "div", 5);
            i0.ɵɵtext(24);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(25, "div", 6);
            i0.ɵɵtext(26, "Scored this week");
            i0.ɵɵelementEnd()()();
            i0.ɵɵelementStart(27, "div", 7)(28, "button", 8);
            i0.ɵɵlistener("click", function PSHomeComponent_Template_button_click_28_listener() { return ctx.navigate.emit("pipelines"); });
            i0.ɵɵelement(29, "i", 9);
            i0.ɵɵtext(30, " New Training Pipeline ");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(31, "button", 10);
            i0.ɵɵlistener("click", function PSHomeComponent_Template_button_click_31_listener() { return ctx.onAskAgent(); });
            i0.ɵɵelement(32, "i", 11);
            i0.ɵɵtext(33, " Ask the Model Dev Agent ");
            i0.ɵɵelementEnd()()();
            i0.ɵɵelementStart(34, "div", 12)(35, "div", 13);
            i0.ɵɵlistener("click", function PSHomeComponent_Template_div_click_35_listener() { return ctx.navigate.emit("pipelines"); });
            i0.ɵɵelementStart(36, "div", 14);
            i0.ɵɵelement(37, "i", 15);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(38, "h4");
            i0.ɵɵtext(39, "Start from data");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(40, "p");
            i0.ɵɵtext(41, "Point Studio at any entity's records, pick the target you want to predict, and we'll profile features automatically.");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(42, "button", 16);
            i0.ɵɵelement(43, "i", 17);
            i0.ɵɵtext(44, " Choose dataset");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(45, "div", 18);
            i0.ɵɵlistener("click", function PSHomeComponent_Template_div_click_45_listener() { return ctx.navigate.emit("catalog"); });
            i0.ɵɵelementStart(46, "div", 19);
            i0.ɵɵelement(47, "i", 20);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(48, "h4");
            i0.ɵɵtext(49, "Use a template");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(50, "p");
            i0.ɵɵtext(51, "Browse the algorithm catalog with a use-case guide that ranks each algorithm for your scenario.");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(52, "button", 21);
            i0.ɵɵelement(53, "i", 22);
            i0.ɵɵtext(54, " Browse catalog");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(55, "div", 23);
            i0.ɵɵlistener("click", function PSHomeComponent_Template_div_click_55_listener() { return ctx.onAskAgent(); });
            i0.ɵɵelementStart(56, "div", 24);
            i0.ɵɵelement(57, "i", 11);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(58, "h4");
            i0.ɵɵtext(59, "Ask the agent");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(60, "p");
            i0.ɵɵtext(61, "Describe the goal in plain English. The agent proposes algorithms, features, and a budget.");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(62, "button", 21);
            i0.ɵɵelement(63, "i", 25);
            i0.ɵɵtext(64, " Open agent");
            i0.ɵɵelementEnd()()();
            i0.ɵɵelementStart(65, "div", 26)(66, "div", 27)(67, "div", 28);
            i0.ɵɵelement(68, "i", 29);
            i0.ɵɵelementStart(69, "h3");
            i0.ɵɵtext(70, "Recent Activity");
            i0.ɵɵelementEnd();
            i0.ɵɵelement(71, "span", 30);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(72, "div", 31);
            i0.ɵɵconditionalCreate(73, PSHomeComponent_Conditional_73_Template, 3, 0, "div", 32)(74, PSHomeComponent_Conditional_74_Template, 5, 0, "div", 33);
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(75, "div", 34)(76, "div", 27)(77, "div", 28);
            i0.ɵɵelement(78, "i", 35);
            i0.ɵɵelementStart(79, "h3");
            i0.ɵɵtext(80, "This Week");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(81, "div", 31)(82, "div", 36)(83, "div", 37);
            i0.ɵɵtext(84, "Records scored");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(85, "div", 38);
            i0.ɵɵtext(86);
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(87, "div", 36)(88, "div", 37);
            i0.ɵɵtext(89, "Best holdout AUC");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(90, "div", 38);
            i0.ɵɵtext(91);
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(92, "div", 36)(93, "div", 37);
            i0.ɵɵtext(94, "Experiment runs");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(95, "div", 38);
            i0.ɵɵtext(96);
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(97, "div", 36)(98, "div", 37);
            i0.ɵɵtext(99, "Published models");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(100, "div", 38);
            i0.ɵɵtext(101);
            i0.ɵɵelementEnd()()()()()()();
        } if (rf & 2) {
            i0.ɵɵadvance(9);
            i0.ɵɵtextInterpolate(ctx.kpis.publishedCount);
            i0.ɵɵadvance(5);
            i0.ɵɵtextInterpolate(ctx.kpis.activeExperiments);
            i0.ɵɵadvance(5);
            i0.ɵɵtextInterpolate(ctx.kpis.bestHoldout);
            i0.ɵɵadvance(5);
            i0.ɵɵtextInterpolate(ctx.kpis.scoredThisWeek);
            i0.ɵɵadvance(49);
            i0.ɵɵconditional(ctx.activity.length > 0 ? 73 : 74);
            i0.ɵɵadvance(13);
            i0.ɵɵtextInterpolate(ctx.kpis.scoredThisWeek);
            i0.ɵɵadvance(5);
            i0.ɵɵtextInterpolate(ctx.kpis.bestHoldout);
            i0.ɵɵadvance(5);
            i0.ɵɵtextInterpolate(ctx.kpis.experimentRuns);
            i0.ɵɵadvance(5);
            i0.ɵɵtextInterpolate(ctx.kpis.publishedCount);
        } }, dependencies: [CommonModule, MJButtonDirective], 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: 10px;\n  box-shadow: var(--mj-shadow-sm);\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: 10px; padding: 16px 18px; box-shadow: var(--mj-shadow-sm);\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: 150px 1fr 48px; align-items: center; gap: 10px; padding: 5px 0; }\n.ps-fbar .track { height: 14px; border-radius: 5px; background: var(--mj-bg-surface-sunken); overflow: hidden; }\n.ps-fbar .track > span { display: block; height: 100%; background: var(--mj-brand-primary); }\n.ps-fbar .track > span.warn { background: var(--mj-status-warning); }\n.ps-fbar .name { color: var(--mj-text-secondary); }\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: 10px;\n  box-shadow: var(--mj-shadow-sm); 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", ".ps-home { display: flex; flex-direction: column; gap: 18px; }\n\n/* Hero \u2014 intentional brand gradient band (categorical/branded surface).\n   The gradient uses brand tokens; text on it uses --mj-text-inverse. */\n.ps-home .hero {\n  position: relative; overflow: hidden; border-radius: 14px;\n  background: linear-gradient(120deg,\n      color-mix(in srgb, var(--mj-brand-primary) 78%, black) 0%,\n      var(--mj-brand-primary) 55%,\n      color-mix(in srgb, var(--mj-brand-primary) 60%, var(--ps-node-embedding)) 100%);\n  color: var(--mj-text-inverse);\n  padding: 26px 28px; box-shadow: var(--mj-shadow-lg);\n}\n.ps-home .hero::after {\n  content: ''; position: absolute; right: -60px; top: -60px; width: 320px; height: 320px;\n  border-radius: 50%; background: radial-gradient(circle, rgba(255, 255, 255, .14), transparent 70%);\n}\n.ps-home .hero h2 { font-size: 24px; letter-spacing: -.02em; color: var(--mj-text-inverse); }\n.ps-home .hero .sub { color: color-mix(in srgb, var(--mj-text-inverse) 80%, transparent); margin-top: 6px; max-width: 560px; font-size: 13.5px; }\n.ps-home .hero-stats { display: flex; gap: 26px; margin-top: 18px; position: relative; z-index: 1; }\n.ps-home .hero-stats .s .n { font-size: 22px; font-weight: 720; }\n.ps-home .hero-stats .s .l { font-size: 11.5px; color: color-mix(in srgb, var(--mj-text-inverse) 72%, transparent); text-transform: uppercase; letter-spacing: .05em; }\n.ps-home .hero-actions { margin-top: 20px; position: relative; z-index: 1; display: flex; gap: 10px; }\n.ps-home .hero-ghost {\n  display: inline-flex; align-items: center; gap: 7px;\n  background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .28);\n  color: var(--mj-text-inverse); border-radius: 8px; padding: 6px 14px;\n  font-weight: 600; font-size: 13px; cursor: pointer;\n}\n.ps-home .hero-ghost:hover { background: rgba(255, 255, 255, .2); }\n\n/* entry paths */\n.ps-home .paths { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }\n.ps-home .path {\n  border: 1px solid var(--mj-border-default); border-radius: 10px;\n  background: var(--mj-bg-surface); padding: 18px; cursor: pointer; transition: transform .08s, box-shadow .08s, border-color .08s;\n}\n.ps-home .path:hover { border-color: var(--mj-brand-primary); box-shadow: var(--mj-shadow-md); transform: translateY(-2px); }\n.ps-home .path .ic {\n  width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; font-size: 20px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface)); color: var(--mj-brand-primary);\n}\n.ps-home .path .ic.green { background: var(--mj-status-success-bg); color: var(--mj-status-success-text); }\n.ps-home .path .ic.purple { background: color-mix(in srgb, var(--ps-node-embedding) 14%, var(--mj-bg-surface)); color: var(--ps-node-embedding); }\n.ps-home .path h4 { margin-top: 12px; font-size: 15px; color: var(--mj-text-primary); }\n.ps-home .path p { color: var(--mj-text-secondary); font-size: 12.5px; margin: 6px 0 12px; }\n\n/* lower split */\n.ps-home .lower { display: grid; grid-template-columns: 1.5fr 1fr; gap: 16px; align-items: start; }\n@media (max-width: 980px) { .ps-home .lower, .ps-home .paths { grid-template-columns: 1fr; } }\n\n.ps-home .feed { position: relative; }\n.ps-home .fitem { display: grid; grid-template-columns: 34px 1fr; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--mj-border-subtle); }\n.ps-home .fitem:last-child { border-bottom: none; }\n.ps-home .ftitle { color: var(--mj-text-primary); }\n.ps-home .fitem .ev { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; color: var(--mj-text-inverse); }\n.ps-home .fitem .when { color: var(--mj-text-muted); font-size: 11.5px; margin-top: 2px; }\n.ps-home .ev.promote { background: var(--mj-status-success); }\n.ps-home .ev.run { background: var(--mj-brand-primary); }\n.ps-home .ev.warn { background: var(--mj-status-warning); }\n.ps-home .ev.archive { background: var(--mj-text-disabled); }\n\n.ps-home .mini-kpi { display: flex; align-items: center; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--mj-border-subtle); }\n.ps-home .mini-kpi:last-child { border-bottom: none; }\n.ps-home .mini-kpi .v { font-weight: 720; font-size: 18px; color: var(--mj-text-primary); }\n"], encapsulation: 2 });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PSHomeComponent, [{
        type: Component,
        args: [{ standalone: true, selector: 'ps-home', imports: [CommonModule, MJButtonDirective], encapsulation: ViewEncapsulation.None, template: `
    <div class="ps-panel ps-home" data-testid="ps-home-panel">
      <!-- Hero -->
      <div class="hero" data-testid="ps-home-hero">
        <h2>Build a predictive model</h2>
        <div class="sub">
          Train a model on your own data, start from a proven template, or let the Model Dev Agent
          design the pipeline for you.
        </div>
        <div class="hero-stats">
          <div class="s"><div class="n">{{ kpis.publishedCount }}</div><div class="l">Published</div></div>
          <div class="s"><div class="n">{{ kpis.activeExperiments }}</div><div class="l">Active Experiments</div></div>
          <div class="s"><div class="n">{{ kpis.bestHoldout }}</div><div class="l">Best Holdout AUC</div></div>
          <div class="s"><div class="n">{{ kpis.scoredThisWeek }}</div><div class="l">Scored this week</div></div>
        </div>
        <div class="hero-actions">
          <button mjButton variant="secondary" size="sm" (click)="navigate.emit('pipelines')">
            <i class="fa-solid fa-diagram-project"></i> New Training Pipeline
          </button>
          <button class="hero-ghost" (click)="onAskAgent()">
            <i class="fa-solid fa-robot"></i> Ask the Model Dev Agent
          </button>
        </div>
      </div>

      <!-- Entry paths -->
      <div class="paths" data-testid="ps-home-paths">
        <div class="path" data-testid="ps-home-path-data" (click)="navigate.emit('pipelines')">
          <div class="ic"><i class="fa-solid fa-table-cells-large"></i></div>
          <h4>Start from data</h4>
          <p>Point Studio at any entity's records, pick the target you want to predict, and we'll profile features automatically.</p>
          <button mjButton variant="primary" size="sm"><i class="fa-solid fa-arrow-right-to-bracket"></i> Choose dataset</button>
        </div>
        <div class="path" data-testid="ps-home-path-template" (click)="navigate.emit('catalog')">
          <div class="ic green"><i class="fa-solid fa-layer-group"></i></div>
          <h4>Use a template</h4>
          <p>Browse the algorithm catalog with a use-case guide that ranks each algorithm for your scenario.</p>
          <button mjButton variant="secondary" size="sm"><i class="fa-solid fa-clone"></i> Browse catalog</button>
        </div>
        <div class="path" data-testid="ps-home-path-agent" (click)="onAskAgent()">
          <div class="ic purple"><i class="fa-solid fa-robot"></i></div>
          <h4>Ask the agent</h4>
          <p>Describe the goal in plain English. The agent proposes algorithms, features, and a budget.</p>
          <button mjButton variant="secondary" size="sm"><i class="fa-solid fa-comment-dots"></i> Open agent</button>
        </div>
      </div>

      <!-- Lower: timeline + side rail -->
      <div class="lower">
        <div class="ps-card">
          <div class="ps-card-head">
            <i class="fa-solid fa-clock-rotate-left" style="color: var(--mj-brand-primary)"></i>
            <h3>Recent Activity</h3>
            <span class="ps-spacer"></span>
          </div>
          <div class="ps-card-body">
            @if (activity.length > 0) {
              <div class="feed">
                @for (item of activity; track item.title + item.when) {
                  <div class="fitem">
                    <div class="ev" [class]="item.kind"><i [class]="item.icon"></i></div>
                    <div>
                      <div class="ftitle">{{ item.title }}</div>
                      <div class="ps-muted ps-small">{{ item.detail }}</div>
                      <div class="when">{{ item.when }}</div>
                    </div>
                  </div>
                }
              </div>
            } @else {
              <div class="ps-empty" style="padding:32px 16px">
                <span class="ps-empty-ico"><i class="fa-solid fa-clock-rotate-left"></i></span>
                <p>No activity yet. Promote a model or run a scoring batch and it'll show up here.</p>
              </div>
            }
          </div>
        </div>

        <div class="ps-col">
          <div class="ps-card">
            <div class="ps-card-head">
              <i class="fa-solid fa-gauge-high" style="color: var(--mj-brand-primary)"></i>
              <h3>This Week</h3>
            </div>
            <div class="ps-card-body">
              <div class="mini-kpi"><div class="ps-muted ps-small">Records scored</div><div class="v">{{ kpis.scoredThisWeek }}</div></div>
              <div class="mini-kpi"><div class="ps-muted ps-small">Best holdout AUC</div><div class="v">{{ kpis.bestHoldout }}</div></div>
              <div class="mini-kpi"><div class="ps-muted ps-small">Experiment runs</div><div class="v">{{ kpis.experimentRuns }}</div></div>
              <div class="mini-kpi"><div class="ps-muted ps-small">Published models</div><div class="v">{{ kpis.publishedCount }}</div></div>
            </div>
          </div>
        </div>
      </div>
    </div>
  `, 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: 10px;\n  box-shadow: var(--mj-shadow-sm);\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: 10px; padding: 16px 18px; box-shadow: var(--mj-shadow-sm);\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: 150px 1fr 48px; align-items: center; gap: 10px; padding: 5px 0; }\n.ps-fbar .track { height: 14px; border-radius: 5px; background: var(--mj-bg-surface-sunken); overflow: hidden; }\n.ps-fbar .track > span { display: block; height: 100%; background: var(--mj-brand-primary); }\n.ps-fbar .track > span.warn { background: var(--mj-status-warning); }\n.ps-fbar .name { color: var(--mj-text-secondary); }\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: 10px;\n  box-shadow: var(--mj-shadow-sm); 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", ".ps-home { display: flex; flex-direction: column; gap: 18px; }\n\n/* Hero \u2014 intentional brand gradient band (categorical/branded surface).\n   The gradient uses brand tokens; text on it uses --mj-text-inverse. */\n.ps-home .hero {\n  position: relative; overflow: hidden; border-radius: 14px;\n  background: linear-gradient(120deg,\n      color-mix(in srgb, var(--mj-brand-primary) 78%, black) 0%,\n      var(--mj-brand-primary) 55%,\n      color-mix(in srgb, var(--mj-brand-primary) 60%, var(--ps-node-embedding)) 100%);\n  color: var(--mj-text-inverse);\n  padding: 26px 28px; box-shadow: var(--mj-shadow-lg);\n}\n.ps-home .hero::after {\n  content: ''; position: absolute; right: -60px; top: -60px; width: 320px; height: 320px;\n  border-radius: 50%; background: radial-gradient(circle, rgba(255, 255, 255, .14), transparent 70%);\n}\n.ps-home .hero h2 { font-size: 24px; letter-spacing: -.02em; color: var(--mj-text-inverse); }\n.ps-home .hero .sub { color: color-mix(in srgb, var(--mj-text-inverse) 80%, transparent); margin-top: 6px; max-width: 560px; font-size: 13.5px; }\n.ps-home .hero-stats { display: flex; gap: 26px; margin-top: 18px; position: relative; z-index: 1; }\n.ps-home .hero-stats .s .n { font-size: 22px; font-weight: 720; }\n.ps-home .hero-stats .s .l { font-size: 11.5px; color: color-mix(in srgb, var(--mj-text-inverse) 72%, transparent); text-transform: uppercase; letter-spacing: .05em; }\n.ps-home .hero-actions { margin-top: 20px; position: relative; z-index: 1; display: flex; gap: 10px; }\n.ps-home .hero-ghost {\n  display: inline-flex; align-items: center; gap: 7px;\n  background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .28);\n  color: var(--mj-text-inverse); border-radius: 8px; padding: 6px 14px;\n  font-weight: 600; font-size: 13px; cursor: pointer;\n}\n.ps-home .hero-ghost:hover { background: rgba(255, 255, 255, .2); }\n\n/* entry paths */\n.ps-home .paths { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }\n.ps-home .path {\n  border: 1px solid var(--mj-border-default); border-radius: 10px;\n  background: var(--mj-bg-surface); padding: 18px; cursor: pointer; transition: transform .08s, box-shadow .08s, border-color .08s;\n}\n.ps-home .path:hover { border-color: var(--mj-brand-primary); box-shadow: var(--mj-shadow-md); transform: translateY(-2px); }\n.ps-home .path .ic {\n  width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; font-size: 20px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface)); color: var(--mj-brand-primary);\n}\n.ps-home .path .ic.green { background: var(--mj-status-success-bg); color: var(--mj-status-success-text); }\n.ps-home .path .ic.purple { background: color-mix(in srgb, var(--ps-node-embedding) 14%, var(--mj-bg-surface)); color: var(--ps-node-embedding); }\n.ps-home .path h4 { margin-top: 12px; font-size: 15px; color: var(--mj-text-primary); }\n.ps-home .path p { color: var(--mj-text-secondary); font-size: 12.5px; margin: 6px 0 12px; }\n\n/* lower split */\n.ps-home .lower { display: grid; grid-template-columns: 1.5fr 1fr; gap: 16px; align-items: start; }\n@media (max-width: 980px) { .ps-home .lower, .ps-home .paths { grid-template-columns: 1fr; } }\n\n.ps-home .feed { position: relative; }\n.ps-home .fitem { display: grid; grid-template-columns: 34px 1fr; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--mj-border-subtle); }\n.ps-home .fitem:last-child { border-bottom: none; }\n.ps-home .ftitle { color: var(--mj-text-primary); }\n.ps-home .fitem .ev { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; color: var(--mj-text-inverse); }\n.ps-home .fitem .when { color: var(--mj-text-muted); font-size: 11.5px; margin-top: 2px; }\n.ps-home .ev.promote { background: var(--mj-status-success); }\n.ps-home .ev.run { background: var(--mj-brand-primary); }\n.ps-home .ev.warn { background: var(--mj-status-warning); }\n.ps-home .ev.archive { background: var(--mj-text-disabled); }\n\n.ps-home .mini-kpi { display: flex; align-items: center; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--mj-border-subtle); }\n.ps-home .mini-kpi:last-child { border-bottom: none; }\n.ps-home .mini-kpi .v { font-weight: 720; font-size: 18px; color: var(--mj-text-primary); }\n"] }]
    }], null, { engine: [{
            type: Input
        }], provider: [{
            type: Input
        }], currentUser: [{
            type: Input
        }], navigate: [{
            type: Output
        }], askAgent: [{
            type: Output
        }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PSHomeComponent, { className: "PSHomeComponent", filePath: "src/PredictiveStudio/components/ps-home.component.ts", lineNumber: 140 }); })();
//# sourceMappingURL=ps-home.component.js.map