@memberjunction/ng-core-entity-forms 3.4.0 → 4.0.0

package/dist/lib/custom/Tests/test-run-form.component.js

@@ -27,16 +27,16 @@ import * as i9 from "./entity-link-pill.component";
 const _c0 = () => [1, 2, 3];
 const _c1 = () => [1, 2];
 const _c2 = () => [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
-function TestRunFormComponentExtended_div_1_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 65);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.retryLoad()); });
-    i0.ɵɵelement(1, "i", 66);
+    i0.ɵɵelementStart(0, "div", 64);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.retryLoad()); });
+    i0.ɵɵelement(1, "i", 65);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "button", 67);
-    i0.ɵɵelement(5, "i", 21);
+    i0.ɵɵelementStart(4, "button", 66);
+    i0.ɵɵelement(5, "i", 20);
     i0.ɵɵtext(6, " Retry ");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -44,13 +44,13 @@ function TestRunFormComponentExtended_div_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(ctx_r1.error);
 } }
-function TestRunFormComponentExtended_li_10_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_10_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "li");
-    i0.ɵɵelement(1, "i", 9);
+    i0.ɵɵelement(1, "i", 8);
     i0.ɵɵelementStart(2, "a", 4);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_li_10_Template_a_click_2_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.openTest()); });
-    i0.ɵɵelement(3, "i", 68);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_10_Template_a_click_2_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.openTest()); });
+    i0.ɵɵelement(3, "i", 67);
     i0.ɵɵelementStart(4, "span", 6);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd()()();
@@ -59,9 +59,9 @@ function TestRunFormComponentExtended_li_10_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate(ctx_r1.test.Name);
 } }
-function TestRunFormComponentExtended_span_27_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 69);
-    i0.ɵɵelement(1, "i", 68);
+function TestRunFormComponentExtended_Conditional_27_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 17);
+    i0.ɵɵelement(1, "i", 67);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -69,33 +69,33 @@ function TestRunFormComponentExtended_span_27_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", ctx_r1.test.Type, " ");
 } }
-function TestRunFormComponentExtended_span_28_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 69);
-    i0.ɵɵelement(1, "i", 70);
+function TestRunFormComponentExtended_Conditional_28_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 17);
+    i0.ɵɵelement(1, "i", 68);
     i0.ɵɵtext(2, " Auto-refreshing ");
     i0.ɵɵelementEnd();
 } }
-function TestRunFormComponentExtended_div_66_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 71);
-    i0.ɵɵelement(1, "div", 72);
+function TestRunFormComponentExtended_Conditional_66_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 34);
+    i0.ɵɵelement(1, "div", 69);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
     i0.ɵɵstyleProp("width", ctx_r1.getScorePercentage(), "%")("background-color", ctx_r1.getStatusColor());
 } }
-function TestRunFormComponentExtended_div_75_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 71);
-    i0.ɵɵelement(1, "div", 72);
+function TestRunFormComponentExtended_Conditional_75_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 34);
+    i0.ɵɵelement(1, "div", 69);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
     i0.ɵɵstyleProp("width", ctx_r1.getPassRatePercentage(), "%")("background-color", ctx_r1.getStatusColor());
 } }
-function TestRunFormComponentExtended_div_84_span_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 77);
-    i0.ɵɵelement(1, "i", 78);
+function TestRunFormComponentExtended_Conditional_84_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 70);
+    i0.ɵɵelement(1, "i", 73);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -103,11 +103,11 @@ function TestRunFormComponentExtended_div_84_span_1_Template(rf, ctx) { if (rf &
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", ctx_r1.record.RunByUser, " ");
 } }
-function TestRunFormComponentExtended_div_84_span_2_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_84_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 79);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_84_span_2_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.openTestSuiteRun()); });
-    i0.ɵɵelement(1, "i", 80);
+    i0.ɵɵelementStart(0, "span", 74);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_84_Conditional_2_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.openTestSuiteRun()); });
+    i0.ɵɵelement(1, "i", 75);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -115,27 +115,29 @@ function TestRunFormComponentExtended_div_84_span_2_Template(rf, ctx) { if (rf &
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" Part of Suite Run (Seq: ", ctx_r1.record.Sequence, ") ");
 } }
-function TestRunFormComponentExtended_div_84_mj_entity_link_pill_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-entity-link-pill", 81);
+function TestRunFormComponentExtended_Conditional_84_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-entity-link-pill", 72);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("entityName", ctx_r1.record.TargetLogEntity)("recordId", ctx_r1.record.TargetLogID);
 } }
-function TestRunFormComponentExtended_div_84_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 73);
-    i0.ɵɵtemplate(1, TestRunFormComponentExtended_div_84_span_1_Template, 3, 1, "span", 74)(2, TestRunFormComponentExtended_div_84_span_2_Template, 3, 1, "span", 75)(3, TestRunFormComponentExtended_div_84_mj_entity_link_pill_3_Template, 1, 2, "mj-entity-link-pill", 76);
+function TestRunFormComponentExtended_Conditional_84_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 37);
+    i0.ɵɵconditionalCreate(1, TestRunFormComponentExtended_Conditional_84_Conditional_1_Template, 3, 1, "span", 70);
+    i0.ɵɵconditionalCreate(2, TestRunFormComponentExtended_Conditional_84_Conditional_2_Template, 3, 1, "span", 71);
+    i0.ɵɵconditionalCreate(3, TestRunFormComponentExtended_Conditional_84_Conditional_3_Template, 1, 2, "mj-entity-link-pill", 72);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.record.RunByUser);
+    i0.ɵɵconditional(ctx_r1.record.RunByUser ? 1 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.testSuiteRun);
+    i0.ɵɵconditional(ctx_r1.testSuiteRun ? 2 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.record.TargetLogEntityID && ctx_r1.record.TargetLogID);
+    i0.ɵɵconditional(ctx_r1.record.TargetLogEntityID && ctx_r1.record.TargetLogID ? 3 : -1);
 } }
-function TestRunFormComponentExtended_div_85_div_4_span_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 92);
+function TestRunFormComponentExtended_Conditional_85_Conditional_4_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 83);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -143,91 +145,93 @@ function TestRunFormComponentExtended_div_85_div_4_span_1_Template(rf, ctx) { if
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(tag_r6);
 } }
-function TestRunFormComponentExtended_div_85_div_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 90);
-    i0.ɵɵtemplate(1, TestRunFormComponentExtended_div_85_div_4_span_1_Template, 2, 1, "span", 91);
+function TestRunFormComponentExtended_Conditional_85_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 79);
+    i0.ɵɵrepeaterCreate(1, TestRunFormComponentExtended_Conditional_85_Conditional_4_For_2_Template, 2, 1, "span", 83, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r1.tags);
+    i0.ɵɵrepeater(ctx_r1.tags);
 } }
-function TestRunFormComponentExtended_div_85_span_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 93);
+function TestRunFormComponentExtended_Conditional_85_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 80);
     i0.ɵɵtext(1, "No tags");
     i0.ɵɵelementEnd();
 } }
-function TestRunFormComponentExtended_div_85_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_85_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 82)(1, "div", 83)(2, "span", 84);
-    i0.ɵɵelement(3, "i", 85);
-    i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(4, TestRunFormComponentExtended_div_85_div_4_Template, 2, 1, "div", 86)(5, TestRunFormComponentExtended_div_85_span_5_Template, 2, 0, "span", 87);
-    i0.ɵɵelementStart(6, "button", 88);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_85_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.startEditingTags()); });
-    i0.ɵɵelement(7, "i", 89);
+    i0.ɵɵelementStart(0, "div", 38)(1, "div", 76)(2, "span", 77);
+    i0.ɵɵelement(3, "i", 78);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(4, TestRunFormComponentExtended_Conditional_85_Conditional_4_Template, 3, 0, "div", 79);
+    i0.ɵɵconditionalCreate(5, TestRunFormComponentExtended_Conditional_85_Conditional_5_Template, 2, 0, "span", 80);
+    i0.ɵɵelementStart(6, "button", 81);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_85_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.startEditingTags()); });
+    i0.ɵɵelement(7, "i", 82);
     i0.ɵɵtext(8, " Add ");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance(4);
-    i0.ɵɵproperty("ngIf", ctx_r1.tags.length > 0);
+    i0.ɵɵconditional(ctx_r1.tags.length > 0 ? 4 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.tags.length === 0);
+    i0.ɵɵconditional(ctx_r1.tags.length === 0 ? 5 : -1);
 } }
-function TestRunFormComponentExtended_div_86_span_7_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_86_For_8_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 108);
+    i0.ɵɵelementStart(0, "span", 88);
     i0.ɵɵtext(1);
-    i0.ɵɵelementStart(2, "button", 109);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_86_span_7_Template_button_click_2_listener() { const tag_r9 = i0.ɵɵrestoreView(_r8).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.removeTag(tag_r9)); });
-    i0.ɵɵelement(3, "i", 110);
+    i0.ɵɵelementStart(2, "button", 97);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_86_For_8_Template_button_click_2_listener() { const tag_r9 = i0.ɵɵrestoreView(_r8).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.removeTag(tag_r9)); });
+    i0.ɵɵelement(3, "i", 98);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const tag_r9 = ctx.$implicit;
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", tag_r9, " ");
 } }
-function TestRunFormComponentExtended_div_86_span_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 111);
+function TestRunFormComponentExtended_Conditional_86_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 89);
     i0.ɵɵtext(1, "No tags yet");
     i0.ɵɵelementEnd();
 } }
-function TestRunFormComponentExtended_div_86_i_15_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 112);
+function TestRunFormComponentExtended_Conditional_86_Conditional_16_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 95);
 } }
-function TestRunFormComponentExtended_div_86_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_86_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 94)(1, "div", 95)(2, "span", 96);
-    i0.ɵɵelement(3, "i", 85);
+    i0.ɵɵelementStart(0, "div", 39)(1, "div", 84)(2, "span", 85);
+    i0.ɵɵelement(3, "i", 78);
     i0.ɵɵtext(4, " Edit Tags");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div", 97)(6, "div", 98);
-    i0.ɵɵtemplate(7, TestRunFormComponentExtended_div_86_span_7_Template, 4, 1, "span", 99)(8, TestRunFormComponentExtended_div_86_span_8_Template, 2, 0, "span", 100);
+    i0.ɵɵelementStart(5, "div", 86)(6, "div", 87);
+    i0.ɵɵrepeaterCreate(7, TestRunFormComponentExtended_Conditional_86_For_8_Template, 4, 1, "span", 88, i0.ɵɵrepeaterTrackByIdentity);
+    i0.ɵɵconditionalCreate(9, TestRunFormComponentExtended_Conditional_86_Conditional_9_Template, 2, 0, "span", 89);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "div", 101)(10, "input", 102);
-    i0.ɵɵtwoWayListener("ngModelChange", function TestRunFormComponentExtended_div_86_Template_input_ngModelChange_10_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.newTag, $event) || (ctx_r1.newTag = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵlistener("keyup.enter", function TestRunFormComponentExtended_div_86_Template_input_keyup_enter_10_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.addTag()); });
+    i0.ɵɵelementStart(10, "div", 90)(11, "input", 91);
+    i0.ɵɵtwoWayListener("ngModelChange", function TestRunFormComponentExtended_Conditional_86_Template_input_ngModelChange_11_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.newTag, $event) || (ctx_r1.newTag = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("keyup.enter", function TestRunFormComponentExtended_Conditional_86_Template_input_keyup_enter_11_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.addTag()); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(11, "button", 103);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_86_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.addTag()); });
-    i0.ɵɵelement(12, "i", 89);
+    i0.ɵɵelementStart(12, "button", 92);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_86_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.addTag()); });
+    i0.ɵɵelement(13, "i", 82);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(13, "div", 104)(14, "button", 105);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_86_Template_button_click_14_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.saveTags()); });
-    i0.ɵɵtemplate(15, TestRunFormComponentExtended_div_86_i_15_Template, 1, 0, "i", 106);
-    i0.ɵɵtext(16);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(17, "button", 107);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_86_Template_button_click_17_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.cancelEditingTags()); });
-    i0.ɵɵtext(18, "Cancel");
+    i0.ɵɵelementStart(14, "div", 93)(15, "button", 94);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_86_Template_button_click_15_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.saveTags()); });
+    i0.ɵɵconditionalCreate(16, TestRunFormComponentExtended_Conditional_86_Conditional_16_Template, 1, 0, "i", 95);
+    i0.ɵɵtext(17);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(18, "button", 96);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_86_Template_button_click_18_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.cancelEditingTags()); });
+    i0.ɵɵtext(19, "Cancel");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance(7);
-    i0.ɵɵproperty("ngForOf", ctx_r1.tags);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.tags.length === 0);
+    i0.ɵɵrepeater(ctx_r1.tags);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.tags.length === 0 ? 9 : -1);
     i0.ɵɵadvance(2);
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.newTag);
     i0.ɵɵadvance();
@@ -235,12 +239,12 @@ function TestRunFormComponentExtended_div_86_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(3);
     i0.ɵɵproperty("disabled", ctx_r1.savingTags);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.savingTags);
+    i0.ɵɵconditional(ctx_r1.savingTags ? 16 : -1);
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", ctx_r1.savingTags ? "Saving..." : "Save", " ");
 } }
-function TestRunFormComponentExtended_span_101_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 113);
+function TestRunFormComponentExtended_Conditional_101_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 48);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -248,8 +252,8 @@ function TestRunFormComponentExtended_span_101_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(ctx_r1.aiAgentRuns.length + ctx_r1.aiPromptRuns.length);
 } }
-function TestRunFormComponentExtended_span_106_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 113);
+function TestRunFormComponentExtended_Conditional_106_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 48);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -257,11 +261,11 @@ function TestRunFormComponentExtended_span_106_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(ctx_r1.feedbacks.length);
 } }
-function TestRunFormComponentExtended_button_111_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_111_Template(rf, ctx) { if (rf & 1) {
     const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 114);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_button_111_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.changeTab("log")); });
-    i0.ɵɵelement(1, "i", 115);
+    i0.ɵɵelementStart(0, "button", 99);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_111_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.changeTab("log")); });
+    i0.ɵɵelement(1, "i", 100);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "Log");
     i0.ɵɵelementEnd()();
@@ -270,11 +274,11 @@ function TestRunFormComponentExtended_button_111_Template(rf, ctx) { if (rf & 1)
     i0.ɵɵclassProp("active", ctx_r1.activeTab === "log");
     i0.ɵɵattribute("aria-selected", ctx_r1.activeTab === "log");
 } }
-function TestRunFormComponentExtended_div_113_div_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "div", 137);
+function TestRunFormComponentExtended_Conditional_113_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "div", 104);
 } }
-function TestRunFormComponentExtended_div_113_div_16_div_8_div_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 150);
+function TestRunFormComponentExtended_Conditional_113_Conditional_16_For_9_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 130);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -282,8 +286,8 @@ function TestRunFormComponentExtended_div_113_div_16_div_8_div_6_Template(rf, ct
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(check_r12.message);
 } }
-function TestRunFormComponentExtended_div_113_div_16_div_8_div_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 151)(1, "span", 152);
+function TestRunFormComponentExtended_Conditional_113_Conditional_16_For_9_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 131)(1, "span", 132);
     i0.ɵɵtext(2, "Weight:");
     i0.ɵɵelementEnd();
     i0.ɵɵtext(3);
@@ -293,90 +297,90 @@ function TestRunFormComponentExtended_div_113_div_16_div_8_div_7_Template(rf, ct
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", check_r12.weight, " ");
 } }
-function TestRunFormComponentExtended_div_113_div_16_div_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 143)(1, "div", 144);
-    i0.ɵɵelement(2, "i", 145);
+function TestRunFormComponentExtended_Conditional_113_Conditional_16_For_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 125)(1, "div", 126);
+    i0.ɵɵelement(2, "i", 127);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 146)(4, "div", 147);
+    i0.ɵɵelementStart(3, "div", 128)(4, "div", 129);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(6, TestRunFormComponentExtended_div_113_div_16_div_8_div_6_Template, 2, 1, "div", 148);
+    i0.ɵɵconditionalCreate(6, TestRunFormComponentExtended_Conditional_113_Conditional_16_For_9_Conditional_6_Template, 2, 1, "div", 130);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(7, TestRunFormComponentExtended_div_113_div_16_div_8_div_7_Template, 4, 1, "div", 149);
+    i0.ɵɵconditionalCreate(7, TestRunFormComponentExtended_Conditional_113_Conditional_16_For_9_Conditional_7_Template, 4, 1, "div", 131);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const check_r12 = ctx.$implicit;
-    const i_r13 = ctx.index;
-    i0.ɵɵstyleProp("animation-delay", i_r13 * 50, "ms");
+    const ɵ$index_375_r13 = ctx.$index;
+    i0.ɵɵstyleProp("animation-delay", ɵ$index_375_r13 * 50, "ms");
     i0.ɵɵclassProp("passed", check_r12.passed)("failed", !check_r12.passed);
     i0.ɵɵadvance(2);
     i0.ɵɵclassProp("fa-check-circle", check_r12.passed)("fa-times-circle", !check_r12.passed);
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(check_r12.name);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", check_r12.message);
+    i0.ɵɵconditional(check_r12.message ? 6 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", check_r12.weight);
+    i0.ɵɵconditional(check_r12.weight ? 7 : -1);
 } }
-function TestRunFormComponentExtended_div_113_div_16_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 138)(1, "div", 128)(2, "h3");
-    i0.ɵɵelement(3, "i", 139);
+function TestRunFormComponentExtended_Conditional_113_Conditional_16_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 110)(1, "div", 112)(2, "h3");
+    i0.ɵɵelement(3, "i", 121);
     i0.ɵɵtext(4, " Check Results");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "span", 140);
+    i0.ɵɵelementStart(5, "span", 122);
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(7, "div", 141);
-    i0.ɵɵtemplate(8, TestRunFormComponentExtended_div_113_div_16_div_8_Template, 8, 13, "div", 142);
+    i0.ɵɵelementStart(7, "div", 123);
+    i0.ɵɵrepeaterCreate(8, TestRunFormComponentExtended_Conditional_113_Conditional_16_For_9_Template, 8, 13, "div", 124, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(6);
     i0.ɵɵtextInterpolate2("", ctx_r1.record.PassedChecks, " passed, ", ctx_r1.record.FailedChecks, " failed");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngForOf", ctx_r1.getCheckResults());
+    i0.ɵɵrepeater(ctx_r1.getCheckResults());
 } }
-function TestRunFormComponentExtended_div_113_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_113_Template(rf, ctx) { if (rf & 1) {
     const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 116)(1, "div", 117)(2, "div", 118)(3, "div", 119);
-    i0.ɵɵelement(4, "i", 13);
+    i0.ɵɵelementStart(0, "div", 55)(1, "div", 101)(2, "div", 102)(3, "div", 103);
+    i0.ɵɵelement(4, "i", 12);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(5, TestRunFormComponentExtended_div_113_div_5_Template, 1, 0, "div", 120);
+    i0.ɵɵconditionalCreate(5, TestRunFormComponentExtended_Conditional_113_Conditional_5_Template, 1, 0, "div", 104);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 121)(7, "h2");
+    i0.ɵɵelementStart(6, "div", 105)(7, "h2");
     i0.ɵɵtext(8);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "div", 122)(10, "span", 123);
+    i0.ɵɵelementStart(9, "div", 106)(10, "span", 107);
     i0.ɵɵtext(11);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "span", 124);
+    i0.ɵɵelementStart(12, "span", 108);
     i0.ɵɵtext(13, "|");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(14, "span", 125);
+    i0.ɵɵelementStart(14, "span", 109);
     i0.ɵɵtext(15);
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵtemplate(16, TestRunFormComponentExtended_div_113_div_16_Template, 9, 3, "div", 126);
-    i0.ɵɵelementStart(17, "div", 127)(18, "div", 128)(19, "h3");
-    i0.ɵɵelement(20, "i", 129);
+    i0.ɵɵconditionalCreate(16, TestRunFormComponentExtended_Conditional_113_Conditional_16_Template, 10, 2, "div", 110);
+    i0.ɵɵelementStart(17, "div", 111)(18, "div", 112)(19, "h3");
+    i0.ɵɵelement(20, "i", 113);
     i0.ɵɵtext(21, " Data Comparison");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(22, "div", 130)(23, "button", 131);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_113_Template_button_click_23_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setComparisonView("input")); });
-    i0.ɵɵelement(24, "i", 132);
+    i0.ɵɵelementStart(22, "div", 114)(23, "button", 115);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_113_Template_button_click_23_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setComparisonView("input")); });
+    i0.ɵɵelement(24, "i", 116);
     i0.ɵɵtext(25, " Input ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(26, "button", 131);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_113_Template_button_click_26_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setComparisonView("expected")); });
-    i0.ɵɵelement(27, "i", 133);
+    i0.ɵɵelementStart(26, "button", 115);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_113_Template_button_click_26_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setComparisonView("expected")); });
+    i0.ɵɵelement(27, "i", 117);
     i0.ɵɵtext(28, " Expected ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(29, "button", 131);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_113_Template_button_click_29_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setComparisonView("actual")); });
-    i0.ɵɵelement(30, "i", 134);
+    i0.ɵɵelementStart(29, "button", 115);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_113_Template_button_click_29_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setComparisonView("actual")); });
+    i0.ɵɵelement(30, "i", 118);
     i0.ɵɵtext(31, " Actual ");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(32, "div", 135);
-    i0.ɵɵelement(33, "mj-code-editor", 136);
+    i0.ɵɵelementStart(32, "div", 119);
+    i0.ɵɵelement(33, "mj-code-editor", 120);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -386,15 +390,15 @@ function TestRunFormComponentExtended_div_113_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(3);
     i0.ɵɵproperty("ngClass", ctx_r1.getStatusIcon());
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.record.Status === "Running");
+    i0.ɵɵconditional(ctx_r1.record.Status === "Running" ? 5 : -1);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1("TEST ", ctx_r1.record.Status.toUpperCase(), "");
+    i0.ɵɵtextInterpolate1("TEST ", ctx_r1.record.Status.toUpperCase());
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1("Score: ", ctx_r1.formatScore(ctx_r1.record.Score), "");
+    i0.ɵɵtextInterpolate1("Score: ", ctx_r1.formatScore(ctx_r1.record.Score));
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate2("", ctx_r1.record.PassedChecks, " of ", ctx_r1.record.TotalChecks, " checks passed");
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.getCheckResults().length > 0);
+    i0.ɵɵconditional(ctx_r1.getCheckResults().length > 0 ? 16 : -1);
     i0.ɵɵadvance(7);
     i0.ɵɵclassProp("active", ctx_r1.comparisonView === "input");
     i0.ɵɵadvance(3);
@@ -404,102 +408,103 @@ function TestRunFormComponentExtended_div_113_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(4);
     i0.ɵɵproperty("value", ctx_r1.getComparisonData())("readonly", true)("toolbar", ctx_r1.jsonToolbar)("lineWrapping", true);
 } }
-function TestRunFormComponentExtended_div_114_div_10_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_114_Conditional_10_Template(rf, ctx) { if (rf & 1) {
     const _r14 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 169);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_114_div_10_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.openTest()); });
-    i0.ɵɵelementStart(1, "div", 156);
-    i0.ɵɵelement(2, "i", 68);
+    i0.ɵɵelementStart(0, "div", 148);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_114_Conditional_10_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.openTest()); });
+    i0.ɵɵelementStart(1, "div", 135);
+    i0.ɵɵelement(2, "i", 67);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 158)(4, "div", 159);
+    i0.ɵɵelementStart(3, "div", 137)(4, "div", 138);
     i0.ɵɵtext(5, "Test");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 170);
+    i0.ɵɵelementStart(6, "div", 149);
     i0.ɵɵtext(7);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(8, "i", 171);
+    i0.ɵɵelement(8, "i", 150);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(7);
     i0.ɵɵtextInterpolate(ctx_r1.test.Name);
 } }
-function TestRunFormComponentExtended_div_114_div_45_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 172)(1, "div", 173)(2, "h3");
-    i0.ɵɵelement(3, "i", 66);
+function TestRunFormComponentExtended_Conditional_114_Conditional_45_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 146)(1, "div", 151)(2, "h3");
+    i0.ɵɵelement(3, "i", 65);
     i0.ɵɵtext(4, " Error Message");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div", 174);
-    i0.ɵɵelement(6, "mj-code-editor", 175);
+    i0.ɵɵelementStart(5, "div", 152);
+    i0.ɵɵelement(6, "mj-code-editor", 153);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(6);
     i0.ɵɵproperty("value", ctx_r1.record.ErrorMessage)("readonly", true)("toolbar", ctx_r1.jsonToolbar)("lineWrapping", true);
 } }
-function TestRunFormComponentExtended_div_114_div_46_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 176)(1, "div", 128)(2, "h3");
-    i0.ɵɵelement(3, "i", 177);
+function TestRunFormComponentExtended_Conditional_114_Conditional_46_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 147)(1, "div", 112)(2, "h3");
+    i0.ɵɵelement(3, "i", 154);
     i0.ɵɵtext(4, " Result Details");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div", 178);
-    i0.ɵɵelement(6, "mj-code-editor", 136);
+    i0.ɵɵelementStart(5, "div", 155);
+    i0.ɵɵelement(6, "mj-code-editor", 120);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(6);
     i0.ɵɵproperty("value", ctx_r1.getFormattedResultDetails())("readonly", true)("toolbar", ctx_r1.jsonToolbar)("lineWrapping", true);
 } }
-function TestRunFormComponentExtended_div_114_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 153)(1, "div", 154)(2, "div", 155)(3, "div", 156);
-    i0.ɵɵelement(4, "i", 157);
+function TestRunFormComponentExtended_Conditional_114_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 56)(1, "div", 133)(2, "div", 134)(3, "div", 135);
+    i0.ɵɵelement(4, "i", 136);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "div", 158)(6, "div", 159);
+    i0.ɵɵelementStart(5, "div", 137)(6, "div", 138);
     i0.ɵɵtext(7, "Test Run ID");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "div", 160);
+    i0.ɵɵelementStart(8, "div", 139);
     i0.ɵɵtext(9);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵtemplate(10, TestRunFormComponentExtended_div_114_div_10_Template, 9, 1, "div", 161);
-    i0.ɵɵelementStart(11, "div", 155)(12, "div", 156);
-    i0.ɵɵelement(13, "i", 162);
+    i0.ɵɵconditionalCreate(10, TestRunFormComponentExtended_Conditional_114_Conditional_10_Template, 9, 1, "div", 140);
+    i0.ɵɵelementStart(11, "div", 134)(12, "div", 135);
+    i0.ɵɵelement(13, "i", 141);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(14, "div", 158)(15, "div", 159);
+    i0.ɵɵelementStart(14, "div", 137)(15, "div", 138);
     i0.ɵɵtext(16, "Target Type");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(17, "div", 163);
+    i0.ɵɵelementStart(17, "div", 142);
     i0.ɵɵtext(18);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(19, "div", 155)(20, "div", 156);
-    i0.ɵɵelement(21, "i", 164);
+    i0.ɵɵelementStart(19, "div", 134)(20, "div", 135);
+    i0.ɵɵelement(21, "i", 143);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(22, "div", 158)(23, "div", 159);
+    i0.ɵɵelementStart(22, "div", 137)(23, "div", 138);
     i0.ɵɵtext(24, "Started At");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(25, "div", 163);
+    i0.ɵɵelementStart(25, "div", 142);
     i0.ɵɵtext(26);
     i0.ɵɵpipe(27, "date");
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(28, "div", 155)(29, "div", 156);
-    i0.ɵɵelement(30, "i", 165);
+    i0.ɵɵelementStart(28, "div", 134)(29, "div", 135);
+    i0.ɵɵelement(30, "i", 144);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(31, "div", 158)(32, "div", 159);
+    i0.ɵɵelementStart(31, "div", 137)(32, "div", 138);
     i0.ɵɵtext(33, "Completed At");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(34, "div", 163);
+    i0.ɵɵelementStart(34, "div", 142);
     i0.ɵɵtext(35);
     i0.ɵɵpipe(36, "date");
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(37, "div", 155)(38, "div", 156);
-    i0.ɵɵelement(39, "i", 166);
+    i0.ɵɵelementStart(37, "div", 134)(38, "div", 135);
+    i0.ɵɵelement(39, "i", 145);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(40, "div", 158)(41, "div", 159);
+    i0.ɵɵelementStart(40, "div", 137)(41, "div", 138);
     i0.ɵɵtext(42, "Duration");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(43, "div", 163);
+    i0.ɵɵelementStart(43, "div", 142);
     i0.ɵɵtext(44);
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵtemplate(45, TestRunFormComponentExtended_div_114_div_45_Template, 7, 4, "div", 167)(46, TestRunFormComponentExtended_div_114_div_46_Template, 7, 4, "div", 168);
+    i0.ɵɵconditionalCreate(45, TestRunFormComponentExtended_Conditional_114_Conditional_45_Template, 7, 4, "div", 146);
+    i0.ɵɵconditionalCreate(46, TestRunFormComponentExtended_Conditional_114_Conditional_46_Template, 7, 4, "div", 147);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -507,7 +512,7 @@ function TestRunFormComponentExtended_div_114_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(9);
     i0.ɵɵtextInterpolate(ctx_r1.record.ID);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.test);
+    i0.ɵɵconditional(ctx_r1.test ? 10 : -1);
     i0.ɵɵadvance(8);
     i0.ɵɵtextInterpolate(ctx_r1.record.TargetType || "N/A");
     i0.ɵɵadvance(8);
@@ -517,28 +522,28 @@ function TestRunFormComponentExtended_div_114_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(9);
     i0.ɵɵtextInterpolate(ctx_r1.calculateDuration());
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.record.ErrorMessage);
+    i0.ɵɵconditional(ctx_r1.record.ErrorMessage ? 45 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.parsedData.resultDetails);
+    i0.ɵɵconditional(ctx_r1.parsedData.resultDetails ? 46 : -1);
 } }
-function TestRunFormComponentExtended_div_115_div_1_div_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 186);
-    i0.ɵɵelement(1, "div", 187);
-    i0.ɵɵelementStart(2, "div", 188);
-    i0.ɵɵelement(3, "div", 189)(4, "div", 190);
+function TestRunFormComponentExtended_Conditional_115_Conditional_1_For_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 160);
+    i0.ɵɵelement(1, "div", 161);
+    i0.ɵɵelementStart(2, "div", 162);
+    i0.ɵɵelement(3, "div", 163)(4, "div", 164);
     i0.ɵɵelementEnd()();
 } }
-function TestRunFormComponentExtended_div_115_div_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 183)(1, "div", 184);
-    i0.ɵɵtemplate(2, TestRunFormComponentExtended_div_115_div_1_div_2_Template, 5, 0, "div", 185);
+function TestRunFormComponentExtended_Conditional_115_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 156)(1, "div", 159);
+    i0.ɵɵrepeaterCreate(2, TestRunFormComponentExtended_Conditional_115_Conditional_1_For_3_Template, 5, 0, "div", 160, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngForOf", i0.ɵɵpureFunction0(1, _c0));
+    i0.ɵɵrepeater(i0.ɵɵpureFunction0(0, _c0));
 } }
-function TestRunFormComponentExtended_div_115_div_2_div_8_span_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 203);
-    i0.ɵɵelement(1, "i", 37);
+function TestRunFormComponentExtended_Conditional_115_Conditional_2_For_9_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 174);
+    i0.ɵɵelement(1, "i", 36);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "number");
     i0.ɵɵelementEnd();
@@ -547,22 +552,22 @@ function TestRunFormComponentExtended_div_115_div_2_div_8_span_9_Template(rf, ct
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(3, 1, run_r16.TotalCost, "1.4-4"), " ");
 } }
-function TestRunFormComponentExtended_div_115_div_2_div_8_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_115_Conditional_2_For_9_Template(rf, ctx) { if (rf & 1) {
     const _r15 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 195);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_115_div_2_div_8_Template_div_click_0_listener() { const run_r16 = i0.ɵɵrestoreView(_r15).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.openAIAgentRun(run_r16.ID)); });
-    i0.ɵɵelementStart(1, "div", 196);
-    i0.ɵɵelement(2, "i", 48);
+    i0.ɵɵelementStart(0, "div", 168);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_115_Conditional_2_For_9_Template_div_click_0_listener() { const run_r16 = i0.ɵɵrestoreView(_r15).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.openAIAgentRun(run_r16.ID)); });
+    i0.ɵɵelementStart(1, "div", 169);
+    i0.ɵɵelement(2, "i", 47);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 197)(4, "div", 198);
+    i0.ɵɵelementStart(3, "div", 170)(4, "div", 171);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 199)(7, "span", 200);
+    i0.ɵɵelementStart(6, "div", 172)(7, "span", 173);
     i0.ɵɵtext(8);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(9, TestRunFormComponentExtended_div_115_div_2_div_8_span_9_Template, 4, 4, "span", 201);
+    i0.ɵɵconditionalCreate(9, TestRunFormComponentExtended_Conditional_115_Conditional_2_For_9_Conditional_9_Template, 4, 4, "span", 174);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(10, "i", 202);
+    i0.ɵɵelement(10, "i", 175);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const run_r16 = ctx.$implicit;
@@ -573,29 +578,29 @@ function TestRunFormComponentExtended_div_115_div_2_div_8_Template(rf, ctx) { if
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(run_r16.Status);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", run_r16.TotalCost);
+    i0.ɵɵconditional(run_r16.TotalCost ? 9 : -1);
 } }
-function TestRunFormComponentExtended_div_115_div_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 191)(1, "div", 128)(2, "h3");
-    i0.ɵɵelement(3, "i", 48);
+function TestRunFormComponentExtended_Conditional_115_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 157)(1, "div", 112)(2, "h3");
+    i0.ɵɵelement(3, "i", 47);
     i0.ɵɵtext(4, " AI Agent Runs");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "span", 192);
+    i0.ɵɵelementStart(5, "span", 165);
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(7, "div", 193);
-    i0.ɵɵtemplate(8, TestRunFormComponentExtended_div_115_div_2_div_8_Template, 11, 5, "div", 194);
+    i0.ɵɵelementStart(7, "div", 166);
+    i0.ɵɵrepeaterCreate(8, TestRunFormComponentExtended_Conditional_115_Conditional_2_For_9_Template, 11, 5, "div", 167, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(6);
     i0.ɵɵtextInterpolate(ctx_r1.aiAgentRuns.length);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngForOf", ctx_r1.aiAgentRuns);
+    i0.ɵɵrepeater(ctx_r1.aiAgentRuns);
 } }
-function TestRunFormComponentExtended_div_115_div_3_div_8_span_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 203);
-    i0.ɵɵelement(1, "i", 37);
+function TestRunFormComponentExtended_Conditional_115_Conditional_3_For_9_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 174);
+    i0.ɵɵelement(1, "i", 36);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "number");
     i0.ɵɵelementEnd();
@@ -604,49 +609,49 @@ function TestRunFormComponentExtended_div_115_div_3_div_8_span_7_Template(rf, ct
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(3, 1, run_r18.TotalCost, "1.4-4"), " ");
 } }
-function TestRunFormComponentExtended_div_115_div_3_div_8_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_115_Conditional_3_For_9_Template(rf, ctx) { if (rf & 1) {
     const _r17 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 195);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_115_div_3_div_8_Template_div_click_0_listener() { const run_r18 = i0.ɵɵrestoreView(_r17).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.openAIPromptRun(run_r18.ID)); });
-    i0.ɵɵelementStart(1, "div", 205);
-    i0.ɵɵelement(2, "i", 204);
+    i0.ɵɵelementStart(0, "div", 168);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_115_Conditional_3_For_9_Template_div_click_0_listener() { const run_r18 = i0.ɵɵrestoreView(_r17).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.openAIPromptRun(run_r18.ID)); });
+    i0.ɵɵelementStart(1, "div", 177);
+    i0.ɵɵelement(2, "i", 176);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 197)(4, "div", 198);
+    i0.ɵɵelementStart(3, "div", 170)(4, "div", 171);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 199);
-    i0.ɵɵtemplate(7, TestRunFormComponentExtended_div_115_div_3_div_8_span_7_Template, 4, 4, "span", 201);
+    i0.ɵɵelementStart(6, "div", 172);
+    i0.ɵɵconditionalCreate(7, TestRunFormComponentExtended_Conditional_115_Conditional_3_For_9_Conditional_7_Template, 4, 4, "span", 174);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(8, "i", 202);
+    i0.ɵɵelement(8, "i", 175);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const run_r18 = ctx.$implicit;
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate(run_r18.Prompt || run_r18.Model);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", run_r18.TotalCost);
+    i0.ɵɵconditional(run_r18.TotalCost ? 7 : -1);
 } }
-function TestRunFormComponentExtended_div_115_div_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 191)(1, "div", 128)(2, "h3");
-    i0.ɵɵelement(3, "i", 204);
+function TestRunFormComponentExtended_Conditional_115_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 157)(1, "div", 112)(2, "h3");
+    i0.ɵɵelement(3, "i", 176);
     i0.ɵɵtext(4, " AI Prompt Runs");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "span", 192);
+    i0.ɵɵelementStart(5, "span", 165);
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(7, "div", 193);
-    i0.ɵɵtemplate(8, TestRunFormComponentExtended_div_115_div_3_div_8_Template, 9, 2, "div", 194);
+    i0.ɵɵelementStart(7, "div", 166);
+    i0.ɵɵrepeaterCreate(8, TestRunFormComponentExtended_Conditional_115_Conditional_3_For_9_Template, 9, 2, "div", 167, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(6);
     i0.ɵɵtextInterpolate(ctx_r1.aiPromptRuns.length);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngForOf", ctx_r1.aiPromptRuns);
+    i0.ɵɵrepeater(ctx_r1.aiPromptRuns);
 } }
-function TestRunFormComponentExtended_div_115_div_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 206)(1, "div", 207);
-    i0.ɵɵelement(2, "i", 48);
+function TestRunFormComponentExtended_Conditional_115_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 158)(1, "div", 178);
+    i0.ɵɵelement(2, "i", 47);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(3, "h3");
     i0.ɵɵtext(4, "No AI Runs");
@@ -655,47 +660,50 @@ function TestRunFormComponentExtended_div_115_div_4_Template(rf, ctx) { if (rf &
     i0.ɵɵtext(6, "This test execution didn't involve any AI agent or prompt runs.");
     i0.ɵɵelementEnd()();
 } }
-function TestRunFormComponentExtended_div_115_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 179);
-    i0.ɵɵtemplate(1, TestRunFormComponentExtended_div_115_div_1_Template, 3, 2, "div", 180)(2, TestRunFormComponentExtended_div_115_div_2_Template, 9, 2, "div", 181)(3, TestRunFormComponentExtended_div_115_div_3_Template, 9, 2, "div", 181)(4, TestRunFormComponentExtended_div_115_div_4_Template, 7, 0, "div", 182);
+function TestRunFormComponentExtended_Conditional_115_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 57);
+    i0.ɵɵconditionalCreate(1, TestRunFormComponentExtended_Conditional_115_Conditional_1_Template, 4, 1, "div", 156);
+    i0.ɵɵconditionalCreate(2, TestRunFormComponentExtended_Conditional_115_Conditional_2_Template, 10, 1, "div", 157);
+    i0.ɵɵconditionalCreate(3, TestRunFormComponentExtended_Conditional_115_Conditional_3_Template, 10, 1, "div", 157);
+    i0.ɵɵconditionalCreate(4, TestRunFormComponentExtended_Conditional_115_Conditional_4_Template, 7, 0, "div", 158);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵproperty("@fadeIn", undefined);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.loadingAIRuns);
+    i0.ɵɵconditional(ctx_r1.loadingAIRuns ? 1 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.loadingAIRuns && ctx_r1.aiAgentRuns.length > 0);
+    i0.ɵɵconditional(!ctx_r1.loadingAIRuns && ctx_r1.aiAgentRuns.length > 0 ? 2 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.loadingAIRuns && ctx_r1.aiPromptRuns.length > 0);
+    i0.ɵɵconditional(!ctx_r1.loadingAIRuns && ctx_r1.aiPromptRuns.length > 0 ? 3 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.aiRunsLoaded && ctx_r1.aiAgentRuns.length === 0 && ctx_r1.aiPromptRuns.length === 0);
+    i0.ɵɵconditional(ctx_r1.aiRunsLoaded && ctx_r1.aiAgentRuns.length === 0 && ctx_r1.aiPromptRuns.length === 0 ? 4 : -1);
 } }
-function TestRunFormComponentExtended_div_116_div_1_div_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 186);
-    i0.ɵɵelement(1, "div", 210);
-    i0.ɵɵelementStart(2, "div", 188);
-    i0.ɵɵelement(3, "div", 189)(4, "div", 190)(5, "div", 211);
+function TestRunFormComponentExtended_Conditional_116_Conditional_1_For_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 160);
+    i0.ɵɵelement(1, "div", 180);
+    i0.ɵɵelementStart(2, "div", 162);
+    i0.ɵɵelement(3, "div", 163)(4, "div", 164)(5, "div", 181);
     i0.ɵɵelementEnd()();
 } }
-function TestRunFormComponentExtended_div_116_div_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 183)(1, "div", 184);
-    i0.ɵɵtemplate(2, TestRunFormComponentExtended_div_116_div_1_div_2_Template, 6, 0, "div", 185);
+function TestRunFormComponentExtended_Conditional_116_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 156)(1, "div", 159);
+    i0.ɵɵrepeaterCreate(2, TestRunFormComponentExtended_Conditional_116_Conditional_1_For_3_Template, 6, 0, "div", 160, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngForOf", i0.ɵɵpureFunction0(1, _c1));
+    i0.ɵɵrepeater(i0.ɵɵpureFunction0(0, _c1));
 } }
-function TestRunFormComponentExtended_div_116_div_2_div_1_i_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 34);
+function TestRunFormComponentExtended_Conditional_116_Conditional_2_For_2_For_13_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 33);
 } if (rf & 2) {
     const s_r19 = ctx.$implicit;
     const feedback_r20 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵclassProp("filled", s_r19 <= (feedback_r20.Rating || 0));
 } }
-function TestRunFormComponentExtended_div_116_div_2_div_1_div_15_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 227)(1, "span", 228);
-    i0.ɵɵelement(2, "i", 145);
+function TestRunFormComponentExtended_Conditional_116_Conditional_2_For_2_Conditional_16_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 193)(1, "span", 195);
+    i0.ɵɵelement(2, "i", 127);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -707,8 +715,8 @@ function TestRunFormComponentExtended_div_116_div_2_div_1_div_15_Template(rf, ct
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", feedback_r20.IsCorrect ? "Marked Correct" : "Marked Incorrect", " ");
 } }
-function TestRunFormComponentExtended_div_116_div_2_div_1_div_16_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 229)(1, "p");
+function TestRunFormComponentExtended_Conditional_116_Conditional_2_For_2_Conditional_17_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 194)(1, "p");
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -716,23 +724,24 @@ function TestRunFormComponentExtended_div_116_div_2_div_1_div_16_Template(rf, ct
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(feedback_r20.CorrectionSummary);
 } }
-function TestRunFormComponentExtended_div_116_div_2_div_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 214)(1, "div", 215)(2, "div", 216)(3, "div", 217);
-    i0.ɵɵelement(4, "i", 78);
+function TestRunFormComponentExtended_Conditional_116_Conditional_2_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 182)(1, "div", 183)(2, "div", 184)(3, "div", 185);
+    i0.ɵɵelement(4, "i", 73);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "span", 218);
+    i0.ɵɵelementStart(5, "span", 186);
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(7, "div", 219);
+    i0.ɵɵelementStart(7, "div", 187);
     i0.ɵɵtext(8);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(9, "div", 220)(10, "div", 221)(11, "div", 222);
-    i0.ɵɵtemplate(12, TestRunFormComponentExtended_div_116_div_2_div_1_i_12_Template, 1, 2, "i", 223);
+    i0.ɵɵelementStart(9, "div", 188)(10, "div", 189)(11, "div", 190);
+    i0.ɵɵrepeaterCreate(12, TestRunFormComponentExtended_Conditional_116_Conditional_2_For_2_For_13_Template, 1, 2, "i", 191, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(13, "span", 224);
-    i0.ɵɵtext(14);
+    i0.ɵɵelementStart(14, "span", 192);
+    i0.ɵɵtext(15);
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(15, TestRunFormComponentExtended_div_116_div_2_div_1_div_15_Template, 4, 9, "div", 225)(16, TestRunFormComponentExtended_div_116_div_2_div_1_div_16_Template, 3, 1, "div", 226);
+    i0.ɵɵconditionalCreate(16, TestRunFormComponentExtended_Conditional_116_Conditional_2_For_2_Conditional_16_Template, 4, 9, "div", 193);
+    i0.ɵɵconditionalCreate(17, TestRunFormComponentExtended_Conditional_116_Conditional_2_For_2_Conditional_17_Template, 3, 1, "div", 194);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const feedback_r20 = ctx.$implicit;
@@ -742,26 +751,26 @@ function TestRunFormComponentExtended_div_116_div_2_div_1_Template(rf, ctx) { if
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", ctx_r1.getRelativeTime(feedback_r20.__mj_CreatedAt), " ");
     i0.ɵɵadvance(4);
-    i0.ɵɵproperty("ngForOf", i0.ɵɵpureFunction0(6, _c2));
-    i0.ɵɵadvance(2);
+    i0.ɵɵrepeater(i0.ɵɵpureFunction0(5, _c2));
+    i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1("", feedback_r20.Rating, "/10");
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", feedback_r20.IsCorrect !== null);
+    i0.ɵɵconditional(feedback_r20.IsCorrect !== null ? 16 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", feedback_r20.CorrectionSummary);
+    i0.ɵɵconditional(feedback_r20.CorrectionSummary ? 17 : -1);
 } }
-function TestRunFormComponentExtended_div_116_div_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 212);
-    i0.ɵɵtemplate(1, TestRunFormComponentExtended_div_116_div_2_div_1_Template, 17, 7, "div", 213);
+function TestRunFormComponentExtended_Conditional_116_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 179);
+    i0.ɵɵrepeaterCreate(1, TestRunFormComponentExtended_Conditional_116_Conditional_2_For_2_Template, 18, 6, "div", 182, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r1.feedbacks);
+    i0.ɵɵrepeater(ctx_r1.feedbacks);
 } }
-function TestRunFormComponentExtended_div_116_div_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 206)(1, "div", 207);
-    i0.ɵɵelement(2, "i", 51);
+function TestRunFormComponentExtended_Conditional_116_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 158)(1, "div", 178);
+    i0.ɵɵelement(2, "i", 50);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(3, "h3");
     i0.ɵɵtext(4, "No Feedback Yet");
@@ -770,23 +779,25 @@ function TestRunFormComponentExtended_div_116_div_3_Template(rf, ctx) { if (rf &
     i0.ɵɵtext(6, "No one has reviewed this test run yet. Be the first to provide feedback!");
     i0.ɵɵelementEnd()();
 } }
-function TestRunFormComponentExtended_div_116_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 208);
-    i0.ɵɵtemplate(1, TestRunFormComponentExtended_div_116_div_1_Template, 3, 2, "div", 180)(2, TestRunFormComponentExtended_div_116_div_2_Template, 2, 1, "div", 209)(3, TestRunFormComponentExtended_div_116_div_3_Template, 7, 0, "div", 182);
+function TestRunFormComponentExtended_Conditional_116_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 58);
+    i0.ɵɵconditionalCreate(1, TestRunFormComponentExtended_Conditional_116_Conditional_1_Template, 4, 1, "div", 156);
+    i0.ɵɵconditionalCreate(2, TestRunFormComponentExtended_Conditional_116_Conditional_2_Template, 3, 0, "div", 179);
+    i0.ɵɵconditionalCreate(3, TestRunFormComponentExtended_Conditional_116_Conditional_3_Template, 7, 0, "div", 158);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵproperty("@fadeIn", undefined);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.loadingFeedback);
+    i0.ɵɵconditional(ctx_r1.loadingFeedback ? 1 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.loadingFeedback && ctx_r1.feedbacks.length > 0);
+    i0.ɵɵconditional(!ctx_r1.loadingFeedback && ctx_r1.feedbacks.length > 0 ? 2 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.feedbackLoaded && ctx_r1.feedbacks.length === 0);
+    i0.ɵɵconditional(ctx_r1.feedbackLoaded && ctx_r1.feedbacks.length === 0 ? 3 : -1);
 } }
-function TestRunFormComponentExtended_div_117_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 230);
-    i0.ɵɵelement(1, "mj-execution-context", 231);
+function TestRunFormComponentExtended_Conditional_117_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 59);
+    i0.ɵɵelement(1, "mj-execution-context", 196);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -794,21 +805,21 @@ function TestRunFormComponentExtended_div_117_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵproperty("machineName", ctx_r1.record.MachineName)("machineId", ctx_r1.record.MachineID)("runByUserName", ctx_r1.record.RunByUserName)("runByUserEmail", ctx_r1.record.RunByUserEmail)("runContextDetailsJson", ctx_r1.record.RunContextDetails);
 } }
-function TestRunFormComponentExtended_div_118_Template(rf, ctx) { if (rf & 1) {
+function TestRunFormComponentExtended_Conditional_118_Template(rf, ctx) { if (rf & 1) {
     const _r21 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 232)(1, "div", 233)(2, "div", 234);
-    i0.ɵɵelement(3, "i", 115);
+    i0.ɵɵelementStart(0, "div", 60)(1, "div", 197)(2, "div", 198);
+    i0.ɵɵelement(3, "i", 100);
     i0.ɵɵelementStart(4, "h3");
     i0.ɵɵtext(5, "Execution Log");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "div", 235)(7, "button", 236);
-    i0.ɵɵlistener("click", function TestRunFormComponentExtended_div_118_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.copyLogToClipboard()); });
-    i0.ɵɵelement(8, "i", 237);
-    i0.ɵɵelementStart(9, "span", 22);
+    i0.ɵɵelementStart(6, "div", 199)(7, "button", 200);
+    i0.ɵɵlistener("click", function TestRunFormComponentExtended_Conditional_118_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.copyLogToClipboard()); });
+    i0.ɵɵelement(8, "i", 201);
+    i0.ɵɵelementStart(9, "span", 21);
     i0.ɵɵtext(10, "Copy");
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵelementStart(11, "div", 238);
-    i0.ɵɵelement(12, "mj-code-editor", 175);
+    i0.ɵɵelementStart(11, "div", 202);
+    i0.ɵɵelement(12, "mj-code-editor", 153);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -1312,144 +1323,152 @@ let TestRunFormComponentExtended = class TestRunFormComponentExtended extends Te
     }
     static { this.ɵfac = function TestRunFormComponentExtended_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TestRunFormComponentExtended)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i1.SharedService), i0.ɵɵdirectiveInject(i2.Router), i0.ɵɵdirectiveInject(i2.ActivatedRoute), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i3.TestingDialogService), i0.ɵɵdirectiveInject(i4.ApplicationManager), i0.ɵɵdirectiveInject(i0.ViewContainerRef)); }; }
     static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TestRunFormComponentExtended, selectors: [["mj-test-run-form"]], hostBindings: function TestRunFormComponentExtended_HostBindings(rf, ctx) { if (rf & 1) {
-            i0.ɵɵlistener("keydown", function TestRunFormComponentExtended_keydown_HostBindingHandler($event) { return ctx.handleKeyboardShortcut($event); }, false, i0.ɵɵresolveDocument);
-        } }, features: [i0.ɵɵInheritDefinitionFeature], decls: 137, vars: 59, consts: [[1, "test-run-form"], ["class", "error-banner", 3, "click", 4, "ngIf"], [1, "test-run-header"], ["aria-label", "Breadcrumb", 1, "breadcrumb"], ["href", "javascript:void(0)", 3, "click"], [1, "fas", "fa-vial"], [1, "breadcrumb-text"], [4, "ngIf"], [1, "current"], [1, "fas", "fa-chevron-right", "separator"], [1, "header-content"], [1, "header-left"], [1, "status-indicator"], [1, "fas", 3, "ngClass"], [1, "test-run-info"], [1, "run-id"], [1, "test-run-meta"], [1, "status-badge"], ["class", "meta-item", 4, "ngIf"], [1, "header-actions"], ["kendoButton", "", "title", "Re-run this test (Cmd+Shift+R)", 3, "click", "disabled"], [1, "fas", "fa-redo"], [1, "btn-text"], ["kendoButton", "", "title", "Refresh (Cmd+R)", 3, "click", "disabled"], [1, "fas", "fa-sync-alt"], [1, "metrics-bar"], [1, "metric-card"], [1, "metric-icon"], [1, "fas", "fa-clock"], [1, "metric-content"], [1, "metric-label"], [1, "metric-value"], [1, "metric-detail"], [1, "fas", "fa-stopwatch"], [1, "fas", "fa-star"], ["class", "metric-progress", 4, "ngIf"], [1, "fas", "fa-check-double"], [1, "fas", "fa-dollar-sign"], ["class", "secondary-info", 4, "ngIf"], ["class", "tags-bar", 4, "ngIf"], ["class", "tags-editor-panel", 4, "ngIf"], [1, "tabs-container"], ["role", "tablist", 1, "tabs"], ["role", "tab", "title", "Press 1", 1, "tab", 3, "click"], [1, "fas", "fa-chart-pie"], ["role", "tab", "title", "Press 2", 1, "tab", 3, "click"], [1, "fas", "fa-info-circle"], ["role", "tab", "title", "Press 3", 1, "tab", 3, "click"], [1, "fas", "fa-robot"], ["class", "tab-badge", 4, "ngIf"], ["role", "tab", "title", "Press 4", 1, "tab", 3, "click"], [1, "fas", "fa-comments"], ["role", "tab", "title", "Press 5", 1, "tab", 3, "click"], [1, "fas", "fa-microchip"], ["class", "tab", "role", "tab", "title", "Press 6", 3, "active", "click", 4, "ngIf"], [1, "tab-content"], ["class", "overview-tab", 4, "ngIf"], ["class", "details-tab", 4, "ngIf"], ["class", "ai-runs-tab", 4, "ngIf"], ["class", "feedback-tab", 4, "ngIf"], ["class", "execution-tab", 4, "ngIf"], ["class", "log-tab", 4, "ngIf"], ["title", "Keyboard Shortcuts", 1, "shortcuts-hint"], [1, "fas", "fa-keyboard"], [1, "shortcuts-popup"], [1, "error-banner", 3, "click"], [1, "fas", "fa-exclamation-triangle"], [1, "retry-btn"], [1, "fas", "fa-flask"], [1, "meta-item"], [1, "fas", "fa-sync-alt", "fa-spin"], [1, "metric-progress"], [1, "progress-bar"], [1, "secondary-info"], ["class", "info-chip", 4, "ngIf"], ["class", "info-chip clickable", 3, "click", 4, "ngIf"], [3, "entityName", "recordId", 4, "ngIf"], [1, "info-chip"], [1, "fas", "fa-user"], [1, "info-chip", "clickable", 3, "click"], [1, "fas", "fa-layer-group"], [3, "entityName", "recordId"], [1, "tags-bar"], [1, "tags-bar-content"], [1, "tags-bar-label"], [1, "fas", "fa-tags"], ["class", "tags-bar-chips", 4, "ngIf"], ["class", "tags-bar-empty", 4, "ngIf"], ["title", "Edit tags", 1, "tags-bar-edit", 3, "click"], [1, "fas", "fa-plus"], [1, "tags-bar-chips"], ["class", "tag-inline", 4, "ngFor", "ngForOf"], [1, "tag-inline"], [1, "tags-bar-empty"], [1, "tags-editor-panel"], [1, "tags-editor-header"], [1, "tags-editor-title"], [1, "tags-editor-body"], [1, "tags-editor-chips"], ["class", "tag-editable", 4, "ngFor", "ngForOf"], ["class", "tags-empty-hint", 4, "ngIf"], [1, "tags-editor-input"], ["type", "text", "placeholder", "Type a tag and press Enter...", 1, "tag-text-input", 3, "ngModelChange", "keyup.enter", "ngModel"], ["kendoButton", "", "fillMode", "flat", 3, "click", "disabled"], [1, "tags-editor-footer"], ["kendoButton", "", "themeColor", "primary", 3, "click", "disabled"], ["class", "fas fa-spinner fa-spin", 4, "ngIf"], ["kendoButton", "", "fillMode", "flat", 3, "click"], [1, "tag-editable"], ["title", "Remove tag", 1, "tag-remove-btn", 3, "click"], [1, "fas", "fa-times"], [1, "tags-empty-hint"], [1, "fas", "fa-spinner", "fa-spin"], [1, "tab-badge"], ["role", "tab", "title", "Press 6", 1, "tab", 3, "click"], [1, "fas", "fa-terminal"], [1, "overview-tab"], [1, "result-hero"], [1, "result-icon-wrapper"], [1, "result-icon"], ["class", "result-pulse", 4, "ngIf"], [1, "result-text"], [1, "result-details"], [1, "result-score"], [1, "result-divider"], [1, "result-checks"], ["class", "check-results", 4, "ngIf"], [1, "comparison-section"], [1, "section-header"], [1, "fas", "fa-exchange-alt"], [1, "comparison-tabs"], [1, "comparison-tab", 3, "click"], [1, "fas", "fa-sign-in-alt"], [1, "fas", "fa-bullseye"], [1, "fas", "fa-check-square"], [1, "comparison-content"], ["language", "json", 3, "value", "readonly", "toolbar", "lineWrapping"], [1, "result-pulse"], [1, "check-results"], [1, "fas", "fa-tasks"], [1, "check-summary"], [1, "check-list"], ["class", "check-item", 3, "passed", "failed", "animation-delay", 4, "ngFor", "ngForOf"], [1, "check-item"], [1, "check-status"], [1, "fas"], [1, "check-content"], [1, "check-name"], ["class", "check-message", 4, "ngIf"], ["class", "check-weight", 4, "ngIf"], [1, "check-message"], [1, "check-weight"], [1, "weight-label"], [1, "details-tab"], [1, "details-grid"], [1, "detail-card"], [1, "detail-icon"], [1, "fas", "fa-fingerprint"], [1, "detail-content"], [1, "detail-label"], [1, "detail-value", "monospace"], ["class", "detail-card clickable", 3, "click", 4, "ngIf"], [1, "fas", "fa-tag"], [1, "detail-value"], [1, "fas", "fa-play-circle"], [1, "fas", "fa-stop-circle"], [1, "fas", "fa-hourglass-half"], ["class", "error-section", 4, "ngIf"], ["class", "result-details-section", 4, "ngIf"], [1, "detail-card", "clickable", 3, "click"], [1, "detail-value", "link"], [1, "fas", "fa-external-link-alt", "detail-action"], [1, "error-section"], [1, "section-header", "error"], [1, "error-content"], [3, "value", "readonly", "toolbar", "lineWrapping"], [1, "result-details-section"], [1, "fas", "fa-file-code"], [1, "result-details-content"], [1, "ai-runs-tab"], ["class", "loading-state", 4, "ngIf"], ["class", "ai-section", 4, "ngIf"], ["class", "empty-state", 4, "ngIf"], [1, "loading-state"], [1, "skeleton-list"], ["class", "skeleton-card", 4, "ngFor", "ngForOf"], [1, "skeleton-card"], [1, "skeleton-icon"], [1, "skeleton-content"], [1, "skeleton-line", "wide"], [1, "skeleton-line", "narrow"], [1, "ai-section"], [1, "count-badge"], [1, "ai-run-list"], ["class", "ai-run-card", 3, "click", 4, "ngFor", "ngForOf"], [1, "ai-run-card", 3, "click"], [1, "ai-run-icon", "agent"], [1, "ai-run-content"], [1, "ai-run-name"], [1, "ai-run-meta"], [1, "status-chip"], ["class", "cost-chip", 4, "ngIf"], [1, "fas", "fa-chevron-right", "ai-run-arrow"], [1, "cost-chip"], [1, "fas", "fa-comment-dots"], [1, "ai-run-icon", "prompt"], [1, "empty-state"], [1, "empty-icon"], [1, "feedback-tab"], ["class", "feedback-list", 4, "ngIf"], [1, "skeleton-avatar"], [1, "skeleton-line", "medium"], [1, "feedback-list"], ["class", "feedback-item", 4, "ngFor", "ngForOf"], [1, "feedback-item"], [1, "feedback-header"], [1, "feedback-user"], [1, "user-avatar"], [1, "user-name"], [1, "feedback-date"], [1, "feedback-body"], [1, "feedback-rating"], [1, "rating-stars"], ["class", "fas fa-star", 3, "filled", 4, "ngFor", "ngForOf"], [1, "rating-value"], ["class", "feedback-verdict", 4, "ngIf"], ["class", "feedback-comments", 4, "ngIf"], [1, "feedback-verdict"], [1, "verdict-badge"], [1, "feedback-comments"], [1, "execution-tab"], [3, "machineName", "machineId", "runByUserName", "runByUserEmail", "runContextDetailsJson"], [1, "log-tab"], [1, "log-header"], [1, "log-title"], [1, "log-actions"], ["kendoButton", "", "look", "flat", 3, "click"], [1, "fas", "fa-copy"], [1, "log-container"]], template: function TestRunFormComponentExtended_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵlistener("keydown", function TestRunFormComponentExtended_keydown_HostBindingHandler($event) { return ctx.handleKeyboardShortcut($event); }, i0.ɵɵresolveDocument);
+        } }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 137, vars: 59, consts: [[1, "test-run-form"], [1, "error-banner"], [1, "test-run-header"], ["aria-label", "Breadcrumb", 1, "breadcrumb"], ["href", "javascript:void(0)", 3, "click"], [1, "fas", "fa-vial"], [1, "breadcrumb-text"], [1, "current"], [1, "fas", "fa-chevron-right", "separator"], [1, "header-content"], [1, "header-left"], [1, "status-indicator"], [1, "fas", 3, "ngClass"], [1, "test-run-info"], [1, "run-id"], [1, "test-run-meta"], [1, "status-badge"], [1, "meta-item"], [1, "header-actions"], ["kendoButton", "", "title", "Re-run this test (Cmd+Shift+R)", 3, "click", "disabled"], [1, "fas", "fa-redo"], [1, "btn-text"], ["kendoButton", "", "title", "Refresh (Cmd+R)", 3, "click", "disabled"], [1, "fas", "fa-sync-alt"], [1, "metrics-bar"], [1, "metric-card"], [1, "metric-icon"], [1, "fas", "fa-clock"], [1, "metric-content"], [1, "metric-label"], [1, "metric-value"], [1, "metric-detail"], [1, "fas", "fa-stopwatch"], [1, "fas", "fa-star"], [1, "metric-progress"], [1, "fas", "fa-check-double"], [1, "fas", "fa-dollar-sign"], [1, "secondary-info"], [1, "tags-bar"], [1, "tags-editor-panel"], [1, "tabs-container"], ["role", "tablist", 1, "tabs"], ["role", "tab", "title", "Press 1", 1, "tab", 3, "click"], [1, "fas", "fa-chart-pie"], ["role", "tab", "title", "Press 2", 1, "tab", 3, "click"], [1, "fas", "fa-info-circle"], ["role", "tab", "title", "Press 3", 1, "tab", 3, "click"], [1, "fas", "fa-robot"], [1, "tab-badge"], ["role", "tab", "title", "Press 4", 1, "tab", 3, "click"], [1, "fas", "fa-comments"], ["role", "tab", "title", "Press 5", 1, "tab", 3, "click"], [1, "fas", "fa-microchip"], ["role", "tab", "title", "Press 6", 1, "tab", 3, "active"], [1, "tab-content"], [1, "overview-tab"], [1, "details-tab"], [1, "ai-runs-tab"], [1, "feedback-tab"], [1, "execution-tab"], [1, "log-tab"], ["title", "Keyboard Shortcuts", 1, "shortcuts-hint"], [1, "fas", "fa-keyboard"], [1, "shortcuts-popup"], [1, "error-banner", 3, "click"], [1, "fas", "fa-exclamation-triangle"], [1, "retry-btn"], [1, "fas", "fa-flask"], [1, "fas", "fa-sync-alt", "fa-spin"], [1, "progress-bar"], [1, "info-chip"], [1, "info-chip", "clickable"], [3, "entityName", "recordId"], [1, "fas", "fa-user"], [1, "info-chip", "clickable", 3, "click"], [1, "fas", "fa-layer-group"], [1, "tags-bar-content"], [1, "tags-bar-label"], [1, "fas", "fa-tags"], [1, "tags-bar-chips"], [1, "tags-bar-empty"], ["title", "Edit tags", 1, "tags-bar-edit", 3, "click"], [1, "fas", "fa-plus"], [1, "tag-inline"], [1, "tags-editor-header"], [1, "tags-editor-title"], [1, "tags-editor-body"], [1, "tags-editor-chips"], [1, "tag-editable"], [1, "tags-empty-hint"], [1, "tags-editor-input"], ["type", "text", "placeholder", "Type a tag and press Enter...", 1, "tag-text-input", 3, "ngModelChange", "keyup.enter", "ngModel"], ["kendoButton", "", "fillMode", "flat", 3, "click", "disabled"], [1, "tags-editor-footer"], ["kendoButton", "", "themeColor", "primary", 3, "click", "disabled"], [1, "fas", "fa-spinner", "fa-spin"], ["kendoButton", "", "fillMode", "flat", 3, "click"], ["title", "Remove tag", 1, "tag-remove-btn", 3, "click"], [1, "fas", "fa-times"], ["role", "tab", "title", "Press 6", 1, "tab", 3, "click"], [1, "fas", "fa-terminal"], [1, "result-hero"], [1, "result-icon-wrapper"], [1, "result-icon"], [1, "result-pulse"], [1, "result-text"], [1, "result-details"], [1, "result-score"], [1, "result-divider"], [1, "result-checks"], [1, "check-results"], [1, "comparison-section"], [1, "section-header"], [1, "fas", "fa-exchange-alt"], [1, "comparison-tabs"], [1, "comparison-tab", 3, "click"], [1, "fas", "fa-sign-in-alt"], [1, "fas", "fa-bullseye"], [1, "fas", "fa-check-square"], [1, "comparison-content"], ["language", "json", 3, "value", "readonly", "toolbar", "lineWrapping"], [1, "fas", "fa-tasks"], [1, "check-summary"], [1, "check-list"], [1, "check-item", 3, "passed", "failed", "animation-delay"], [1, "check-item"], [1, "check-status"], [1, "fas"], [1, "check-content"], [1, "check-name"], [1, "check-message"], [1, "check-weight"], [1, "weight-label"], [1, "details-grid"], [1, "detail-card"], [1, "detail-icon"], [1, "fas", "fa-fingerprint"], [1, "detail-content"], [1, "detail-label"], [1, "detail-value", "monospace"], [1, "detail-card", "clickable"], [1, "fas", "fa-tag"], [1, "detail-value"], [1, "fas", "fa-play-circle"], [1, "fas", "fa-stop-circle"], [1, "fas", "fa-hourglass-half"], [1, "error-section"], [1, "result-details-section"], [1, "detail-card", "clickable", 3, "click"], [1, "detail-value", "link"], [1, "fas", "fa-external-link-alt", "detail-action"], [1, "section-header", "error"], [1, "error-content"], [3, "value", "readonly", "toolbar", "lineWrapping"], [1, "fas", "fa-file-code"], [1, "result-details-content"], [1, "loading-state"], [1, "ai-section"], [1, "empty-state"], [1, "skeleton-list"], [1, "skeleton-card"], [1, "skeleton-icon"], [1, "skeleton-content"], [1, "skeleton-line", "wide"], [1, "skeleton-line", "narrow"], [1, "count-badge"], [1, "ai-run-list"], [1, "ai-run-card"], [1, "ai-run-card", 3, "click"], [1, "ai-run-icon", "agent"], [1, "ai-run-content"], [1, "ai-run-name"], [1, "ai-run-meta"], [1, "status-chip"], [1, "cost-chip"], [1, "fas", "fa-chevron-right", "ai-run-arrow"], [1, "fas", "fa-comment-dots"], [1, "ai-run-icon", "prompt"], [1, "empty-icon"], [1, "feedback-list"], [1, "skeleton-avatar"], [1, "skeleton-line", "medium"], [1, "feedback-item"], [1, "feedback-header"], [1, "feedback-user"], [1, "user-avatar"], [1, "user-name"], [1, "feedback-date"], [1, "feedback-body"], [1, "feedback-rating"], [1, "rating-stars"], [1, "fas", "fa-star", 3, "filled"], [1, "rating-value"], [1, "feedback-verdict"], [1, "feedback-comments"], [1, "verdict-badge"], [3, "machineName", "machineId", "runByUserName", "runByUserEmail", "runContextDetailsJson"], [1, "log-header"], [1, "log-title"], [1, "log-actions"], ["kendoButton", "", "look", "flat", 3, "click"], [1, "fas", "fa-copy"], [1, "log-container"]], template: function TestRunFormComponentExtended_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
-            i0.ɵɵtemplate(1, TestRunFormComponentExtended_div_1_Template, 7, 1, "div", 1);
+            i0.ɵɵconditionalCreate(1, TestRunFormComponentExtended_Conditional_1_Template, 7, 1, "div", 1);
             i0.ɵɵelementStart(2, "div", 2)(3, "nav", 3)(4, "ol")(5, "li")(6, "a", 4);
             i0.ɵɵlistener("click", function TestRunFormComponentExtended_Template_a_click_6_listener() { return ctx.navigateToTestingDashboard(); });
             i0.ɵɵelement(7, "i", 5);
             i0.ɵɵelementStart(8, "span", 6);
             i0.ɵɵtext(9, "Testing");
             i0.ɵɵelementEnd()()();
-            i0.ɵɵtemplate(10, TestRunFormComponentExtended_li_10_Template, 6, 1, "li", 7);
-            i0.ɵɵelementStart(11, "li", 8);
-            i0.ɵɵelement(12, "i", 9);
+            i0.ɵɵconditionalCreate(10, TestRunFormComponentExtended_Conditional_10_Template, 6, 1, "li");
+            i0.ɵɵelementStart(11, "li", 7);
+            i0.ɵɵelement(12, "i", 8);
             i0.ɵɵelementStart(13, "span");
             i0.ɵɵtext(14);
             i0.ɵɵelementEnd()()()();
-            i0.ɵɵelementStart(15, "div", 10)(16, "div", 11)(17, "div", 12);
-            i0.ɵɵelement(18, "i", 13);
+            i0.ɵɵelementStart(15, "div", 9)(16, "div", 10)(17, "div", 11);
+            i0.ɵɵelement(18, "i", 12);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(19, "div", 14)(20, "h1");
+            i0.ɵɵelementStart(19, "div", 13)(20, "h1");
             i0.ɵɵtext(21, " Test Run ");
-            i0.ɵɵelementStart(22, "span", 15);
+            i0.ɵɵelementStart(22, "span", 14);
             i0.ɵɵtext(23);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(24, "div", 16)(25, "span", 17);
+            i0.ɵɵelementStart(24, "div", 15)(25, "span", 16);
             i0.ɵɵtext(26);
             i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(27, TestRunFormComponentExtended_span_27_Template, 3, 1, "span", 18)(28, TestRunFormComponentExtended_span_28_Template, 3, 0, "span", 18);
+            i0.ɵɵconditionalCreate(27, TestRunFormComponentExtended_Conditional_27_Template, 3, 1, "span", 17);
+            i0.ɵɵconditionalCreate(28, TestRunFormComponentExtended_Conditional_28_Template, 3, 0, "span", 17);
             i0.ɵɵelementEnd()()();
-            i0.ɵɵelementStart(29, "div", 19)(30, "button", 20);
+            i0.ɵɵelementStart(29, "div", 18)(30, "button", 19);
             i0.ɵɵlistener("click", function TestRunFormComponentExtended_Template_button_click_30_listener() { return ctx.reRunTest(); });
-            i0.ɵɵelement(31, "i", 21);
-            i0.ɵɵelementStart(32, "span", 22);
+            i0.ɵɵelement(31, "i", 20);
+            i0.ɵɵelementStart(32, "span", 21);
             i0.ɵɵtext(33, "Re-run");
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(34, "button", 23);
+            i0.ɵɵelementStart(34, "button", 22);
             i0.ɵɵlistener("click", function TestRunFormComponentExtended_Template_button_click_34_listener() { return ctx.refresh(); });
-            i0.ɵɵelement(35, "i", 24);
-            i0.ɵɵelementStart(36, "span", 22);
+            i0.ɵɵelement(35, "i", 23);
+            i0.ɵɵelementStart(36, "span", 21);
             i0.ɵɵtext(37, "Refresh");
             i0.ɵɵelementEnd()()()();
-            i0.ɵɵelementStart(38, "div", 25)(39, "div", 26)(40, "div", 27);
-            i0.ɵɵelement(41, "i", 28);
+            i0.ɵɵelementStart(38, "div", 24)(39, "div", 25)(40, "div", 26);
+            i0.ɵɵelement(41, "i", 27);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(42, "div", 29)(43, "div", 30);
+            i0.ɵɵelementStart(42, "div", 28)(43, "div", 29);
             i0.ɵɵtext(44, "Started");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(45, "div", 31);
+            i0.ɵɵelementStart(45, "div", 30);
             i0.ɵɵtext(46);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(47, "div", 32);
+            i0.ɵɵelementStart(47, "div", 31);
             i0.ɵɵtext(48);
             i0.ɵɵpipe(49, "date");
             i0.ɵɵelementEnd()()();
-            i0.ɵɵelementStart(50, "div", 26)(51, "div", 27);
-            i0.ɵɵelement(52, "i", 33);
+            i0.ɵɵelementStart(50, "div", 25)(51, "div", 26);
+            i0.ɵɵelement(52, "i", 32);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(53, "div", 29)(54, "div", 30);
+            i0.ɵɵelementStart(53, "div", 28)(54, "div", 29);
             i0.ɵɵtext(55, "Duration");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(56, "div", 31);
+            i0.ɵɵelementStart(56, "div", 30);
             i0.ɵɵtext(57);
             i0.ɵɵelementEnd()()();
-            i0.ɵɵelementStart(58, "div", 26)(59, "div", 27);
-            i0.ɵɵelement(60, "i", 34);
+            i0.ɵɵelementStart(58, "div", 25)(59, "div", 26);
+            i0.ɵɵelement(60, "i", 33);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(61, "div", 29)(62, "div", 30);
+            i0.ɵɵelementStart(61, "div", 28)(62, "div", 29);
             i0.ɵɵtext(63, "Score");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(64, "div", 31);
+            i0.ɵɵelementStart(64, "div", 30);
             i0.ɵɵtext(65);
             i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(66, TestRunFormComponentExtended_div_66_Template, 2, 4, "div", 35);
+            i0.ɵɵconditionalCreate(66, TestRunFormComponentExtended_Conditional_66_Template, 2, 4, "div", 34);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(67, "div", 26)(68, "div", 27);
-            i0.ɵɵelement(69, "i", 36);
+            i0.ɵɵelementStart(67, "div", 25)(68, "div", 26);
+            i0.ɵɵelement(69, "i", 35);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(70, "div", 29)(71, "div", 30);
+            i0.ɵɵelementStart(70, "div", 28)(71, "div", 29);
             i0.ɵɵtext(72, "Checks");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(73, "div", 31);
+            i0.ɵɵelementStart(73, "div", 30);
             i0.ɵɵtext(74);
             i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(75, TestRunFormComponentExtended_div_75_Template, 2, 4, "div", 35);
+            i0.ɵɵconditionalCreate(75, TestRunFormComponentExtended_Conditional_75_Template, 2, 4, "div", 34);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(76, "div", 26)(77, "div", 27);
-            i0.ɵɵelement(78, "i", 37);
+            i0.ɵɵelementStart(76, "div", 25)(77, "div", 26);
+            i0.ɵɵelement(78, "i", 36);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(79, "div", 29)(80, "div", 30);
+            i0.ɵɵelementStart(79, "div", 28)(80, "div", 29);
             i0.ɵɵtext(81, "Cost");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(82, "div", 31);
+            i0.ɵɵelementStart(82, "div", 30);
             i0.ɵɵtext(83);
             i0.ɵɵelementEnd()()()();
-            i0.ɵɵtemplate(84, TestRunFormComponentExtended_div_84_Template, 4, 3, "div", 38)(85, TestRunFormComponentExtended_div_85_Template, 9, 2, "div", 39)(86, TestRunFormComponentExtended_div_86_Template, 19, 7, "div", 40);
+            i0.ɵɵconditionalCreate(84, TestRunFormComponentExtended_Conditional_84_Template, 4, 3, "div", 37);
+            i0.ɵɵconditionalCreate(85, TestRunFormComponentExtended_Conditional_85_Template, 9, 2, "div", 38);
+            i0.ɵɵconditionalCreate(86, TestRunFormComponentExtended_Conditional_86_Template, 20, 6, "div", 39);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(87, "div", 41)(88, "div", 42)(89, "button", 43);
+            i0.ɵɵelementStart(87, "div", 40)(88, "div", 41)(89, "button", 42);
             i0.ɵɵlistener("click", function TestRunFormComponentExtended_Template_button_click_89_listener() { return ctx.changeTab("overview"); });
-            i0.ɵɵelement(90, "i", 44);
+            i0.ɵɵelement(90, "i", 43);
             i0.ɵɵelementStart(91, "span");
             i0.ɵɵtext(92, "Overview");
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(93, "button", 45);
+            i0.ɵɵelementStart(93, "button", 44);
             i0.ɵɵlistener("click", function TestRunFormComponentExtended_Template_button_click_93_listener() { return ctx.changeTab("details"); });
-            i0.ɵɵelement(94, "i", 46);
+            i0.ɵɵelement(94, "i", 45);
             i0.ɵɵelementStart(95, "span");
             i0.ɵɵtext(96, "Details");
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(97, "button", 47);
+            i0.ɵɵelementStart(97, "button", 46);
             i0.ɵɵlistener("click", function TestRunFormComponentExtended_Template_button_click_97_listener() { return ctx.changeTab("ai-runs"); });
-            i0.ɵɵelement(98, "i", 48);
+            i0.ɵɵelement(98, "i", 47);
             i0.ɵɵelementStart(99, "span");
             i0.ɵɵtext(100, "AI Runs");
             i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(101, TestRunFormComponentExtended_span_101_Template, 2, 1, "span", 49);
+            i0.ɵɵconditionalCreate(101, TestRunFormComponentExtended_Conditional_101_Template, 2, 1, "span", 48);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(102, "button", 50);
+            i0.ɵɵelementStart(102, "button", 49);
             i0.ɵɵlistener("click", function TestRunFormComponentExtended_Template_button_click_102_listener() { return ctx.changeTab("feedback"); });
-            i0.ɵɵelement(103, "i", 51);
+            i0.ɵɵelement(103, "i", 50);
             i0.ɵɵelementStart(104, "span");
             i0.ɵɵtext(105, "Feedback");
             i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(106, TestRunFormComponentExtended_span_106_Template, 2, 1, "span", 49);
+            i0.ɵɵconditionalCreate(106, TestRunFormComponentExtended_Conditional_106_Template, 2, 1, "span", 48);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(107, "button", 52);
+            i0.ɵɵelementStart(107, "button", 51);
             i0.ɵɵlistener("click", function TestRunFormComponentExtended_Template_button_click_107_listener() { return ctx.changeTab("execution"); });
-            i0.ɵɵelement(108, "i", 53);
+            i0.ɵɵelement(108, "i", 52);
             i0.ɵɵelementStart(109, "span");
             i0.ɵɵtext(110, "Execution");
             i0.ɵɵelementEnd()();
-            i0.ɵɵtemplate(111, TestRunFormComponentExtended_button_111_Template, 4, 3, "button", 54);
+            i0.ɵɵconditionalCreate(111, TestRunFormComponentExtended_Conditional_111_Template, 4, 3, "button", 53);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(112, "div", 55);
-            i0.ɵɵtemplate(113, TestRunFormComponentExtended_div_113_Template, 34, 20, "div", 56)(114, TestRunFormComponentExtended_div_114_Template, 47, 15, "div", 57)(115, TestRunFormComponentExtended_div_115_Template, 5, 5, "div", 58)(116, TestRunFormComponentExtended_div_116_Template, 4, 4, "div", 59)(117, TestRunFormComponentExtended_div_117_Template, 2, 6, "div", 60)(118, TestRunFormComponentExtended_div_118_Template, 13, 5, "div", 61);
+            i0.ɵɵelementStart(112, "div", 54);
+            i0.ɵɵconditionalCreate(113, TestRunFormComponentExtended_Conditional_113_Template, 34, 20, "div", 55);
+            i0.ɵɵconditionalCreate(114, TestRunFormComponentExtended_Conditional_114_Template, 47, 15, "div", 56);
+            i0.ɵɵconditionalCreate(115, TestRunFormComponentExtended_Conditional_115_Template, 5, 5, "div", 57);
+            i0.ɵɵconditionalCreate(116, TestRunFormComponentExtended_Conditional_116_Template, 4, 4, "div", 58);
+            i0.ɵɵconditionalCreate(117, TestRunFormComponentExtended_Conditional_117_Template, 2, 6, "div", 59);
+            i0.ɵɵconditionalCreate(118, TestRunFormComponentExtended_Conditional_118_Template, 13, 5, "div", 60);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(119, "div", 62);
-            i0.ɵɵelement(120, "i", 63);
-            i0.ɵɵelementStart(121, "div", 64)(122, "h4");
+            i0.ɵɵelementStart(119, "div", 61);
+            i0.ɵɵelement(120, "i", 62);
+            i0.ɵɵelementStart(121, "div", 63)(122, "h4");
             i0.ɵɵtext(123, "Keyboard Shortcuts");
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(124, "ul")(125, "li")(126, "kbd");
@@ -1470,27 +1489,27 @@ let TestRunFormComponentExtended = class TestRunFormComponentExtended extends Te
         } if (rf & 2) {
             i0.ɵɵclassProp("is-mobile", false);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.error);
+            i0.ɵɵconditional(ctx.error ? 1 : -1);
             i0.ɵɵadvance();
             i0.ɵɵclassMap(ctx.getStatusClass());
             i0.ɵɵadvance(8);
-            i0.ɵɵproperty("ngIf", ctx.test);
+            i0.ɵɵconditional(ctx.test ? 10 : -1);
             i0.ɵɵadvance(4);
-            i0.ɵɵtextInterpolate1("Run #", ctx.record.ID.substring(0, 8), "");
+            i0.ɵɵtextInterpolate1("Run #", ctx.record.ID.substring(0, 8));
             i0.ɵɵadvance(3);
             i0.ɵɵstyleProp("background-color", ctx.getStatusColor());
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngClass", ctx.getStatusIcon());
             i0.ɵɵadvance(5);
-            i0.ɵɵtextInterpolate1("#", ctx.record.ID.substring(0, 8), "");
+            i0.ɵɵtextInterpolate1("#", ctx.record.ID.substring(0, 8));
             i0.ɵɵadvance(2);
             i0.ɵɵstyleProp("background-color", ctx.getStatusColor());
             i0.ɵɵadvance();
             i0.ɵɵtextInterpolate1(" ", ctx.record.Status, " ");
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.test);
+            i0.ɵɵconditional(ctx.test ? 27 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.autoRefreshEnabled);
+            i0.ɵɵconditional(ctx.autoRefreshEnabled ? 28 : -1);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("disabled", !ctx.record.TestID);
             i0.ɵɵadvance(4);
@@ -1506,19 +1525,19 @@ let TestRunFormComponentExtended = class TestRunFormComponentExtended extends Te
             i0.ɵɵadvance(8);
             i0.ɵɵtextInterpolate(ctx.formatScore(ctx.record.Score));
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.record.Score != null);
+            i0.ɵɵconditional(ctx.record.Score != null ? 66 : -1);
             i0.ɵɵadvance(8);
-            i0.ɵɵtextInterpolate2("", ctx.record.PassedChecks, "/", ctx.record.TotalChecks, "");
+            i0.ɵɵtextInterpolate2("", ctx.record.PassedChecks, "/", ctx.record.TotalChecks);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.record.TotalChecks);
+            i0.ɵɵconditional(ctx.record.TotalChecks ? 75 : -1);
             i0.ɵɵadvance(8);
             i0.ɵɵtextInterpolate(ctx.formatCost(ctx.record.CostUSD));
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.record.RunByUser || ctx.testSuiteRun || ctx.record.TargetLogEntityID);
+            i0.ɵɵconditional(ctx.record.RunByUser || ctx.testSuiteRun || ctx.record.TargetLogEntityID ? 84 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", !ctx.editingTags);
+            i0.ɵɵconditional(!ctx.editingTags ? 85 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.editingTags);
+            i0.ɵɵconditional(ctx.editingTags ? 86 : -1);
             i0.ɵɵadvance(3);
             i0.ɵɵclassProp("active", ctx.activeTab === "overview");
             i0.ɵɵattribute("aria-selected", ctx.activeTab === "overview");
@@ -1529,30 +1548,30 @@ let TestRunFormComponentExtended = class TestRunFormComponentExtended extends Te
             i0.ɵɵclassProp("active", ctx.activeTab === "ai-runs");
             i0.ɵɵattribute("aria-selected", ctx.activeTab === "ai-runs");
             i0.ɵɵadvance(4);
-            i0.ɵɵproperty("ngIf", ctx.aiRunsLoaded);
+            i0.ɵɵconditional(ctx.aiRunsLoaded ? 101 : -1);
             i0.ɵɵadvance();
             i0.ɵɵclassProp("active", ctx.activeTab === "feedback");
             i0.ɵɵattribute("aria-selected", ctx.activeTab === "feedback");
             i0.ɵɵadvance(4);
-            i0.ɵɵproperty("ngIf", ctx.feedbackLoaded);
+            i0.ɵɵconditional(ctx.feedbackLoaded ? 106 : -1);
             i0.ɵɵadvance();
             i0.ɵɵclassProp("active", ctx.activeTab === "execution");
             i0.ɵɵattribute("aria-selected", ctx.activeTab === "execution");
             i0.ɵɵadvance(4);
-            i0.ɵɵproperty("ngIf", ctx.record.Log);
+            i0.ɵɵconditional(ctx.record.Log ? 111 : -1);
             i0.ɵɵadvance(2);
-            i0.ɵɵproperty("ngIf", ctx.activeTab === "overview");
+            i0.ɵɵconditional(ctx.activeTab === "overview" ? 113 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.activeTab === "details");
+            i0.ɵɵconditional(ctx.activeTab === "details" ? 114 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.activeTab === "ai-runs");
+            i0.ɵɵconditional(ctx.activeTab === "ai-runs" ? 115 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.activeTab === "feedback");
+            i0.ɵɵconditional(ctx.activeTab === "feedback" ? 116 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.activeTab === "execution");
+            i0.ɵɵconditional(ctx.activeTab === "execution" ? 117 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.activeTab === "log");
-        } }, dependencies: [i5.NgClass, i5.NgForOf, i5.NgIf, i6.DefaultValueAccessor, i6.NgControlStatus, i6.NgModel, i7.ButtonComponent, i8.CodeEditorComponent, i3.ExecutionContextComponent, i9.EntityLinkPillComponent, i5.DecimalPipe, i5.DatePipe], styles: ["\n\n\n\n\n\n\n\n[_nghost-%COMP%] {\n  --test-primary: #2563eb;\n  --test-primary-light: #3b82f6;\n  --test-primary-dark: #1d4ed8;\n  --test-success: #10b981;\n  --test-success-light: #d1fae5;\n  --test-error: #ef4444;\n  --test-error-light: #fee2e2;\n  --test-warning: #f59e0b;\n  --test-warning-light: #fef3c7;\n  --test-timeout: #f97316;\n  --test-timeout-light: #ffedd5;\n  --test-running: #3b82f6;\n  --test-pending: #8b5cf6;\n  --test-skipped: #6b7280;\n  --test-bg: #f8fafc;\n  --test-surface: #ffffff;\n  --test-border: #e2e8f0;\n  --test-text: #1e293b;\n  --test-text-secondary: #64748b;\n  --test-text-muted: #94a3b8;\n  --test-radius-sm: 6px;\n  --test-radius-md: 10px;\n  --test-radius-lg: 16px;\n  --test-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);\n  --test-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  --test-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n  --test-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  display: block;\n  height: 100%;\n}\n\n\n\n.test-run-form[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  background: var(--test-bg);\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n\n\n\n\n.error-banner[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  padding: 12px 20px;\n  background: linear-gradient(135deg, var(--test-error) 0%, #dc2626 100%);\n  color: white;\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: var(--test-transition);\n  animation: _ngcontent-%COMP%_slideDown 0.3s ease-out;\n}\n\n.error-banner[_ngcontent-%COMP%]:hover {\n  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);\n}\n\n.error-banner[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 16px;\n}\n\n.retry-btn[_ngcontent-%COMP%] {\n  background: rgba(255, 255, 255, 0.2);\n  border: 1px solid rgba(255, 255, 255, 0.3);\n  color: white;\n  padding: 6px 12px;\n  border-radius: var(--test-radius-sm);\n  cursor: pointer;\n  font-size: 12px;\n  font-weight: 600;\n  transition: var(--test-transition);\n}\n\n.retry-btn[_ngcontent-%COMP%]:hover {\n  background: rgba(255, 255, 255, 0.3);\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n  from {\n    transform: translateY(-100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}\n\n\n\n\n\n.test-run-header[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-bottom: 1px solid var(--test-border);\n  padding: 20px;\n  position: relative;\n}\n\n\n\n.breadcrumb[_ngcontent-%COMP%] {\n  margin-bottom: 16px;\n}\n\n.breadcrumb[_ngcontent-%COMP%]   ol[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  font-size: 13px;\n  flex-wrap: wrap;\n}\n\n.breadcrumb[_ngcontent-%COMP%]   li[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.breadcrumb[_ngcontent-%COMP%]   a[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n  text-decoration: none;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 8px;\n  border-radius: var(--test-radius-sm);\n  transition: var(--test-transition);\n}\n\n.breadcrumb[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:hover {\n  background: rgba(37, 99, 235, 0.1);\n  text-decoration: none;\n}\n\n.breadcrumb[_ngcontent-%COMP%]   .separator[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: var(--test-text-muted);\n  margin: 0 4px;\n}\n\n.breadcrumb[_ngcontent-%COMP%]   .current[_ngcontent-%COMP%] {\n  color: var(--test-text-secondary);\n  font-weight: 500;\n}\n\n.breadcrumb-text[_ngcontent-%COMP%] {\n  max-width: 200px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n\n\n.header-content[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 20px;\n  gap: 16px;\n}\n\n.header-left[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 16px;\n  flex: 1;\n  min-width: 0;\n}\n\n\n\n.status-indicator[_ngcontent-%COMP%] {\n  width: 56px;\n  height: 56px;\n  border-radius: var(--test-radius-md);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: white;\n  font-size: 24px;\n  flex-shrink: 0;\n  box-shadow: var(--test-shadow-md);\n  transition: var(--test-transition);\n}\n\n.status-indicator[_ngcontent-%COMP%]:hover {\n  transform: scale(1.05);\n}\n\n\n\n.test-run-info[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.test-run-info[_ngcontent-%COMP%]   h1[_ngcontent-%COMP%] {\n  margin: 0 0 8px 0;\n  font-size: clamp(18px, 4vw, 24px);\n  font-weight: 700;\n  color: var(--test-text);\n  line-height: 1.2;\n  word-wrap: break-word;\n}\n\n.test-run-info[_ngcontent-%COMP%]   h1[_ngcontent-%COMP%]   .run-id[_ngcontent-%COMP%] {\n  color: var(--test-text-secondary);\n  font-weight: 500;\n}\n\n.test-run-meta[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n\n\n.status-badge[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 14px;\n  border-radius: 20px;\n  color: white;\n  font-size: 12px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n\n\n.meta-item[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 14px;\n  color: var(--test-text-secondary);\n}\n\n.meta-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 12px;\n}\n\n\n\n.header-actions[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n  flex-shrink: 0;\n}\n\n.header-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  white-space: nowrap;\n}\n\n.btn-text[_ngcontent-%COMP%] {\n  margin-left: 6px;\n}\n\n\n\n\n\n.metrics-bar[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));\n  gap: 12px;\n  margin-bottom: 16px;\n}\n\n.metric-card[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  padding: 14px;\n  transition: var(--test-transition);\n}\n\n.metric-card[_ngcontent-%COMP%]:hover {\n  transform: translateY(-2px);\n  box-shadow: var(--test-shadow-md);\n}\n\n.metric-icon[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-sm);\n  color: var(--test-primary);\n  font-size: 16px;\n  flex-shrink: 0;\n}\n\n.metric-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.metric-label[_ngcontent-%COMP%] {\n  font-size: 10px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  color: var(--test-text-muted);\n  margin-bottom: 4px;\n}\n\n.metric-value[_ngcontent-%COMP%] {\n  font-size: 16px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.metric-detail[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--test-text-muted);\n  margin-top: 2px;\n}\n\n\n\n.metric-progress[_ngcontent-%COMP%] {\n  margin-top: 6px;\n  height: 4px;\n  background: var(--test-border);\n  border-radius: 2px;\n  overflow: hidden;\n}\n\n.progress-bar[_ngcontent-%COMP%] {\n  height: 100%;\n  border-radius: 2px;\n  transition: width 0.5s ease-out;\n}\n\n\n\n.secondary-info[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 12px;\n  padding-top: 16px;\n  border-top: 1px solid var(--test-border);\n  flex-wrap: wrap;\n}\n\n.info-chip[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 13px;\n  color: var(--test-text-secondary);\n  padding: 6px 12px;\n  background: var(--test-bg);\n  border-radius: 20px;\n  transition: var(--test-transition);\n}\n\n.info-chip[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 12px;\n}\n\n.info-chip.clickable[_ngcontent-%COMP%] {\n  cursor: pointer;\n}\n\n.info-chip.clickable[_ngcontent-%COMP%]:hover {\n  background: rgba(37, 99, 235, 0.1);\n  color: var(--test-primary);\n}\n\n\n\n\n\n.tabs-container[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-bottom: 1px solid var(--test-border);\n  position: sticky;\n  top: 0;\n  z-index: 10;\n}\n\n.tabs[_ngcontent-%COMP%] {\n  display: flex;\n  padding: 0 20px;\n  overflow-x: auto;\n  -webkit-overflow-scrolling: touch;\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n\n.tabs[_ngcontent-%COMP%]::-webkit-scrollbar {\n  display: none;\n}\n\n.tab[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 14px 18px;\n  border: none;\n  background: transparent;\n  border-bottom: 3px solid transparent;\n  color: var(--test-text-secondary);\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: var(--test-transition);\n  white-space: nowrap;\n  position: relative;\n}\n\n.tab[_ngcontent-%COMP%]:hover {\n  color: var(--test-primary);\n  background: rgba(37, 99, 235, 0.05);\n}\n\n.tab.active[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n  border-bottom-color: var(--test-primary);\n  font-weight: 600;\n}\n\n.tab[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 15px;\n}\n\n.tab-badge[_ngcontent-%COMP%] {\n  background: var(--test-border);\n  color: var(--test-text-secondary);\n  padding: 2px 8px;\n  border-radius: 10px;\n  font-size: 11px;\n  font-weight: 600;\n  transition: var(--test-transition);\n}\n\n.tab.active[_ngcontent-%COMP%]   .tab-badge[_ngcontent-%COMP%] {\n  background: rgba(37, 99, 235, 0.15);\n  color: var(--test-primary);\n}\n\n.shortcut-hint[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: var(--test-text-muted);\n  background: var(--test-bg);\n  padding: 2px 6px;\n  border-radius: 4px;\n  font-weight: 600;\n  margin-left: 4px;\n  font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n}\n\n\n\n\n\n.tab-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 20px;\n  scroll-behavior: smooth;\n}\n\n\n\n\n\n.overview-tab[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n  from { opacity: 0; transform: translateY(10px); }\n  to { opacity: 1; transform: translateY(0); }\n}\n\n\n\n.result-hero[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 32px;\n  text-align: center;\n  border: 2px solid var(--test-border);\n  box-shadow: var(--test-shadow-sm);\n  transition: var(--test-transition);\n}\n\n.result-hero.passed[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #ecfdf5 0%, var(--test-success-light) 100%);\n  border-color: var(--test-success);\n}\n\n.result-hero.failed[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #fef2f2 0%, var(--test-error-light) 100%);\n  border-color: var(--test-error);\n}\n\n.result-hero.error[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #fffbeb 0%, var(--test-warning-light) 100%);\n  border-color: var(--test-warning);\n}\n\n.result-hero.timeout[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #fff7ed 0%, var(--test-timeout-light) 100%);\n  border-color: var(--test-timeout);\n}\n\n.result-hero.running[_ngcontent-%COMP%], \n.result-hero.pending[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);\n  border-color: var(--test-primary-light);\n}\n\n.result-icon-wrapper[_ngcontent-%COMP%] {\n  position: relative;\n  display: inline-block;\n  margin-bottom: 16px;\n}\n\n.result-icon[_ngcontent-%COMP%] {\n  width: 80px;\n  height: 80px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border-radius: 50%;\n  font-size: 40px;\n  margin: 0 auto;\n  box-shadow: var(--test-shadow-md);\n}\n\n.result-hero.passed[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] { color: var(--test-success); }\n.result-hero.failed[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] { color: var(--test-error); }\n.result-hero.error[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] { color: var(--test-warning); }\n.result-hero.timeout[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] { color: var(--test-timeout); }\n.result-hero.running[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%], \n.result-hero.pending[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] { color: var(--test-primary); }\n\n.result-pulse[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 100px;\n  height: 100px;\n  border-radius: 50%;\n  background: rgba(59, 130, 246, 0.2);\n  animation: _ngcontent-%COMP%_pulse 2s ease-in-out infinite;\n}\n\n@keyframes _ngcontent-%COMP%_pulse {\n  0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.5; }\n  50% { transform: translate(-50%, -50%) scale(1.2); opacity: 0; }\n}\n\n.result-text[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n  margin: 0 0 12px 0;\n  font-size: clamp(24px, 5vw, 32px);\n  font-weight: 800;\n  color: var(--test-text);\n}\n\n.result-details[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n.result-score[_ngcontent-%COMP%] {\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--test-text-secondary);\n}\n\n.result-divider[_ngcontent-%COMP%] {\n  color: var(--test-border);\n}\n\n.result-checks[_ngcontent-%COMP%] {\n  font-size: 16px;\n  color: var(--test-text-muted);\n}\n\n\n\n.section-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 16px;\n  gap: 12px;\n}\n\n.section-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 700;\n  color: var(--test-text);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.section-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n}\n\n.section-header.error[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--test-error);\n}\n\n.check-summary[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: var(--test-text-secondary);\n}\n\n\n\n.check-results[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.check-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.check-item[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 12px;\n  padding: 14px 16px;\n  border-radius: var(--test-radius-md);\n  border: 1px solid var(--test-border);\n  transition: var(--test-transition);\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out backwards;\n}\n\n.check-item[_ngcontent-%COMP%]:hover {\n  transform: translateX(4px);\n}\n\n.check-item.passed[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);\n  border-color: #86efac;\n}\n\n.check-item.failed[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);\n  border-color: #fca5a5;\n}\n\n.check-status[_ngcontent-%COMP%] {\n  font-size: 20px;\n  flex-shrink: 0;\n  margin-top: 2px;\n}\n\n.check-item.passed[_ngcontent-%COMP%]   .check-status[_ngcontent-%COMP%] { color: var(--test-success); }\n.check-item.failed[_ngcontent-%COMP%]   .check-status[_ngcontent-%COMP%] { color: var(--test-error); }\n\n.check-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.check-name[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n  margin-bottom: 4px;\n}\n\n.check-message[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: var(--test-text-secondary);\n  line-height: 1.5;\n  word-wrap: break-word;\n}\n\n.check-weight[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: var(--test-text-muted);\n  flex-shrink: 0;\n  text-align: right;\n}\n\n.weight-label[_ngcontent-%COMP%] {\n  font-weight: 500;\n}\n\n\n\n.comparison-section[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.comparison-tabs[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 4px;\n  margin-bottom: 16px;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  padding: 4px;\n}\n\n.comparison-tab[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  padding: 10px 16px;\n  border: none;\n  background: transparent;\n  color: var(--test-text-secondary);\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  border-radius: var(--test-radius-sm);\n  transition: var(--test-transition);\n}\n\n.comparison-tab[_ngcontent-%COMP%]:hover {\n  color: var(--test-text);\n  background: rgba(0, 0, 0, 0.05);\n}\n\n.comparison-tab.active[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  color: var(--test-primary);\n  font-weight: 600;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.comparison-content[_ngcontent-%COMP%] {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid var(--test-border);\n}\n\n\n\n\n\n.details-tab[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n}\n\n.details-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n  gap: 12px;\n}\n\n.detail-card[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  transition: var(--test-transition);\n}\n\n.detail-card.clickable[_ngcontent-%COMP%] {\n  cursor: pointer;\n}\n\n.detail-card.clickable[_ngcontent-%COMP%]:hover {\n  background: rgba(37, 99, 235, 0.05);\n  border-color: var(--test-primary-light);\n  transform: translateX(4px);\n}\n\n.detail-icon[_ngcontent-%COMP%] {\n  width: 44px;\n  height: 44px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  color: var(--test-primary);\n  font-size: 18px;\n  flex-shrink: 0;\n}\n\n.detail-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.detail-label[_ngcontent-%COMP%] {\n  font-size: 11px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  color: var(--test-text-muted);\n  margin-bottom: 4px;\n}\n\n.detail-value[_ngcontent-%COMP%] {\n  font-size: 14px;\n  color: var(--test-text);\n  word-wrap: break-word;\n  font-weight: 500;\n}\n\n.detail-value.monospace[_ngcontent-%COMP%] {\n  font-family: 'SF Mono', Monaco, 'Courier New', monospace;\n  font-size: 12px;\n}\n\n.detail-value.link[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n}\n\n.detail-action[_ngcontent-%COMP%] {\n  color: var(--test-text-muted);\n  font-size: 12px;\n  transition: var(--test-transition);\n}\n\n.detail-card.clickable[_ngcontent-%COMP%]:hover   .detail-action[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n}\n\n\n\n.error-section[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.error-content[_ngcontent-%COMP%] {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid #fca5a5;\n}\n\n\n\n.result-details-section[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.result-details-content[_ngcontent-%COMP%] {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid var(--test-border);\n}\n\n\n\n\n\n.ai-runs-tab[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n}\n\n.ai-section[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.count-badge[_ngcontent-%COMP%] {\n  background: var(--test-bg);\n  color: var(--test-text-secondary);\n  padding: 4px 10px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n.ai-run-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.ai-run-card[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-bg);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  cursor: pointer;\n  transition: var(--test-transition);\n}\n\n.ai-run-card[_ngcontent-%COMP%]:hover {\n  background: rgba(37, 99, 235, 0.05);\n  border-color: var(--test-primary-light);\n  transform: translateX(4px);\n  box-shadow: var(--test-shadow-sm);\n}\n\n.ai-run-icon[_ngcontent-%COMP%] {\n  width: 44px;\n  height: 44px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: linear-gradient(135deg, var(--test-primary) 0%, var(--test-primary-dark) 100%);\n  color: white;\n  border-radius: var(--test-radius-md);\n  font-size: 18px;\n  flex-shrink: 0;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.ai-run-icon.agent[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, var(--test-primary) 0%, var(--test-primary-dark) 100%);\n}\n\n.ai-run-icon.prompt[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #9333ea 0%, #7c3aed 100%);\n}\n\n.ai-run-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.ai-run-name[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n  margin-bottom: 6px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.ai-run-meta[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 10px;\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  flex-wrap: wrap;\n}\n\n.status-chip[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  padding: 2px 8px;\n  border-radius: 10px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n}\n\n.status-chip.complete[_ngcontent-%COMP%], \n.status-chip.completed[_ngcontent-%COMP%], \n.status-chip.passed[_ngcontent-%COMP%] {\n  background: var(--test-success-light);\n  color: #059669;\n}\n\n.status-chip.failed[_ngcontent-%COMP%], \n.status-chip.error[_ngcontent-%COMP%] {\n  background: var(--test-error-light);\n  color: #dc2626;\n}\n\n.status-chip.running[_ngcontent-%COMP%] {\n  background: #dbeafe;\n  color: var(--test-primary);\n}\n\n.cost-chip[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 2px;\n  color: var(--test-text-muted);\n}\n\n.ai-run-arrow[_ngcontent-%COMP%] {\n  color: var(--test-text-muted);\n  font-size: 14px;\n  transition: var(--test-transition);\n}\n\n.ai-run-card[_ngcontent-%COMP%]:hover   .ai-run-arrow[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n  transform: translateX(2px);\n}\n\n\n\n\n\n.feedback-tab[_ngcontent-%COMP%] {\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n}\n\n.feedback-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n.feedback-item[_ngcontent-%COMP%] {\n  padding: 20px;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  border: 1px solid var(--test-border);\n  box-shadow: var(--test-shadow-sm);\n  transition: var(--test-transition);\n}\n\n.feedback-item[_ngcontent-%COMP%]:hover {\n  border-color: var(--test-primary-light);\n}\n\n.feedback-header[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 16px;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.feedback-user[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.user-avatar[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: 50%;\n  color: var(--test-primary);\n  font-size: 14px;\n}\n\n.user-name[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.feedback-date[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: var(--test-text-muted);\n}\n\n.feedback-body[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.feedback-rating[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.rating-stars[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 2px;\n}\n\n.rating-stars[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 14px;\n  color: var(--test-border);\n}\n\n.rating-stars[_ngcontent-%COMP%]   i.filled[_ngcontent-%COMP%] {\n  color: #fbbf24;\n}\n\n.rating-value[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.feedback-verdict[_ngcontent-%COMP%] {\n  display: flex;\n}\n\n.verdict-badge[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  border-radius: 20px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n.verdict-badge.correct[_ngcontent-%COMP%] {\n  background: var(--test-success-light);\n  color: #059669;\n}\n\n.verdict-badge.incorrect[_ngcontent-%COMP%] {\n  background: var(--test-error-light);\n  color: #dc2626;\n}\n\n.feedback-comments[_ngcontent-%COMP%] {\n  padding: 14px;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  border-left: 3px solid var(--test-primary);\n}\n\n.feedback-comments[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 14px;\n  line-height: 1.6;\n  color: var(--test-text);\n}\n\n\n\n\n\n.log-tab[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  height: 100%;\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n}\n\n.log-header[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background: var(--test-surface);\n  padding: 16px 20px;\n  border-radius: var(--test-radius-lg) var(--test-radius-lg) 0 0;\n  border: 1px solid var(--test-border);\n  border-bottom: none;\n}\n\n.log-title[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.log-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--test-text-secondary);\n  font-size: 16px;\n}\n\n.log-title[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.log-actions[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n}\n\n.log-container[_ngcontent-%COMP%] {\n  flex: 1;\n  border-radius: 0 0 var(--test-radius-lg) var(--test-radius-lg);\n  overflow: hidden;\n  min-height: 300px;\n  border: 1px solid var(--test-border);\n  border-top: none;\n}\n\n\n\n\n\n.loading-state[_ngcontent-%COMP%] {\n  padding: 20px;\n}\n\n.skeleton-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.skeleton-card[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-md);\n  border: 1px solid var(--test-border);\n}\n\n.skeleton-icon[_ngcontent-%COMP%], \n.skeleton-avatar[_ngcontent-%COMP%] {\n  width: 44px;\n  height: 44px;\n  border-radius: var(--test-radius-md);\n  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);\n  background-size: 200% 100%;\n  animation: _ngcontent-%COMP%_shimmer 1.5s infinite;\n}\n\n.skeleton-avatar[_ngcontent-%COMP%] {\n  border-radius: 50%;\n}\n\n.skeleton-content[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.skeleton-line[_ngcontent-%COMP%] {\n  height: 14px;\n  border-radius: 4px;\n  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);\n  background-size: 200% 100%;\n  animation: _ngcontent-%COMP%_shimmer 1.5s infinite;\n}\n\n.skeleton-line.wide[_ngcontent-%COMP%] { width: 70%; }\n.skeleton-line.medium[_ngcontent-%COMP%] { width: 55%; }\n.skeleton-line.narrow[_ngcontent-%COMP%] { width: 40%; }\n\n@keyframes _ngcontent-%COMP%_shimmer {\n  0% { background-position: 200% 0; }\n  100% { background-position: -200% 0; }\n}\n\n\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 60px 24px;\n  text-align: center;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n}\n\n.empty-icon[_ngcontent-%COMP%] {\n  width: 80px;\n  height: 80px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: 50%;\n  margin-bottom: 20px;\n}\n\n.empty-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 36px;\n  color: var(--test-text-muted);\n}\n\n.empty-state[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0 0 8px 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.empty-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 14px;\n  color: var(--test-text-secondary);\n  max-width: 300px;\n}\n\n\n\n\n\n.shortcuts-hint[_ngcontent-%COMP%] {\n  position: fixed;\n  bottom: 20px;\n  right: 20px;\n  z-index: 100;\n}\n\n.shortcuts-hint[_ngcontent-%COMP%]    > i[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: 50%;\n  color: var(--test-text-muted);\n  font-size: 16px;\n  cursor: pointer;\n  box-shadow: var(--test-shadow-md);\n  transition: var(--test-transition);\n}\n\n.shortcuts-hint[_ngcontent-%COMP%]:hover    > i[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n  border-color: var(--test-primary-light);\n}\n\n.shortcuts-popup[_ngcontent-%COMP%] {\n  display: none;\n  position: absolute;\n  bottom: 50px;\n  right: 0;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  padding: 16px;\n  box-shadow: var(--test-shadow-lg);\n  min-width: 200px;\n}\n\n.shortcuts-hint[_ngcontent-%COMP%]:hover   .shortcuts-popup[_ngcontent-%COMP%] {\n  display: block;\n  animation: _ngcontent-%COMP%_fadeIn 0.2s ease-out;\n}\n\n.shortcuts-popup[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n  margin: 0 0 12px 0;\n  font-size: 14px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.shortcuts-popup[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%] {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n\n.shortcuts-popup[_ngcontent-%COMP%]   li[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 6px 0;\n  font-size: 13px;\n  color: var(--test-text-secondary);\n}\n\n.shortcuts-popup[_ngcontent-%COMP%]   kbd[_ngcontent-%COMP%] {\n  background: var(--test-bg);\n  border: 1px solid var(--test-border);\n  border-radius: 4px;\n  padding: 2px 6px;\n  font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n  font-size: 11px;\n  color: var(--test-text);\n}\n\n\n\n\n\n@media (max-width: 1024px) {\n  .metrics-bar[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(3, 1fr);\n  }\n\n  .details-grid[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(2, 1fr);\n  }\n\n  .shortcuts-hint[_ngcontent-%COMP%] {\n    display: none;\n  }\n}\n\n\n\n\n\n@media (max-width: 768px) {\n  .test-run-form[_ngcontent-%COMP%] {\n    height: auto;\n    min-height: 100%;\n  }\n\n  .test-run-header[_ngcontent-%COMP%] {\n    padding: 16px;\n  }\n\n  .breadcrumb[_ngcontent-%COMP%] {\n    margin-bottom: 12px;\n  }\n\n  .breadcrumb[_ngcontent-%COMP%]   ol[_ngcontent-%COMP%] {\n    font-size: 12px;\n  }\n\n  .header-content[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .header-left[_ngcontent-%COMP%] {\n    width: 100%;\n  }\n\n  .status-indicator[_ngcontent-%COMP%] {\n    width: 48px;\n    height: 48px;\n    font-size: 20px;\n  }\n\n  .test-run-info[_ngcontent-%COMP%]   h1[_ngcontent-%COMP%] {\n    font-size: 18px;\n  }\n\n  .test-run-meta[_ngcontent-%COMP%] {\n    gap: 8px;\n  }\n\n  .status-badge[_ngcontent-%COMP%] {\n    padding: 4px 10px;\n    font-size: 11px;\n  }\n\n  .header-actions[_ngcontent-%COMP%] {\n    width: 100%;\n    justify-content: stretch;\n  }\n\n  .header-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n    flex: 1;\n  }\n\n  .metrics-bar[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(2, 1fr);\n    gap: 10px;\n  }\n\n  .metric-card[_ngcontent-%COMP%] {\n    padding: 12px;\n  }\n\n  .metric-icon[_ngcontent-%COMP%] {\n    width: 36px;\n    height: 36px;\n    font-size: 14px;\n  }\n\n  .metric-value[_ngcontent-%COMP%] {\n    font-size: 14px;\n  }\n\n  .tabs[_ngcontent-%COMP%] {\n    padding: 0 12px;\n  }\n\n  .tab[_ngcontent-%COMP%] {\n    padding: 12px 14px;\n    font-size: 13px;\n    gap: 6px;\n  }\n\n  .tab[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 14px;\n  }\n\n  .shortcut-hint[_ngcontent-%COMP%] {\n    display: none;\n  }\n\n  .tab-content[_ngcontent-%COMP%] {\n    padding: 16px;\n  }\n\n  .result-hero[_ngcontent-%COMP%] {\n    padding: 24px 20px;\n  }\n\n  .result-icon[_ngcontent-%COMP%] {\n    width: 64px;\n    height: 64px;\n    font-size: 32px;\n  }\n\n  .result-text[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n    font-size: 24px;\n  }\n\n  .result-score[_ngcontent-%COMP%] {\n    font-size: 16px;\n  }\n\n  .check-results[_ngcontent-%COMP%], \n   .comparison-section[_ngcontent-%COMP%], \n   .ai-section[_ngcontent-%COMP%], \n   .feedback-item[_ngcontent-%COMP%] {\n    padding: 18px;\n  }\n\n  .check-item[_ngcontent-%COMP%] {\n    padding: 12px;\n  }\n\n  .comparison-tabs[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .comparison-tab[_ngcontent-%COMP%] {\n    text-align: center;\n  }\n\n  .details-grid[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr;\n  }\n\n  .detail-card[_ngcontent-%COMP%] {\n    padding: 14px;\n  }\n\n  .ai-run-card[_ngcontent-%COMP%] {\n    padding: 14px;\n  }\n\n  .ai-run-icon[_ngcontent-%COMP%] {\n    width: 40px;\n    height: 40px;\n    font-size: 16px;\n  }\n\n  .ai-run-meta[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .feedback-header[_ngcontent-%COMP%] {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .log-header[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 12px;\n    align-items: stretch;\n  }\n\n  .log-actions[_ngcontent-%COMP%] {\n    justify-content: stretch;\n  }\n\n  .log-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n    flex: 1;\n  }\n\n  .empty-state[_ngcontent-%COMP%] {\n    padding: 40px 20px;\n  }\n\n  .empty-icon[_ngcontent-%COMP%] {\n    width: 64px;\n    height: 64px;\n  }\n\n  .empty-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 28px;\n  }\n}\n\n\n\n\n\n@media (max-width: 480px) {\n  .test-run-header[_ngcontent-%COMP%] {\n    padding: 12px;\n  }\n\n  .header-left[_ngcontent-%COMP%] {\n    gap: 12px;\n  }\n\n  .status-indicator[_ngcontent-%COMP%] {\n    width: 40px;\n    height: 40px;\n    font-size: 18px;\n    border-radius: 8px;\n  }\n\n  .test-run-info[_ngcontent-%COMP%]   h1[_ngcontent-%COMP%] {\n    font-size: 16px;\n  }\n\n  .metrics-bar[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr 1fr;\n  }\n\n  .metric-card[_ngcontent-%COMP%] {\n    padding: 10px;\n    flex-direction: column;\n    text-align: center;\n  }\n\n  .metric-icon[_ngcontent-%COMP%] {\n    margin-bottom: 8px;\n  }\n\n  .metric-label[_ngcontent-%COMP%] {\n    font-size: 9px;\n  }\n\n  .metric-value[_ngcontent-%COMP%] {\n    font-size: 14px;\n  }\n\n  .tabs[_ngcontent-%COMP%] {\n    padding: 0 8px;\n  }\n\n  .tab[_ngcontent-%COMP%] {\n    padding: 10px 12px;\n    font-size: 12px;\n  }\n\n  .tab-badge[_ngcontent-%COMP%] {\n    display: none;\n  }\n\n  .tab-content[_ngcontent-%COMP%] {\n    padding: 12px;\n  }\n\n  .result-hero[_ngcontent-%COMP%] {\n    padding: 20px 16px;\n  }\n\n  .result-icon[_ngcontent-%COMP%] {\n    width: 56px;\n    height: 56px;\n    font-size: 28px;\n  }\n\n  .result-text[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n    font-size: 20px;\n  }\n\n  .result-score[_ngcontent-%COMP%] {\n    font-size: 14px;\n  }\n\n  .result-checks[_ngcontent-%COMP%] {\n    font-size: 12px;\n  }\n\n  .section-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    font-size: 16px;\n  }\n\n  .check-item[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  .check-weight[_ngcontent-%COMP%] {\n    text-align: left;\n  }\n}\n\n\n\n\n\n@media (hover: none) and (pointer: coarse) {\n  .tab[_ngcontent-%COMP%], \n   .comparison-tab[_ngcontent-%COMP%], \n   .ai-run-card[_ngcontent-%COMP%], \n   .check-item[_ngcontent-%COMP%], \n   .feedback-item[_ngcontent-%COMP%], \n   .detail-card.clickable[_ngcontent-%COMP%] {\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  .ai-run-card[_ngcontent-%COMP%]:active, \n   .detail-card.clickable[_ngcontent-%COMP%]:active {\n    background: rgba(37, 99, 235, 0.1);\n    transform: scale(0.98);\n  }\n\n  .tab[_ngcontent-%COMP%]:active {\n    background: rgba(37, 99, 235, 0.1);\n  }\n\n  \n\n  .tab[_ngcontent-%COMP%] {\n    min-height: 48px;\n  }\n\n  .ai-run-card[_ngcontent-%COMP%], \n   .detail-card[_ngcontent-%COMP%] {\n    min-height: 64px;\n  }\n}\n\n\n\n\n\n@media (prefers-contrast: high) {\n  .status-badge[_ngcontent-%COMP%] {\n    border: 2px solid currentColor;\n  }\n\n  .check-item[_ngcontent-%COMP%] {\n    border-width: 2px;\n  }\n\n  .tab.active[_ngcontent-%COMP%] {\n    border-bottom-width: 4px;\n  }\n}\n\n\n\n\n\n@media (prefers-reduced-motion: reduce) {\n  *[_ngcontent-%COMP%], \n   *[_ngcontent-%COMP%]::before, \n   *[_ngcontent-%COMP%]::after {\n    animation-duration: 0.01ms !important;\n    animation-iteration-count: 1 !important;\n    transition-duration: 0.01ms !important;\n  }\n\n  .skeleton-icon[_ngcontent-%COMP%], \n   .skeleton-avatar[_ngcontent-%COMP%], \n   .skeleton-line[_ngcontent-%COMP%] {\n    animation: none;\n    background: #e2e8f0;\n  }\n\n  .result-pulse[_ngcontent-%COMP%] {\n    animation: none;\n    display: none;\n  }\n}\n\n\n\n\n\n@media print {\n  .test-run-form[_ngcontent-%COMP%] {\n    background: white;\n    height: auto;\n  }\n\n  .header-actions[_ngcontent-%COMP%], \n   .tabs-container[_ngcontent-%COMP%], \n   .shortcuts-hint[_ngcontent-%COMP%], \n   .log-actions[_ngcontent-%COMP%] {\n    display: none !important;\n  }\n\n  .tab-content[_ngcontent-%COMP%] {\n    overflow: visible;\n    padding: 0;\n  }\n\n  .result-hero[_ngcontent-%COMP%], \n   .check-results[_ngcontent-%COMP%], \n   .details-grid[_ngcontent-%COMP%], \n   .ai-section[_ngcontent-%COMP%], \n   .feedback-item[_ngcontent-%COMP%] {\n    break-inside: avoid;\n    box-shadow: none;\n    border: 1px solid #ddd;\n  }\n\n  .comparison-content[_ngcontent-%COMP%], \n   .log-container[_ngcontent-%COMP%] {\n    max-height: none;\n    overflow: visible;\n  }\n}\n\n\n\n\n\n.tags-bar[_ngcontent-%COMP%] {\n  margin-top: 16px;\n  padding: 8px 14px;\n  background: linear-gradient(135deg, rgba(37, 99, 235, 0.04) 0%, rgba(37, 99, 235, 0.08) 100%);\n  border: 1px solid rgba(37, 99, 235, 0.15);\n  border-radius: 8px;\n  max-width: 600px;\n}\n\n.tags-bar-content[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  flex-wrap: wrap;\n}\n\n.tags-bar-label[_ngcontent-%COMP%] {\n  color: var(--test-text-secondary);\n  font-size: 14px;\n}\n\n.tags-bar-label[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  opacity: 0.6;\n}\n\n.tags-bar-chips[_ngcontent-%COMP%] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  flex: 1;\n}\n\n.tag-inline[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  padding: 4px 10px;\n  background: rgba(37, 99, 235, 0.1);\n  color: var(--test-primary);\n  border-radius: 12px;\n  font-size: 11px;\n  font-weight: 500;\n  letter-spacing: 0.01em;\n}\n\n.tags-bar-empty[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  opacity: 0.7;\n  flex: 1;\n}\n\n.tags-bar-edit[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 4px 10px;\n  background: transparent;\n  border: 1px dashed var(--test-border);\n  border-radius: 12px;\n  font-size: 11px;\n  font-weight: 500;\n  color: var(--test-text-secondary);\n  cursor: pointer;\n  transition: var(--test-transition);\n}\n\n.tags-bar-edit[_ngcontent-%COMP%]:hover {\n  border-color: var(--test-primary);\n  color: var(--test-primary);\n  background: rgba(37, 99, 235, 0.05);\n}\n\n.tags-bar-edit[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 10px;\n}\n\n\n\n\n\n.tags-editor-panel[_ngcontent-%COMP%] {\n  margin-top: 16px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-primary);\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.1);\n  max-width: 600px;\n}\n\n.tags-editor-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  padding: 12px 16px;\n  background: rgba(37, 99, 235, 0.08);\n  border-bottom: 1px solid rgba(37, 99, 235, 0.2);\n}\n\n.tags-editor-title[_ngcontent-%COMP%] {\n  font-size: 13px;\n  font-weight: 600;\n  color: var(--test-primary);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.tags-editor-body[_ngcontent-%COMP%] {\n  padding: 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.tags-editor-chips[_ngcontent-%COMP%] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  min-height: 32px;\n}\n\n.tag-editable[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 5px 8px 5px 12px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-primary);\n  color: var(--test-primary);\n  border-radius: 14px;\n  font-size: 12px;\n  font-weight: 500;\n}\n\n.tag-remove-btn[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  background: transparent;\n  border: none;\n  color: var(--test-primary);\n  cursor: pointer;\n  border-radius: 50%;\n  font-size: 9px;\n  opacity: 0.6;\n  transition: var(--test-transition);\n}\n\n.tag-remove-btn[_ngcontent-%COMP%]:hover {\n  opacity: 1;\n  background: var(--test-error-light);\n  color: var(--test-error);\n}\n\n.tags-empty-hint[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  font-style: italic;\n  padding: 4px 0;\n}\n\n.tags-editor-input[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.tag-text-input[_ngcontent-%COMP%] {\n  flex: 1;\n  padding: 10px 14px;\n  border: 1px solid var(--test-border);\n  border-radius: 8px;\n  font-size: 13px;\n  background: var(--test-bg);\n}\n\n.tag-text-input[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: var(--test-primary);\n  background: var(--test-surface);\n  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);\n}\n\n.tag-text-input[_ngcontent-%COMP%]::placeholder {\n  color: var(--test-text-secondary);\n  opacity: 0.6;\n}\n\n.tags-editor-footer[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: flex-start;\n  gap: 8px;\n  padding: 12px 16px;\n  background: var(--test-bg);\n  border-top: 1px solid var(--test-border);\n}\n\n\n\n@media (max-width: 768px) {\n  .tags-bar[_ngcontent-%COMP%] {\n    padding: 8px 12px;\n  }\n\n  .tags-bar-content[_ngcontent-%COMP%] {\n    gap: 8px;\n  }\n\n  .tag-inline[_ngcontent-%COMP%] {\n    padding: 3px 8px;\n    font-size: 10px;\n  }\n\n  .tags-editor-panel[_ngcontent-%COMP%] {\n    margin-top: 12px;\n  }\n\n  .tags-editor-body[_ngcontent-%COMP%] {\n    padding: 12px;\n  }\n\n  .tags-editor-footer[_ngcontent-%COMP%] {\n    padding: 10px 12px;\n  }\n}"], changeDetection: 0 }); }
+            i0.ɵɵconditional(ctx.activeTab === "log" ? 118 : -1);
+        } }, dependencies: [i5.NgClass, i6.DefaultValueAccessor, i6.NgControlStatus, i6.NgModel, i7.ButtonComponent, i8.CodeEditorComponent, i3.ExecutionContextComponent, i9.EntityLinkPillComponent, i5.DecimalPipe, i5.DatePipe], styles: ["\n\n\n\n\n\n\n\n[_nghost-%COMP%] {\n  --test-primary: #2563eb;\n  --test-primary-light: #3b82f6;\n  --test-primary-dark: #1d4ed8;\n  --test-success: #10b981;\n  --test-success-light: #d1fae5;\n  --test-error: #ef4444;\n  --test-error-light: #fee2e2;\n  --test-warning: #f59e0b;\n  --test-warning-light: #fef3c7;\n  --test-timeout: #f97316;\n  --test-timeout-light: #ffedd5;\n  --test-running: #3b82f6;\n  --test-pending: #8b5cf6;\n  --test-skipped: #6b7280;\n  --test-bg: #f8fafc;\n  --test-surface: #ffffff;\n  --test-border: #e2e8f0;\n  --test-text: #1e293b;\n  --test-text-secondary: #64748b;\n  --test-text-muted: #94a3b8;\n  --test-radius-sm: 6px;\n  --test-radius-md: 10px;\n  --test-radius-lg: 16px;\n  --test-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);\n  --test-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  --test-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n  --test-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  display: block;\n  height: 100%;\n}\n\n\n\n.test-run-form[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  background: var(--test-bg);\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n\n\n\n\n.error-banner[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  padding: 12px 20px;\n  background: linear-gradient(135deg, var(--test-error) 0%, #dc2626 100%);\n  color: white;\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: var(--test-transition);\n  animation: _ngcontent-%COMP%_slideDown 0.3s ease-out;\n}\n\n.error-banner[_ngcontent-%COMP%]:hover {\n  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);\n}\n\n.error-banner[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 16px;\n}\n\n.retry-btn[_ngcontent-%COMP%] {\n  background: rgba(255, 255, 255, 0.2);\n  border: 1px solid rgba(255, 255, 255, 0.3);\n  color: white;\n  padding: 6px 12px;\n  border-radius: var(--test-radius-sm);\n  cursor: pointer;\n  font-size: 12px;\n  font-weight: 600;\n  transition: var(--test-transition);\n}\n\n.retry-btn[_ngcontent-%COMP%]:hover {\n  background: rgba(255, 255, 255, 0.3);\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n  from {\n    transform: translateY(-100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}\n\n\n\n\n\n.test-run-header[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-bottom: 1px solid var(--test-border);\n  padding: 20px;\n  position: relative;\n}\n\n\n\n.breadcrumb[_ngcontent-%COMP%] {\n  margin-bottom: 16px;\n}\n\n.breadcrumb[_ngcontent-%COMP%]   ol[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  font-size: 13px;\n  flex-wrap: wrap;\n}\n\n.breadcrumb[_ngcontent-%COMP%]   li[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.breadcrumb[_ngcontent-%COMP%]   a[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n  text-decoration: none;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 8px;\n  border-radius: var(--test-radius-sm);\n  transition: var(--test-transition);\n}\n\n.breadcrumb[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:hover {\n  background: rgba(37, 99, 235, 0.1);\n  text-decoration: none;\n}\n\n.breadcrumb[_ngcontent-%COMP%]   .separator[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: var(--test-text-muted);\n  margin: 0 4px;\n}\n\n.breadcrumb[_ngcontent-%COMP%]   .current[_ngcontent-%COMP%] {\n  color: var(--test-text-secondary);\n  font-weight: 500;\n}\n\n.breadcrumb-text[_ngcontent-%COMP%] {\n  max-width: 200px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n\n\n.header-content[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 20px;\n  gap: 16px;\n}\n\n.header-left[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 16px;\n  flex: 1;\n  min-width: 0;\n}\n\n\n\n.status-indicator[_ngcontent-%COMP%] {\n  width: 56px;\n  height: 56px;\n  border-radius: var(--test-radius-md);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: white;\n  font-size: 24px;\n  flex-shrink: 0;\n  box-shadow: var(--test-shadow-md);\n  transition: var(--test-transition);\n}\n\n.status-indicator[_ngcontent-%COMP%]:hover {\n  transform: scale(1.05);\n}\n\n\n\n.test-run-info[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.test-run-info[_ngcontent-%COMP%]   h1[_ngcontent-%COMP%] {\n  margin: 0 0 8px 0;\n  font-size: clamp(18px, 4vw, 24px);\n  font-weight: 700;\n  color: var(--test-text);\n  line-height: 1.2;\n  word-wrap: break-word;\n}\n\n.test-run-info[_ngcontent-%COMP%]   h1[_ngcontent-%COMP%]   .run-id[_ngcontent-%COMP%] {\n  color: var(--test-text-secondary);\n  font-weight: 500;\n}\n\n.test-run-meta[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n\n\n.status-badge[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 14px;\n  border-radius: 20px;\n  color: white;\n  font-size: 12px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n\n\n.meta-item[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 14px;\n  color: var(--test-text-secondary);\n}\n\n.meta-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 12px;\n}\n\n\n\n.header-actions[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n  flex-shrink: 0;\n}\n\n.header-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  white-space: nowrap;\n}\n\n.btn-text[_ngcontent-%COMP%] {\n  margin-left: 6px;\n}\n\n\n\n\n\n.metrics-bar[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));\n  gap: 12px;\n  margin-bottom: 16px;\n}\n\n.metric-card[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  padding: 14px;\n  transition: var(--test-transition);\n}\n\n.metric-card[_ngcontent-%COMP%]:hover {\n  transform: translateY(-2px);\n  box-shadow: var(--test-shadow-md);\n}\n\n.metric-icon[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-sm);\n  color: var(--test-primary);\n  font-size: 16px;\n  flex-shrink: 0;\n}\n\n.metric-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.metric-label[_ngcontent-%COMP%] {\n  font-size: 10px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  color: var(--test-text-muted);\n  margin-bottom: 4px;\n}\n\n.metric-value[_ngcontent-%COMP%] {\n  font-size: 16px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.metric-detail[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--test-text-muted);\n  margin-top: 2px;\n}\n\n\n\n.metric-progress[_ngcontent-%COMP%] {\n  margin-top: 6px;\n  height: 4px;\n  background: var(--test-border);\n  border-radius: 2px;\n  overflow: hidden;\n}\n\n.progress-bar[_ngcontent-%COMP%] {\n  height: 100%;\n  border-radius: 2px;\n  transition: width 0.5s ease-out;\n}\n\n\n\n.secondary-info[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 12px;\n  padding-top: 16px;\n  border-top: 1px solid var(--test-border);\n  flex-wrap: wrap;\n}\n\n.info-chip[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 13px;\n  color: var(--test-text-secondary);\n  padding: 6px 12px;\n  background: var(--test-bg);\n  border-radius: 20px;\n  transition: var(--test-transition);\n}\n\n.info-chip[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 12px;\n}\n\n.info-chip.clickable[_ngcontent-%COMP%] {\n  cursor: pointer;\n}\n\n.info-chip.clickable[_ngcontent-%COMP%]:hover {\n  background: rgba(37, 99, 235, 0.1);\n  color: var(--test-primary);\n}\n\n\n\n\n\n.tabs-container[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-bottom: 1px solid var(--test-border);\n  position: sticky;\n  top: 0;\n  z-index: 10;\n}\n\n.tabs[_ngcontent-%COMP%] {\n  display: flex;\n  padding: 0 20px;\n  overflow-x: auto;\n  -webkit-overflow-scrolling: touch;\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n\n.tabs[_ngcontent-%COMP%]::-webkit-scrollbar {\n  display: none;\n}\n\n.tab[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 14px 18px;\n  border: none;\n  background: transparent;\n  border-bottom: 3px solid transparent;\n  color: var(--test-text-secondary);\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: var(--test-transition);\n  white-space: nowrap;\n  position: relative;\n}\n\n.tab[_ngcontent-%COMP%]:hover {\n  color: var(--test-primary);\n  background: rgba(37, 99, 235, 0.05);\n}\n\n.tab.active[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n  border-bottom-color: var(--test-primary);\n  font-weight: 600;\n}\n\n.tab[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 15px;\n}\n\n.tab-badge[_ngcontent-%COMP%] {\n  background: var(--test-border);\n  color: var(--test-text-secondary);\n  padding: 2px 8px;\n  border-radius: 10px;\n  font-size: 11px;\n  font-weight: 600;\n  transition: var(--test-transition);\n}\n\n.tab.active[_ngcontent-%COMP%]   .tab-badge[_ngcontent-%COMP%] {\n  background: rgba(37, 99, 235, 0.15);\n  color: var(--test-primary);\n}\n\n.shortcut-hint[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: var(--test-text-muted);\n  background: var(--test-bg);\n  padding: 2px 6px;\n  border-radius: 4px;\n  font-weight: 600;\n  margin-left: 4px;\n  font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n}\n\n\n\n\n\n.tab-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 20px;\n  scroll-behavior: smooth;\n}\n\n\n\n\n\n.overview-tab[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n  from { opacity: 0; transform: translateY(10px); }\n  to { opacity: 1; transform: translateY(0); }\n}\n\n\n\n.result-hero[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 32px;\n  text-align: center;\n  border: 2px solid var(--test-border);\n  box-shadow: var(--test-shadow-sm);\n  transition: var(--test-transition);\n}\n\n.result-hero.passed[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #ecfdf5 0%, var(--test-success-light) 100%);\n  border-color: var(--test-success);\n}\n\n.result-hero.failed[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #fef2f2 0%, var(--test-error-light) 100%);\n  border-color: var(--test-error);\n}\n\n.result-hero.error[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #fffbeb 0%, var(--test-warning-light) 100%);\n  border-color: var(--test-warning);\n}\n\n.result-hero.timeout[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #fff7ed 0%, var(--test-timeout-light) 100%);\n  border-color: var(--test-timeout);\n}\n\n.result-hero.running[_ngcontent-%COMP%], \n.result-hero.pending[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);\n  border-color: var(--test-primary-light);\n}\n\n.result-icon-wrapper[_ngcontent-%COMP%] {\n  position: relative;\n  display: inline-block;\n  margin-bottom: 16px;\n}\n\n.result-icon[_ngcontent-%COMP%] {\n  width: 80px;\n  height: 80px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border-radius: 50%;\n  font-size: 40px;\n  margin: 0 auto;\n  box-shadow: var(--test-shadow-md);\n}\n\n.result-hero.passed[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] { color: var(--test-success); }\n.result-hero.failed[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] { color: var(--test-error); }\n.result-hero.error[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] { color: var(--test-warning); }\n.result-hero.timeout[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] { color: var(--test-timeout); }\n.result-hero.running[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%], \n.result-hero.pending[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] { color: var(--test-primary); }\n\n.result-pulse[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 100px;\n  height: 100px;\n  border-radius: 50%;\n  background: rgba(59, 130, 246, 0.2);\n  animation: _ngcontent-%COMP%_pulse 2s ease-in-out infinite;\n}\n\n@keyframes _ngcontent-%COMP%_pulse {\n  0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.5; }\n  50% { transform: translate(-50%, -50%) scale(1.2); opacity: 0; }\n}\n\n.result-text[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n  margin: 0 0 12px 0;\n  font-size: clamp(24px, 5vw, 32px);\n  font-weight: 800;\n  color: var(--test-text);\n}\n\n.result-details[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n.result-score[_ngcontent-%COMP%] {\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--test-text-secondary);\n}\n\n.result-divider[_ngcontent-%COMP%] {\n  color: var(--test-border);\n}\n\n.result-checks[_ngcontent-%COMP%] {\n  font-size: 16px;\n  color: var(--test-text-muted);\n}\n\n\n\n.section-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 16px;\n  gap: 12px;\n}\n\n.section-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 700;\n  color: var(--test-text);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.section-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n}\n\n.section-header.error[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--test-error);\n}\n\n.check-summary[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: var(--test-text-secondary);\n}\n\n\n\n.check-results[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.check-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.check-item[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 12px;\n  padding: 14px 16px;\n  border-radius: var(--test-radius-md);\n  border: 1px solid var(--test-border);\n  transition: var(--test-transition);\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out backwards;\n}\n\n.check-item[_ngcontent-%COMP%]:hover {\n  transform: translateX(4px);\n}\n\n.check-item.passed[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);\n  border-color: #86efac;\n}\n\n.check-item.failed[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);\n  border-color: #fca5a5;\n}\n\n.check-status[_ngcontent-%COMP%] {\n  font-size: 20px;\n  flex-shrink: 0;\n  margin-top: 2px;\n}\n\n.check-item.passed[_ngcontent-%COMP%]   .check-status[_ngcontent-%COMP%] { color: var(--test-success); }\n.check-item.failed[_ngcontent-%COMP%]   .check-status[_ngcontent-%COMP%] { color: var(--test-error); }\n\n.check-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.check-name[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n  margin-bottom: 4px;\n}\n\n.check-message[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: var(--test-text-secondary);\n  line-height: 1.5;\n  word-wrap: break-word;\n}\n\n.check-weight[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: var(--test-text-muted);\n  flex-shrink: 0;\n  text-align: right;\n}\n\n.weight-label[_ngcontent-%COMP%] {\n  font-weight: 500;\n}\n\n\n\n.comparison-section[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.comparison-tabs[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 4px;\n  margin-bottom: 16px;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  padding: 4px;\n}\n\n.comparison-tab[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  padding: 10px 16px;\n  border: none;\n  background: transparent;\n  color: var(--test-text-secondary);\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  border-radius: var(--test-radius-sm);\n  transition: var(--test-transition);\n}\n\n.comparison-tab[_ngcontent-%COMP%]:hover {\n  color: var(--test-text);\n  background: rgba(0, 0, 0, 0.05);\n}\n\n.comparison-tab.active[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  color: var(--test-primary);\n  font-weight: 600;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.comparison-content[_ngcontent-%COMP%] {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid var(--test-border);\n}\n\n\n\n\n\n.details-tab[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n}\n\n.details-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n  gap: 12px;\n}\n\n.detail-card[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  transition: var(--test-transition);\n}\n\n.detail-card.clickable[_ngcontent-%COMP%] {\n  cursor: pointer;\n}\n\n.detail-card.clickable[_ngcontent-%COMP%]:hover {\n  background: rgba(37, 99, 235, 0.05);\n  border-color: var(--test-primary-light);\n  transform: translateX(4px);\n}\n\n.detail-icon[_ngcontent-%COMP%] {\n  width: 44px;\n  height: 44px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  color: var(--test-primary);\n  font-size: 18px;\n  flex-shrink: 0;\n}\n\n.detail-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.detail-label[_ngcontent-%COMP%] {\n  font-size: 11px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  color: var(--test-text-muted);\n  margin-bottom: 4px;\n}\n\n.detail-value[_ngcontent-%COMP%] {\n  font-size: 14px;\n  color: var(--test-text);\n  word-wrap: break-word;\n  font-weight: 500;\n}\n\n.detail-value.monospace[_ngcontent-%COMP%] {\n  font-family: 'SF Mono', Monaco, 'Courier New', monospace;\n  font-size: 12px;\n}\n\n.detail-value.link[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n}\n\n.detail-action[_ngcontent-%COMP%] {\n  color: var(--test-text-muted);\n  font-size: 12px;\n  transition: var(--test-transition);\n}\n\n.detail-card.clickable[_ngcontent-%COMP%]:hover   .detail-action[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n}\n\n\n\n.error-section[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.error-content[_ngcontent-%COMP%] {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid #fca5a5;\n}\n\n\n\n.result-details-section[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.result-details-content[_ngcontent-%COMP%] {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid var(--test-border);\n}\n\n\n\n\n\n.ai-runs-tab[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n}\n\n.ai-section[_ngcontent-%COMP%] {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.count-badge[_ngcontent-%COMP%] {\n  background: var(--test-bg);\n  color: var(--test-text-secondary);\n  padding: 4px 10px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n.ai-run-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.ai-run-card[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-bg);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  cursor: pointer;\n  transition: var(--test-transition);\n}\n\n.ai-run-card[_ngcontent-%COMP%]:hover {\n  background: rgba(37, 99, 235, 0.05);\n  border-color: var(--test-primary-light);\n  transform: translateX(4px);\n  box-shadow: var(--test-shadow-sm);\n}\n\n.ai-run-icon[_ngcontent-%COMP%] {\n  width: 44px;\n  height: 44px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: linear-gradient(135deg, var(--test-primary) 0%, var(--test-primary-dark) 100%);\n  color: white;\n  border-radius: var(--test-radius-md);\n  font-size: 18px;\n  flex-shrink: 0;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.ai-run-icon.agent[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, var(--test-primary) 0%, var(--test-primary-dark) 100%);\n}\n\n.ai-run-icon.prompt[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #9333ea 0%, #7c3aed 100%);\n}\n\n.ai-run-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.ai-run-name[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n  margin-bottom: 6px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.ai-run-meta[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 10px;\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  flex-wrap: wrap;\n}\n\n.status-chip[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  padding: 2px 8px;\n  border-radius: 10px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n}\n\n.status-chip.complete[_ngcontent-%COMP%], \n.status-chip.completed[_ngcontent-%COMP%], \n.status-chip.passed[_ngcontent-%COMP%] {\n  background: var(--test-success-light);\n  color: #059669;\n}\n\n.status-chip.failed[_ngcontent-%COMP%], \n.status-chip.error[_ngcontent-%COMP%] {\n  background: var(--test-error-light);\n  color: #dc2626;\n}\n\n.status-chip.running[_ngcontent-%COMP%] {\n  background: #dbeafe;\n  color: var(--test-primary);\n}\n\n.cost-chip[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 2px;\n  color: var(--test-text-muted);\n}\n\n.ai-run-arrow[_ngcontent-%COMP%] {\n  color: var(--test-text-muted);\n  font-size: 14px;\n  transition: var(--test-transition);\n}\n\n.ai-run-card[_ngcontent-%COMP%]:hover   .ai-run-arrow[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n  transform: translateX(2px);\n}\n\n\n\n\n\n.feedback-tab[_ngcontent-%COMP%] {\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n}\n\n.feedback-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n.feedback-item[_ngcontent-%COMP%] {\n  padding: 20px;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  border: 1px solid var(--test-border);\n  box-shadow: var(--test-shadow-sm);\n  transition: var(--test-transition);\n}\n\n.feedback-item[_ngcontent-%COMP%]:hover {\n  border-color: var(--test-primary-light);\n}\n\n.feedback-header[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 16px;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.feedback-user[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.user-avatar[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: 50%;\n  color: var(--test-primary);\n  font-size: 14px;\n}\n\n.user-name[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.feedback-date[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: var(--test-text-muted);\n}\n\n.feedback-body[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.feedback-rating[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.rating-stars[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 2px;\n}\n\n.rating-stars[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 14px;\n  color: var(--test-border);\n}\n\n.rating-stars[_ngcontent-%COMP%]   i.filled[_ngcontent-%COMP%] {\n  color: #fbbf24;\n}\n\n.rating-value[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.feedback-verdict[_ngcontent-%COMP%] {\n  display: flex;\n}\n\n.verdict-badge[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  border-radius: 20px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n.verdict-badge.correct[_ngcontent-%COMP%] {\n  background: var(--test-success-light);\n  color: #059669;\n}\n\n.verdict-badge.incorrect[_ngcontent-%COMP%] {\n  background: var(--test-error-light);\n  color: #dc2626;\n}\n\n.feedback-comments[_ngcontent-%COMP%] {\n  padding: 14px;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  border-left: 3px solid var(--test-primary);\n}\n\n.feedback-comments[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 14px;\n  line-height: 1.6;\n  color: var(--test-text);\n}\n\n\n\n\n\n.log-tab[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  height: 100%;\n  animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n}\n\n.log-header[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background: var(--test-surface);\n  padding: 16px 20px;\n  border-radius: var(--test-radius-lg) var(--test-radius-lg) 0 0;\n  border: 1px solid var(--test-border);\n  border-bottom: none;\n}\n\n.log-title[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.log-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--test-text-secondary);\n  font-size: 16px;\n}\n\n.log-title[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.log-actions[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n}\n\n.log-container[_ngcontent-%COMP%] {\n  flex: 1;\n  border-radius: 0 0 var(--test-radius-lg) var(--test-radius-lg);\n  overflow: hidden;\n  min-height: 300px;\n  border: 1px solid var(--test-border);\n  border-top: none;\n}\n\n\n\n\n\n.loading-state[_ngcontent-%COMP%] {\n  padding: 20px;\n}\n\n.skeleton-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.skeleton-card[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-md);\n  border: 1px solid var(--test-border);\n}\n\n.skeleton-icon[_ngcontent-%COMP%], \n.skeleton-avatar[_ngcontent-%COMP%] {\n  width: 44px;\n  height: 44px;\n  border-radius: var(--test-radius-md);\n  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);\n  background-size: 200% 100%;\n  animation: _ngcontent-%COMP%_shimmer 1.5s infinite;\n}\n\n.skeleton-avatar[_ngcontent-%COMP%] {\n  border-radius: 50%;\n}\n\n.skeleton-content[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.skeleton-line[_ngcontent-%COMP%] {\n  height: 14px;\n  border-radius: 4px;\n  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);\n  background-size: 200% 100%;\n  animation: _ngcontent-%COMP%_shimmer 1.5s infinite;\n}\n\n.skeleton-line.wide[_ngcontent-%COMP%] { width: 70%; }\n.skeleton-line.medium[_ngcontent-%COMP%] { width: 55%; }\n.skeleton-line.narrow[_ngcontent-%COMP%] { width: 40%; }\n\n@keyframes _ngcontent-%COMP%_shimmer {\n  0% { background-position: 200% 0; }\n  100% { background-position: -200% 0; }\n}\n\n\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 60px 24px;\n  text-align: center;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n}\n\n.empty-icon[_ngcontent-%COMP%] {\n  width: 80px;\n  height: 80px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: 50%;\n  margin-bottom: 20px;\n}\n\n.empty-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 36px;\n  color: var(--test-text-muted);\n}\n\n.empty-state[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0 0 8px 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.empty-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 14px;\n  color: var(--test-text-secondary);\n  max-width: 300px;\n}\n\n\n\n\n\n.shortcuts-hint[_ngcontent-%COMP%] {\n  position: fixed;\n  bottom: 20px;\n  right: 20px;\n  z-index: 100;\n}\n\n.shortcuts-hint[_ngcontent-%COMP%]    > i[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: 50%;\n  color: var(--test-text-muted);\n  font-size: 16px;\n  cursor: pointer;\n  box-shadow: var(--test-shadow-md);\n  transition: var(--test-transition);\n}\n\n.shortcuts-hint[_ngcontent-%COMP%]:hover    > i[_ngcontent-%COMP%] {\n  color: var(--test-primary);\n  border-color: var(--test-primary-light);\n}\n\n.shortcuts-popup[_ngcontent-%COMP%] {\n  display: none;\n  position: absolute;\n  bottom: 50px;\n  right: 0;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  padding: 16px;\n  box-shadow: var(--test-shadow-lg);\n  min-width: 200px;\n}\n\n.shortcuts-hint[_ngcontent-%COMP%]:hover   .shortcuts-popup[_ngcontent-%COMP%] {\n  display: block;\n  animation: _ngcontent-%COMP%_fadeIn 0.2s ease-out;\n}\n\n.shortcuts-popup[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n  margin: 0 0 12px 0;\n  font-size: 14px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.shortcuts-popup[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%] {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n\n.shortcuts-popup[_ngcontent-%COMP%]   li[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 6px 0;\n  font-size: 13px;\n  color: var(--test-text-secondary);\n}\n\n.shortcuts-popup[_ngcontent-%COMP%]   kbd[_ngcontent-%COMP%] {\n  background: var(--test-bg);\n  border: 1px solid var(--test-border);\n  border-radius: 4px;\n  padding: 2px 6px;\n  font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n  font-size: 11px;\n  color: var(--test-text);\n}\n\n\n\n\n\n@media (max-width: 1024px) {\n  .metrics-bar[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(3, 1fr);\n  }\n\n  .details-grid[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(2, 1fr);\n  }\n\n  .shortcuts-hint[_ngcontent-%COMP%] {\n    display: none;\n  }\n}\n\n\n\n\n\n@media (max-width: 768px) {\n  .test-run-form[_ngcontent-%COMP%] {\n    height: auto;\n    min-height: 100%;\n  }\n\n  .test-run-header[_ngcontent-%COMP%] {\n    padding: 16px;\n  }\n\n  .breadcrumb[_ngcontent-%COMP%] {\n    margin-bottom: 12px;\n  }\n\n  .breadcrumb[_ngcontent-%COMP%]   ol[_ngcontent-%COMP%] {\n    font-size: 12px;\n  }\n\n  .header-content[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .header-left[_ngcontent-%COMP%] {\n    width: 100%;\n  }\n\n  .status-indicator[_ngcontent-%COMP%] {\n    width: 48px;\n    height: 48px;\n    font-size: 20px;\n  }\n\n  .test-run-info[_ngcontent-%COMP%]   h1[_ngcontent-%COMP%] {\n    font-size: 18px;\n  }\n\n  .test-run-meta[_ngcontent-%COMP%] {\n    gap: 8px;\n  }\n\n  .status-badge[_ngcontent-%COMP%] {\n    padding: 4px 10px;\n    font-size: 11px;\n  }\n\n  .header-actions[_ngcontent-%COMP%] {\n    width: 100%;\n    justify-content: stretch;\n  }\n\n  .header-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n    flex: 1;\n  }\n\n  .metrics-bar[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(2, 1fr);\n    gap: 10px;\n  }\n\n  .metric-card[_ngcontent-%COMP%] {\n    padding: 12px;\n  }\n\n  .metric-icon[_ngcontent-%COMP%] {\n    width: 36px;\n    height: 36px;\n    font-size: 14px;\n  }\n\n  .metric-value[_ngcontent-%COMP%] {\n    font-size: 14px;\n  }\n\n  .tabs[_ngcontent-%COMP%] {\n    padding: 0 12px;\n  }\n\n  .tab[_ngcontent-%COMP%] {\n    padding: 12px 14px;\n    font-size: 13px;\n    gap: 6px;\n  }\n\n  .tab[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 14px;\n  }\n\n  .shortcut-hint[_ngcontent-%COMP%] {\n    display: none;\n  }\n\n  .tab-content[_ngcontent-%COMP%] {\n    padding: 16px;\n  }\n\n  .result-hero[_ngcontent-%COMP%] {\n    padding: 24px 20px;\n  }\n\n  .result-icon[_ngcontent-%COMP%] {\n    width: 64px;\n    height: 64px;\n    font-size: 32px;\n  }\n\n  .result-text[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n    font-size: 24px;\n  }\n\n  .result-score[_ngcontent-%COMP%] {\n    font-size: 16px;\n  }\n\n  .check-results[_ngcontent-%COMP%], \n   .comparison-section[_ngcontent-%COMP%], \n   .ai-section[_ngcontent-%COMP%], \n   .feedback-item[_ngcontent-%COMP%] {\n    padding: 18px;\n  }\n\n  .check-item[_ngcontent-%COMP%] {\n    padding: 12px;\n  }\n\n  .comparison-tabs[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .comparison-tab[_ngcontent-%COMP%] {\n    text-align: center;\n  }\n\n  .details-grid[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr;\n  }\n\n  .detail-card[_ngcontent-%COMP%] {\n    padding: 14px;\n  }\n\n  .ai-run-card[_ngcontent-%COMP%] {\n    padding: 14px;\n  }\n\n  .ai-run-icon[_ngcontent-%COMP%] {\n    width: 40px;\n    height: 40px;\n    font-size: 16px;\n  }\n\n  .ai-run-meta[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .feedback-header[_ngcontent-%COMP%] {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .log-header[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 12px;\n    align-items: stretch;\n  }\n\n  .log-actions[_ngcontent-%COMP%] {\n    justify-content: stretch;\n  }\n\n  .log-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n    flex: 1;\n  }\n\n  .empty-state[_ngcontent-%COMP%] {\n    padding: 40px 20px;\n  }\n\n  .empty-icon[_ngcontent-%COMP%] {\n    width: 64px;\n    height: 64px;\n  }\n\n  .empty-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 28px;\n  }\n}\n\n\n\n\n\n@media (max-width: 480px) {\n  .test-run-header[_ngcontent-%COMP%] {\n    padding: 12px;\n  }\n\n  .header-left[_ngcontent-%COMP%] {\n    gap: 12px;\n  }\n\n  .status-indicator[_ngcontent-%COMP%] {\n    width: 40px;\n    height: 40px;\n    font-size: 18px;\n    border-radius: 8px;\n  }\n\n  .test-run-info[_ngcontent-%COMP%]   h1[_ngcontent-%COMP%] {\n    font-size: 16px;\n  }\n\n  .metrics-bar[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr 1fr;\n  }\n\n  .metric-card[_ngcontent-%COMP%] {\n    padding: 10px;\n    flex-direction: column;\n    text-align: center;\n  }\n\n  .metric-icon[_ngcontent-%COMP%] {\n    margin-bottom: 8px;\n  }\n\n  .metric-label[_ngcontent-%COMP%] {\n    font-size: 9px;\n  }\n\n  .metric-value[_ngcontent-%COMP%] {\n    font-size: 14px;\n  }\n\n  .tabs[_ngcontent-%COMP%] {\n    padding: 0 8px;\n  }\n\n  .tab[_ngcontent-%COMP%] {\n    padding: 10px 12px;\n    font-size: 12px;\n  }\n\n  .tab-badge[_ngcontent-%COMP%] {\n    display: none;\n  }\n\n  .tab-content[_ngcontent-%COMP%] {\n    padding: 12px;\n  }\n\n  .result-hero[_ngcontent-%COMP%] {\n    padding: 20px 16px;\n  }\n\n  .result-icon[_ngcontent-%COMP%] {\n    width: 56px;\n    height: 56px;\n    font-size: 28px;\n  }\n\n  .result-text[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n    font-size: 20px;\n  }\n\n  .result-score[_ngcontent-%COMP%] {\n    font-size: 14px;\n  }\n\n  .result-checks[_ngcontent-%COMP%] {\n    font-size: 12px;\n  }\n\n  .section-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    font-size: 16px;\n  }\n\n  .check-item[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  .check-weight[_ngcontent-%COMP%] {\n    text-align: left;\n  }\n}\n\n\n\n\n\n@media (hover: none) and (pointer: coarse) {\n  .tab[_ngcontent-%COMP%], \n   .comparison-tab[_ngcontent-%COMP%], \n   .ai-run-card[_ngcontent-%COMP%], \n   .check-item[_ngcontent-%COMP%], \n   .feedback-item[_ngcontent-%COMP%], \n   .detail-card.clickable[_ngcontent-%COMP%] {\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  .ai-run-card[_ngcontent-%COMP%]:active, \n   .detail-card.clickable[_ngcontent-%COMP%]:active {\n    background: rgba(37, 99, 235, 0.1);\n    transform: scale(0.98);\n  }\n\n  .tab[_ngcontent-%COMP%]:active {\n    background: rgba(37, 99, 235, 0.1);\n  }\n\n  \n\n  .tab[_ngcontent-%COMP%] {\n    min-height: 48px;\n  }\n\n  .ai-run-card[_ngcontent-%COMP%], \n   .detail-card[_ngcontent-%COMP%] {\n    min-height: 64px;\n  }\n}\n\n\n\n\n\n@media (prefers-contrast: high) {\n  .status-badge[_ngcontent-%COMP%] {\n    border: 2px solid currentColor;\n  }\n\n  .check-item[_ngcontent-%COMP%] {\n    border-width: 2px;\n  }\n\n  .tab.active[_ngcontent-%COMP%] {\n    border-bottom-width: 4px;\n  }\n}\n\n\n\n\n\n@media (prefers-reduced-motion: reduce) {\n  *[_ngcontent-%COMP%], \n   *[_ngcontent-%COMP%]::before, \n   *[_ngcontent-%COMP%]::after {\n    animation-duration: 0.01ms !important;\n    animation-iteration-count: 1 !important;\n    transition-duration: 0.01ms !important;\n  }\n\n  .skeleton-icon[_ngcontent-%COMP%], \n   .skeleton-avatar[_ngcontent-%COMP%], \n   .skeleton-line[_ngcontent-%COMP%] {\n    animation: none;\n    background: #e2e8f0;\n  }\n\n  .result-pulse[_ngcontent-%COMP%] {\n    animation: none;\n    display: none;\n  }\n}\n\n\n\n\n\n@media print {\n  .test-run-form[_ngcontent-%COMP%] {\n    background: white;\n    height: auto;\n  }\n\n  .header-actions[_ngcontent-%COMP%], \n   .tabs-container[_ngcontent-%COMP%], \n   .shortcuts-hint[_ngcontent-%COMP%], \n   .log-actions[_ngcontent-%COMP%] {\n    display: none !important;\n  }\n\n  .tab-content[_ngcontent-%COMP%] {\n    overflow: visible;\n    padding: 0;\n  }\n\n  .result-hero[_ngcontent-%COMP%], \n   .check-results[_ngcontent-%COMP%], \n   .details-grid[_ngcontent-%COMP%], \n   .ai-section[_ngcontent-%COMP%], \n   .feedback-item[_ngcontent-%COMP%] {\n    break-inside: avoid;\n    box-shadow: none;\n    border: 1px solid #ddd;\n  }\n\n  .comparison-content[_ngcontent-%COMP%], \n   .log-container[_ngcontent-%COMP%] {\n    max-height: none;\n    overflow: visible;\n  }\n}\n\n\n\n\n\n.tags-bar[_ngcontent-%COMP%] {\n  margin-top: 16px;\n  padding: 8px 14px;\n  background: linear-gradient(135deg, rgba(37, 99, 235, 0.04) 0%, rgba(37, 99, 235, 0.08) 100%);\n  border: 1px solid rgba(37, 99, 235, 0.15);\n  border-radius: 8px;\n  max-width: 600px;\n}\n\n.tags-bar-content[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  flex-wrap: wrap;\n}\n\n.tags-bar-label[_ngcontent-%COMP%] {\n  color: var(--test-text-secondary);\n  font-size: 14px;\n}\n\n.tags-bar-label[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  opacity: 0.6;\n}\n\n.tags-bar-chips[_ngcontent-%COMP%] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  flex: 1;\n}\n\n.tag-inline[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  padding: 4px 10px;\n  background: rgba(37, 99, 235, 0.1);\n  color: var(--test-primary);\n  border-radius: 12px;\n  font-size: 11px;\n  font-weight: 500;\n  letter-spacing: 0.01em;\n}\n\n.tags-bar-empty[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  opacity: 0.7;\n  flex: 1;\n}\n\n.tags-bar-edit[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 4px 10px;\n  background: transparent;\n  border: 1px dashed var(--test-border);\n  border-radius: 12px;\n  font-size: 11px;\n  font-weight: 500;\n  color: var(--test-text-secondary);\n  cursor: pointer;\n  transition: var(--test-transition);\n}\n\n.tags-bar-edit[_ngcontent-%COMP%]:hover {\n  border-color: var(--test-primary);\n  color: var(--test-primary);\n  background: rgba(37, 99, 235, 0.05);\n}\n\n.tags-bar-edit[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 10px;\n}\n\n\n\n\n\n.tags-editor-panel[_ngcontent-%COMP%] {\n  margin-top: 16px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-primary);\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.1);\n  max-width: 600px;\n}\n\n.tags-editor-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  padding: 12px 16px;\n  background: rgba(37, 99, 235, 0.08);\n  border-bottom: 1px solid rgba(37, 99, 235, 0.2);\n}\n\n.tags-editor-title[_ngcontent-%COMP%] {\n  font-size: 13px;\n  font-weight: 600;\n  color: var(--test-primary);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.tags-editor-body[_ngcontent-%COMP%] {\n  padding: 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.tags-editor-chips[_ngcontent-%COMP%] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  min-height: 32px;\n}\n\n.tag-editable[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 5px 8px 5px 12px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-primary);\n  color: var(--test-primary);\n  border-radius: 14px;\n  font-size: 12px;\n  font-weight: 500;\n}\n\n.tag-remove-btn[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  background: transparent;\n  border: none;\n  color: var(--test-primary);\n  cursor: pointer;\n  border-radius: 50%;\n  font-size: 9px;\n  opacity: 0.6;\n  transition: var(--test-transition);\n}\n\n.tag-remove-btn[_ngcontent-%COMP%]:hover {\n  opacity: 1;\n  background: var(--test-error-light);\n  color: var(--test-error);\n}\n\n.tags-empty-hint[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  font-style: italic;\n  padding: 4px 0;\n}\n\n.tags-editor-input[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.tag-text-input[_ngcontent-%COMP%] {\n  flex: 1;\n  padding: 10px 14px;\n  border: 1px solid var(--test-border);\n  border-radius: 8px;\n  font-size: 13px;\n  background: var(--test-bg);\n}\n\n.tag-text-input[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: var(--test-primary);\n  background: var(--test-surface);\n  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);\n}\n\n.tag-text-input[_ngcontent-%COMP%]::placeholder {\n  color: var(--test-text-secondary);\n  opacity: 0.6;\n}\n\n.tags-editor-footer[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: flex-start;\n  gap: 8px;\n  padding: 12px 16px;\n  background: var(--test-bg);\n  border-top: 1px solid var(--test-border);\n}\n\n\n\n@media (max-width: 768px) {\n  .tags-bar[_ngcontent-%COMP%] {\n    padding: 8px 12px;\n  }\n\n  .tags-bar-content[_ngcontent-%COMP%] {\n    gap: 8px;\n  }\n\n  .tag-inline[_ngcontent-%COMP%] {\n    padding: 3px 8px;\n    font-size: 10px;\n  }\n\n  .tags-editor-panel[_ngcontent-%COMP%] {\n    margin-top: 12px;\n  }\n\n  .tags-editor-body[_ngcontent-%COMP%] {\n    padding: 12px;\n  }\n\n  .tags-editor-footer[_ngcontent-%COMP%] {\n    padding: 10px 12px;\n  }\n}"], changeDetection: 0 }); }
 };
 TestRunFormComponentExtended = __decorate([
     RegisterClass(BaseFormComponent, 'MJ: Test Runs')
@@ -1560,14 +1579,10 @@ TestRunFormComponentExtended = __decorate([
 export { TestRunFormComponentExtended };
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TestRunFormComponentExtended, [{
         type: Component,
-        args: [{ selector: 'mj-test-run-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"test-run-form\" [class.is-mobile]=\"false\">\n  <!-- Error State -->\n  <div class=\"error-banner\" *ngIf=\"error\" (click)=\"retryLoad()\">\n    <i class=\"fas fa-exclamation-triangle\"></i>\n    <span>{{ error }}</span>\n    <button class=\"retry-btn\">\n      <i class=\"fas fa-redo\"></i> Retry\n    </button>\n  </div>\n\n  <!-- Header Section -->\n  <div class=\"test-run-header\" [class]=\"getStatusClass()\">\n    <!-- Breadcrumb Navigation -->\n    <nav class=\"breadcrumb\" aria-label=\"Breadcrumb\">\n      <ol>\n        <li>\n          <a href=\"javascript:void(0)\" (click)=\"navigateToTestingDashboard()\">\n            <i class=\"fas fa-vial\"></i>\n            <span class=\"breadcrumb-text\">Testing</span>\n          </a>\n        </li>\n        <li *ngIf=\"test\">\n          <i class=\"fas fa-chevron-right separator\"></i>\n          <a href=\"javascript:void(0)\" (click)=\"openTest()\">\n            <i class=\"fas fa-flask\"></i>\n            <span class=\"breadcrumb-text\">{{ test.Name }}</span>\n          </a>\n        </li>\n        <li class=\"current\">\n          <i class=\"fas fa-chevron-right separator\"></i>\n          <span>Run #{{ record.ID.substring(0, 8) }}</span>\n        </li>\n      </ol>\n    </nav>\n\n    <div class=\"header-content\">\n      <div class=\"header-left\">\n        <!-- Status Indicator -->\n        <div class=\"status-indicator\" [style.background-color]=\"getStatusColor()\">\n          <i class=\"fas\" [ngClass]=\"getStatusIcon()\"></i>\n        </div>\n\n        <div class=\"test-run-info\">\n          <h1>\n            Test Run\n            <span class=\"run-id\">#{{ record.ID.substring(0, 8) }}</span>\n          </h1>\n          <div class=\"test-run-meta\">\n            <span class=\"status-badge\" [style.background-color]=\"getStatusColor()\">\n              {{ record.Status }}\n            </span>\n            <span class=\"meta-item\" *ngIf=\"test\">\n              <i class=\"fas fa-flask\"></i>\n              {{ test.Type }}\n            </span>\n            <span class=\"meta-item\" *ngIf=\"autoRefreshEnabled\">\n              <i class=\"fas fa-sync-alt fa-spin\"></i>\n              Auto-refreshing\n            </span>\n          </div>\n        </div>\n      </div>\n\n      <div class=\"header-actions\">\n        <button kendoButton (click)=\"reRunTest()\" [disabled]=\"!record.TestID\" title=\"Re-run this test (Cmd+Shift+R)\">\n          <i class=\"fas fa-redo\"></i>\n          <span class=\"btn-text\">Re-run</span>\n        </button>\n        <button kendoButton (click)=\"refresh()\" [disabled]=\"isRefreshing\" title=\"Refresh (Cmd+R)\">\n          <i class=\"fas fa-sync-alt\" [class.fa-spin]=\"isRefreshing\"></i>\n          <span class=\"btn-text\">Refresh</span>\n        </button>\n      </div>\n    </div>\n\n    <!-- Metrics Bar -->\n    <div class=\"metrics-bar\">\n      <div class=\"metric-card\">\n        <div class=\"metric-icon\">\n          <i class=\"fas fa-clock\"></i>\n        </div>\n        <div class=\"metric-content\">\n          <div class=\"metric-label\">Started</div>\n          <div class=\"metric-value\">{{ getRelativeTime(record.StartedAt) }}</div>\n          <div class=\"metric-detail\">{{ record.StartedAt | date:'short' }}</div>\n        </div>\n      </div>\n\n      <div class=\"metric-card\">\n        <div class=\"metric-icon\">\n          <i class=\"fas fa-stopwatch\"></i>\n        </div>\n        <div class=\"metric-content\">\n          <div class=\"metric-label\">Duration</div>\n          <div class=\"metric-value\">{{ calculateDuration() }}</div>\n        </div>\n      </div>\n\n      <div class=\"metric-card\">\n        <div class=\"metric-icon\">\n          <i class=\"fas fa-star\"></i>\n        </div>\n        <div class=\"metric-content\">\n          <div class=\"metric-label\">Score</div>\n          <div class=\"metric-value\">{{ formatScore(record.Score) }}</div>\n          <div class=\"metric-progress\" *ngIf=\"record.Score != null\">\n            <div class=\"progress-bar\" [style.width.%]=\"getScorePercentage()\" [style.background-color]=\"getStatusColor()\"></div>\n          </div>\n        </div>\n      </div>\n\n      <div class=\"metric-card\">\n        <div class=\"metric-icon\">\n          <i class=\"fas fa-check-double\"></i>\n        </div>\n        <div class=\"metric-content\">\n          <div class=\"metric-label\">Checks</div>\n          <div class=\"metric-value\">{{ record.PassedChecks }}/{{ record.TotalChecks }}</div>\n          <div class=\"metric-progress\" *ngIf=\"record.TotalChecks\">\n            <div class=\"progress-bar\" [style.width.%]=\"getPassRatePercentage()\" [style.background-color]=\"getStatusColor()\"></div>\n          </div>\n        </div>\n      </div>\n\n      <div class=\"metric-card\">\n        <div class=\"metric-icon\">\n          <i class=\"fas fa-dollar-sign\"></i>\n        </div>\n        <div class=\"metric-content\">\n          <div class=\"metric-label\">Cost</div>\n          <div class=\"metric-value\">{{ formatCost(record.CostUSD) }}</div>\n        </div>\n      </div>\n    </div>\n\n    <!-- Secondary Info -->\n    <div class=\"secondary-info\" *ngIf=\"record.RunByUser || testSuiteRun || record.TargetLogEntityID\">\n      <span class=\"info-chip\" *ngIf=\"record.RunByUser\">\n        <i class=\"fas fa-user\"></i>\n        {{ record.RunByUser }}\n      </span>\n      <span class=\"info-chip clickable\" *ngIf=\"testSuiteRun\" (click)=\"openTestSuiteRun()\">\n        <i class=\"fas fa-layer-group\"></i>\n        Part of Suite Run (Seq: {{ record.Sequence }})\n      </span>\n      <!-- Target Entity Link Pill -->\n      <mj-entity-link-pill\n        *ngIf=\"record.TargetLogEntityID && record.TargetLogID\"\n        [entityName]=\"record.TargetLogEntity\"\n        [recordId]=\"record.TargetLogID\">\n      </mj-entity-link-pill>\n    </div>\n\n    <!-- Tags Section - Sleek inline design -->\n    <div class=\"tags-bar\" *ngIf=\"!editingTags\">\n      <div class=\"tags-bar-content\">\n        <span class=\"tags-bar-label\"><i class=\"fas fa-tags\"></i></span>\n        <div class=\"tags-bar-chips\" *ngIf=\"tags.length > 0\">\n          <span class=\"tag-inline\" *ngFor=\"let tag of tags\">{{ tag }}</span>\n        </div>\n        <span class=\"tags-bar-empty\" *ngIf=\"tags.length === 0\">No tags</span>\n        <button class=\"tags-bar-edit\" (click)=\"startEditingTags()\" title=\"Edit tags\">\n          <i class=\"fas fa-plus\"></i> Add\n        </button>\n      </div>\n    </div>\n\n    <!-- Tags Editor - Expanded when editing -->\n    <div class=\"tags-editor-panel\" *ngIf=\"editingTags\">\n      <div class=\"tags-editor-header\">\n        <span class=\"tags-editor-title\"><i class=\"fas fa-tags\"></i> Edit Tags</span>\n      </div>\n      <div class=\"tags-editor-body\">\n        <div class=\"tags-editor-chips\">\n          <span class=\"tag-editable\" *ngFor=\"let tag of tags\">\n            {{ tag }}\n            <button class=\"tag-remove-btn\" (click)=\"removeTag(tag)\" title=\"Remove tag\">\n              <i class=\"fas fa-times\"></i>\n            </button>\n          </span>\n          <span class=\"tags-empty-hint\" *ngIf=\"tags.length === 0\">No tags yet</span>\n        </div>\n        <div class=\"tags-editor-input\">\n          <input type=\"text\"\n                 [(ngModel)]=\"newTag\"\n                 placeholder=\"Type a tag and press Enter...\"\n                 (keyup.enter)=\"addTag()\"\n                 class=\"tag-text-input\" />\n          <button kendoButton (click)=\"addTag()\" [disabled]=\"!newTag.trim()\" fillMode=\"flat\">\n            <i class=\"fas fa-plus\"></i>\n          </button>\n        </div>\n      </div>\n      <div class=\"tags-editor-footer\">\n        <button kendoButton (click)=\"saveTags()\" themeColor=\"primary\" [disabled]=\"savingTags\">\n          <i class=\"fas fa-spinner fa-spin\" *ngIf=\"savingTags\"></i>\n          {{ savingTags ? 'Saving...' : 'Save' }}\n        </button>\n        <button kendoButton (click)=\"cancelEditingTags()\" fillMode=\"flat\">Cancel</button>\n      </div>\n    </div>\n  </div>\n\n  <!-- Tabs -->\n  <div class=\"tabs-container\">\n    <div class=\"tabs\" role=\"tablist\">\n      <button class=\"tab\" [class.active]=\"activeTab === 'overview'\" (click)=\"changeTab('overview')\"\n              role=\"tab\" [attr.aria-selected]=\"activeTab === 'overview'\" title=\"Press 1\">\n        <i class=\"fas fa-chart-pie\"></i>\n        <span>Overview</span>\n      </button>\n      <button class=\"tab\" [class.active]=\"activeTab === 'details'\" (click)=\"changeTab('details')\"\n              role=\"tab\" [attr.aria-selected]=\"activeTab === 'details'\" title=\"Press 2\">\n        <i class=\"fas fa-info-circle\"></i>\n        <span>Details</span>\n      </button>\n      <button class=\"tab\" [class.active]=\"activeTab === 'ai-runs'\" (click)=\"changeTab('ai-runs')\"\n              role=\"tab\" [attr.aria-selected]=\"activeTab === 'ai-runs'\" title=\"Press 3\">\n        <i class=\"fas fa-robot\"></i>\n        <span>AI Runs</span>\n        <span class=\"tab-badge\" *ngIf=\"aiRunsLoaded\">{{ aiAgentRuns.length + aiPromptRuns.length }}</span>\n      </button>\n      <button class=\"tab\" [class.active]=\"activeTab === 'feedback'\" (click)=\"changeTab('feedback')\"\n              role=\"tab\" [attr.aria-selected]=\"activeTab === 'feedback'\" title=\"Press 4\">\n        <i class=\"fas fa-comments\"></i>\n        <span>Feedback</span>\n        <span class=\"tab-badge\" *ngIf=\"feedbackLoaded\">{{ feedbacks.length }}</span>\n      </button>\n      <button class=\"tab\" [class.active]=\"activeTab === 'execution'\" (click)=\"changeTab('execution')\"\n              role=\"tab\" [attr.aria-selected]=\"activeTab === 'execution'\" title=\"Press 5\">\n        <i class=\"fas fa-microchip\"></i>\n        <span>Execution</span>\n      </button>\n      <button class=\"tab\" [class.active]=\"activeTab === 'log'\" (click)=\"changeTab('log')\" *ngIf=\"record.Log\"\n              role=\"tab\" [attr.aria-selected]=\"activeTab === 'log'\" title=\"Press 6\">\n        <i class=\"fas fa-terminal\"></i>\n        <span>Log</span>\n      </button>\n    </div>\n  </div>\n\n  <!-- Tab Content -->\n  <div class=\"tab-content\">\n    <!-- Overview Tab -->\n    <div class=\"overview-tab\" *ngIf=\"activeTab === 'overview'\" [@fadeIn]>\n      <!-- Result Hero -->\n      <div class=\"result-hero\" [class]=\"getStatusClass()\">\n        <div class=\"result-icon-wrapper\">\n          <div class=\"result-icon\">\n            <i class=\"fas\" [ngClass]=\"getStatusIcon()\"></i>\n          </div>\n          <div class=\"result-pulse\" *ngIf=\"record.Status === 'Running'\"></div>\n        </div>\n        <div class=\"result-text\">\n          <h2>TEST {{ record.Status.toUpperCase() }}</h2>\n          <div class=\"result-details\">\n            <span class=\"result-score\">Score: {{ formatScore(record.Score) }}</span>\n            <span class=\"result-divider\">|</span>\n            <span class=\"result-checks\">{{ record.PassedChecks }} of {{ record.TotalChecks }} checks passed</span>\n          </div>\n        </div>\n      </div>\n\n      <!-- Check Results -->\n      <div class=\"check-results\" *ngIf=\"getCheckResults().length > 0\">\n        <div class=\"section-header\">\n          <h3><i class=\"fas fa-tasks\"></i> Check Results</h3>\n          <span class=\"check-summary\">{{ record.PassedChecks }} passed, {{ record.FailedChecks }} failed</span>\n        </div>\n        <div class=\"check-list\">\n          <div class=\"check-item\" *ngFor=\"let check of getCheckResults(); let i = index\"\n               [class.passed]=\"check.passed\" [class.failed]=\"!check.passed\"\n               [style.animation-delay.ms]=\"i * 50\">\n            <div class=\"check-status\">\n              <i class=\"fas\" [class.fa-check-circle]=\"check.passed\" [class.fa-times-circle]=\"!check.passed\"></i>\n            </div>\n            <div class=\"check-content\">\n              <div class=\"check-name\">{{ check.name }}</div>\n              <div class=\"check-message\" *ngIf=\"check.message\">{{ check.message }}</div>\n            </div>\n            <div class=\"check-weight\" *ngIf=\"check.weight\">\n              <span class=\"weight-label\">Weight:</span> {{ check.weight }}\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <!-- Data Comparison -->\n      <div class=\"comparison-section\">\n        <div class=\"section-header\">\n          <h3><i class=\"fas fa-exchange-alt\"></i> Data Comparison</h3>\n        </div>\n        <div class=\"comparison-tabs\">\n          <button class=\"comparison-tab\" [class.active]=\"comparisonView === 'input'\" (click)=\"setComparisonView('input')\">\n            <i class=\"fas fa-sign-in-alt\"></i> Input\n          </button>\n          <button class=\"comparison-tab\" [class.active]=\"comparisonView === 'expected'\" (click)=\"setComparisonView('expected')\">\n            <i class=\"fas fa-bullseye\"></i> Expected\n          </button>\n          <button class=\"comparison-tab\" [class.active]=\"comparisonView === 'actual'\" (click)=\"setComparisonView('actual')\">\n            <i class=\"fas fa-check-square\"></i> Actual\n          </button>\n        </div>\n        <div class=\"comparison-content\">\n          <mj-code-editor\n            [value]=\"getComparisonData()\"\n            language=\"json\"\n            [readonly]=\"true\"\n            [toolbar]=\"jsonToolbar\"\n            [lineWrapping]=\"true\">\n          </mj-code-editor>\n        </div>\n      </div>\n    </div>\n\n    <!-- Details Tab -->\n    <div class=\"details-tab\" *ngIf=\"activeTab === 'details'\" [@fadeIn]>\n      <div class=\"details-grid\">\n        <div class=\"detail-card\">\n          <div class=\"detail-icon\"><i class=\"fas fa-fingerprint\"></i></div>\n          <div class=\"detail-content\">\n            <div class=\"detail-label\">Test Run ID</div>\n            <div class=\"detail-value monospace\">{{ record.ID }}</div>\n          </div>\n        </div>\n\n        <div class=\"detail-card clickable\" *ngIf=\"test\" (click)=\"openTest()\">\n          <div class=\"detail-icon\"><i class=\"fas fa-flask\"></i></div>\n          <div class=\"detail-content\">\n            <div class=\"detail-label\">Test</div>\n            <div class=\"detail-value link\">{{ test.Name }}</div>\n          </div>\n          <i class=\"fas fa-external-link-alt detail-action\"></i>\n        </div>\n\n        <div class=\"detail-card\">\n          <div class=\"detail-icon\"><i class=\"fas fa-tag\"></i></div>\n          <div class=\"detail-content\">\n            <div class=\"detail-label\">Target Type</div>\n            <div class=\"detail-value\">{{ record.TargetType || 'N/A' }}</div>\n          </div>\n        </div>\n\n        <div class=\"detail-card\">\n          <div class=\"detail-icon\"><i class=\"fas fa-play-circle\"></i></div>\n          <div class=\"detail-content\">\n            <div class=\"detail-label\">Started At</div>\n            <div class=\"detail-value\">{{ record.StartedAt | date:'medium' }}</div>\n          </div>\n        </div>\n\n        <div class=\"detail-card\">\n          <div class=\"detail-icon\"><i class=\"fas fa-stop-circle\"></i></div>\n          <div class=\"detail-content\">\n            <div class=\"detail-label\">Completed At</div>\n            <div class=\"detail-value\">{{ record.CompletedAt | date:'medium' }}</div>\n          </div>\n        </div>\n\n        <div class=\"detail-card\">\n          <div class=\"detail-icon\"><i class=\"fas fa-hourglass-half\"></i></div>\n          <div class=\"detail-content\">\n            <div class=\"detail-label\">Duration</div>\n            <div class=\"detail-value\">{{ calculateDuration() }}</div>\n          </div>\n        </div>\n      </div>\n\n      <!-- Error Message -->\n      <div class=\"error-section\" *ngIf=\"record.ErrorMessage\">\n        <div class=\"section-header error\">\n          <h3><i class=\"fas fa-exclamation-triangle\"></i> Error Message</h3>\n        </div>\n        <div class=\"error-content\">\n          <mj-code-editor\n            [value]=\"record.ErrorMessage\"\n            [readonly]=\"true\"\n            [toolbar]=\"jsonToolbar\"\n            [lineWrapping]=\"true\">\n          </mj-code-editor>\n        </div>\n      </div>\n\n      <!-- Result Details -->\n      <div class=\"result-details-section\" *ngIf=\"parsedData.resultDetails\">\n        <div class=\"section-header\">\n          <h3><i class=\"fas fa-file-code\"></i> Result Details</h3>\n        </div>\n        <div class=\"result-details-content\">\n          <mj-code-editor\n            [value]=\"getFormattedResultDetails()\"\n            language=\"json\"\n            [readonly]=\"true\"\n            [toolbar]=\"jsonToolbar\"\n            [lineWrapping]=\"true\">\n          </mj-code-editor>\n        </div>\n      </div>\n    </div>\n\n    <!-- AI Runs Tab -->\n    <div class=\"ai-runs-tab\" *ngIf=\"activeTab === 'ai-runs'\" [@fadeIn]>\n      <!-- Loading State -->\n      <div class=\"loading-state\" *ngIf=\"loadingAIRuns\">\n        <div class=\"skeleton-list\">\n          <div class=\"skeleton-card\" *ngFor=\"let i of [1,2,3]\">\n            <div class=\"skeleton-icon\"></div>\n            <div class=\"skeleton-content\">\n              <div class=\"skeleton-line wide\"></div>\n              <div class=\"skeleton-line narrow\"></div>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <!-- AI Agent Runs -->\n      <div class=\"ai-section\" *ngIf=\"!loadingAIRuns && aiAgentRuns.length > 0\">\n        <div class=\"section-header\">\n          <h3><i class=\"fas fa-robot\"></i> AI Agent Runs</h3>\n          <span class=\"count-badge\">{{ aiAgentRuns.length }}</span>\n        </div>\n        <div class=\"ai-run-list\">\n          <div class=\"ai-run-card\" *ngFor=\"let run of aiAgentRuns\" (click)=\"openAIAgentRun(run.ID)\">\n            <div class=\"ai-run-icon agent\">\n              <i class=\"fas fa-robot\"></i>\n            </div>\n            <div class=\"ai-run-content\">\n              <div class=\"ai-run-name\">{{ run.Agent }}</div>\n              <div class=\"ai-run-meta\">\n                <span class=\"status-chip\" [class]=\"run.Status.toLowerCase()\">{{ run.Status }}</span>\n                <span *ngIf=\"run.TotalCost\" class=\"cost-chip\">\n                  <i class=\"fas fa-dollar-sign\"></i> {{ run.TotalCost | number:'1.4-4' }}\n                </span>\n              </div>\n            </div>\n            <i class=\"fas fa-chevron-right ai-run-arrow\"></i>\n          </div>\n        </div>\n      </div>\n\n      <!-- AI Prompt Runs -->\n      <div class=\"ai-section\" *ngIf=\"!loadingAIRuns && aiPromptRuns.length > 0\">\n        <div class=\"section-header\">\n          <h3><i class=\"fas fa-comment-dots\"></i> AI Prompt Runs</h3>\n          <span class=\"count-badge\">{{ aiPromptRuns.length }}</span>\n        </div>\n        <div class=\"ai-run-list\">\n          <div class=\"ai-run-card\" *ngFor=\"let run of aiPromptRuns\" (click)=\"openAIPromptRun(run.ID)\">\n            <div class=\"ai-run-icon prompt\">\n              <i class=\"fas fa-comment-dots\"></i>\n            </div>\n            <div class=\"ai-run-content\">\n              <div class=\"ai-run-name\">{{ run.Prompt || run.Model }}</div>\n              <div class=\"ai-run-meta\">\n                <span *ngIf=\"run.TotalCost\" class=\"cost-chip\">\n                  <i class=\"fas fa-dollar-sign\"></i> {{ run.TotalCost | number:'1.4-4' }}\n                </span>\n              </div>\n            </div>\n            <i class=\"fas fa-chevron-right ai-run-arrow\"></i>\n          </div>\n        </div>\n      </div>\n\n      <!-- Empty State -->\n      <div class=\"empty-state\" *ngIf=\"aiRunsLoaded && aiAgentRuns.length === 0 && aiPromptRuns.length === 0\">\n        <div class=\"empty-icon\">\n          <i class=\"fas fa-robot\"></i>\n        </div>\n        <h3>No AI Runs</h3>\n        <p>This test execution didn't involve any AI agent or prompt runs.</p>\n      </div>\n    </div>\n\n    <!-- Feedback Tab -->\n    <div class=\"feedback-tab\" *ngIf=\"activeTab === 'feedback'\" [@fadeIn]>\n      <!-- Loading State -->\n      <div class=\"loading-state\" *ngIf=\"loadingFeedback\">\n        <div class=\"skeleton-list\">\n          <div class=\"skeleton-card\" *ngFor=\"let i of [1,2]\">\n            <div class=\"skeleton-avatar\"></div>\n            <div class=\"skeleton-content\">\n              <div class=\"skeleton-line wide\"></div>\n              <div class=\"skeleton-line narrow\"></div>\n              <div class=\"skeleton-line medium\"></div>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <!-- Feedback List -->\n      <div class=\"feedback-list\" *ngIf=\"!loadingFeedback && feedbacks.length > 0\">\n        <div class=\"feedback-item\" *ngFor=\"let feedback of feedbacks\">\n          <div class=\"feedback-header\">\n            <div class=\"feedback-user\">\n              <div class=\"user-avatar\">\n                <i class=\"fas fa-user\"></i>\n              </div>\n              <span class=\"user-name\">{{ feedback.ReviewerUser }}</span>\n            </div>\n            <div class=\"feedback-date\">\n              {{ getRelativeTime(feedback.__mj_CreatedAt) }}\n            </div>\n          </div>\n          <div class=\"feedback-body\">\n            <div class=\"feedback-rating\">\n              <div class=\"rating-stars\">\n                <i class=\"fas fa-star\" *ngFor=\"let s of [1,2,3,4,5,6,7,8,9,10]\"\n                   [class.filled]=\"s <= (feedback.Rating || 0)\"></i>\n              </div>\n              <span class=\"rating-value\">{{ feedback.Rating }}/10</span>\n            </div>\n            <div class=\"feedback-verdict\" *ngIf=\"feedback.IsCorrect !== null\">\n              <span class=\"verdict-badge\" [class.correct]=\"feedback.IsCorrect\" [class.incorrect]=\"!feedback.IsCorrect\">\n                <i class=\"fas\" [class.fa-check]=\"feedback.IsCorrect\" [class.fa-times]=\"!feedback.IsCorrect\"></i>\n                {{ feedback.IsCorrect ? 'Marked Correct' : 'Marked Incorrect' }}\n              </span>\n            </div>\n            <div class=\"feedback-comments\" *ngIf=\"feedback.CorrectionSummary\">\n              <p>{{ feedback.CorrectionSummary }}</p>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <!-- Empty State -->\n      <div class=\"empty-state\" *ngIf=\"feedbackLoaded && feedbacks.length === 0\">\n        <div class=\"empty-icon\">\n          <i class=\"fas fa-comments\"></i>\n        </div>\n        <h3>No Feedback Yet</h3>\n        <p>No one has reviewed this test run yet. Be the first to provide feedback!</p>\n      </div>\n    </div>\n\n    <!-- Execution Context Tab -->\n    <div class=\"execution-tab\" *ngIf=\"activeTab === 'execution'\" [@fadeIn]>\n      <mj-execution-context\n        [machineName]=\"record.MachineName\"\n        [machineId]=\"record.MachineID\"\n        [runByUserName]=\"record.RunByUserName\"\n        [runByUserEmail]=\"record.RunByUserEmail\"\n        [runContextDetailsJson]=\"record.RunContextDetails\">\n      </mj-execution-context>\n    </div>\n\n    <!-- Execution Log Tab -->\n    <div class=\"log-tab\" *ngIf=\"activeTab === 'log'\" [@fadeIn]>\n      <div class=\"log-header\">\n        <div class=\"log-title\">\n          <i class=\"fas fa-terminal\"></i>\n          <h3>Execution Log</h3>\n        </div>\n        <div class=\"log-actions\">\n          <button kendoButton (click)=\"copyLogToClipboard()\" look=\"flat\">\n            <i class=\"fas fa-copy\"></i>\n            <span class=\"btn-text\">Copy</span>\n          </button>\n        </div>\n      </div>\n      <div class=\"log-container\">\n        <mj-code-editor\n          [value]=\"record.Log || ''\"\n          [readonly]=\"true\"\n          [toolbar]=\"jsonToolbar\"\n          [lineWrapping]=\"true\">\n        </mj-code-editor>\n      </div>\n    </div>\n  </div>\n\n  <!-- Keyboard Shortcuts Help (shown on hover of ? icon) -->\n  <div class=\"shortcuts-hint\" title=\"Keyboard Shortcuts\">\n    <i class=\"fas fa-keyboard\"></i>\n    <div class=\"shortcuts-popup\">\n      <h4>Keyboard Shortcuts</h4>\n      <ul>\n        <li><kbd>1-6</kbd> Switch tabs</li>\n        <li><kbd>Cmd+R</kbd> Refresh</li>\n        <li><kbd>Cmd+Shift+R</kbd> Re-run test</li>\n      </ul>\n    </div>\n  </div>\n</div>\n", styles: ["/* ===========================\n   Test Run Form - World-Class UX\n   Premium Testing Dashboard Styles\n   =========================== */\n\n/* CSS Custom Properties for Theming - using :host for Angular encapsulation */\n:host {\n  --test-primary: #2563eb;\n  --test-primary-light: #3b82f6;\n  --test-primary-dark: #1d4ed8;\n  --test-success: #10b981;\n  --test-success-light: #d1fae5;\n  --test-error: #ef4444;\n  --test-error-light: #fee2e2;\n  --test-warning: #f59e0b;\n  --test-warning-light: #fef3c7;\n  --test-timeout: #f97316;\n  --test-timeout-light: #ffedd5;\n  --test-running: #3b82f6;\n  --test-pending: #8b5cf6;\n  --test-skipped: #6b7280;\n  --test-bg: #f8fafc;\n  --test-surface: #ffffff;\n  --test-border: #e2e8f0;\n  --test-text: #1e293b;\n  --test-text-secondary: #64748b;\n  --test-text-muted: #94a3b8;\n  --test-radius-sm: 6px;\n  --test-radius-md: 10px;\n  --test-radius-lg: 16px;\n  --test-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);\n  --test-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  --test-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n  --test-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  display: block;\n  height: 100%;\n}\n\n/* Base Container */\n.test-run-form {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  background: var(--test-bg);\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n/* ===========================\n   Error Banner\n   =========================== */\n.error-banner {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  padding: 12px 20px;\n  background: linear-gradient(135deg, var(--test-error) 0%, #dc2626 100%);\n  color: white;\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: var(--test-transition);\n  animation: slideDown 0.3s ease-out;\n}\n\n.error-banner:hover {\n  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);\n}\n\n.error-banner i {\n  font-size: 16px;\n}\n\n.retry-btn {\n  background: rgba(255, 255, 255, 0.2);\n  border: 1px solid rgba(255, 255, 255, 0.3);\n  color: white;\n  padding: 6px 12px;\n  border-radius: var(--test-radius-sm);\n  cursor: pointer;\n  font-size: 12px;\n  font-weight: 600;\n  transition: var(--test-transition);\n}\n\n.retry-btn:hover {\n  background: rgba(255, 255, 255, 0.3);\n}\n\n@keyframes slideDown {\n  from {\n    transform: translateY(-100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}\n\n/* ===========================\n   Header Section\n   =========================== */\n.test-run-header {\n  background: var(--test-surface);\n  border-bottom: 1px solid var(--test-border);\n  padding: 20px;\n  position: relative;\n}\n\n/* Breadcrumb */\n.breadcrumb {\n  margin-bottom: 16px;\n}\n\n.breadcrumb ol {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  font-size: 13px;\n  flex-wrap: wrap;\n}\n\n.breadcrumb li {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.breadcrumb a {\n  color: var(--test-primary);\n  text-decoration: none;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 8px;\n  border-radius: var(--test-radius-sm);\n  transition: var(--test-transition);\n}\n\n.breadcrumb a:hover {\n  background: rgba(37, 99, 235, 0.1);\n  text-decoration: none;\n}\n\n.breadcrumb .separator {\n  font-size: 10px;\n  color: var(--test-text-muted);\n  margin: 0 4px;\n}\n\n.breadcrumb .current {\n  color: var(--test-text-secondary);\n  font-weight: 500;\n}\n\n.breadcrumb-text {\n  max-width: 200px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* Header Content */\n.header-content {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 20px;\n  gap: 16px;\n}\n\n.header-left {\n  display: flex;\n  gap: 16px;\n  flex: 1;\n  min-width: 0;\n}\n\n/* Status Indicator */\n.status-indicator {\n  width: 56px;\n  height: 56px;\n  border-radius: var(--test-radius-md);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: white;\n  font-size: 24px;\n  flex-shrink: 0;\n  box-shadow: var(--test-shadow-md);\n  transition: var(--test-transition);\n}\n\n.status-indicator:hover {\n  transform: scale(1.05);\n}\n\n/* Test Run Info */\n.test-run-info {\n  flex: 1;\n  min-width: 0;\n}\n\n.test-run-info h1 {\n  margin: 0 0 8px 0;\n  font-size: clamp(18px, 4vw, 24px);\n  font-weight: 700;\n  color: var(--test-text);\n  line-height: 1.2;\n  word-wrap: break-word;\n}\n\n.test-run-info h1 .run-id {\n  color: var(--test-text-secondary);\n  font-weight: 500;\n}\n\n.test-run-meta {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n/* Status Badge */\n.status-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 14px;\n  border-radius: 20px;\n  color: white;\n  font-size: 12px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n/* Meta Item */\n.meta-item {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 14px;\n  color: var(--test-text-secondary);\n}\n\n.meta-item i {\n  font-size: 12px;\n}\n\n/* Header Actions */\n.header-actions {\n  display: flex;\n  gap: 8px;\n  flex-shrink: 0;\n}\n\n.header-actions button {\n  white-space: nowrap;\n}\n\n.btn-text {\n  margin-left: 6px;\n}\n\n/* ===========================\n   Metrics Bar\n   =========================== */\n.metrics-bar {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));\n  gap: 12px;\n  margin-bottom: 16px;\n}\n\n.metric-card {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  padding: 14px;\n  transition: var(--test-transition);\n}\n\n.metric-card:hover {\n  transform: translateY(-2px);\n  box-shadow: var(--test-shadow-md);\n}\n\n.metric-icon {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-sm);\n  color: var(--test-primary);\n  font-size: 16px;\n  flex-shrink: 0;\n}\n\n.metric-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.metric-label {\n  font-size: 10px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  color: var(--test-text-muted);\n  margin-bottom: 4px;\n}\n\n.metric-value {\n  font-size: 16px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.metric-detail {\n  font-size: 11px;\n  color: var(--test-text-muted);\n  margin-top: 2px;\n}\n\n/* Progress bar in metric card */\n.metric-progress {\n  margin-top: 6px;\n  height: 4px;\n  background: var(--test-border);\n  border-radius: 2px;\n  overflow: hidden;\n}\n\n.progress-bar {\n  height: 100%;\n  border-radius: 2px;\n  transition: width 0.5s ease-out;\n}\n\n/* Secondary Info */\n.secondary-info {\n  display: flex;\n  gap: 12px;\n  padding-top: 16px;\n  border-top: 1px solid var(--test-border);\n  flex-wrap: wrap;\n}\n\n.info-chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 13px;\n  color: var(--test-text-secondary);\n  padding: 6px 12px;\n  background: var(--test-bg);\n  border-radius: 20px;\n  transition: var(--test-transition);\n}\n\n.info-chip i {\n  font-size: 12px;\n}\n\n.info-chip.clickable {\n  cursor: pointer;\n}\n\n.info-chip.clickable:hover {\n  background: rgba(37, 99, 235, 0.1);\n  color: var(--test-primary);\n}\n\n/* ===========================\n   Tabs Navigation\n   =========================== */\n.tabs-container {\n  background: var(--test-surface);\n  border-bottom: 1px solid var(--test-border);\n  position: sticky;\n  top: 0;\n  z-index: 10;\n}\n\n.tabs {\n  display: flex;\n  padding: 0 20px;\n  overflow-x: auto;\n  -webkit-overflow-scrolling: touch;\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n\n.tabs::-webkit-scrollbar {\n  display: none;\n}\n\n.tab {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 14px 18px;\n  border: none;\n  background: transparent;\n  border-bottom: 3px solid transparent;\n  color: var(--test-text-secondary);\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: var(--test-transition);\n  white-space: nowrap;\n  position: relative;\n}\n\n.tab:hover {\n  color: var(--test-primary);\n  background: rgba(37, 99, 235, 0.05);\n}\n\n.tab.active {\n  color: var(--test-primary);\n  border-bottom-color: var(--test-primary);\n  font-weight: 600;\n}\n\n.tab i {\n  font-size: 15px;\n}\n\n.tab-badge {\n  background: var(--test-border);\n  color: var(--test-text-secondary);\n  padding: 2px 8px;\n  border-radius: 10px;\n  font-size: 11px;\n  font-weight: 600;\n  transition: var(--test-transition);\n}\n\n.tab.active .tab-badge {\n  background: rgba(37, 99, 235, 0.15);\n  color: var(--test-primary);\n}\n\n.shortcut-hint {\n  font-size: 10px;\n  color: var(--test-text-muted);\n  background: var(--test-bg);\n  padding: 2px 6px;\n  border-radius: 4px;\n  font-weight: 600;\n  margin-left: 4px;\n  font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n}\n\n/* ===========================\n   Tab Content Area\n   =========================== */\n.tab-content {\n  flex: 1;\n  overflow-y: auto;\n  padding: 20px;\n  scroll-behavior: smooth;\n}\n\n/* ===========================\n   Overview Tab\n   =========================== */\n.overview-tab {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: fadeIn 0.3s ease-out;\n}\n\n@keyframes fadeIn {\n  from { opacity: 0; transform: translateY(10px); }\n  to { opacity: 1; transform: translateY(0); }\n}\n\n/* Result Hero Card */\n.result-hero {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 32px;\n  text-align: center;\n  border: 2px solid var(--test-border);\n  box-shadow: var(--test-shadow-sm);\n  transition: var(--test-transition);\n}\n\n.result-hero.passed {\n  background: linear-gradient(135deg, #ecfdf5 0%, var(--test-success-light) 100%);\n  border-color: var(--test-success);\n}\n\n.result-hero.failed {\n  background: linear-gradient(135deg, #fef2f2 0%, var(--test-error-light) 100%);\n  border-color: var(--test-error);\n}\n\n.result-hero.error {\n  background: linear-gradient(135deg, #fffbeb 0%, var(--test-warning-light) 100%);\n  border-color: var(--test-warning);\n}\n\n.result-hero.timeout {\n  background: linear-gradient(135deg, #fff7ed 0%, var(--test-timeout-light) 100%);\n  border-color: var(--test-timeout);\n}\n\n.result-hero.running,\n.result-hero.pending {\n  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);\n  border-color: var(--test-primary-light);\n}\n\n.result-icon-wrapper {\n  position: relative;\n  display: inline-block;\n  margin-bottom: 16px;\n}\n\n.result-icon {\n  width: 80px;\n  height: 80px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border-radius: 50%;\n  font-size: 40px;\n  margin: 0 auto;\n  box-shadow: var(--test-shadow-md);\n}\n\n.result-hero.passed .result-icon { color: var(--test-success); }\n.result-hero.failed .result-icon { color: var(--test-error); }\n.result-hero.error .result-icon { color: var(--test-warning); }\n.result-hero.timeout .result-icon { color: var(--test-timeout); }\n.result-hero.running .result-icon,\n.result-hero.pending .result-icon { color: var(--test-primary); }\n\n.result-pulse {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 100px;\n  height: 100px;\n  border-radius: 50%;\n  background: rgba(59, 130, 246, 0.2);\n  animation: pulse 2s ease-in-out infinite;\n}\n\n@keyframes pulse {\n  0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.5; }\n  50% { transform: translate(-50%, -50%) scale(1.2); opacity: 0; }\n}\n\n.result-text h2 {\n  margin: 0 0 12px 0;\n  font-size: clamp(24px, 5vw, 32px);\n  font-weight: 800;\n  color: var(--test-text);\n}\n\n.result-details {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n.result-score {\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--test-text-secondary);\n}\n\n.result-divider {\n  color: var(--test-border);\n}\n\n.result-checks {\n  font-size: 16px;\n  color: var(--test-text-muted);\n}\n\n/* Section Headers */\n.section-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 16px;\n  gap: 12px;\n}\n\n.section-header h3 {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 700;\n  color: var(--test-text);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.section-header h3 i {\n  color: var(--test-primary);\n}\n\n.section-header.error h3 i {\n  color: var(--test-error);\n}\n\n.check-summary {\n  font-size: 13px;\n  color: var(--test-text-secondary);\n}\n\n/* Check Results Section */\n.check-results {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.check-list {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.check-item {\n  display: flex;\n  gap: 12px;\n  padding: 14px 16px;\n  border-radius: var(--test-radius-md);\n  border: 1px solid var(--test-border);\n  transition: var(--test-transition);\n  animation: fadeIn 0.3s ease-out backwards;\n}\n\n.check-item:hover {\n  transform: translateX(4px);\n}\n\n.check-item.passed {\n  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);\n  border-color: #86efac;\n}\n\n.check-item.failed {\n  background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);\n  border-color: #fca5a5;\n}\n\n.check-status {\n  font-size: 20px;\n  flex-shrink: 0;\n  margin-top: 2px;\n}\n\n.check-item.passed .check-status { color: var(--test-success); }\n.check-item.failed .check-status { color: var(--test-error); }\n\n.check-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.check-name {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n  margin-bottom: 4px;\n}\n\n.check-message {\n  font-size: 13px;\n  color: var(--test-text-secondary);\n  line-height: 1.5;\n  word-wrap: break-word;\n}\n\n.check-weight {\n  font-size: 12px;\n  color: var(--test-text-muted);\n  flex-shrink: 0;\n  text-align: right;\n}\n\n.weight-label {\n  font-weight: 500;\n}\n\n/* Comparison Section */\n.comparison-section {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.comparison-tabs {\n  display: flex;\n  gap: 4px;\n  margin-bottom: 16px;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  padding: 4px;\n}\n\n.comparison-tab {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  padding: 10px 16px;\n  border: none;\n  background: transparent;\n  color: var(--test-text-secondary);\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  border-radius: var(--test-radius-sm);\n  transition: var(--test-transition);\n}\n\n.comparison-tab:hover {\n  color: var(--test-text);\n  background: rgba(0, 0, 0, 0.05);\n}\n\n.comparison-tab.active {\n  background: var(--test-surface);\n  color: var(--test-primary);\n  font-weight: 600;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.comparison-content {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid var(--test-border);\n}\n\n/* ===========================\n   Details Tab\n   =========================== */\n.details-tab {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: fadeIn 0.3s ease-out;\n}\n\n.details-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n  gap: 12px;\n}\n\n.detail-card {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  transition: var(--test-transition);\n}\n\n.detail-card.clickable {\n  cursor: pointer;\n}\n\n.detail-card.clickable:hover {\n  background: rgba(37, 99, 235, 0.05);\n  border-color: var(--test-primary-light);\n  transform: translateX(4px);\n}\n\n.detail-icon {\n  width: 44px;\n  height: 44px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  color: var(--test-primary);\n  font-size: 18px;\n  flex-shrink: 0;\n}\n\n.detail-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.detail-label {\n  font-size: 11px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  color: var(--test-text-muted);\n  margin-bottom: 4px;\n}\n\n.detail-value {\n  font-size: 14px;\n  color: var(--test-text);\n  word-wrap: break-word;\n  font-weight: 500;\n}\n\n.detail-value.monospace {\n  font-family: 'SF Mono', Monaco, 'Courier New', monospace;\n  font-size: 12px;\n}\n\n.detail-value.link {\n  color: var(--test-primary);\n}\n\n.detail-action {\n  color: var(--test-text-muted);\n  font-size: 12px;\n  transition: var(--test-transition);\n}\n\n.detail-card.clickable:hover .detail-action {\n  color: var(--test-primary);\n}\n\n/* Error Section */\n.error-section {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.error-content {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid #fca5a5;\n}\n\n/* Result Details Section */\n.result-details-section {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.result-details-content {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid var(--test-border);\n}\n\n/* ===========================\n   AI Runs Tab\n   =========================== */\n.ai-runs-tab {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: fadeIn 0.3s ease-out;\n}\n\n.ai-section {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.count-badge {\n  background: var(--test-bg);\n  color: var(--test-text-secondary);\n  padding: 4px 10px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n.ai-run-list {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.ai-run-card {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-bg);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  cursor: pointer;\n  transition: var(--test-transition);\n}\n\n.ai-run-card:hover {\n  background: rgba(37, 99, 235, 0.05);\n  border-color: var(--test-primary-light);\n  transform: translateX(4px);\n  box-shadow: var(--test-shadow-sm);\n}\n\n.ai-run-icon {\n  width: 44px;\n  height: 44px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: linear-gradient(135deg, var(--test-primary) 0%, var(--test-primary-dark) 100%);\n  color: white;\n  border-radius: var(--test-radius-md);\n  font-size: 18px;\n  flex-shrink: 0;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.ai-run-icon.agent {\n  background: linear-gradient(135deg, var(--test-primary) 0%, var(--test-primary-dark) 100%);\n}\n\n.ai-run-icon.prompt {\n  background: linear-gradient(135deg, #9333ea 0%, #7c3aed 100%);\n}\n\n.ai-run-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.ai-run-name {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n  margin-bottom: 6px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.ai-run-meta {\n  display: flex;\n  gap: 10px;\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  flex-wrap: wrap;\n}\n\n.status-chip {\n  display: inline-flex;\n  align-items: center;\n  padding: 2px 8px;\n  border-radius: 10px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n}\n\n.status-chip.complete,\n.status-chip.completed,\n.status-chip.passed {\n  background: var(--test-success-light);\n  color: #059669;\n}\n\n.status-chip.failed,\n.status-chip.error {\n  background: var(--test-error-light);\n  color: #dc2626;\n}\n\n.status-chip.running {\n  background: #dbeafe;\n  color: var(--test-primary);\n}\n\n.cost-chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 2px;\n  color: var(--test-text-muted);\n}\n\n.ai-run-arrow {\n  color: var(--test-text-muted);\n  font-size: 14px;\n  transition: var(--test-transition);\n}\n\n.ai-run-card:hover .ai-run-arrow {\n  color: var(--test-primary);\n  transform: translateX(2px);\n}\n\n/* ===========================\n   Feedback Tab\n   =========================== */\n.feedback-tab {\n  animation: fadeIn 0.3s ease-out;\n}\n\n.feedback-list {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n.feedback-item {\n  padding: 20px;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  border: 1px solid var(--test-border);\n  box-shadow: var(--test-shadow-sm);\n  transition: var(--test-transition);\n}\n\n.feedback-item:hover {\n  border-color: var(--test-primary-light);\n}\n\n.feedback-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 16px;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.feedback-user {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.user-avatar {\n  width: 36px;\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: 50%;\n  color: var(--test-primary);\n  font-size: 14px;\n}\n\n.user-name {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.feedback-date {\n  font-size: 12px;\n  color: var(--test-text-muted);\n}\n\n.feedback-body {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.feedback-rating {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.rating-stars {\n  display: flex;\n  gap: 2px;\n}\n\n.rating-stars i {\n  font-size: 14px;\n  color: var(--test-border);\n}\n\n.rating-stars i.filled {\n  color: #fbbf24;\n}\n\n.rating-value {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.feedback-verdict {\n  display: flex;\n}\n\n.verdict-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  border-radius: 20px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n.verdict-badge.correct {\n  background: var(--test-success-light);\n  color: #059669;\n}\n\n.verdict-badge.incorrect {\n  background: var(--test-error-light);\n  color: #dc2626;\n}\n\n.feedback-comments {\n  padding: 14px;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  border-left: 3px solid var(--test-primary);\n}\n\n.feedback-comments p {\n  margin: 0;\n  font-size: 14px;\n  line-height: 1.6;\n  color: var(--test-text);\n}\n\n/* ===========================\n   Log Tab\n   =========================== */\n.log-tab {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  height: 100%;\n  animation: fadeIn 0.3s ease-out;\n}\n\n.log-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background: var(--test-surface);\n  padding: 16px 20px;\n  border-radius: var(--test-radius-lg) var(--test-radius-lg) 0 0;\n  border: 1px solid var(--test-border);\n  border-bottom: none;\n}\n\n.log-title {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.log-title i {\n  color: var(--test-text-secondary);\n  font-size: 16px;\n}\n\n.log-title h3 {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.log-actions {\n  display: flex;\n  gap: 8px;\n}\n\n.log-container {\n  flex: 1;\n  border-radius: 0 0 var(--test-radius-lg) var(--test-radius-lg);\n  overflow: hidden;\n  min-height: 300px;\n  border: 1px solid var(--test-border);\n  border-top: none;\n}\n\n/* ===========================\n   Loading States & Skeletons\n   =========================== */\n.loading-state {\n  padding: 20px;\n}\n\n.skeleton-list {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.skeleton-card {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-md);\n  border: 1px solid var(--test-border);\n}\n\n.skeleton-icon,\n.skeleton-avatar {\n  width: 44px;\n  height: 44px;\n  border-radius: var(--test-radius-md);\n  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);\n  background-size: 200% 100%;\n  animation: shimmer 1.5s infinite;\n}\n\n.skeleton-avatar {\n  border-radius: 50%;\n}\n\n.skeleton-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.skeleton-line {\n  height: 14px;\n  border-radius: 4px;\n  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);\n  background-size: 200% 100%;\n  animation: shimmer 1.5s infinite;\n}\n\n.skeleton-line.wide { width: 70%; }\n.skeleton-line.medium { width: 55%; }\n.skeleton-line.narrow { width: 40%; }\n\n@keyframes shimmer {\n  0% { background-position: 200% 0; }\n  100% { background-position: -200% 0; }\n}\n\n/* ===========================\n   Empty States\n   =========================== */\n.empty-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 60px 24px;\n  text-align: center;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n}\n\n.empty-icon {\n  width: 80px;\n  height: 80px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: 50%;\n  margin-bottom: 20px;\n}\n\n.empty-icon i {\n  font-size: 36px;\n  color: var(--test-text-muted);\n}\n\n.empty-state h3 {\n  margin: 0 0 8px 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.empty-state p {\n  margin: 0;\n  font-size: 14px;\n  color: var(--test-text-secondary);\n  max-width: 300px;\n}\n\n/* ===========================\n   Keyboard Shortcuts Help\n   =========================== */\n.shortcuts-hint {\n  position: fixed;\n  bottom: 20px;\n  right: 20px;\n  z-index: 100;\n}\n\n.shortcuts-hint > i {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: 50%;\n  color: var(--test-text-muted);\n  font-size: 16px;\n  cursor: pointer;\n  box-shadow: var(--test-shadow-md);\n  transition: var(--test-transition);\n}\n\n.shortcuts-hint:hover > i {\n  color: var(--test-primary);\n  border-color: var(--test-primary-light);\n}\n\n.shortcuts-popup {\n  display: none;\n  position: absolute;\n  bottom: 50px;\n  right: 0;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  padding: 16px;\n  box-shadow: var(--test-shadow-lg);\n  min-width: 200px;\n}\n\n.shortcuts-hint:hover .shortcuts-popup {\n  display: block;\n  animation: fadeIn 0.2s ease-out;\n}\n\n.shortcuts-popup h4 {\n  margin: 0 0 12px 0;\n  font-size: 14px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.shortcuts-popup ul {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n\n.shortcuts-popup li {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 6px 0;\n  font-size: 13px;\n  color: var(--test-text-secondary);\n}\n\n.shortcuts-popup kbd {\n  background: var(--test-bg);\n  border: 1px solid var(--test-border);\n  border-radius: 4px;\n  padding: 2px 6px;\n  font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n  font-size: 11px;\n  color: var(--test-text);\n}\n\n/* ===========================\n   Responsive Design - Tablet\n   =========================== */\n@media (max-width: 1024px) {\n  .metrics-bar {\n    grid-template-columns: repeat(3, 1fr);\n  }\n\n  .details-grid {\n    grid-template-columns: repeat(2, 1fr);\n  }\n\n  .shortcuts-hint {\n    display: none;\n  }\n}\n\n/* ===========================\n   Responsive Design - Mobile\n   =========================== */\n@media (max-width: 768px) {\n  .test-run-form {\n    height: auto;\n    min-height: 100%;\n  }\n\n  .test-run-header {\n    padding: 16px;\n  }\n\n  .breadcrumb {\n    margin-bottom: 12px;\n  }\n\n  .breadcrumb ol {\n    font-size: 12px;\n  }\n\n  .header-content {\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .header-left {\n    width: 100%;\n  }\n\n  .status-indicator {\n    width: 48px;\n    height: 48px;\n    font-size: 20px;\n  }\n\n  .test-run-info h1 {\n    font-size: 18px;\n  }\n\n  .test-run-meta {\n    gap: 8px;\n  }\n\n  .status-badge {\n    padding: 4px 10px;\n    font-size: 11px;\n  }\n\n  .header-actions {\n    width: 100%;\n    justify-content: stretch;\n  }\n\n  .header-actions button {\n    flex: 1;\n  }\n\n  .metrics-bar {\n    grid-template-columns: repeat(2, 1fr);\n    gap: 10px;\n  }\n\n  .metric-card {\n    padding: 12px;\n  }\n\n  .metric-icon {\n    width: 36px;\n    height: 36px;\n    font-size: 14px;\n  }\n\n  .metric-value {\n    font-size: 14px;\n  }\n\n  .tabs {\n    padding: 0 12px;\n  }\n\n  .tab {\n    padding: 12px 14px;\n    font-size: 13px;\n    gap: 6px;\n  }\n\n  .tab i {\n    font-size: 14px;\n  }\n\n  .shortcut-hint {\n    display: none;\n  }\n\n  .tab-content {\n    padding: 16px;\n  }\n\n  .result-hero {\n    padding: 24px 20px;\n  }\n\n  .result-icon {\n    width: 64px;\n    height: 64px;\n    font-size: 32px;\n  }\n\n  .result-text h2 {\n    font-size: 24px;\n  }\n\n  .result-score {\n    font-size: 16px;\n  }\n\n  .check-results,\n  .comparison-section,\n  .ai-section,\n  .feedback-item {\n    padding: 18px;\n  }\n\n  .check-item {\n    padding: 12px;\n  }\n\n  .comparison-tabs {\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .comparison-tab {\n    text-align: center;\n  }\n\n  .details-grid {\n    grid-template-columns: 1fr;\n  }\n\n  .detail-card {\n    padding: 14px;\n  }\n\n  .ai-run-card {\n    padding: 14px;\n  }\n\n  .ai-run-icon {\n    width: 40px;\n    height: 40px;\n    font-size: 16px;\n  }\n\n  .ai-run-meta {\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .feedback-header {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .log-header {\n    flex-direction: column;\n    gap: 12px;\n    align-items: stretch;\n  }\n\n  .log-actions {\n    justify-content: stretch;\n  }\n\n  .log-actions button {\n    flex: 1;\n  }\n\n  .empty-state {\n    padding: 40px 20px;\n  }\n\n  .empty-icon {\n    width: 64px;\n    height: 64px;\n  }\n\n  .empty-icon i {\n    font-size: 28px;\n  }\n}\n\n/* ===========================\n   Responsive Design - Small Mobile\n   =========================== */\n@media (max-width: 480px) {\n  .test-run-header {\n    padding: 12px;\n  }\n\n  .header-left {\n    gap: 12px;\n  }\n\n  .status-indicator {\n    width: 40px;\n    height: 40px;\n    font-size: 18px;\n    border-radius: 8px;\n  }\n\n  .test-run-info h1 {\n    font-size: 16px;\n  }\n\n  .metrics-bar {\n    grid-template-columns: 1fr 1fr;\n  }\n\n  .metric-card {\n    padding: 10px;\n    flex-direction: column;\n    text-align: center;\n  }\n\n  .metric-icon {\n    margin-bottom: 8px;\n  }\n\n  .metric-label {\n    font-size: 9px;\n  }\n\n  .metric-value {\n    font-size: 14px;\n  }\n\n  .tabs {\n    padding: 0 8px;\n  }\n\n  .tab {\n    padding: 10px 12px;\n    font-size: 12px;\n  }\n\n  .tab-badge {\n    display: none;\n  }\n\n  .tab-content {\n    padding: 12px;\n  }\n\n  .result-hero {\n    padding: 20px 16px;\n  }\n\n  .result-icon {\n    width: 56px;\n    height: 56px;\n    font-size: 28px;\n  }\n\n  .result-text h2 {\n    font-size: 20px;\n  }\n\n  .result-score {\n    font-size: 14px;\n  }\n\n  .result-checks {\n    font-size: 12px;\n  }\n\n  .section-header h3 {\n    font-size: 16px;\n  }\n\n  .check-item {\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  .check-weight {\n    text-align: left;\n  }\n}\n\n/* ===========================\n   Touch Device Optimizations\n   =========================== */\n@media (hover: none) and (pointer: coarse) {\n  .tab,\n  .comparison-tab,\n  .ai-run-card,\n  .check-item,\n  .feedback-item,\n  .detail-card.clickable {\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  .ai-run-card:active,\n  .detail-card.clickable:active {\n    background: rgba(37, 99, 235, 0.1);\n    transform: scale(0.98);\n  }\n\n  .tab:active {\n    background: rgba(37, 99, 235, 0.1);\n  }\n\n  /* Larger touch targets */\n  .tab {\n    min-height: 48px;\n  }\n\n  .ai-run-card,\n  .detail-card {\n    min-height: 64px;\n  }\n}\n\n/* ===========================\n   High Contrast Mode\n   =========================== */\n@media (prefers-contrast: high) {\n  .status-badge {\n    border: 2px solid currentColor;\n  }\n\n  .check-item {\n    border-width: 2px;\n  }\n\n  .tab.active {\n    border-bottom-width: 4px;\n  }\n}\n\n/* ===========================\n   Reduced Motion\n   =========================== */\n@media (prefers-reduced-motion: reduce) {\n  *,\n  *::before,\n  *::after {\n    animation-duration: 0.01ms !important;\n    animation-iteration-count: 1 !important;\n    transition-duration: 0.01ms !important;\n  }\n\n  .skeleton-icon,\n  .skeleton-avatar,\n  .skeleton-line {\n    animation: none;\n    background: #e2e8f0;\n  }\n\n  .result-pulse {\n    animation: none;\n    display: none;\n  }\n}\n\n/* ===========================\n   Print Styles\n   =========================== */\n@media print {\n  .test-run-form {\n    background: white;\n    height: auto;\n  }\n\n  .header-actions,\n  .tabs-container,\n  .shortcuts-hint,\n  .log-actions {\n    display: none !important;\n  }\n\n  .tab-content {\n    overflow: visible;\n    padding: 0;\n  }\n\n  .result-hero,\n  .check-results,\n  .details-grid,\n  .ai-section,\n  .feedback-item {\n    break-inside: avoid;\n    box-shadow: none;\n    border: 1px solid #ddd;\n  }\n\n  .comparison-content,\n  .log-container {\n    max-height: none;\n    overflow: visible;\n  }\n}\n\n/* ===========================\n   Tags Bar - Sleek Inline Display\n   =========================== */\n.tags-bar {\n  margin-top: 16px;\n  padding: 8px 14px;\n  background: linear-gradient(135deg, rgba(37, 99, 235, 0.04) 0%, rgba(37, 99, 235, 0.08) 100%);\n  border: 1px solid rgba(37, 99, 235, 0.15);\n  border-radius: 8px;\n  max-width: 600px;\n}\n\n.tags-bar-content {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  flex-wrap: wrap;\n}\n\n.tags-bar-label {\n  color: var(--test-text-secondary);\n  font-size: 14px;\n}\n\n.tags-bar-label i {\n  opacity: 0.6;\n}\n\n.tags-bar-chips {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  flex: 1;\n}\n\n.tag-inline {\n  display: inline-flex;\n  align-items: center;\n  padding: 4px 10px;\n  background: rgba(37, 99, 235, 0.1);\n  color: var(--test-primary);\n  border-radius: 12px;\n  font-size: 11px;\n  font-weight: 500;\n  letter-spacing: 0.01em;\n}\n\n.tags-bar-empty {\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  opacity: 0.7;\n  flex: 1;\n}\n\n.tags-bar-edit {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 4px 10px;\n  background: transparent;\n  border: 1px dashed var(--test-border);\n  border-radius: 12px;\n  font-size: 11px;\n  font-weight: 500;\n  color: var(--test-text-secondary);\n  cursor: pointer;\n  transition: var(--test-transition);\n}\n\n.tags-bar-edit:hover {\n  border-color: var(--test-primary);\n  color: var(--test-primary);\n  background: rgba(37, 99, 235, 0.05);\n}\n\n.tags-bar-edit i {\n  font-size: 10px;\n}\n\n/* ===========================\n   Tags Editor Panel - Expanded Edit Mode\n   =========================== */\n.tags-editor-panel {\n  margin-top: 16px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-primary);\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.1);\n  max-width: 600px;\n}\n\n.tags-editor-header {\n  display: flex;\n  align-items: center;\n  padding: 12px 16px;\n  background: rgba(37, 99, 235, 0.08);\n  border-bottom: 1px solid rgba(37, 99, 235, 0.2);\n}\n\n.tags-editor-title {\n  font-size: 13px;\n  font-weight: 600;\n  color: var(--test-primary);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.tags-editor-body {\n  padding: 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.tags-editor-chips {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  min-height: 32px;\n}\n\n.tag-editable {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 5px 8px 5px 12px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-primary);\n  color: var(--test-primary);\n  border-radius: 14px;\n  font-size: 12px;\n  font-weight: 500;\n}\n\n.tag-remove-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  background: transparent;\n  border: none;\n  color: var(--test-primary);\n  cursor: pointer;\n  border-radius: 50%;\n  font-size: 9px;\n  opacity: 0.6;\n  transition: var(--test-transition);\n}\n\n.tag-remove-btn:hover {\n  opacity: 1;\n  background: var(--test-error-light);\n  color: var(--test-error);\n}\n\n.tags-empty-hint {\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  font-style: italic;\n  padding: 4px 0;\n}\n\n.tags-editor-input {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.tag-text-input {\n  flex: 1;\n  padding: 10px 14px;\n  border: 1px solid var(--test-border);\n  border-radius: 8px;\n  font-size: 13px;\n  background: var(--test-bg);\n}\n\n.tag-text-input:focus {\n  outline: none;\n  border-color: var(--test-primary);\n  background: var(--test-surface);\n  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);\n}\n\n.tag-text-input::placeholder {\n  color: var(--test-text-secondary);\n  opacity: 0.6;\n}\n\n.tags-editor-footer {\n  display: flex;\n  justify-content: flex-start;\n  gap: 8px;\n  padding: 12px 16px;\n  background: var(--test-bg);\n  border-top: 1px solid var(--test-border);\n}\n\n/* Mobile Responsive for Tags */\n@media (max-width: 768px) {\n  .tags-bar {\n    padding: 8px 12px;\n  }\n\n  .tags-bar-content {\n    gap: 8px;\n  }\n\n  .tag-inline {\n    padding: 3px 8px;\n    font-size: 10px;\n  }\n\n  .tags-editor-panel {\n    margin-top: 12px;\n  }\n\n  .tags-editor-body {\n    padding: 12px;\n  }\n\n  .tags-editor-footer {\n    padding: 10px 12px;\n  }\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-test-run-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"test-run-form\" [class.is-mobile]=\"false\">\n  <!-- Error State -->\n  @if (error) {\n    <div class=\"error-banner\" (click)=\"retryLoad()\">\n      <i class=\"fas fa-exclamation-triangle\"></i>\n      <span>{{ error }}</span>\n      <button class=\"retry-btn\">\n        <i class=\"fas fa-redo\"></i> Retry\n      </button>\n    </div>\n  }\n\n  <!-- Header Section -->\n  <div class=\"test-run-header\" [class]=\"getStatusClass()\">\n    <!-- Breadcrumb Navigation -->\n    <nav class=\"breadcrumb\" aria-label=\"Breadcrumb\">\n      <ol>\n        <li>\n          <a href=\"javascript:void(0)\" (click)=\"navigateToTestingDashboard()\">\n            <i class=\"fas fa-vial\"></i>\n            <span class=\"breadcrumb-text\">Testing</span>\n          </a>\n        </li>\n        @if (test) {\n          <li>\n            <i class=\"fas fa-chevron-right separator\"></i>\n            <a href=\"javascript:void(0)\" (click)=\"openTest()\">\n              <i class=\"fas fa-flask\"></i>\n              <span class=\"breadcrumb-text\">{{ test.Name }}</span>\n            </a>\n          </li>\n        }\n        <li class=\"current\">\n          <i class=\"fas fa-chevron-right separator\"></i>\n          <span>Run #{{ record.ID.substring(0, 8) }}</span>\n        </li>\n      </ol>\n    </nav>\n\n    <div class=\"header-content\">\n      <div class=\"header-left\">\n        <!-- Status Indicator -->\n        <div class=\"status-indicator\" [style.background-color]=\"getStatusColor()\">\n          <i class=\"fas\" [ngClass]=\"getStatusIcon()\"></i>\n        </div>\n\n        <div class=\"test-run-info\">\n          <h1>\n            Test Run\n            <span class=\"run-id\">#{{ record.ID.substring(0, 8) }}</span>\n          </h1>\n          <div class=\"test-run-meta\">\n            <span class=\"status-badge\" [style.background-color]=\"getStatusColor()\">\n              {{ record.Status }}\n            </span>\n            @if (test) {\n              <span class=\"meta-item\">\n                <i class=\"fas fa-flask\"></i>\n                {{ test.Type }}\n              </span>\n            }\n            @if (autoRefreshEnabled) {\n              <span class=\"meta-item\">\n                <i class=\"fas fa-sync-alt fa-spin\"></i>\n                Auto-refreshing\n              </span>\n            }\n          </div>\n        </div>\n      </div>\n\n      <div class=\"header-actions\">\n        <button kendoButton (click)=\"reRunTest()\" [disabled]=\"!record.TestID\" title=\"Re-run this test (Cmd+Shift+R)\">\n          <i class=\"fas fa-redo\"></i>\n          <span class=\"btn-text\">Re-run</span>\n        </button>\n        <button kendoButton (click)=\"refresh()\" [disabled]=\"isRefreshing\" title=\"Refresh (Cmd+R)\">\n          <i class=\"fas fa-sync-alt\" [class.fa-spin]=\"isRefreshing\"></i>\n          <span class=\"btn-text\">Refresh</span>\n        </button>\n      </div>\n    </div>\n\n    <!-- Metrics Bar -->\n    <div class=\"metrics-bar\">\n      <div class=\"metric-card\">\n        <div class=\"metric-icon\">\n          <i class=\"fas fa-clock\"></i>\n        </div>\n        <div class=\"metric-content\">\n          <div class=\"metric-label\">Started</div>\n          <div class=\"metric-value\">{{ getRelativeTime(record.StartedAt) }}</div>\n          <div class=\"metric-detail\">{{ record.StartedAt | date:'short' }}</div>\n        </div>\n      </div>\n\n      <div class=\"metric-card\">\n        <div class=\"metric-icon\">\n          <i class=\"fas fa-stopwatch\"></i>\n        </div>\n        <div class=\"metric-content\">\n          <div class=\"metric-label\">Duration</div>\n          <div class=\"metric-value\">{{ calculateDuration() }}</div>\n        </div>\n      </div>\n\n      <div class=\"metric-card\">\n        <div class=\"metric-icon\">\n          <i class=\"fas fa-star\"></i>\n        </div>\n        <div class=\"metric-content\">\n          <div class=\"metric-label\">Score</div>\n          <div class=\"metric-value\">{{ formatScore(record.Score) }}</div>\n          @if (record.Score != null) {\n            <div class=\"metric-progress\">\n              <div class=\"progress-bar\" [style.width.%]=\"getScorePercentage()\" [style.background-color]=\"getStatusColor()\"></div>\n            </div>\n          }\n        </div>\n      </div>\n\n      <div class=\"metric-card\">\n        <div class=\"metric-icon\">\n          <i class=\"fas fa-check-double\"></i>\n        </div>\n        <div class=\"metric-content\">\n          <div class=\"metric-label\">Checks</div>\n          <div class=\"metric-value\">{{ record.PassedChecks }}/{{ record.TotalChecks }}</div>\n          @if (record.TotalChecks) {\n            <div class=\"metric-progress\">\n              <div class=\"progress-bar\" [style.width.%]=\"getPassRatePercentage()\" [style.background-color]=\"getStatusColor()\"></div>\n            </div>\n          }\n        </div>\n      </div>\n\n      <div class=\"metric-card\">\n        <div class=\"metric-icon\">\n          <i class=\"fas fa-dollar-sign\"></i>\n        </div>\n        <div class=\"metric-content\">\n          <div class=\"metric-label\">Cost</div>\n          <div class=\"metric-value\">{{ formatCost(record.CostUSD) }}</div>\n        </div>\n      </div>\n    </div>\n\n    <!-- Secondary Info -->\n    @if (record.RunByUser || testSuiteRun || record.TargetLogEntityID) {\n      <div class=\"secondary-info\">\n        @if (record.RunByUser) {\n          <span class=\"info-chip\">\n            <i class=\"fas fa-user\"></i>\n            {{ record.RunByUser }}\n          </span>\n        }\n        @if (testSuiteRun) {\n          <span class=\"info-chip clickable\" (click)=\"openTestSuiteRun()\">\n            <i class=\"fas fa-layer-group\"></i>\n            Part of Suite Run (Seq: {{ record.Sequence }})\n          </span>\n        }\n        <!-- Target Entity Link Pill -->\n        @if (record.TargetLogEntityID && record.TargetLogID) {\n          <mj-entity-link-pill\n            [entityName]=\"record.TargetLogEntity\"\n            [recordId]=\"record.TargetLogID\">\n          </mj-entity-link-pill>\n        }\n      </div>\n    }\n\n    <!-- Tags Section - Sleek inline design -->\n    @if (!editingTags) {\n      <div class=\"tags-bar\">\n        <div class=\"tags-bar-content\">\n          <span class=\"tags-bar-label\"><i class=\"fas fa-tags\"></i></span>\n          @if (tags.length > 0) {\n            <div class=\"tags-bar-chips\">\n              @for (tag of tags; track tag) {\n                <span class=\"tag-inline\">{{ tag }}</span>\n              }\n            </div>\n          }\n          @if (tags.length === 0) {\n            <span class=\"tags-bar-empty\">No tags</span>\n          }\n          <button class=\"tags-bar-edit\" (click)=\"startEditingTags()\" title=\"Edit tags\">\n            <i class=\"fas fa-plus\"></i> Add\n          </button>\n        </div>\n      </div>\n    }\n\n    <!-- Tags Editor - Expanded when editing -->\n    @if (editingTags) {\n      <div class=\"tags-editor-panel\">\n        <div class=\"tags-editor-header\">\n          <span class=\"tags-editor-title\"><i class=\"fas fa-tags\"></i> Edit Tags</span>\n        </div>\n        <div class=\"tags-editor-body\">\n          <div class=\"tags-editor-chips\">\n            @for (tag of tags; track tag) {\n              <span class=\"tag-editable\">\n                {{ tag }}\n                <button class=\"tag-remove-btn\" (click)=\"removeTag(tag)\" title=\"Remove tag\">\n                  <i class=\"fas fa-times\"></i>\n                </button>\n              </span>\n            }\n            @if (tags.length === 0) {\n              <span class=\"tags-empty-hint\">No tags yet</span>\n            }\n          </div>\n          <div class=\"tags-editor-input\">\n            <input type=\"text\"\n              [(ngModel)]=\"newTag\"\n              placeholder=\"Type a tag and press Enter...\"\n              (keyup.enter)=\"addTag()\"\n              class=\"tag-text-input\" />\n            <button kendoButton (click)=\"addTag()\" [disabled]=\"!newTag.trim()\" fillMode=\"flat\">\n              <i class=\"fas fa-plus\"></i>\n            </button>\n          </div>\n        </div>\n        <div class=\"tags-editor-footer\">\n          <button kendoButton (click)=\"saveTags()\" themeColor=\"primary\" [disabled]=\"savingTags\">\n            @if (savingTags) {\n              <i class=\"fas fa-spinner fa-spin\"></i>\n            }\n            {{ savingTags ? 'Saving...' : 'Save' }}\n          </button>\n          <button kendoButton (click)=\"cancelEditingTags()\" fillMode=\"flat\">Cancel</button>\n        </div>\n      </div>\n    }\n  </div>\n\n  <!-- Tabs -->\n  <div class=\"tabs-container\">\n    <div class=\"tabs\" role=\"tablist\">\n      <button class=\"tab\" [class.active]=\"activeTab === 'overview'\" (click)=\"changeTab('overview')\"\n        role=\"tab\" [attr.aria-selected]=\"activeTab === 'overview'\" title=\"Press 1\">\n        <i class=\"fas fa-chart-pie\"></i>\n        <span>Overview</span>\n      </button>\n      <button class=\"tab\" [class.active]=\"activeTab === 'details'\" (click)=\"changeTab('details')\"\n        role=\"tab\" [attr.aria-selected]=\"activeTab === 'details'\" title=\"Press 2\">\n        <i class=\"fas fa-info-circle\"></i>\n        <span>Details</span>\n      </button>\n      <button class=\"tab\" [class.active]=\"activeTab === 'ai-runs'\" (click)=\"changeTab('ai-runs')\"\n        role=\"tab\" [attr.aria-selected]=\"activeTab === 'ai-runs'\" title=\"Press 3\">\n        <i class=\"fas fa-robot\"></i>\n        <span>AI Runs</span>\n        @if (aiRunsLoaded) {\n          <span class=\"tab-badge\">{{ aiAgentRuns.length + aiPromptRuns.length }}</span>\n        }\n      </button>\n      <button class=\"tab\" [class.active]=\"activeTab === 'feedback'\" (click)=\"changeTab('feedback')\"\n        role=\"tab\" [attr.aria-selected]=\"activeTab === 'feedback'\" title=\"Press 4\">\n        <i class=\"fas fa-comments\"></i>\n        <span>Feedback</span>\n        @if (feedbackLoaded) {\n          <span class=\"tab-badge\">{{ feedbacks.length }}</span>\n        }\n      </button>\n      <button class=\"tab\" [class.active]=\"activeTab === 'execution'\" (click)=\"changeTab('execution')\"\n        role=\"tab\" [attr.aria-selected]=\"activeTab === 'execution'\" title=\"Press 5\">\n        <i class=\"fas fa-microchip\"></i>\n        <span>Execution</span>\n      </button>\n      @if (record.Log) {\n        <button class=\"tab\" [class.active]=\"activeTab === 'log'\" (click)=\"changeTab('log')\"\n          role=\"tab\" [attr.aria-selected]=\"activeTab === 'log'\" title=\"Press 6\">\n          <i class=\"fas fa-terminal\"></i>\n          <span>Log</span>\n        </button>\n      }\n    </div>\n  </div>\n\n  <!-- Tab Content -->\n  <div class=\"tab-content\">\n    <!-- Overview Tab -->\n    @if (activeTab === 'overview') {\n      <div class=\"overview-tab\" [@fadeIn]>\n        <!-- Result Hero -->\n        <div class=\"result-hero\" [class]=\"getStatusClass()\">\n          <div class=\"result-icon-wrapper\">\n            <div class=\"result-icon\">\n              <i class=\"fas\" [ngClass]=\"getStatusIcon()\"></i>\n            </div>\n            @if (record.Status === 'Running') {\n              <div class=\"result-pulse\"></div>\n            }\n          </div>\n          <div class=\"result-text\">\n            <h2>TEST {{ record.Status.toUpperCase() }}</h2>\n            <div class=\"result-details\">\n              <span class=\"result-score\">Score: {{ formatScore(record.Score) }}</span>\n              <span class=\"result-divider\">|</span>\n              <span class=\"result-checks\">{{ record.PassedChecks }} of {{ record.TotalChecks }} checks passed</span>\n            </div>\n          </div>\n        </div>\n        <!-- Check Results -->\n        @if (getCheckResults().length > 0) {\n          <div class=\"check-results\">\n            <div class=\"section-header\">\n              <h3><i class=\"fas fa-tasks\"></i> Check Results</h3>\n              <span class=\"check-summary\">{{ record.PassedChecks }} passed, {{ record.FailedChecks }} failed</span>\n            </div>\n            <div class=\"check-list\">\n              @for (check of getCheckResults(); track check; let i = $index) {\n                <div class=\"check-item\"\n                  [class.passed]=\"check.passed\" [class.failed]=\"!check.passed\"\n                  [style.animation-delay.ms]=\"i * 50\">\n                  <div class=\"check-status\">\n                    <i class=\"fas\" [class.fa-check-circle]=\"check.passed\" [class.fa-times-circle]=\"!check.passed\"></i>\n                  </div>\n                  <div class=\"check-content\">\n                    <div class=\"check-name\">{{ check.name }}</div>\n                    @if (check.message) {\n                      <div class=\"check-message\">{{ check.message }}</div>\n                    }\n                  </div>\n                  @if (check.weight) {\n                    <div class=\"check-weight\">\n                      <span class=\"weight-label\">Weight:</span> {{ check.weight }}\n                    </div>\n                  }\n                </div>\n              }\n            </div>\n          </div>\n        }\n        <!-- Data Comparison -->\n        <div class=\"comparison-section\">\n          <div class=\"section-header\">\n            <h3><i class=\"fas fa-exchange-alt\"></i> Data Comparison</h3>\n          </div>\n          <div class=\"comparison-tabs\">\n            <button class=\"comparison-tab\" [class.active]=\"comparisonView === 'input'\" (click)=\"setComparisonView('input')\">\n              <i class=\"fas fa-sign-in-alt\"></i> Input\n            </button>\n            <button class=\"comparison-tab\" [class.active]=\"comparisonView === 'expected'\" (click)=\"setComparisonView('expected')\">\n              <i class=\"fas fa-bullseye\"></i> Expected\n            </button>\n            <button class=\"comparison-tab\" [class.active]=\"comparisonView === 'actual'\" (click)=\"setComparisonView('actual')\">\n              <i class=\"fas fa-check-square\"></i> Actual\n            </button>\n          </div>\n          <div class=\"comparison-content\">\n            <mj-code-editor\n              [value]=\"getComparisonData()\"\n              language=\"json\"\n              [readonly]=\"true\"\n              [toolbar]=\"jsonToolbar\"\n              [lineWrapping]=\"true\">\n            </mj-code-editor>\n          </div>\n        </div>\n      </div>\n    }\n\n    <!-- Details Tab -->\n    @if (activeTab === 'details') {\n      <div class=\"details-tab\" [@fadeIn]>\n        <div class=\"details-grid\">\n          <div class=\"detail-card\">\n            <div class=\"detail-icon\"><i class=\"fas fa-fingerprint\"></i></div>\n            <div class=\"detail-content\">\n              <div class=\"detail-label\">Test Run ID</div>\n              <div class=\"detail-value monospace\">{{ record.ID }}</div>\n            </div>\n          </div>\n          @if (test) {\n            <div class=\"detail-card clickable\" (click)=\"openTest()\">\n              <div class=\"detail-icon\"><i class=\"fas fa-flask\"></i></div>\n              <div class=\"detail-content\">\n                <div class=\"detail-label\">Test</div>\n                <div class=\"detail-value link\">{{ test.Name }}</div>\n              </div>\n              <i class=\"fas fa-external-link-alt detail-action\"></i>\n            </div>\n          }\n          <div class=\"detail-card\">\n            <div class=\"detail-icon\"><i class=\"fas fa-tag\"></i></div>\n            <div class=\"detail-content\">\n              <div class=\"detail-label\">Target Type</div>\n              <div class=\"detail-value\">{{ record.TargetType || 'N/A' }}</div>\n            </div>\n          </div>\n          <div class=\"detail-card\">\n            <div class=\"detail-icon\"><i class=\"fas fa-play-circle\"></i></div>\n            <div class=\"detail-content\">\n              <div class=\"detail-label\">Started At</div>\n              <div class=\"detail-value\">{{ record.StartedAt | date:'medium' }}</div>\n            </div>\n          </div>\n          <div class=\"detail-card\">\n            <div class=\"detail-icon\"><i class=\"fas fa-stop-circle\"></i></div>\n            <div class=\"detail-content\">\n              <div class=\"detail-label\">Completed At</div>\n              <div class=\"detail-value\">{{ record.CompletedAt | date:'medium' }}</div>\n            </div>\n          </div>\n          <div class=\"detail-card\">\n            <div class=\"detail-icon\"><i class=\"fas fa-hourglass-half\"></i></div>\n            <div class=\"detail-content\">\n              <div class=\"detail-label\">Duration</div>\n              <div class=\"detail-value\">{{ calculateDuration() }}</div>\n            </div>\n          </div>\n        </div>\n        <!-- Error Message -->\n        @if (record.ErrorMessage) {\n          <div class=\"error-section\">\n            <div class=\"section-header error\">\n              <h3><i class=\"fas fa-exclamation-triangle\"></i> Error Message</h3>\n            </div>\n            <div class=\"error-content\">\n              <mj-code-editor\n                [value]=\"record.ErrorMessage\"\n                [readonly]=\"true\"\n                [toolbar]=\"jsonToolbar\"\n                [lineWrapping]=\"true\">\n              </mj-code-editor>\n            </div>\n          </div>\n        }\n        <!-- Result Details -->\n        @if (parsedData.resultDetails) {\n          <div class=\"result-details-section\">\n            <div class=\"section-header\">\n              <h3><i class=\"fas fa-file-code\"></i> Result Details</h3>\n            </div>\n            <div class=\"result-details-content\">\n              <mj-code-editor\n                [value]=\"getFormattedResultDetails()\"\n                language=\"json\"\n                [readonly]=\"true\"\n                [toolbar]=\"jsonToolbar\"\n                [lineWrapping]=\"true\">\n              </mj-code-editor>\n            </div>\n          </div>\n        }\n      </div>\n    }\n\n    <!-- AI Runs Tab -->\n    @if (activeTab === 'ai-runs') {\n      <div class=\"ai-runs-tab\" [@fadeIn]>\n        <!-- Loading State -->\n        @if (loadingAIRuns) {\n          <div class=\"loading-state\">\n            <div class=\"skeleton-list\">\n              @for (i of [1,2,3]; track i) {\n                <div class=\"skeleton-card\">\n                  <div class=\"skeleton-icon\"></div>\n                  <div class=\"skeleton-content\">\n                    <div class=\"skeleton-line wide\"></div>\n                    <div class=\"skeleton-line narrow\"></div>\n                  </div>\n                </div>\n              }\n            </div>\n          </div>\n        }\n        <!-- AI Agent Runs -->\n        @if (!loadingAIRuns && aiAgentRuns.length > 0) {\n          <div class=\"ai-section\">\n            <div class=\"section-header\">\n              <h3><i class=\"fas fa-robot\"></i> AI Agent Runs</h3>\n              <span class=\"count-badge\">{{ aiAgentRuns.length }}</span>\n            </div>\n            <div class=\"ai-run-list\">\n              @for (run of aiAgentRuns; track run) {\n                <div class=\"ai-run-card\" (click)=\"openAIAgentRun(run.ID)\">\n                  <div class=\"ai-run-icon agent\">\n                    <i class=\"fas fa-robot\"></i>\n                  </div>\n                  <div class=\"ai-run-content\">\n                    <div class=\"ai-run-name\">{{ run.Agent }}</div>\n                    <div class=\"ai-run-meta\">\n                      <span class=\"status-chip\" [class]=\"run.Status.toLowerCase()\">{{ run.Status }}</span>\n                      @if (run.TotalCost) {\n                        <span class=\"cost-chip\">\n                          <i class=\"fas fa-dollar-sign\"></i> {{ run.TotalCost | number:'1.4-4' }}\n                        </span>\n                      }\n                    </div>\n                  </div>\n                  <i class=\"fas fa-chevron-right ai-run-arrow\"></i>\n                </div>\n              }\n            </div>\n          </div>\n        }\n        <!-- AI Prompt Runs -->\n        @if (!loadingAIRuns && aiPromptRuns.length > 0) {\n          <div class=\"ai-section\">\n            <div class=\"section-header\">\n              <h3><i class=\"fas fa-comment-dots\"></i> AI Prompt Runs</h3>\n              <span class=\"count-badge\">{{ aiPromptRuns.length }}</span>\n            </div>\n            <div class=\"ai-run-list\">\n              @for (run of aiPromptRuns; track run) {\n                <div class=\"ai-run-card\" (click)=\"openAIPromptRun(run.ID)\">\n                  <div class=\"ai-run-icon prompt\">\n                    <i class=\"fas fa-comment-dots\"></i>\n                  </div>\n                  <div class=\"ai-run-content\">\n                    <div class=\"ai-run-name\">{{ run.Prompt || run.Model }}</div>\n                    <div class=\"ai-run-meta\">\n                      @if (run.TotalCost) {\n                        <span class=\"cost-chip\">\n                          <i class=\"fas fa-dollar-sign\"></i> {{ run.TotalCost | number:'1.4-4' }}\n                        </span>\n                      }\n                    </div>\n                  </div>\n                  <i class=\"fas fa-chevron-right ai-run-arrow\"></i>\n                </div>\n              }\n            </div>\n          </div>\n        }\n        <!-- Empty State -->\n        @if (aiRunsLoaded && aiAgentRuns.length === 0 && aiPromptRuns.length === 0) {\n          <div class=\"empty-state\">\n            <div class=\"empty-icon\">\n              <i class=\"fas fa-robot\"></i>\n            </div>\n            <h3>No AI Runs</h3>\n            <p>This test execution didn't involve any AI agent or prompt runs.</p>\n          </div>\n        }\n      </div>\n    }\n\n    <!-- Feedback Tab -->\n    @if (activeTab === 'feedback') {\n      <div class=\"feedback-tab\" [@fadeIn]>\n        <!-- Loading State -->\n        @if (loadingFeedback) {\n          <div class=\"loading-state\">\n            <div class=\"skeleton-list\">\n              @for (i of [1,2]; track i) {\n                <div class=\"skeleton-card\">\n                  <div class=\"skeleton-avatar\"></div>\n                  <div class=\"skeleton-content\">\n                    <div class=\"skeleton-line wide\"></div>\n                    <div class=\"skeleton-line narrow\"></div>\n                    <div class=\"skeleton-line medium\"></div>\n                  </div>\n                </div>\n              }\n            </div>\n          </div>\n        }\n        <!-- Feedback List -->\n        @if (!loadingFeedback && feedbacks.length > 0) {\n          <div class=\"feedback-list\">\n            @for (feedback of feedbacks; track feedback) {\n              <div class=\"feedback-item\">\n                <div class=\"feedback-header\">\n                  <div class=\"feedback-user\">\n                    <div class=\"user-avatar\">\n                      <i class=\"fas fa-user\"></i>\n                    </div>\n                    <span class=\"user-name\">{{ feedback.ReviewerUser }}</span>\n                  </div>\n                  <div class=\"feedback-date\">\n                    {{ getRelativeTime(feedback.__mj_CreatedAt) }}\n                  </div>\n                </div>\n                <div class=\"feedback-body\">\n                  <div class=\"feedback-rating\">\n                    <div class=\"rating-stars\">\n                      @for (s of [1,2,3,4,5,6,7,8,9,10]; track s) {\n                        <i class=\"fas fa-star\"\n                        [class.filled]=\"s <= (feedback.Rating || 0)\"></i>\n                      }\n                    </div>\n                    <span class=\"rating-value\">{{ feedback.Rating }}/10</span>\n                  </div>\n                  @if (feedback.IsCorrect !== null) {\n                    <div class=\"feedback-verdict\">\n                      <span class=\"verdict-badge\" [class.correct]=\"feedback.IsCorrect\" [class.incorrect]=\"!feedback.IsCorrect\">\n                        <i class=\"fas\" [class.fa-check]=\"feedback.IsCorrect\" [class.fa-times]=\"!feedback.IsCorrect\"></i>\n                        {{ feedback.IsCorrect ? 'Marked Correct' : 'Marked Incorrect' }}\n                      </span>\n                    </div>\n                  }\n                  @if (feedback.CorrectionSummary) {\n                    <div class=\"feedback-comments\">\n                      <p>{{ feedback.CorrectionSummary }}</p>\n                    </div>\n                  }\n                </div>\n              </div>\n            }\n          </div>\n        }\n        <!-- Empty State -->\n        @if (feedbackLoaded && feedbacks.length === 0) {\n          <div class=\"empty-state\">\n            <div class=\"empty-icon\">\n              <i class=\"fas fa-comments\"></i>\n            </div>\n            <h3>No Feedback Yet</h3>\n            <p>No one has reviewed this test run yet. Be the first to provide feedback!</p>\n          </div>\n        }\n      </div>\n    }\n\n    <!-- Execution Context Tab -->\n    @if (activeTab === 'execution') {\n      <div class=\"execution-tab\" [@fadeIn]>\n        <mj-execution-context\n          [machineName]=\"record.MachineName\"\n          [machineId]=\"record.MachineID\"\n          [runByUserName]=\"record.RunByUserName\"\n          [runByUserEmail]=\"record.RunByUserEmail\"\n          [runContextDetailsJson]=\"record.RunContextDetails\">\n        </mj-execution-context>\n      </div>\n    }\n\n    <!-- Execution Log Tab -->\n    @if (activeTab === 'log') {\n      <div class=\"log-tab\" [@fadeIn]>\n        <div class=\"log-header\">\n          <div class=\"log-title\">\n            <i class=\"fas fa-terminal\"></i>\n            <h3>Execution Log</h3>\n          </div>\n          <div class=\"log-actions\">\n            <button kendoButton (click)=\"copyLogToClipboard()\" look=\"flat\">\n              <i class=\"fas fa-copy\"></i>\n              <span class=\"btn-text\">Copy</span>\n            </button>\n          </div>\n        </div>\n        <div class=\"log-container\">\n          <mj-code-editor\n            [value]=\"record.Log || ''\"\n            [readonly]=\"true\"\n            [toolbar]=\"jsonToolbar\"\n            [lineWrapping]=\"true\">\n          </mj-code-editor>\n        </div>\n      </div>\n    }\n  </div>\n\n  <!-- Keyboard Shortcuts Help (shown on hover of ? icon) -->\n  <div class=\"shortcuts-hint\" title=\"Keyboard Shortcuts\">\n    <i class=\"fas fa-keyboard\"></i>\n    <div class=\"shortcuts-popup\">\n      <h4>Keyboard Shortcuts</h4>\n      <ul>\n        <li><kbd>1-6</kbd> Switch tabs</li>\n        <li><kbd>Cmd+R</kbd> Refresh</li>\n        <li><kbd>Cmd+Shift+R</kbd> Re-run test</li>\n      </ul>\n    </div>\n  </div>\n</div>\n", styles: ["/* ===========================\n   Test Run Form - World-Class UX\n   Premium Testing Dashboard Styles\n   =========================== */\n\n/* CSS Custom Properties for Theming - using :host for Angular encapsulation */\n:host {\n  --test-primary: #2563eb;\n  --test-primary-light: #3b82f6;\n  --test-primary-dark: #1d4ed8;\n  --test-success: #10b981;\n  --test-success-light: #d1fae5;\n  --test-error: #ef4444;\n  --test-error-light: #fee2e2;\n  --test-warning: #f59e0b;\n  --test-warning-light: #fef3c7;\n  --test-timeout: #f97316;\n  --test-timeout-light: #ffedd5;\n  --test-running: #3b82f6;\n  --test-pending: #8b5cf6;\n  --test-skipped: #6b7280;\n  --test-bg: #f8fafc;\n  --test-surface: #ffffff;\n  --test-border: #e2e8f0;\n  --test-text: #1e293b;\n  --test-text-secondary: #64748b;\n  --test-text-muted: #94a3b8;\n  --test-radius-sm: 6px;\n  --test-radius-md: 10px;\n  --test-radius-lg: 16px;\n  --test-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);\n  --test-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  --test-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n  --test-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  display: block;\n  height: 100%;\n}\n\n/* Base Container */\n.test-run-form {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  background: var(--test-bg);\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n/* ===========================\n   Error Banner\n   =========================== */\n.error-banner {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  padding: 12px 20px;\n  background: linear-gradient(135deg, var(--test-error) 0%, #dc2626 100%);\n  color: white;\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: var(--test-transition);\n  animation: slideDown 0.3s ease-out;\n}\n\n.error-banner:hover {\n  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);\n}\n\n.error-banner i {\n  font-size: 16px;\n}\n\n.retry-btn {\n  background: rgba(255, 255, 255, 0.2);\n  border: 1px solid rgba(255, 255, 255, 0.3);\n  color: white;\n  padding: 6px 12px;\n  border-radius: var(--test-radius-sm);\n  cursor: pointer;\n  font-size: 12px;\n  font-weight: 600;\n  transition: var(--test-transition);\n}\n\n.retry-btn:hover {\n  background: rgba(255, 255, 255, 0.3);\n}\n\n@keyframes slideDown {\n  from {\n    transform: translateY(-100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}\n\n/* ===========================\n   Header Section\n   =========================== */\n.test-run-header {\n  background: var(--test-surface);\n  border-bottom: 1px solid var(--test-border);\n  padding: 20px;\n  position: relative;\n}\n\n/* Breadcrumb */\n.breadcrumb {\n  margin-bottom: 16px;\n}\n\n.breadcrumb ol {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  font-size: 13px;\n  flex-wrap: wrap;\n}\n\n.breadcrumb li {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.breadcrumb a {\n  color: var(--test-primary);\n  text-decoration: none;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 8px;\n  border-radius: var(--test-radius-sm);\n  transition: var(--test-transition);\n}\n\n.breadcrumb a:hover {\n  background: rgba(37, 99, 235, 0.1);\n  text-decoration: none;\n}\n\n.breadcrumb .separator {\n  font-size: 10px;\n  color: var(--test-text-muted);\n  margin: 0 4px;\n}\n\n.breadcrumb .current {\n  color: var(--test-text-secondary);\n  font-weight: 500;\n}\n\n.breadcrumb-text {\n  max-width: 200px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* Header Content */\n.header-content {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 20px;\n  gap: 16px;\n}\n\n.header-left {\n  display: flex;\n  gap: 16px;\n  flex: 1;\n  min-width: 0;\n}\n\n/* Status Indicator */\n.status-indicator {\n  width: 56px;\n  height: 56px;\n  border-radius: var(--test-radius-md);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: white;\n  font-size: 24px;\n  flex-shrink: 0;\n  box-shadow: var(--test-shadow-md);\n  transition: var(--test-transition);\n}\n\n.status-indicator:hover {\n  transform: scale(1.05);\n}\n\n/* Test Run Info */\n.test-run-info {\n  flex: 1;\n  min-width: 0;\n}\n\n.test-run-info h1 {\n  margin: 0 0 8px 0;\n  font-size: clamp(18px, 4vw, 24px);\n  font-weight: 700;\n  color: var(--test-text);\n  line-height: 1.2;\n  word-wrap: break-word;\n}\n\n.test-run-info h1 .run-id {\n  color: var(--test-text-secondary);\n  font-weight: 500;\n}\n\n.test-run-meta {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n/* Status Badge */\n.status-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 14px;\n  border-radius: 20px;\n  color: white;\n  font-size: 12px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n/* Meta Item */\n.meta-item {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 14px;\n  color: var(--test-text-secondary);\n}\n\n.meta-item i {\n  font-size: 12px;\n}\n\n/* Header Actions */\n.header-actions {\n  display: flex;\n  gap: 8px;\n  flex-shrink: 0;\n}\n\n.header-actions button {\n  white-space: nowrap;\n}\n\n.btn-text {\n  margin-left: 6px;\n}\n\n/* ===========================\n   Metrics Bar\n   =========================== */\n.metrics-bar {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));\n  gap: 12px;\n  margin-bottom: 16px;\n}\n\n.metric-card {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  padding: 14px;\n  transition: var(--test-transition);\n}\n\n.metric-card:hover {\n  transform: translateY(-2px);\n  box-shadow: var(--test-shadow-md);\n}\n\n.metric-icon {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-sm);\n  color: var(--test-primary);\n  font-size: 16px;\n  flex-shrink: 0;\n}\n\n.metric-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.metric-label {\n  font-size: 10px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  color: var(--test-text-muted);\n  margin-bottom: 4px;\n}\n\n.metric-value {\n  font-size: 16px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.metric-detail {\n  font-size: 11px;\n  color: var(--test-text-muted);\n  margin-top: 2px;\n}\n\n/* Progress bar in metric card */\n.metric-progress {\n  margin-top: 6px;\n  height: 4px;\n  background: var(--test-border);\n  border-radius: 2px;\n  overflow: hidden;\n}\n\n.progress-bar {\n  height: 100%;\n  border-radius: 2px;\n  transition: width 0.5s ease-out;\n}\n\n/* Secondary Info */\n.secondary-info {\n  display: flex;\n  gap: 12px;\n  padding-top: 16px;\n  border-top: 1px solid var(--test-border);\n  flex-wrap: wrap;\n}\n\n.info-chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 13px;\n  color: var(--test-text-secondary);\n  padding: 6px 12px;\n  background: var(--test-bg);\n  border-radius: 20px;\n  transition: var(--test-transition);\n}\n\n.info-chip i {\n  font-size: 12px;\n}\n\n.info-chip.clickable {\n  cursor: pointer;\n}\n\n.info-chip.clickable:hover {\n  background: rgba(37, 99, 235, 0.1);\n  color: var(--test-primary);\n}\n\n/* ===========================\n   Tabs Navigation\n   =========================== */\n.tabs-container {\n  background: var(--test-surface);\n  border-bottom: 1px solid var(--test-border);\n  position: sticky;\n  top: 0;\n  z-index: 10;\n}\n\n.tabs {\n  display: flex;\n  padding: 0 20px;\n  overflow-x: auto;\n  -webkit-overflow-scrolling: touch;\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n\n.tabs::-webkit-scrollbar {\n  display: none;\n}\n\n.tab {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 14px 18px;\n  border: none;\n  background: transparent;\n  border-bottom: 3px solid transparent;\n  color: var(--test-text-secondary);\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: var(--test-transition);\n  white-space: nowrap;\n  position: relative;\n}\n\n.tab:hover {\n  color: var(--test-primary);\n  background: rgba(37, 99, 235, 0.05);\n}\n\n.tab.active {\n  color: var(--test-primary);\n  border-bottom-color: var(--test-primary);\n  font-weight: 600;\n}\n\n.tab i {\n  font-size: 15px;\n}\n\n.tab-badge {\n  background: var(--test-border);\n  color: var(--test-text-secondary);\n  padding: 2px 8px;\n  border-radius: 10px;\n  font-size: 11px;\n  font-weight: 600;\n  transition: var(--test-transition);\n}\n\n.tab.active .tab-badge {\n  background: rgba(37, 99, 235, 0.15);\n  color: var(--test-primary);\n}\n\n.shortcut-hint {\n  font-size: 10px;\n  color: var(--test-text-muted);\n  background: var(--test-bg);\n  padding: 2px 6px;\n  border-radius: 4px;\n  font-weight: 600;\n  margin-left: 4px;\n  font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n}\n\n/* ===========================\n   Tab Content Area\n   =========================== */\n.tab-content {\n  flex: 1;\n  overflow-y: auto;\n  padding: 20px;\n  scroll-behavior: smooth;\n}\n\n/* ===========================\n   Overview Tab\n   =========================== */\n.overview-tab {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: fadeIn 0.3s ease-out;\n}\n\n@keyframes fadeIn {\n  from { opacity: 0; transform: translateY(10px); }\n  to { opacity: 1; transform: translateY(0); }\n}\n\n/* Result Hero Card */\n.result-hero {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 32px;\n  text-align: center;\n  border: 2px solid var(--test-border);\n  box-shadow: var(--test-shadow-sm);\n  transition: var(--test-transition);\n}\n\n.result-hero.passed {\n  background: linear-gradient(135deg, #ecfdf5 0%, var(--test-success-light) 100%);\n  border-color: var(--test-success);\n}\n\n.result-hero.failed {\n  background: linear-gradient(135deg, #fef2f2 0%, var(--test-error-light) 100%);\n  border-color: var(--test-error);\n}\n\n.result-hero.error {\n  background: linear-gradient(135deg, #fffbeb 0%, var(--test-warning-light) 100%);\n  border-color: var(--test-warning);\n}\n\n.result-hero.timeout {\n  background: linear-gradient(135deg, #fff7ed 0%, var(--test-timeout-light) 100%);\n  border-color: var(--test-timeout);\n}\n\n.result-hero.running,\n.result-hero.pending {\n  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);\n  border-color: var(--test-primary-light);\n}\n\n.result-icon-wrapper {\n  position: relative;\n  display: inline-block;\n  margin-bottom: 16px;\n}\n\n.result-icon {\n  width: 80px;\n  height: 80px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border-radius: 50%;\n  font-size: 40px;\n  margin: 0 auto;\n  box-shadow: var(--test-shadow-md);\n}\n\n.result-hero.passed .result-icon { color: var(--test-success); }\n.result-hero.failed .result-icon { color: var(--test-error); }\n.result-hero.error .result-icon { color: var(--test-warning); }\n.result-hero.timeout .result-icon { color: var(--test-timeout); }\n.result-hero.running .result-icon,\n.result-hero.pending .result-icon { color: var(--test-primary); }\n\n.result-pulse {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 100px;\n  height: 100px;\n  border-radius: 50%;\n  background: rgba(59, 130, 246, 0.2);\n  animation: pulse 2s ease-in-out infinite;\n}\n\n@keyframes pulse {\n  0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.5; }\n  50% { transform: translate(-50%, -50%) scale(1.2); opacity: 0; }\n}\n\n.result-text h2 {\n  margin: 0 0 12px 0;\n  font-size: clamp(24px, 5vw, 32px);\n  font-weight: 800;\n  color: var(--test-text);\n}\n\n.result-details {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n.result-score {\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--test-text-secondary);\n}\n\n.result-divider {\n  color: var(--test-border);\n}\n\n.result-checks {\n  font-size: 16px;\n  color: var(--test-text-muted);\n}\n\n/* Section Headers */\n.section-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 16px;\n  gap: 12px;\n}\n\n.section-header h3 {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 700;\n  color: var(--test-text);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.section-header h3 i {\n  color: var(--test-primary);\n}\n\n.section-header.error h3 i {\n  color: var(--test-error);\n}\n\n.check-summary {\n  font-size: 13px;\n  color: var(--test-text-secondary);\n}\n\n/* Check Results Section */\n.check-results {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.check-list {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.check-item {\n  display: flex;\n  gap: 12px;\n  padding: 14px 16px;\n  border-radius: var(--test-radius-md);\n  border: 1px solid var(--test-border);\n  transition: var(--test-transition);\n  animation: fadeIn 0.3s ease-out backwards;\n}\n\n.check-item:hover {\n  transform: translateX(4px);\n}\n\n.check-item.passed {\n  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);\n  border-color: #86efac;\n}\n\n.check-item.failed {\n  background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);\n  border-color: #fca5a5;\n}\n\n.check-status {\n  font-size: 20px;\n  flex-shrink: 0;\n  margin-top: 2px;\n}\n\n.check-item.passed .check-status { color: var(--test-success); }\n.check-item.failed .check-status { color: var(--test-error); }\n\n.check-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.check-name {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n  margin-bottom: 4px;\n}\n\n.check-message {\n  font-size: 13px;\n  color: var(--test-text-secondary);\n  line-height: 1.5;\n  word-wrap: break-word;\n}\n\n.check-weight {\n  font-size: 12px;\n  color: var(--test-text-muted);\n  flex-shrink: 0;\n  text-align: right;\n}\n\n.weight-label {\n  font-weight: 500;\n}\n\n/* Comparison Section */\n.comparison-section {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.comparison-tabs {\n  display: flex;\n  gap: 4px;\n  margin-bottom: 16px;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  padding: 4px;\n}\n\n.comparison-tab {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  padding: 10px 16px;\n  border: none;\n  background: transparent;\n  color: var(--test-text-secondary);\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  border-radius: var(--test-radius-sm);\n  transition: var(--test-transition);\n}\n\n.comparison-tab:hover {\n  color: var(--test-text);\n  background: rgba(0, 0, 0, 0.05);\n}\n\n.comparison-tab.active {\n  background: var(--test-surface);\n  color: var(--test-primary);\n  font-weight: 600;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.comparison-content {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid var(--test-border);\n}\n\n/* ===========================\n   Details Tab\n   =========================== */\n.details-tab {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: fadeIn 0.3s ease-out;\n}\n\n.details-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n  gap: 12px;\n}\n\n.detail-card {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  transition: var(--test-transition);\n}\n\n.detail-card.clickable {\n  cursor: pointer;\n}\n\n.detail-card.clickable:hover {\n  background: rgba(37, 99, 235, 0.05);\n  border-color: var(--test-primary-light);\n  transform: translateX(4px);\n}\n\n.detail-icon {\n  width: 44px;\n  height: 44px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  color: var(--test-primary);\n  font-size: 18px;\n  flex-shrink: 0;\n}\n\n.detail-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.detail-label {\n  font-size: 11px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  color: var(--test-text-muted);\n  margin-bottom: 4px;\n}\n\n.detail-value {\n  font-size: 14px;\n  color: var(--test-text);\n  word-wrap: break-word;\n  font-weight: 500;\n}\n\n.detail-value.monospace {\n  font-family: 'SF Mono', Monaco, 'Courier New', monospace;\n  font-size: 12px;\n}\n\n.detail-value.link {\n  color: var(--test-primary);\n}\n\n.detail-action {\n  color: var(--test-text-muted);\n  font-size: 12px;\n  transition: var(--test-transition);\n}\n\n.detail-card.clickable:hover .detail-action {\n  color: var(--test-primary);\n}\n\n/* Error Section */\n.error-section {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.error-content {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid #fca5a5;\n}\n\n/* Result Details Section */\n.result-details-section {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.result-details-content {\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  border: 1px solid var(--test-border);\n}\n\n/* ===========================\n   AI Runs Tab\n   =========================== */\n.ai-runs-tab {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  animation: fadeIn 0.3s ease-out;\n}\n\n.ai-section {\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  padding: 24px;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.count-badge {\n  background: var(--test-bg);\n  color: var(--test-text-secondary);\n  padding: 4px 10px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n.ai-run-list {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.ai-run-card {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-bg);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  cursor: pointer;\n  transition: var(--test-transition);\n}\n\n.ai-run-card:hover {\n  background: rgba(37, 99, 235, 0.05);\n  border-color: var(--test-primary-light);\n  transform: translateX(4px);\n  box-shadow: var(--test-shadow-sm);\n}\n\n.ai-run-icon {\n  width: 44px;\n  height: 44px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: linear-gradient(135deg, var(--test-primary) 0%, var(--test-primary-dark) 100%);\n  color: white;\n  border-radius: var(--test-radius-md);\n  font-size: 18px;\n  flex-shrink: 0;\n  box-shadow: var(--test-shadow-sm);\n}\n\n.ai-run-icon.agent {\n  background: linear-gradient(135deg, var(--test-primary) 0%, var(--test-primary-dark) 100%);\n}\n\n.ai-run-icon.prompt {\n  background: linear-gradient(135deg, #9333ea 0%, #7c3aed 100%);\n}\n\n.ai-run-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.ai-run-name {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n  margin-bottom: 6px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.ai-run-meta {\n  display: flex;\n  gap: 10px;\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  flex-wrap: wrap;\n}\n\n.status-chip {\n  display: inline-flex;\n  align-items: center;\n  padding: 2px 8px;\n  border-radius: 10px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n}\n\n.status-chip.complete,\n.status-chip.completed,\n.status-chip.passed {\n  background: var(--test-success-light);\n  color: #059669;\n}\n\n.status-chip.failed,\n.status-chip.error {\n  background: var(--test-error-light);\n  color: #dc2626;\n}\n\n.status-chip.running {\n  background: #dbeafe;\n  color: var(--test-primary);\n}\n\n.cost-chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 2px;\n  color: var(--test-text-muted);\n}\n\n.ai-run-arrow {\n  color: var(--test-text-muted);\n  font-size: 14px;\n  transition: var(--test-transition);\n}\n\n.ai-run-card:hover .ai-run-arrow {\n  color: var(--test-primary);\n  transform: translateX(2px);\n}\n\n/* ===========================\n   Feedback Tab\n   =========================== */\n.feedback-tab {\n  animation: fadeIn 0.3s ease-out;\n}\n\n.feedback-list {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n.feedback-item {\n  padding: 20px;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n  border: 1px solid var(--test-border);\n  box-shadow: var(--test-shadow-sm);\n  transition: var(--test-transition);\n}\n\n.feedback-item:hover {\n  border-color: var(--test-primary-light);\n}\n\n.feedback-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 16px;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.feedback-user {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.user-avatar {\n  width: 36px;\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: 50%;\n  color: var(--test-primary);\n  font-size: 14px;\n}\n\n.user-name {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.feedback-date {\n  font-size: 12px;\n  color: var(--test-text-muted);\n}\n\n.feedback-body {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.feedback-rating {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.rating-stars {\n  display: flex;\n  gap: 2px;\n}\n\n.rating-stars i {\n  font-size: 14px;\n  color: var(--test-border);\n}\n\n.rating-stars i.filled {\n  color: #fbbf24;\n}\n\n.rating-value {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.feedback-verdict {\n  display: flex;\n}\n\n.verdict-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  border-radius: 20px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n.verdict-badge.correct {\n  background: var(--test-success-light);\n  color: #059669;\n}\n\n.verdict-badge.incorrect {\n  background: var(--test-error-light);\n  color: #dc2626;\n}\n\n.feedback-comments {\n  padding: 14px;\n  background: var(--test-bg);\n  border-radius: var(--test-radius-md);\n  border-left: 3px solid var(--test-primary);\n}\n\n.feedback-comments p {\n  margin: 0;\n  font-size: 14px;\n  line-height: 1.6;\n  color: var(--test-text);\n}\n\n/* ===========================\n   Log Tab\n   =========================== */\n.log-tab {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  height: 100%;\n  animation: fadeIn 0.3s ease-out;\n}\n\n.log-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background: var(--test-surface);\n  padding: 16px 20px;\n  border-radius: var(--test-radius-lg) var(--test-radius-lg) 0 0;\n  border: 1px solid var(--test-border);\n  border-bottom: none;\n}\n\n.log-title {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.log-title i {\n  color: var(--test-text-secondary);\n  font-size: 16px;\n}\n\n.log-title h3 {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.log-actions {\n  display: flex;\n  gap: 8px;\n}\n\n.log-container {\n  flex: 1;\n  border-radius: 0 0 var(--test-radius-lg) var(--test-radius-lg);\n  overflow: hidden;\n  min-height: 300px;\n  border: 1px solid var(--test-border);\n  border-top: none;\n}\n\n/* ===========================\n   Loading States & Skeletons\n   =========================== */\n.loading-state {\n  padding: 20px;\n}\n\n.skeleton-list {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.skeleton-card {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 16px;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-md);\n  border: 1px solid var(--test-border);\n}\n\n.skeleton-icon,\n.skeleton-avatar {\n  width: 44px;\n  height: 44px;\n  border-radius: var(--test-radius-md);\n  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);\n  background-size: 200% 100%;\n  animation: shimmer 1.5s infinite;\n}\n\n.skeleton-avatar {\n  border-radius: 50%;\n}\n\n.skeleton-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.skeleton-line {\n  height: 14px;\n  border-radius: 4px;\n  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);\n  background-size: 200% 100%;\n  animation: shimmer 1.5s infinite;\n}\n\n.skeleton-line.wide { width: 70%; }\n.skeleton-line.medium { width: 55%; }\n.skeleton-line.narrow { width: 40%; }\n\n@keyframes shimmer {\n  0% { background-position: 200% 0; }\n  100% { background-position: -200% 0; }\n}\n\n/* ===========================\n   Empty States\n   =========================== */\n.empty-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 60px 24px;\n  text-align: center;\n  background: var(--test-surface);\n  border-radius: var(--test-radius-lg);\n}\n\n.empty-icon {\n  width: 80px;\n  height: 80px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-bg);\n  border-radius: 50%;\n  margin-bottom: 20px;\n}\n\n.empty-icon i {\n  font-size: 36px;\n  color: var(--test-text-muted);\n}\n\n.empty-state h3 {\n  margin: 0 0 8px 0;\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--test-text);\n}\n\n.empty-state p {\n  margin: 0;\n  font-size: 14px;\n  color: var(--test-text-secondary);\n  max-width: 300px;\n}\n\n/* ===========================\n   Keyboard Shortcuts Help\n   =========================== */\n.shortcuts-hint {\n  position: fixed;\n  bottom: 20px;\n  right: 20px;\n  z-index: 100;\n}\n\n.shortcuts-hint > i {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: 50%;\n  color: var(--test-text-muted);\n  font-size: 16px;\n  cursor: pointer;\n  box-shadow: var(--test-shadow-md);\n  transition: var(--test-transition);\n}\n\n.shortcuts-hint:hover > i {\n  color: var(--test-primary);\n  border-color: var(--test-primary-light);\n}\n\n.shortcuts-popup {\n  display: none;\n  position: absolute;\n  bottom: 50px;\n  right: 0;\n  background: var(--test-surface);\n  border: 1px solid var(--test-border);\n  border-radius: var(--test-radius-md);\n  padding: 16px;\n  box-shadow: var(--test-shadow-lg);\n  min-width: 200px;\n}\n\n.shortcuts-hint:hover .shortcuts-popup {\n  display: block;\n  animation: fadeIn 0.2s ease-out;\n}\n\n.shortcuts-popup h4 {\n  margin: 0 0 12px 0;\n  font-size: 14px;\n  font-weight: 700;\n  color: var(--test-text);\n}\n\n.shortcuts-popup ul {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n\n.shortcuts-popup li {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 6px 0;\n  font-size: 13px;\n  color: var(--test-text-secondary);\n}\n\n.shortcuts-popup kbd {\n  background: var(--test-bg);\n  border: 1px solid var(--test-border);\n  border-radius: 4px;\n  padding: 2px 6px;\n  font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n  font-size: 11px;\n  color: var(--test-text);\n}\n\n/* ===========================\n   Responsive Design - Tablet\n   =========================== */\n@media (max-width: 1024px) {\n  .metrics-bar {\n    grid-template-columns: repeat(3, 1fr);\n  }\n\n  .details-grid {\n    grid-template-columns: repeat(2, 1fr);\n  }\n\n  .shortcuts-hint {\n    display: none;\n  }\n}\n\n/* ===========================\n   Responsive Design - Mobile\n   =========================== */\n@media (max-width: 768px) {\n  .test-run-form {\n    height: auto;\n    min-height: 100%;\n  }\n\n  .test-run-header {\n    padding: 16px;\n  }\n\n  .breadcrumb {\n    margin-bottom: 12px;\n  }\n\n  .breadcrumb ol {\n    font-size: 12px;\n  }\n\n  .header-content {\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .header-left {\n    width: 100%;\n  }\n\n  .status-indicator {\n    width: 48px;\n    height: 48px;\n    font-size: 20px;\n  }\n\n  .test-run-info h1 {\n    font-size: 18px;\n  }\n\n  .test-run-meta {\n    gap: 8px;\n  }\n\n  .status-badge {\n    padding: 4px 10px;\n    font-size: 11px;\n  }\n\n  .header-actions {\n    width: 100%;\n    justify-content: stretch;\n  }\n\n  .header-actions button {\n    flex: 1;\n  }\n\n  .metrics-bar {\n    grid-template-columns: repeat(2, 1fr);\n    gap: 10px;\n  }\n\n  .metric-card {\n    padding: 12px;\n  }\n\n  .metric-icon {\n    width: 36px;\n    height: 36px;\n    font-size: 14px;\n  }\n\n  .metric-value {\n    font-size: 14px;\n  }\n\n  .tabs {\n    padding: 0 12px;\n  }\n\n  .tab {\n    padding: 12px 14px;\n    font-size: 13px;\n    gap: 6px;\n  }\n\n  .tab i {\n    font-size: 14px;\n  }\n\n  .shortcut-hint {\n    display: none;\n  }\n\n  .tab-content {\n    padding: 16px;\n  }\n\n  .result-hero {\n    padding: 24px 20px;\n  }\n\n  .result-icon {\n    width: 64px;\n    height: 64px;\n    font-size: 32px;\n  }\n\n  .result-text h2 {\n    font-size: 24px;\n  }\n\n  .result-score {\n    font-size: 16px;\n  }\n\n  .check-results,\n  .comparison-section,\n  .ai-section,\n  .feedback-item {\n    padding: 18px;\n  }\n\n  .check-item {\n    padding: 12px;\n  }\n\n  .comparison-tabs {\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .comparison-tab {\n    text-align: center;\n  }\n\n  .details-grid {\n    grid-template-columns: 1fr;\n  }\n\n  .detail-card {\n    padding: 14px;\n  }\n\n  .ai-run-card {\n    padding: 14px;\n  }\n\n  .ai-run-icon {\n    width: 40px;\n    height: 40px;\n    font-size: 16px;\n  }\n\n  .ai-run-meta {\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .feedback-header {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .log-header {\n    flex-direction: column;\n    gap: 12px;\n    align-items: stretch;\n  }\n\n  .log-actions {\n    justify-content: stretch;\n  }\n\n  .log-actions button {\n    flex: 1;\n  }\n\n  .empty-state {\n    padding: 40px 20px;\n  }\n\n  .empty-icon {\n    width: 64px;\n    height: 64px;\n  }\n\n  .empty-icon i {\n    font-size: 28px;\n  }\n}\n\n/* ===========================\n   Responsive Design - Small Mobile\n   =========================== */\n@media (max-width: 480px) {\n  .test-run-header {\n    padding: 12px;\n  }\n\n  .header-left {\n    gap: 12px;\n  }\n\n  .status-indicator {\n    width: 40px;\n    height: 40px;\n    font-size: 18px;\n    border-radius: 8px;\n  }\n\n  .test-run-info h1 {\n    font-size: 16px;\n  }\n\n  .metrics-bar {\n    grid-template-columns: 1fr 1fr;\n  }\n\n  .metric-card {\n    padding: 10px;\n    flex-direction: column;\n    text-align: center;\n  }\n\n  .metric-icon {\n    margin-bottom: 8px;\n  }\n\n  .metric-label {\n    font-size: 9px;\n  }\n\n  .metric-value {\n    font-size: 14px;\n  }\n\n  .tabs {\n    padding: 0 8px;\n  }\n\n  .tab {\n    padding: 10px 12px;\n    font-size: 12px;\n  }\n\n  .tab-badge {\n    display: none;\n  }\n\n  .tab-content {\n    padding: 12px;\n  }\n\n  .result-hero {\n    padding: 20px 16px;\n  }\n\n  .result-icon {\n    width: 56px;\n    height: 56px;\n    font-size: 28px;\n  }\n\n  .result-text h2 {\n    font-size: 20px;\n  }\n\n  .result-score {\n    font-size: 14px;\n  }\n\n  .result-checks {\n    font-size: 12px;\n  }\n\n  .section-header h3 {\n    font-size: 16px;\n  }\n\n  .check-item {\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  .check-weight {\n    text-align: left;\n  }\n}\n\n/* ===========================\n   Touch Device Optimizations\n   =========================== */\n@media (hover: none) and (pointer: coarse) {\n  .tab,\n  .comparison-tab,\n  .ai-run-card,\n  .check-item,\n  .feedback-item,\n  .detail-card.clickable {\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  .ai-run-card:active,\n  .detail-card.clickable:active {\n    background: rgba(37, 99, 235, 0.1);\n    transform: scale(0.98);\n  }\n\n  .tab:active {\n    background: rgba(37, 99, 235, 0.1);\n  }\n\n  /* Larger touch targets */\n  .tab {\n    min-height: 48px;\n  }\n\n  .ai-run-card,\n  .detail-card {\n    min-height: 64px;\n  }\n}\n\n/* ===========================\n   High Contrast Mode\n   =========================== */\n@media (prefers-contrast: high) {\n  .status-badge {\n    border: 2px solid currentColor;\n  }\n\n  .check-item {\n    border-width: 2px;\n  }\n\n  .tab.active {\n    border-bottom-width: 4px;\n  }\n}\n\n/* ===========================\n   Reduced Motion\n   =========================== */\n@media (prefers-reduced-motion: reduce) {\n  *,\n  *::before,\n  *::after {\n    animation-duration: 0.01ms !important;\n    animation-iteration-count: 1 !important;\n    transition-duration: 0.01ms !important;\n  }\n\n  .skeleton-icon,\n  .skeleton-avatar,\n  .skeleton-line {\n    animation: none;\n    background: #e2e8f0;\n  }\n\n  .result-pulse {\n    animation: none;\n    display: none;\n  }\n}\n\n/* ===========================\n   Print Styles\n   =========================== */\n@media print {\n  .test-run-form {\n    background: white;\n    height: auto;\n  }\n\n  .header-actions,\n  .tabs-container,\n  .shortcuts-hint,\n  .log-actions {\n    display: none !important;\n  }\n\n  .tab-content {\n    overflow: visible;\n    padding: 0;\n  }\n\n  .result-hero,\n  .check-results,\n  .details-grid,\n  .ai-section,\n  .feedback-item {\n    break-inside: avoid;\n    box-shadow: none;\n    border: 1px solid #ddd;\n  }\n\n  .comparison-content,\n  .log-container {\n    max-height: none;\n    overflow: visible;\n  }\n}\n\n/* ===========================\n   Tags Bar - Sleek Inline Display\n   =========================== */\n.tags-bar {\n  margin-top: 16px;\n  padding: 8px 14px;\n  background: linear-gradient(135deg, rgba(37, 99, 235, 0.04) 0%, rgba(37, 99, 235, 0.08) 100%);\n  border: 1px solid rgba(37, 99, 235, 0.15);\n  border-radius: 8px;\n  max-width: 600px;\n}\n\n.tags-bar-content {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  flex-wrap: wrap;\n}\n\n.tags-bar-label {\n  color: var(--test-text-secondary);\n  font-size: 14px;\n}\n\n.tags-bar-label i {\n  opacity: 0.6;\n}\n\n.tags-bar-chips {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  flex: 1;\n}\n\n.tag-inline {\n  display: inline-flex;\n  align-items: center;\n  padding: 4px 10px;\n  background: rgba(37, 99, 235, 0.1);\n  color: var(--test-primary);\n  border-radius: 12px;\n  font-size: 11px;\n  font-weight: 500;\n  letter-spacing: 0.01em;\n}\n\n.tags-bar-empty {\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  opacity: 0.7;\n  flex: 1;\n}\n\n.tags-bar-edit {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 4px 10px;\n  background: transparent;\n  border: 1px dashed var(--test-border);\n  border-radius: 12px;\n  font-size: 11px;\n  font-weight: 500;\n  color: var(--test-text-secondary);\n  cursor: pointer;\n  transition: var(--test-transition);\n}\n\n.tags-bar-edit:hover {\n  border-color: var(--test-primary);\n  color: var(--test-primary);\n  background: rgba(37, 99, 235, 0.05);\n}\n\n.tags-bar-edit i {\n  font-size: 10px;\n}\n\n/* ===========================\n   Tags Editor Panel - Expanded Edit Mode\n   =========================== */\n.tags-editor-panel {\n  margin-top: 16px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-primary);\n  border-radius: var(--test-radius-md);\n  overflow: hidden;\n  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.1);\n  max-width: 600px;\n}\n\n.tags-editor-header {\n  display: flex;\n  align-items: center;\n  padding: 12px 16px;\n  background: rgba(37, 99, 235, 0.08);\n  border-bottom: 1px solid rgba(37, 99, 235, 0.2);\n}\n\n.tags-editor-title {\n  font-size: 13px;\n  font-weight: 600;\n  color: var(--test-primary);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.tags-editor-body {\n  padding: 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.tags-editor-chips {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  min-height: 32px;\n}\n\n.tag-editable {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 5px 8px 5px 12px;\n  background: var(--test-surface);\n  border: 1px solid var(--test-primary);\n  color: var(--test-primary);\n  border-radius: 14px;\n  font-size: 12px;\n  font-weight: 500;\n}\n\n.tag-remove-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  background: transparent;\n  border: none;\n  color: var(--test-primary);\n  cursor: pointer;\n  border-radius: 50%;\n  font-size: 9px;\n  opacity: 0.6;\n  transition: var(--test-transition);\n}\n\n.tag-remove-btn:hover {\n  opacity: 1;\n  background: var(--test-error-light);\n  color: var(--test-error);\n}\n\n.tags-empty-hint {\n  font-size: 12px;\n  color: var(--test-text-secondary);\n  font-style: italic;\n  padding: 4px 0;\n}\n\n.tags-editor-input {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.tag-text-input {\n  flex: 1;\n  padding: 10px 14px;\n  border: 1px solid var(--test-border);\n  border-radius: 8px;\n  font-size: 13px;\n  background: var(--test-bg);\n}\n\n.tag-text-input:focus {\n  outline: none;\n  border-color: var(--test-primary);\n  background: var(--test-surface);\n  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);\n}\n\n.tag-text-input::placeholder {\n  color: var(--test-text-secondary);\n  opacity: 0.6;\n}\n\n.tags-editor-footer {\n  display: flex;\n  justify-content: flex-start;\n  gap: 8px;\n  padding: 12px 16px;\n  background: var(--test-bg);\n  border-top: 1px solid var(--test-border);\n}\n\n/* Mobile Responsive for Tags */\n@media (max-width: 768px) {\n  .tags-bar {\n    padding: 8px 12px;\n  }\n\n  .tags-bar-content {\n    gap: 8px;\n  }\n\n  .tag-inline {\n    padding: 3px 8px;\n    font-size: 10px;\n  }\n\n  .tags-editor-panel {\n    margin-top: 12px;\n  }\n\n  .tags-editor-body {\n    padding: 12px;\n  }\n\n  .tags-editor-footer {\n    padding: 10px 12px;\n  }\n}\n"] }]
     }], () => [{ type: i0.ElementRef }, { type: i1.SharedService }, { type: i2.Router }, { type: i2.ActivatedRoute }, { type: i0.ChangeDetectorRef }, { type: i3.TestingDialogService }, { type: i4.ApplicationManager }, { type: i0.ViewContainerRef }], { handleKeyboardShortcut: [{
             type: HostListener,
             args: ['document:keydown', ['$event']]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TestRunFormComponentExtended, { className: "TestRunFormComponentExtended", filePath: "src/lib/custom/Tests/test-run-form.component.ts", lineNumber: 36 }); })();
-export function LoadTestRunFormComponentExtended() {
-    // Prevents tree-shaking
-}
-LoadTestRunFormComponentExtended();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TestRunFormComponentExtended, { className: "TestRunFormComponentExtended", filePath: "src/lib/custom/tests/test-run-form.component.ts", lineNumber: 37 }); })();
 //# sourceMappingURL=test-run-form.component.js.map