@memberjunction/ng-conversations 5.42.0 → 5.44.0

package/dist/lib/components/collection/collections-full-view.component.js

@@ -11,10 +11,11 @@ import * as i4 from "../../services/collection-permission.service";
 import * as i5 from "@memberjunction/ng-artifacts";
 import * as i6 from "@angular/common";
 import * as i7 from "@angular/forms";
-import * as i8 from "@memberjunction/ng-shared-generic";
-import * as i9 from "./collection-share-modal.component";
-import * as i10 from "./collection-form-modal.component";
-import * as i11 from "./artifact-create-modal.component";
+import * as i8 from "@memberjunction/ng-ui-components";
+import * as i9 from "@memberjunction/ng-shared-generic";
+import * as i10 from "./collection-share-modal.component";
+import * as i11 from "./collection-form-modal.component";
+import * as i12 from "./artifact-create-modal.component";
 const _forTrack0 = ($index, $item) => $item.collection.ID;
 const _forTrack1 = ($index, $item) => $item.item.id;
 function CollectionsFullViewComponent_Conditional_9_For_2_Template(rf, ctx) { if (rf & 1) {
@@ -292,70 +293,34 @@ function CollectionsFullViewComponent_Conditional_28_Template(rf, ctx) { if (rf
     i0.ɵɵelement(1, "mj-loading", 75);
     i0.ɵɵelementEnd();
 } }
-function CollectionsFullViewComponent_Conditional_29_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "h3");
-    i0.ɵɵtext(1, "No items found");
+function CollectionsFullViewComponent_Conditional_29_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 77);
+    i0.ɵɵtext(1, "Use the ");
+    i0.ɵɵelementStart(2, "strong");
+    i0.ɵɵtext(3, "New");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(2, "p");
-    i0.ɵɵtext(3, "Try adjusting your search");
-    i0.ɵɵelementEnd();
-} }
-function CollectionsFullViewComponent_Conditional_29_Conditional_3_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    const _r21 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 78);
-    i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_29_Conditional_3_Conditional_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r21); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.createCollection()); });
-    i0.ɵɵelement(1, "i", 50);
-    i0.ɵɵtext(2, " Create Collection ");
-    i0.ɵɵelementEnd();
-} }
-function CollectionsFullViewComponent_Conditional_29_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "h3");
-    i0.ɵɵtext(1, "No collections yet");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(2, "p");
-    i0.ɵɵtext(3, "Create your first collection to get started");
-    i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, CollectionsFullViewComponent_Conditional_29_Conditional_3_Conditional_4_Template, 3, 0, "button", 77);
-} if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(4);
-    i0.ɵɵconditional(ctx_r2.canEditCurrent() ? 4 : -1);
-} }
-function CollectionsFullViewComponent_Conditional_29_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "h3");
-    i0.ɵɵtext(1, "This collection is empty");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(2, "p");
-    i0.ɵɵtext(3, "Use the ");
-    i0.ɵɵelementStart(4, "strong");
-    i0.ɵɵtext(5, "New");
-    i0.ɵɵelementEnd();
-    i0.ɵɵtext(6, " button above to add collections or artifacts");
+    i0.ɵɵtext(4, " button above to add collections or artifacts");
     i0.ɵɵelementEnd();
 } }
 function CollectionsFullViewComponent_Conditional_29_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 25);
-    i0.ɵɵelement(1, "i", 76);
-    i0.ɵɵconditionalCreate(2, CollectionsFullViewComponent_Conditional_29_Conditional_2_Template, 4, 0);
-    i0.ɵɵconditionalCreate(3, CollectionsFullViewComponent_Conditional_29_Conditional_3_Template, 5, 1);
-    i0.ɵɵconditionalCreate(4, CollectionsFullViewComponent_Conditional_29_Conditional_4_Template, 7, 0);
+    const _r21 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-empty-state", 76);
+    i0.ɵɵlistener("Action", function CollectionsFullViewComponent_Conditional_29_Template_mj_empty_state_Action_0_listener() { i0.ɵɵrestoreView(_r21); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.createCollection()); });
+    i0.ɵɵconditionalCreate(1, CollectionsFullViewComponent_Conditional_29_Conditional_1_Template, 5, 0, "p", 77);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r2.searchQuery ? 2 : -1);
+    i0.ɵɵproperty("Variant", ctx_r2.searchQuery ? "no-results" : "empty")("Title", ctx_r2.EmptyStateTitle)("Message", ctx_r2.EmptyStateMessage)("ActionText", !ctx_r2.searchQuery && !ctx_r2.currentCollectionId && ctx_r2.canEditCurrent() ? "Create Collection" : "");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(!ctx_r2.searchQuery && !ctx_r2.currentCollectionId ? 3 : -1);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(!ctx_r2.searchQuery && ctx_r2.currentCollectionId ? 4 : -1);
+    i0.ɵɵconditional(!ctx_r2.searchQuery && ctx_r2.currentCollectionId ? 1 : -1);
 } }
 function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 86);
-    i0.ɵɵelement(1, "i", 92);
+    i0.ɵɵelementStart(0, "div", 85);
+    i0.ɵɵelement(1, "i", 91);
     i0.ɵɵelementEnd();
 } }
 function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 89);
+    i0.ɵɵelementStart(0, "div", 88);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -364,7 +329,7 @@ function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditi
     i0.ɵɵtextInterpolate1(" ", item_r23.description, " ");
 } }
 function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 90);
+    i0.ɵɵelementStart(0, "div", 89);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -374,8 +339,8 @@ function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditi
     i0.ɵɵtextInterpolate1(" ", ctx_r2.getItemCountText(item_r23.itemCount), " ");
 } }
 function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 91);
-    i0.ɵɵelement(1, "i", 93);
+    i0.ɵɵelementStart(0, "div", 90);
+    i0.ɵɵelement(1, "i", 92);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -384,16 +349,16 @@ function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditi
     i0.ɵɵtextInterpolate1(" ", item_r23.owner, " ");
 } }
 function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 84)(1, "div", 85);
+    i0.ɵɵelementStart(0, "div", 83)(1, "div", 84);
     i0.ɵɵelement(2, "i", 68);
-    i0.ɵɵconditionalCreate(3, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_3_Template, 2, 0, "div", 86);
+    i0.ɵɵconditionalCreate(3, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_3_Template, 2, 0, "div", 85);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 87)(5, "div", 88);
+    i0.ɵɵelementStart(4, "div", 86)(5, "div", 87);
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(7, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_7_Template, 2, 1, "div", 89);
-    i0.ɵɵconditionalCreate(8, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_8_Template, 2, 1, "div", 90);
-    i0.ɵɵconditionalCreate(9, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_9_Template, 3, 1, "div", 91);
+    i0.ɵɵconditionalCreate(7, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_7_Template, 2, 1, "div", 88);
+    i0.ɵɵconditionalCreate(8, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_8_Template, 2, 1, "div", 89);
+    i0.ɵɵconditionalCreate(9, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Conditional_9_Template, 3, 1, "div", 90);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const item_r23 = i0.ɵɵnextContext().$implicit;
@@ -410,7 +375,7 @@ function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Templat
     i0.ɵɵconditional(item_r23.isShared && item_r23.owner ? 9 : -1);
 } }
 function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 89);
+    i0.ɵɵelementStart(0, "div", 88);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -419,7 +384,7 @@ function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditi
     i0.ɵɵtextInterpolate1(" ", item_r23.description, " ");
 } }
 function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditional_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 95);
+    i0.ɵɵelementStart(0, "span", 94);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -428,7 +393,7 @@ function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditi
     i0.ɵɵtextInterpolate1(" v", item_r23.versionNumber, " ");
 } }
 function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditional_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 96);
+    i0.ɵɵelementStart(0, "span", 95);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -437,16 +402,16 @@ function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditi
     i0.ɵɵtextInterpolate1(" ", item_r23.artifactType, " ");
 } }
 function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 84)(1, "div", 94);
+    i0.ɵɵelementStart(0, "div", 83)(1, "div", 93);
     i0.ɵɵelement(2, "i", 11);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 87)(4, "div", 88);
+    i0.ɵɵelementStart(3, "div", 86)(4, "div", 87);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(6, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditional_6_Template, 2, 1, "div", 89);
-    i0.ɵɵelementStart(7, "div", 90);
-    i0.ɵɵconditionalCreate(8, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditional_8_Template, 2, 1, "span", 95);
-    i0.ɵɵconditionalCreate(9, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditional_9_Template, 2, 1, "span", 96);
+    i0.ɵɵconditionalCreate(6, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditional_6_Template, 2, 1, "div", 88);
+    i0.ɵɵelementStart(7, "div", 89);
+    i0.ɵɵconditionalCreate(8, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditional_8_Template, 2, 1, "span", 94);
+    i0.ɵɵconditionalCreate(9, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Conditional_9_Template, 2, 1, "span", 95);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const item_r23 = i0.ɵɵnextContext().$implicit;
@@ -464,14 +429,14 @@ function CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Templat
 } }
 function CollectionsFullViewComponent_Conditional_30_For_2_Template(rf, ctx) { if (rf & 1) {
     const _r22 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 82);
+    i0.ɵɵelementStart(0, "div", 81);
     i0.ɵɵlistener("dragstart", function CollectionsFullViewComponent_Conditional_30_For_2_Template_div_dragstart_0_listener($event) { const item_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onItemDragStart(item_r23, $event)); })("dragend", function CollectionsFullViewComponent_Conditional_30_For_2_Template_div_dragend_0_listener() { i0.ɵɵrestoreView(_r22); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onItemDragEnd()); })("dragover", function CollectionsFullViewComponent_Conditional_30_For_2_Template_div_dragover_0_listener($event) { const item_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(item_r23.type === "folder" ? ctx_r2.onFolderItemDragOver(item_r23, $event) : null); })("dragleave", function CollectionsFullViewComponent_Conditional_30_For_2_Template_div_dragleave_0_listener() { const item_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(item_r23.type === "folder" ? ctx_r2.onDragLeave(item_r23.id) : null); })("drop", function CollectionsFullViewComponent_Conditional_30_For_2_Template_div_drop_0_listener($event) { const item_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(item_r23.type === "folder" ? ctx_r2.onFolderItemDrop(item_r23, $event) : null); })("click", function CollectionsFullViewComponent_Conditional_30_For_2_Template_div_click_0_listener($event) { const item_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onItemClick(item_r23, $event)); })("dblclick", function CollectionsFullViewComponent_Conditional_30_For_2_Template_div_dblclick_0_listener($event) { const item_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onItemDoubleClick(item_r23, $event)); })("contextmenu", function CollectionsFullViewComponent_Conditional_30_For_2_Template_div_contextmenu_0_listener($event) { const item_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onItemContextMenu(item_r23, $event)); });
-    i0.ɵɵelementStart(1, "div", 83);
+    i0.ɵɵelementStart(1, "div", 82);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_30_For_2_Template_div_click_1_listener($event) { const item_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onCheckboxClick(item_r23, $event)); });
     i0.ɵɵelement(2, "i", 11);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(3, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Template, 10, 6, "div", 84);
-    i0.ɵɵconditionalCreate(4, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Template, 10, 6, "div", 84);
+    i0.ɵɵconditionalCreate(3, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_3_Template, 10, 6, "div", 83);
+    i0.ɵɵconditionalCreate(4, CollectionsFullViewComponent_Conditional_30_For_2_Conditional_4_Template, 10, 6, "div", 83);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const item_r23 = ctx.$implicit;
@@ -487,27 +452,27 @@ function CollectionsFullViewComponent_Conditional_30_For_2_Template(rf, ctx) { i
 } }
 function CollectionsFullViewComponent_Conditional_30_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     const _r24 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 81)(1, "span", 97);
+    i0.ɵɵelementStart(0, "div", 80)(1, "span", 96);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 98)(4, "button", 99);
+    i0.ɵɵelementStart(3, "div", 97)(4, "button", 98);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_30_Conditional_3_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r24); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.GoToPage(1)); });
-    i0.ɵɵelement(5, "i", 100);
+    i0.ɵɵelement(5, "i", 99);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "button", 101);
+    i0.ɵɵelementStart(6, "button", 100);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_30_Conditional_3_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r24); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.GoToPage(ctx_r2.CurrentPage - 1)); });
-    i0.ɵɵelement(7, "i", 102);
+    i0.ɵɵelement(7, "i", 101);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "span", 103);
+    i0.ɵɵelementStart(8, "span", 102);
     i0.ɵɵtext(9);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "button", 104);
+    i0.ɵɵelementStart(10, "button", 103);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_30_Conditional_3_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r24); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.GoToPage(ctx_r2.CurrentPage + 1)); });
-    i0.ɵɵelement(11, "i", 105);
+    i0.ɵɵelement(11, "i", 104);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "button", 106);
+    i0.ɵɵelementStart(12, "button", 105);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_30_Conditional_3_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r24); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.GoToPage(ctx_r2.TotalPages)); });
-    i0.ɵɵelement(13, "i", 107);
+    i0.ɵɵelement(13, "i", 106);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext(2);
@@ -525,10 +490,10 @@ function CollectionsFullViewComponent_Conditional_30_Conditional_3_Template(rf,
     i0.ɵɵproperty("disabled", ctx_r2.CurrentPage === ctx_r2.TotalPages);
 } }
 function CollectionsFullViewComponent_Conditional_30_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 79);
-    i0.ɵɵrepeaterCreate(1, CollectionsFullViewComponent_Conditional_30_For_2_Template, 5, 12, "div", 80, i0.ɵɵrepeaterTrackByIdentity);
+    i0.ɵɵelementStart(0, "div", 78);
+    i0.ɵɵrepeaterCreate(1, CollectionsFullViewComponent_Conditional_30_For_2_Template, 5, 12, "div", 79, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(3, CollectionsFullViewComponent_Conditional_30_Conditional_3_Template, 14, 9, "div", 81);
+    i0.ɵɵconditionalCreate(3, CollectionsFullViewComponent_Conditional_30_Conditional_3_Template, 14, 9, "div", 80);
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵclassProp("select-mode", ctx_r2.isSelectMode);
@@ -565,7 +530,7 @@ function CollectionsFullViewComponent_Conditional_31_Conditional_20_Template(rf,
     i0.ɵɵproperty("ngClass", ctx_r2.sortOrder === "asc" ? "fa-sort-up" : "fa-sort-down");
 } }
 function CollectionsFullViewComponent_Conditional_31_For_25_Conditional_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 120);
+    i0.ɵɵelement(0, "i", 119);
 } }
 function CollectionsFullViewComponent_Conditional_31_For_25_Conditional_10_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
@@ -573,7 +538,7 @@ function CollectionsFullViewComponent_Conditional_31_For_25_Conditional_10_Templ
     i0.ɵɵelementEnd();
 } }
 function CollectionsFullViewComponent_Conditional_31_For_25_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 96);
+    i0.ɵɵelementStart(0, "span", 95);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -602,26 +567,26 @@ function CollectionsFullViewComponent_Conditional_31_For_25_Conditional_15_Templ
 } }
 function CollectionsFullViewComponent_Conditional_31_For_25_Template(rf, ctx) { if (rf & 1) {
     const _r26 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "tr", 117);
+    i0.ɵɵelementStart(0, "tr", 116);
     i0.ɵɵlistener("dragstart", function CollectionsFullViewComponent_Conditional_31_For_25_Template_tr_dragstart_0_listener($event) { const item_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onItemDragStart(item_r27, $event)); })("dragend", function CollectionsFullViewComponent_Conditional_31_For_25_Template_tr_dragend_0_listener() { i0.ɵɵrestoreView(_r26); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onItemDragEnd()); })("dragover", function CollectionsFullViewComponent_Conditional_31_For_25_Template_tr_dragover_0_listener($event) { const item_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(item_r27.type === "folder" ? ctx_r2.onFolderItemDragOver(item_r27, $event) : null); })("dragleave", function CollectionsFullViewComponent_Conditional_31_For_25_Template_tr_dragleave_0_listener() { const item_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(item_r27.type === "folder" ? ctx_r2.onDragLeave(item_r27.id) : null); })("drop", function CollectionsFullViewComponent_Conditional_31_For_25_Template_tr_drop_0_listener($event) { const item_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(item_r27.type === "folder" ? ctx_r2.onFolderItemDrop(item_r27, $event) : null); })("click", function CollectionsFullViewComponent_Conditional_31_For_25_Template_tr_click_0_listener($event) { const item_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onItemClick(item_r27, $event)); })("dblclick", function CollectionsFullViewComponent_Conditional_31_For_25_Template_tr_dblclick_0_listener($event) { const item_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onItemDoubleClick(item_r27, $event)); })("contextmenu", function CollectionsFullViewComponent_Conditional_31_For_25_Template_tr_contextmenu_0_listener($event) { const item_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onItemContextMenu(item_r27, $event)); });
-    i0.ɵɵelementStart(1, "td", 110)(2, "i", 111);
+    i0.ɵɵelementStart(1, "td", 109)(2, "i", 110);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_31_For_25_Template_i_click_2_listener($event) { const item_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onCheckboxClick(item_r27, $event)); });
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(3, "td", 118)(4, "div", 119);
+    i0.ɵɵelementStart(3, "td", 117)(4, "div", 118);
     i0.ɵɵelement(5, "i", 11);
     i0.ɵɵelementStart(6, "span");
     i0.ɵɵtext(7);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(8, CollectionsFullViewComponent_Conditional_31_For_25_Conditional_8_Template, 1, 0, "i", 120);
+    i0.ɵɵconditionalCreate(8, CollectionsFullViewComponent_Conditional_31_For_25_Conditional_8_Template, 1, 0, "i", 119);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(9, "td", 121);
+    i0.ɵɵelementStart(9, "td", 120);
     i0.ɵɵconditionalCreate(10, CollectionsFullViewComponent_Conditional_31_For_25_Conditional_10_Template, 2, 0, "span");
-    i0.ɵɵconditionalCreate(11, CollectionsFullViewComponent_Conditional_31_For_25_Conditional_11_Template, 2, 1, "span", 96);
+    i0.ɵɵconditionalCreate(11, CollectionsFullViewComponent_Conditional_31_For_25_Conditional_11_Template, 2, 1, "span", 95);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "td", 122);
+    i0.ɵɵelementStart(12, "td", 121);
     i0.ɵɵconditionalCreate(13, CollectionsFullViewComponent_Conditional_31_For_25_Conditional_13_Template, 3, 4, "span");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(14, "td", 115);
+    i0.ɵɵelementStart(14, "td", 114);
     i0.ɵɵconditionalCreate(15, CollectionsFullViewComponent_Conditional_31_For_25_Conditional_15_Template, 2, 1, "span");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -648,27 +613,27 @@ function CollectionsFullViewComponent_Conditional_31_For_25_Template(rf, ctx) {
 } }
 function CollectionsFullViewComponent_Conditional_31_Conditional_26_Template(rf, ctx) { if (rf & 1) {
     const _r28 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 81)(1, "span", 97);
+    i0.ɵɵelementStart(0, "div", 80)(1, "span", 96);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 98)(4, "button", 99);
+    i0.ɵɵelementStart(3, "div", 97)(4, "button", 98);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_31_Conditional_26_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r28); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.GoToPage(1)); });
-    i0.ɵɵelement(5, "i", 100);
+    i0.ɵɵelement(5, "i", 99);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "button", 101);
+    i0.ɵɵelementStart(6, "button", 100);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_31_Conditional_26_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r28); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.GoToPage(ctx_r2.CurrentPage - 1)); });
-    i0.ɵɵelement(7, "i", 102);
+    i0.ɵɵelement(7, "i", 101);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "span", 103);
+    i0.ɵɵelementStart(8, "span", 102);
     i0.ɵɵtext(9);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "button", 104);
+    i0.ɵɵelementStart(10, "button", 103);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_31_Conditional_26_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r28); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.GoToPage(ctx_r2.CurrentPage + 1)); });
-    i0.ɵɵelement(11, "i", 105);
+    i0.ɵɵelement(11, "i", 104);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "button", 106);
+    i0.ɵɵelementStart(12, "button", 105);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_31_Conditional_26_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r28); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.GoToPage(ctx_r2.TotalPages)); });
-    i0.ɵɵelement(13, "i", 107);
+    i0.ɵɵelement(13, "i", 106);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext(2);
@@ -687,10 +652,10 @@ function CollectionsFullViewComponent_Conditional_31_Conditional_26_Template(rf,
 } }
 function CollectionsFullViewComponent_Conditional_31_Template(rf, ctx) { if (rf & 1) {
     const _r25 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 108)(1, "table", 109)(2, "thead")(3, "tr")(4, "th", 110)(5, "i", 111);
+    i0.ɵɵelementStart(0, "div", 107)(1, "table", 108)(2, "thead")(3, "tr")(4, "th", 109)(5, "i", 110);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_31_Template_i_click_5_listener() { i0.ɵɵrestoreView(_r25); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.selectedItems.size === ctx_r2.unifiedItems.length ? ctx_r2.clearSelection() : ctx_r2.selectAll()); });
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "th", 112);
+    i0.ɵɵelementStart(6, "th", 111);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_31_Template_th_click_6_listener() { i0.ɵɵrestoreView(_r25); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.setSortBy("name")); });
     i0.ɵɵelementStart(7, "span");
     i0.ɵɵtext(8, "Name");
@@ -698,7 +663,7 @@ function CollectionsFullViewComponent_Conditional_31_Template(rf, ctx) { if (rf
     i0.ɵɵconditionalCreate(9, CollectionsFullViewComponent_Conditional_31_Conditional_9_Template, 1, 0, "i", 33);
     i0.ɵɵconditionalCreate(10, CollectionsFullViewComponent_Conditional_31_Conditional_10_Template, 1, 1, "i", 11);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(11, "th", 113);
+    i0.ɵɵelementStart(11, "th", 112);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_31_Template_th_click_11_listener() { i0.ɵɵrestoreView(_r25); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.setSortBy("type")); });
     i0.ɵɵelementStart(12, "span");
     i0.ɵɵtext(13, "Type");
@@ -706,7 +671,7 @@ function CollectionsFullViewComponent_Conditional_31_Template(rf, ctx) { if (rf
     i0.ɵɵconditionalCreate(14, CollectionsFullViewComponent_Conditional_31_Conditional_14_Template, 1, 0, "i", 33);
     i0.ɵɵconditionalCreate(15, CollectionsFullViewComponent_Conditional_31_Conditional_15_Template, 1, 1, "i", 11);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(16, "th", 114);
+    i0.ɵɵelementStart(16, "th", 113);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_31_Template_th_click_16_listener() { i0.ɵɵrestoreView(_r25); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.setSortBy("date")); });
     i0.ɵɵelementStart(17, "span");
     i0.ɵɵtext(18, "Modified");
@@ -714,13 +679,13 @@ function CollectionsFullViewComponent_Conditional_31_Template(rf, ctx) { if (rf
     i0.ɵɵconditionalCreate(19, CollectionsFullViewComponent_Conditional_31_Conditional_19_Template, 1, 0, "i", 33);
     i0.ɵɵconditionalCreate(20, CollectionsFullViewComponent_Conditional_31_Conditional_20_Template, 1, 1, "i", 11);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(21, "th", 115);
+    i0.ɵɵelementStart(21, "th", 114);
     i0.ɵɵtext(22, "Owner");
     i0.ɵɵelementEnd()()();
     i0.ɵɵelementStart(23, "tbody");
-    i0.ɵɵrepeaterCreate(24, CollectionsFullViewComponent_Conditional_31_For_25_Template, 16, 17, "tr", 116, i0.ɵɵrepeaterTrackByIdentity);
+    i0.ɵɵrepeaterCreate(24, CollectionsFullViewComponent_Conditional_31_For_25_Template, 16, 17, "tr", 115, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵconditionalCreate(26, CollectionsFullViewComponent_Conditional_31_Conditional_26_Template, 14, 9, "div", 81);
+    i0.ɵɵconditionalCreate(26, CollectionsFullViewComponent_Conditional_31_Conditional_26_Template, 14, 9, "div", 80);
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵclassProp("select-mode", ctx_r2.isSelectMode);
@@ -745,12 +710,12 @@ function CollectionsFullViewComponent_Conditional_31_Template(rf, ctx) { if (rf
 } }
 function CollectionsFullViewComponent_Conditional_32_For_7_Template(rf, ctx) { if (rf & 1) {
     const _r30 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 125);
+    i0.ɵɵelementStart(0, "span", 124);
     i0.ɵɵelement(1, "i", 11);
-    i0.ɵɵelementStart(2, "span", 129);
+    i0.ɵɵelementStart(2, "span", 128);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "button", 130);
+    i0.ɵɵelementStart(4, "button", 129);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_32_For_7_Template_button_click_4_listener() { const entry_r31 = i0.ɵɵrestoreView(_r30).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.removeFromShelf(entry_r31.item.id)); });
     i0.ɵɵelement(5, "i", 40);
     i0.ɵɵelementEnd()();
@@ -764,17 +729,17 @@ function CollectionsFullViewComponent_Conditional_32_For_7_Template(rf, ctx) { i
 } }
 function CollectionsFullViewComponent_Conditional_32_Template(rf, ctx) { if (rf & 1) {
     const _r29 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 26)(1, "div", 123);
+    i0.ɵɵelementStart(0, "div", 26)(1, "div", 122);
     i0.ɵɵelement(2, "i", 62);
     i0.ɵɵelementStart(3, "span");
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div", 124);
-    i0.ɵɵrepeaterCreate(6, CollectionsFullViewComponent_Conditional_32_For_7_Template, 6, 3, "span", 125, _forTrack1);
+    i0.ɵɵelementStart(5, "div", 123);
+    i0.ɵɵrepeaterCreate(6, CollectionsFullViewComponent_Conditional_32_For_7_Template, 6, 3, "span", 124, _forTrack1);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "div", 126)(9, "button", 127);
+    i0.ɵɵelementStart(8, "div", 125)(9, "button", 126);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_32_Template_button_click_9_listener() { i0.ɵɵrestoreView(_r29); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.dropShelfHere()); });
-    i0.ɵɵelement(10, "i", 128);
+    i0.ɵɵelement(10, "i", 127);
     i0.ɵɵtext(11, " Move here ");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(12, "button", 59);
@@ -792,7 +757,7 @@ function CollectionsFullViewComponent_Conditional_32_Template(rf, ctx) { if (rf
 } }
 function CollectionsFullViewComponent_Conditional_33_Conditional_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
     const _r34 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 133);
+    i0.ɵɵelementStart(0, "button", 132);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_33_Conditional_2_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r34); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onContextMenuAction("share")); });
     i0.ɵɵelement(1, "i", 45);
     i0.ɵɵelementStart(2, "span");
@@ -801,7 +766,7 @@ function CollectionsFullViewComponent_Conditional_33_Conditional_2_Conditional_5
 } }
 function CollectionsFullViewComponent_Conditional_33_Conditional_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
     const _r35 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 133);
+    i0.ɵɵelementStart(0, "button", 132);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_33_Conditional_2_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r35); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onContextMenuAction("edit")); });
     i0.ɵɵelement(1, "i", 46);
     i0.ɵɵelementStart(2, "span");
@@ -820,9 +785,9 @@ function CollectionsFullViewComponent_Conditional_33_Conditional_2_Conditional_7
 } }
 function CollectionsFullViewComponent_Conditional_33_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     const _r33 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 133);
+    i0.ɵɵelementStart(0, "button", 132);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_33_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r33); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onContextMenuAction("open")); });
-    i0.ɵɵelement(1, "i", 76);
+    i0.ɵɵelement(1, "i", 133);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "Open");
     i0.ɵɵelementEnd()();
@@ -852,7 +817,7 @@ function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_0
 } }
 function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_0_Conditional_7_For_2_Template(rf, ctx) { if (rf & 1) {
     const _r38 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 133);
+    i0.ɵɵelementStart(0, "button", 132);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_0_Conditional_7_For_2_Template_button_click_0_listener() { const t_r39 = i0.ɵɵrestoreView(_r38).$implicit; const ctx_r2 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r2.moveArtifactToCollection(t_r39.collection)); });
     i0.ɵɵelement(1, "i", 68);
     i0.ɵɵelementStart(2, "span");
@@ -877,9 +842,9 @@ function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_0
 } }
 function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_0_Template(rf, ctx) { if (rf & 1) {
     const _r37 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 133);
+    i0.ɵɵelementStart(0, "button", 132);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_0_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r37); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.closeMoveSubmenu($event)); });
-    i0.ɵɵelement(1, "i", 102);
+    i0.ɵɵelement(1, "i", 101);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "Move to Collection");
     i0.ɵɵelementEnd()();
@@ -892,7 +857,7 @@ function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_0
 } }
 function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_1_Conditional_8_Template(rf, ctx) { if (rf & 1) {
     const _r41 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 133);
+    i0.ɵɵelementStart(0, "button", 132);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_1_Conditional_8_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r41); const ctx_r2 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r2.openMoveSubmenu($event)); });
     i0.ɵɵelement(1, "i", 60);
     i0.ɵɵelementStart(2, "span");
@@ -910,13 +875,13 @@ function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_1
 } }
 function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     const _r40 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 133);
+    i0.ɵɵelementStart(0, "button", 132);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_1_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r40); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onContextMenuAction("view")); });
     i0.ɵɵelement(1, "i", 141);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "View");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(4, "button", 133);
+    i0.ɵɵelementStart(4, "button", 132);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_33_Conditional_3_Conditional_1_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r40); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onContextMenuAction("openConversation")); });
     i0.ɵɵelement(5, "i", 142);
     i0.ɵɵelementStart(6, "span");
@@ -936,10 +901,10 @@ function CollectionsFullViewComponent_Conditional_33_Conditional_3_Template(rf,
 } }
 function CollectionsFullViewComponent_Conditional_33_Template(rf, ctx) { if (rf & 1) {
     const _r32 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 131);
+    i0.ɵɵelementStart(0, "div", 130);
     i0.ɵɵlistener("click", function CollectionsFullViewComponent_Conditional_33_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r32); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.closeContextMenu()); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(1, "div", 132);
+    i0.ɵɵelementStart(1, "div", 131);
     i0.ɵɵconditionalCreate(2, CollectionsFullViewComponent_Conditional_33_Conditional_2_Template, 8, 3);
     i0.ɵɵconditionalCreate(3, CollectionsFullViewComponent_Conditional_33_Conditional_3_Template, 2, 1);
     i0.ɵɵelementEnd();
@@ -987,6 +952,22 @@ export class CollectionsFullViewComponent extends BaseAngularComponent {
     sortBy = 'name';
     sortOrder = 'asc';
     searchQuery = '';
+    /** Empty-state heading — varies by search / root / inside-collection context. */
+    get EmptyStateTitle() {
+        if (this.searchQuery)
+            return 'No items found';
+        if (!this.currentCollectionId)
+            return 'No collections yet';
+        return 'This collection is empty';
+    }
+    /** Empty-state supporting message (the rich inside-collection hint is projected, not bound here). */
+    get EmptyStateMessage() {
+        if (this.searchQuery)
+            return 'Try adjusting your search';
+        if (!this.currentCollectionId)
+            return 'Create your first collection to get started';
+        return '';
+    }
     unifiedItems = [];
     selectedItems = new Set();
     showNewDropdown = false;
@@ -2597,7 +2578,7 @@ export class CollectionsFullViewComponent extends BaseAngularComponent {
     static ɵfac = function CollectionsFullViewComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CollectionsFullViewComponent)(i0.ɵɵdirectiveInject(i1.DialogService), i0.ɵɵdirectiveInject(i2.ArtifactStateService), i0.ɵɵdirectiveInject(i3.CollectionStateService), i0.ɵɵdirectiveInject(i4.CollectionPermissionService), i0.ɵɵdirectiveInject(i5.ArtifactIconService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CollectionsFullViewComponent, selectors: [["mj-collections-full-view"]], hostBindings: function CollectionsFullViewComponent_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("keydown.escape", function CollectionsFullViewComponent_keydown_escape_HostBindingHandler() { return ctx.onEscapeKey(); }, i0.ɵɵresolveDocument);
-        } }, inputs: { environmentId: "environmentId", currentUser: "currentUser" }, outputs: { collectionNavigated: "collectionNavigated", openConversationRequested: "openConversationRequested" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 37, vars: 36, consts: [[1, "collections-view", 3, "keydown"], [1, "collections-header"], [1, "collections-breadcrumb"], ["title", "Toggle collections panel", 1, "btn-icon", "nav-toggle", 3, "click"], [1, "fas", "fa-bars"], [1, "breadcrumb-item", 3, "dragover", "dragleave", "drop"], [1, "fas", "fa-home"], [1, "breadcrumb-link", 3, "click"], [1, "breadcrumb-path"], [1, "collections-actions"], [1, "btn-icon", 3, "click", "title"], [1, "fas", 3, "ngClass"], [1, "fas", "fa-check-square"], [1, "dropdown-container"], [1, "search-container"], [1, "fas", "fa-search"], ["type", "text", "placeholder", "Search...", 1, "search-input", 3, "ngModelChange", "ngModel"], ["title", "Clear search", 1, "search-clear"], ["title", "Refresh", 1, "btn-icon", 3, "click"], [1, "fas", "fa-sync"], [1, "selection-toolbar"], [1, "collections-body"], [1, "collections-navigator"], [1, "collections-content"], [1, "loading-state"], [1, "empty-state"], [1, "staging-shelf"], [3, "saved", "cancelled", "isOpen", "collection", "parentCollection", "environmentId", "currentUser"], [3, "saved", "cancelled", "isOpen", "collectionId", "environmentId", "currentUser"], [3, "saved", "cancelled", "isOpen", "collection", "currentUser", "currentUserPermissions"], [1, "fas", "fa-chevron-right", "breadcrumb-separator"], [1, "breadcrumb-link", 3, "dragover", "dragleave", "drop", "click"], ["title", "Sort options", 1, "btn-icon", 3, "click"], [1, "fas", "fa-sort"], [1, "dropdown-menu"], [1, "dropdown-item", 3, "click"], [1, "fas", "fa-sort-alpha-down"], [1, "fas", "fa-calendar"], [1, "fas", "fa-tag"], ["title", "Clear search", 1, "search-clear", 3, "click"], [1, "fas", "fa-times"], [1, "toolbar-separator"], [1, "toolbar-actions-group"], [1, "btn-icon", 3, "title"], [1, "btn-icon", "btn-icon-danger", 3, "title"], [1, "fas", "fa-share-nodes"], [1, "fas", "fa-pen-to-square"], [1, "btn-icon", "btn-icon-danger", 3, "click", "title"], [1, "fas", "fa-trash"], [1, "btn-primary", 3, "click"], [1, "fas", "fa-plus"], [1, "fas", "fa-chevron-down"], [1, "dropdown-menu", "dropdown-menu-right"], [1, "fas", "fa-folder-plus"], [1, "dropdown-item", 3, "click", "disabled"], [1, "fas", "fa-file-plus"], [1, "selection-info"], [1, "selection-count"], [1, "selection-actions"], [1, "btn-toolbar", 3, "click"], [1, "fas", "fa-folder-tree"], ["title", "Add to the staging shelf to move later", 1, "btn-toolbar", 3, "click"], [1, "fas", "fa-layer-group"], [1, "btn-toolbar", "btn-danger", 3, "click"], [1, "bulk-move-backdrop", 3, "click"], [1, "dropdown-menu", "bulk-move-menu"], [1, "dropdown-note"], [1, "dropdown-item", 3, "paddingLeft"], [1, "fas", "fa-folder"], [1, "nav-header"], [1, "nav-list"], [1, "nav-row", 3, "click", "dragover", "dragleave", "drop"], [1, "nav-row", 3, "active", "drag-over", "paddingLeft", "title"], [1, "nav-row", 3, "click", "dragover", "dragleave", "drop", "title"], [1, "nav-row-name"], ["text", "Loading collections...", "size", "large"], [1, "fas", "fa-folder-open"], [1, "btn-primary", "empty-state-cta"], [1, "btn-primary", "empty-state-cta", 3, "click"], [1, "unified-grid"], [1, "grid-item", 3, "selected", "active", "dragging", "drag-over", "draggable"], [1, "pagination-bar"], [1, "grid-item", 3, "dragstart", "dragend", "dragover", "dragleave", "drop", "click", "dblclick", "contextmenu", "draggable"], [1, "item-checkbox", 3, "click"], [1, "grid-item-content", 3, "title"], [1, "grid-icon", "folder-icon"], ["title", "Shared", 1, "shared-badge"], [1, "grid-info"], [1, "grid-name"], [1, "grid-description"], [1, "grid-meta"], [1, "grid-owner"], [1, "fas", "fa-users"], [1, "fas", "fa-user"], [1, "grid-icon", "artifact-icon"], [1, "version-badge"], [1, "artifact-type-badge"], [1, "pagination-info"], [1, "pagination-controls"], ["title", "First page", 1, "pagination-btn", 3, "click", "disabled"], [1, "fas", "fa-angles-left"], ["title", "Previous page", 1, "pagination-btn", 3, "click", "disabled"], [1, "fas", "fa-chevron-left"], [1, "pagination-page-info"], ["title", "Next page", 1, "pagination-btn", 3, "click", "disabled"], [1, "fas", "fa-chevron-right"], ["title", "Last page", 1, "pagination-btn", 3, "click", "disabled"], [1, "fas", "fa-angles-right"], [1, "unified-list"], [1, "list-table"], [1, "col-checkbox"], [1, "fas", 3, "click", "ngClass"], [1, "col-name", "sortable", 3, "click"], [1, "col-type", "sortable", 3, "click"], [1, "col-modified", "sortable", 3, "click"], [1, "col-owner"], [1, "list-item", 3, "selected", "active", "dragging", "drag-over", "draggable"], [1, "list-item", 3, "dragstart", "dragend", "dragover", "dragleave", "drop", "click", "dblclick", "contextmenu", "draggable"], [1, "col-name"], [1, "list-name-cell"], ["title", "Shared", 1, "fas", "fa-users", "shared-indicator"], [1, "col-type"], [1, "col-modified"], [1, "shelf-info"], [1, "shelf-chips"], [1, "shelf-chip", 3, "title"], [1, "shelf-actions"], [1, "btn-toolbar", "btn-primary-toolbar", 3, "click", "disabled", "title"], [1, "fas", "fa-arrow-down"], [1, "shelf-chip-name"], ["title", "Remove", 1, "shelf-chip-x", 3, "click"], [1, "context-menu-backdrop", 3, "click"], [1, "context-menu"], [1, "context-menu-item", 3, "click"], [1, "context-menu-divider"], [1, "context-menu-item"], [1, "context-menu-item", "context-menu-danger", 3, "click"], [1, "context-menu-note"], [1, "move-target-list"], [1, "fas", "fa-spinner", "fa-spin"], [1, "context-menu-item", 3, "paddingLeft"], [1, "fas", "fa-eye"], [1, "fas", "fa-comments"], [1, "fas", "fa-chevron-right", "submenu-arrow"], [1, "fas", "fa-times-circle"]], template: function CollectionsFullViewComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { environmentId: "environmentId", currentUser: "currentUser" }, outputs: { collectionNavigated: "collectionNavigated", openConversationRequested: "openConversationRequested" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 37, vars: 36, consts: [[1, "collections-view", 3, "keydown"], [1, "collections-header"], [1, "collections-breadcrumb"], ["title", "Toggle collections panel", 1, "btn-icon", "nav-toggle", 3, "click"], [1, "fas", "fa-bars"], [1, "breadcrumb-item", 3, "dragover", "dragleave", "drop"], [1, "fas", "fa-home"], [1, "breadcrumb-link", 3, "click"], [1, "breadcrumb-path"], [1, "collections-actions"], [1, "btn-icon", 3, "click", "title"], [1, "fas", 3, "ngClass"], [1, "fas", "fa-check-square"], [1, "dropdown-container"], [1, "search-container"], [1, "fas", "fa-search"], ["type", "text", "placeholder", "Search...", 1, "search-input", 3, "ngModelChange", "ngModel"], ["title", "Clear search", 1, "search-clear"], ["title", "Refresh", 1, "btn-icon", 3, "click"], [1, "fas", "fa-sync"], [1, "selection-toolbar"], [1, "collections-body"], [1, "collections-navigator"], [1, "collections-content"], [1, "loading-state"], ["Icon", "fa-solid fa-folder-open", "ActionIcon", "fa-solid fa-plus", 3, "Variant", "Title", "Message", "ActionText"], [1, "staging-shelf"], [3, "saved", "cancelled", "isOpen", "collection", "parentCollection", "environmentId", "currentUser"], [3, "saved", "cancelled", "isOpen", "collectionId", "environmentId", "currentUser"], [3, "saved", "cancelled", "isOpen", "collection", "currentUser", "currentUserPermissions"], [1, "fas", "fa-chevron-right", "breadcrumb-separator"], [1, "breadcrumb-link", 3, "dragover", "dragleave", "drop", "click"], ["title", "Sort options", 1, "btn-icon", 3, "click"], [1, "fas", "fa-sort"], [1, "dropdown-menu"], [1, "dropdown-item", 3, "click"], [1, "fas", "fa-sort-alpha-down"], [1, "fas", "fa-calendar"], [1, "fas", "fa-tag"], ["title", "Clear search", 1, "search-clear", 3, "click"], [1, "fas", "fa-times"], [1, "toolbar-separator"], [1, "toolbar-actions-group"], [1, "btn-icon", 3, "title"], [1, "btn-icon", "btn-icon-danger", 3, "title"], [1, "fas", "fa-share-nodes"], [1, "fas", "fa-pen-to-square"], [1, "btn-icon", "btn-icon-danger", 3, "click", "title"], [1, "fas", "fa-trash"], [1, "btn-primary", 3, "click"], [1, "fas", "fa-plus"], [1, "fas", "fa-chevron-down"], [1, "dropdown-menu", "dropdown-menu-right"], [1, "fas", "fa-folder-plus"], [1, "dropdown-item", 3, "click", "disabled"], [1, "fas", "fa-file-plus"], [1, "selection-info"], [1, "selection-count"], [1, "selection-actions"], [1, "btn-toolbar", 3, "click"], [1, "fas", "fa-folder-tree"], ["title", "Add to the staging shelf to move later", 1, "btn-toolbar", 3, "click"], [1, "fas", "fa-layer-group"], [1, "btn-toolbar", "btn-danger", 3, "click"], [1, "bulk-move-backdrop", 3, "click"], [1, "dropdown-menu", "bulk-move-menu"], [1, "dropdown-note"], [1, "dropdown-item", 3, "paddingLeft"], [1, "fas", "fa-folder"], [1, "nav-header"], [1, "nav-list"], [1, "nav-row", 3, "click", "dragover", "dragleave", "drop"], [1, "nav-row", 3, "active", "drag-over", "paddingLeft", "title"], [1, "nav-row", 3, "click", "dragover", "dragleave", "drop", "title"], [1, "nav-row-name"], ["text", "Loading collections...", "size", "large"], ["Icon", "fa-solid fa-folder-open", "ActionIcon", "fa-solid fa-plus", 3, "Action", "Variant", "Title", "Message", "ActionText"], [1, "empty-collection-hint"], [1, "unified-grid"], [1, "grid-item", 3, "selected", "active", "dragging", "drag-over", "draggable"], [1, "pagination-bar"], [1, "grid-item", 3, "dragstart", "dragend", "dragover", "dragleave", "drop", "click", "dblclick", "contextmenu", "draggable"], [1, "item-checkbox", 3, "click"], [1, "grid-item-content", 3, "title"], [1, "grid-icon", "folder-icon"], ["title", "Shared", 1, "shared-badge"], [1, "grid-info"], [1, "grid-name"], [1, "grid-description"], [1, "grid-meta"], [1, "grid-owner"], [1, "fas", "fa-users"], [1, "fas", "fa-user"], [1, "grid-icon", "artifact-icon"], [1, "version-badge"], [1, "artifact-type-badge"], [1, "pagination-info"], [1, "pagination-controls"], ["title", "First page", 1, "pagination-btn", 3, "click", "disabled"], [1, "fas", "fa-angles-left"], ["title", "Previous page", 1, "pagination-btn", 3, "click", "disabled"], [1, "fas", "fa-chevron-left"], [1, "pagination-page-info"], ["title", "Next page", 1, "pagination-btn", 3, "click", "disabled"], [1, "fas", "fa-chevron-right"], ["title", "Last page", 1, "pagination-btn", 3, "click", "disabled"], [1, "fas", "fa-angles-right"], [1, "unified-list"], [1, "list-table"], [1, "col-checkbox"], [1, "fas", 3, "click", "ngClass"], [1, "col-name", "sortable", 3, "click"], [1, "col-type", "sortable", 3, "click"], [1, "col-modified", "sortable", 3, "click"], [1, "col-owner"], [1, "list-item", 3, "selected", "active", "dragging", "drag-over", "draggable"], [1, "list-item", 3, "dragstart", "dragend", "dragover", "dragleave", "drop", "click", "dblclick", "contextmenu", "draggable"], [1, "col-name"], [1, "list-name-cell"], ["title", "Shared", 1, "fas", "fa-users", "shared-indicator"], [1, "col-type"], [1, "col-modified"], [1, "shelf-info"], [1, "shelf-chips"], [1, "shelf-chip", 3, "title"], [1, "shelf-actions"], [1, "btn-toolbar", "btn-primary-toolbar", 3, "click", "disabled", "title"], [1, "fas", "fa-arrow-down"], [1, "shelf-chip-name"], ["title", "Remove", 1, "shelf-chip-x", 3, "click"], [1, "context-menu-backdrop", 3, "click"], [1, "context-menu"], [1, "context-menu-item", 3, "click"], [1, "fas", "fa-folder-open"], [1, "context-menu-divider"], [1, "context-menu-item"], [1, "context-menu-item", "context-menu-danger", 3, "click"], [1, "context-menu-note"], [1, "move-target-list"], [1, "fas", "fa-spinner", "fa-spin"], [1, "context-menu-item", 3, "paddingLeft"], [1, "fas", "fa-eye"], [1, "fas", "fa-comments"], [1, "fas", "fa-chevron-right", "submenu-arrow"], [1, "fas", "fa-times-circle"]], template: function CollectionsFullViewComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵlistener("keydown", function CollectionsFullViewComponent_Template_div_keydown_0_listener($event) { return ctx.handleKeyboardShortcut($event); });
             i0.ɵɵelementStart(1, "div", 1)(2, "div", 2)(3, "button", 3);
@@ -2641,7 +2622,7 @@ export class CollectionsFullViewComponent extends BaseAngularComponent {
             i0.ɵɵconditionalCreate(26, CollectionsFullViewComponent_Conditional_26_Template, 10, 4, "div", 22);
             i0.ɵɵelementStart(27, "div", 23);
             i0.ɵɵconditionalCreate(28, CollectionsFullViewComponent_Conditional_28_Template, 2, 0, "div", 24);
-            i0.ɵɵconditionalCreate(29, CollectionsFullViewComponent_Conditional_29_Template, 5, 3, "div", 25);
+            i0.ɵɵconditionalCreate(29, CollectionsFullViewComponent_Conditional_29_Template, 2, 5, "mj-empty-state", 25);
             i0.ɵɵconditionalCreate(30, CollectionsFullViewComponent_Conditional_30_Template, 4, 3);
             i0.ɵɵconditionalCreate(31, CollectionsFullViewComponent_Conditional_31_Template, 27, 10);
             i0.ɵɵelementEnd()();
@@ -2703,7 +2684,7 @@ export class CollectionsFullViewComponent extends BaseAngularComponent {
             i0.ɵɵproperty("isOpen", ctx.isArtifactModalOpen)("collectionId", ctx.currentCollectionId || "")("environmentId", ctx.environmentId)("currentUser", ctx.currentUser);
             i0.ɵɵadvance();
             i0.ɵɵproperty("isOpen", ctx.isShareModalOpen)("collection", ctx.sharingCollection)("currentUser", ctx.currentUser)("currentUserPermissions", ctx.sharingCollection ? ctx.userPermissions.get(ctx.sharingCollection.ID) || null : null);
-        } }, dependencies: [i6.NgClass, i7.DefaultValueAccessor, i7.NgControlStatus, i7.NgModel, i8.LoadingComponent, i9.CollectionShareModalComponent, i10.CollectionFormModalComponent, i11.ArtifactCreateModalComponent, i6.DatePipe], styles: ["[_nghost-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      min-height: 0;\n    }\n\n    \n\n    .collections-view[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      height: 100%;\n      background: var(--mj-bg-surface-sunken);\n      position: relative;\n    }\n\n    \n\n    .collections-header[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      padding: 12px 20px;\n      border-bottom: 1px solid var(--mj-border-default);\n      gap: 16px;\n      background: var(--mj-bg-surface);\n    }\n\n    .collections-breadcrumb[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      flex: 1;\n      min-width: 0;\n    }\n\n    .breadcrumb-item[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .breadcrumb-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-text-muted);\n      font-size: 14px;\n    }\n\n    .breadcrumb-link[_ngcontent-%COMP%] {\n      color: var(--mj-text-primary);\n      font-weight: 500;\n      cursor: pointer;\n      text-decoration: none;\n      white-space: nowrap;\n      transition: color 150ms ease;\n      font-size: 14px;\n    }\n\n    .breadcrumb-link[_ngcontent-%COMP%]:hover {\n      color: var(--mj-brand-primary);\n    }\n\n    .breadcrumb-link.active[_ngcontent-%COMP%] {\n      color: var(--mj-text-muted);\n      cursor: default;\n    }\n\n    .breadcrumb-path[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      overflow-x: auto;\n    }\n\n    .breadcrumb-separator[_ngcontent-%COMP%] {\n      color: var(--mj-border-strong);\n      font-size: 10px;\n    }\n\n    .collections-actions[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    \n\n    .btn-primary[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 6px 12px;\n      background: var(--mj-brand-primary);\n      border: none;\n      border-radius: 6px;\n      color: var(--mj-text-inverse);\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: background 150ms ease;\n    }\n\n    .btn-primary[_ngcontent-%COMP%]:hover {\n      background: var(--mj-brand-primary-hover);\n    }\n\n    .btn-primary[_ngcontent-%COMP%]   i.fa-chevron-down[_ngcontent-%COMP%] {\n      font-size: 10px;\n      margin-left: 2px;\n    }\n\n    .btn-icon[_ngcontent-%COMP%] {\n      padding: 6px 10px;\n      background: transparent;\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      cursor: pointer;\n      color: var(--mj-text-muted);\n      transition: all 150ms ease;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .btn-icon[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-primary);\n      border-color: var(--mj-text-disabled);\n    }\n\n    .btn-icon.active[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      border-color: var(--mj-brand-primary);\n    }\n\n    .btn-icon.active[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n    }\n\n    \n\n    .dropdown-container[_ngcontent-%COMP%] {\n      position: relative;\n    }\n\n    .dropdown-menu[_ngcontent-%COMP%] {\n      position: absolute;\n      top: calc(100% + 4px);\n      left: 0;\n      min-width: 200px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n      padding: 4px;\n      z-index: 1000;\n    }\n\n    .dropdown-menu-right[_ngcontent-%COMP%] {\n      left: auto;\n      right: 0;\n    }\n\n    .dropdown-item[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      width: 100%;\n      padding: 8px 12px;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: var(--mj-text-primary);\n      font-size: 13px;\n      cursor: pointer;\n      text-align: left;\n      transition: background 100ms ease;\n    }\n\n    .dropdown-item[_ngcontent-%COMP%]:hover:not(:disabled) {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .dropdown-item[_ngcontent-%COMP%]:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .dropdown-item.active[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n    }\n\n    .dropdown-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 14px;\n      width: 16px;\n      text-align: center;\n      color: var(--mj-text-muted);\n    }\n\n    .dropdown-item.active[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-brand-primary);\n    }\n\n    .dropdown-divider[_ngcontent-%COMP%] {\n      height: 1px;\n      background: var(--mj-border-default);\n      margin: 4px 0;\n    }\n\n    \n\n    .search-container[_ngcontent-%COMP%] {\n      position: relative;\n      display: flex;\n      align-items: center;\n      min-width: 200px;\n    }\n\n    .search-container[_ngcontent-%COMP%]   i.fa-search[_ngcontent-%COMP%] {\n      position: absolute;\n      left: 10px;\n      color: var(--mj-text-disabled);\n      font-size: 13px;\n      pointer-events: none;\n    }\n\n    .search-input[_ngcontent-%COMP%] {\n      width: 100%;\n      padding: 6px 32px 6px 32px;\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      font-size: 13px;\n      outline: none;\n      transition: all 150ms ease;\n    }\n\n    .search-input[_ngcontent-%COMP%]:focus {\n      border-color: var(--mj-brand-primary);\n      box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    }\n\n    .search-clear[_ngcontent-%COMP%] {\n      position: absolute;\n      right: 6px;\n      padding: 4px;\n      background: transparent;\n      border: none;\n      color: var(--mj-text-disabled);\n      cursor: pointer;\n      border-radius: 4px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .search-clear[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-muted);\n    }\n\n    \n\n    .selection-toolbar[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 8px 20px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-bottom: 1px solid color-mix(in srgb, var(--mj-brand-primary) 30%, var(--mj-bg-surface));\n    }\n\n    .selection-info[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .selection-count[_ngcontent-%COMP%] {\n      font-size: 13px;\n      font-weight: 600;\n      color: var(--mj-brand-primary);\n    }\n\n    .selection-actions[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 8px;\n    }\n\n    .btn-toolbar[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 6px 12px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      color: var(--mj-text-secondary);\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 150ms ease;\n    }\n\n    .btn-toolbar[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n      border-color: var(--mj-text-disabled);\n    }\n\n    .btn-toolbar.btn-danger[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n      border-color: color-mix(in srgb, var(--mj-status-error) 30%, var(--mj-bg-surface));\n    }\n\n    .btn-toolbar.btn-danger[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n      border-color: var(--mj-status-error);\n    }\n\n    \n\n    .collections-content[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      overflow-y: auto;\n      padding: 20px;\n    }\n\n    \n\n    .loading-state[_ngcontent-%COMP%], .empty-state[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      flex: 1;\n      min-height: 0;\n      color: var(--mj-text-disabled);\n      text-align: center;\n      padding: 24px;\n    }\n\n    .empty-state[_ngcontent-%COMP%]    > i[_ngcontent-%COMP%] {\n      font-size: 64px;\n      margin-bottom: 24px;\n      opacity: 0.3;\n      color: var(--mj-border-strong);\n    }\n\n    .empty-state[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n      margin: 0 0 8px 0;\n      color: var(--mj-text-secondary);\n      font-size: 18px;\n      font-weight: 600;\n    }\n\n    .empty-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n      margin: 0 0 24px 0;\n      font-size: 14px;\n      color: var(--mj-text-muted);\n    }\n\n    .empty-state[_ngcontent-%COMP%]   .empty-state-cta[_ngcontent-%COMP%] {\n      padding: 10px 20px;\n      font-size: 14px;\n      border-radius: 8px;\n    }\n\n    .empty-state-actions[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 12px;\n      flex-wrap: wrap;\n      justify-content: center;\n    }\n\n    \n\n    .unified-grid[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));\n      gap: 16px;\n      padding: 4px;\n      flex-shrink: 0;\n    }\n\n    .grid-item[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      padding: 12px;\n      background: var(--mj-bg-surface);\n      border: 2px solid transparent;\n      border-radius: 8px;\n      cursor: pointer;\n      transition: all 150ms ease;\n      position: relative;\n      user-select: none;\n    }\n\n    .grid-item[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n      border-color: var(--mj-border-strong);\n    }\n\n    .grid-item.selected[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-color: var(--mj-brand-primary);\n    }\n\n    .grid-item.active[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      border-color: var(--mj-status-warning);\n      box-shadow: 0 0 0 1px var(--mj-status-warning);\n    }\n\n    .grid-item.active[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-warning) 25%, var(--mj-bg-surface));\n    }\n\n    \n\n    .unified-grid.select-mode[_ngcontent-%COMP%]   .grid-item[_ngcontent-%COMP%] {\n      cursor: pointer;\n    }\n\n    .unified-grid.select-mode[_ngcontent-%COMP%]   .grid-item[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-color: color-mix(in srgb, var(--mj-brand-primary) 30%, var(--mj-bg-surface));\n    }\n\n    .item-checkbox[_ngcontent-%COMP%] {\n      position: absolute;\n      top: 8px;\n      right: 8px;\n      width: 20px;\n      height: 20px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      cursor: pointer;\n      z-index: 10;\n    }\n\n    .item-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 16px;\n      color: var(--mj-text-disabled);\n      transition: color 150ms ease;\n    }\n\n    .grid-item.selected[_ngcontent-%COMP%]   .item-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%], \n   .item-checkbox[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: var(--mj-brand-primary);\n    }\n\n    .grid-item-content[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .grid-icon[_ngcontent-%COMP%] {\n      width: 64px;\n      height: 64px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 8px;\n      position: relative;\n    }\n\n    .grid-icon.folder-icon[_ngcontent-%COMP%] {\n      background: var(--mj-brand-primary);\n    }\n\n    .grid-icon.folder-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 36px;\n      color: var(--mj-text-inverse);\n    }\n\n    .grid-icon.artifact-icon[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .grid-icon.artifact-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 32px;\n      color: var(--mj-text-muted);\n    }\n\n    .shared-badge[_ngcontent-%COMP%] {\n      position: absolute;\n      top: -4px;\n      right: -4px;\n      width: 20px;\n      height: 20px;\n      background: var(--mj-status-success);\n      border-radius: 50%;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border: 2px solid var(--mj-bg-surface);\n    }\n\n    .shared-badge[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n      color: var(--mj-text-inverse);\n    }\n\n    .grid-info[_ngcontent-%COMP%] {\n      width: 100%;\n      text-align: center;\n    }\n\n    .grid-name[_ngcontent-%COMP%] {\n      font-size: 13px;\n      font-weight: 500;\n      color: var(--mj-text-primary);\n      line-height: 1.3;\n      margin-bottom: 4px;\n      \n\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      word-break: break-word;\n    }\n\n    .grid-description[_ngcontent-%COMP%] {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      line-height: 1.3;\n      margin-bottom: 4px;\n      \n\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      word-break: break-word;\n    }\n\n    .grid-meta[_ngcontent-%COMP%] {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      margin-top: 4px;\n    }\n\n    .grid-owner[_ngcontent-%COMP%] {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      margin-top: 2px;\n    }\n\n    .grid-owner[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n      margin-right: 3px;\n    }\n\n    .version-badge[_ngcontent-%COMP%] {\n      display: inline-block;\n      padding: 2px 6px;\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-warning);\n      border-radius: 3px;\n      font-size: 10px;\n      font-weight: 600;\n      font-family: monospace;\n      margin-right: 4px;\n    }\n\n    .artifact-type-badge[_ngcontent-%COMP%] {\n      display: inline-block;\n      padding: 2px 6px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      border-radius: 3px;\n      font-size: 10px;\n      font-weight: 500;\n      text-transform: uppercase;\n    }\n\n    \n\n    .unified-list[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      overflow: hidden;\n      flex-shrink: 0;\n    }\n\n    .list-table[_ngcontent-%COMP%] {\n      width: 100%;\n      border-collapse: collapse;\n    }\n\n    .list-table[_ngcontent-%COMP%]   thead[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface-sunken);\n      border-bottom: 1px solid var(--mj-border-default);\n    }\n\n    .list-table[_ngcontent-%COMP%]   th[_ngcontent-%COMP%] {\n      padding: 10px 16px;\n      text-align: left;\n      font-size: 12px;\n      font-weight: 600;\n      color: var(--mj-text-muted);\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n    }\n\n    .list-table[_ngcontent-%COMP%]   th.sortable[_ngcontent-%COMP%] {\n      cursor: pointer;\n      user-select: none;\n      transition: color 150ms ease;\n    }\n\n    .list-table[_ngcontent-%COMP%]   th.sortable[_ngcontent-%COMP%]:hover {\n      color: var(--mj-brand-primary);\n    }\n\n    .list-table[_ngcontent-%COMP%]   th.sortable[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n      display: inline-block;\n      margin-right: 6px;\n    }\n\n    .list-table[_ngcontent-%COMP%]   th.sortable[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n      opacity: 0.5;\n    }\n\n    .list-table[_ngcontent-%COMP%]   th.sortable[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      opacity: 1;\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%] {\n      border-bottom: 1px solid var(--mj-bg-surface-sunken);\n      transition: background 150ms ease;\n      cursor: pointer;\n      user-select: none;\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]:last-child {\n      border-bottom: none;\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr.selected[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr.active[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      border-left: 3px solid var(--mj-status-warning);\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr.active[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-warning) 25%, var(--mj-bg-surface));\n    }\n\n    .list-table[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] {\n      padding: 12px 16px;\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n    }\n\n    .col-checkbox[_ngcontent-%COMP%] {\n      width: 40px;\n      text-align: center;\n    }\n\n    .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 16px;\n      color: var(--mj-text-disabled);\n      cursor: pointer;\n      transition: color 150ms ease;\n    }\n\n    .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:hover, \n   .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr.selected[_ngcontent-%COMP%]   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-brand-primary);\n    }\n\n    .col-name[_ngcontent-%COMP%] {\n      min-width: 300px;\n    }\n\n    .list-name-cell[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n    }\n\n    .list-name-cell[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 16px;\n      color: var(--mj-text-muted);\n      width: 20px;\n      text-align: center;\n    }\n\n    .list-name-cell[_ngcontent-%COMP%]   .fa-folder[_ngcontent-%COMP%] {\n      color: var(--mj-brand-primary);\n    }\n\n    .shared-indicator[_ngcontent-%COMP%] {\n      font-size: 12px;\n      color: var(--mj-status-success);\n      margin-left: auto;\n    }\n\n    .col-type[_ngcontent-%COMP%] {\n      width: 150px;\n    }\n\n    .col-modified[_ngcontent-%COMP%] {\n      width: 180px;\n    }\n\n    .col-owner[_ngcontent-%COMP%] {\n      width: 150px;\n    }\n\n    \n\n    .pagination-bar[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 10px 16px;\n      margin-top: 8px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n      flex-shrink: 0;\n    }\n\n    .pagination-info[_ngcontent-%COMP%] {\n      white-space: nowrap;\n    }\n\n    .pagination-controls[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n\n    .pagination-btn[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: 32px;\n      height: 32px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      background: var(--mj-bg-surface);\n      color: var(--mj-text-secondary);\n      cursor: pointer;\n      transition: all 150ms ease;\n      font-size: 12px;\n    }\n\n    .pagination-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n      background: var(--mj-bg-surface-hover);\n      border-color: var(--mj-border-strong);\n      color: var(--mj-text-primary);\n    }\n\n    .pagination-btn[_ngcontent-%COMP%]:disabled {\n      opacity: 0.35;\n      cursor: default;\n    }\n\n    .pagination-page-info[_ngcontent-%COMP%] {\n      padding: 0 8px;\n      white-space: nowrap;\n      font-weight: 500;\n    }\n\n    \n\n    .toolbar-separator[_ngcontent-%COMP%] {\n      width: 1px;\n      height: 24px;\n      background: var(--mj-border-strong);\n      margin: 0 4px;\n    }\n\n    .toolbar-actions-group[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n\n    .btn-icon-danger[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n      border-color: color-mix(in srgb, var(--mj-status-error) 30%, var(--mj-bg-surface));\n    }\n\n    .btn-icon-danger[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-error);\n      border-color: var(--mj-status-error);\n    }\n\n    \n\n    .context-menu-backdrop[_ngcontent-%COMP%] {\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      z-index: 1999;\n    }\n\n    .context-menu[_ngcontent-%COMP%] {\n      position: fixed;\n      min-width: 180px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);\n      padding: 4px;\n      z-index: 2000;\n    }\n\n    .context-menu-item[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      width: 100%;\n      padding: 8px 12px;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: var(--mj-text-primary);\n      font-size: 13px;\n      cursor: pointer;\n      text-align: left;\n      transition: background 100ms ease;\n    }\n\n    .context-menu-item[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .context-menu-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 14px;\n      width: 16px;\n      text-align: center;\n      color: var(--mj-text-muted);\n    }\n\n    .context-menu-danger[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n    }\n\n    .context-menu-danger[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n    }\n\n    .context-menu-danger[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n    }\n\n    .context-menu-divider[_ngcontent-%COMP%] {\n      height: 1px;\n      background: var(--mj-border-default);\n      margin: 4px 0;\n    }\n    .submenu-arrow[_ngcontent-%COMP%] {\n      margin-left: auto;\n      font-size: 10px;\n      opacity: 0.6;\n    }\n    .move-target-list[_ngcontent-%COMP%] {\n      max-height: 240px;\n      overflow-y: auto;\n    }\n    .context-menu-note[_ngcontent-%COMP%] {\n      padding: 8px 14px;\n      font-size: 12px;\n      color: var(--mj-text-muted);\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    \n\n    .collections-body[_ngcontent-%COMP%] {\n      flex: 1;\n      display: flex;\n      flex-direction: row;\n      min-height: 0;\n      overflow: hidden;\n    }\n    .collections-navigator[_ngcontent-%COMP%] {\n      width: 240px;\n      flex-shrink: 0;\n      border-right: 1px solid var(--mj-border-default);\n      background: var(--mj-bg-surface);\n      overflow-y: auto;\n      display: flex;\n      flex-direction: column;\n    }\n    .nav-header[_ngcontent-%COMP%] {\n      padding: 12px 14px 8px;\n      font-size: 11px;\n      font-weight: 700;\n      text-transform: uppercase;\n      letter-spacing: 0.06em;\n      color: var(--mj-text-muted);\n    }\n    .nav-list[_ngcontent-%COMP%] { display: flex; flex-direction: column; padding: 0 6px 12px; gap: 1px; }\n    .nav-row[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      width: 100%;\n      padding: 7px 10px;\n      border: 1px solid transparent;\n      border-radius: 6px;\n      background: transparent;\n      color: var(--mj-text-secondary);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: background 0.12s ease;\n    }\n    .nav-row[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n    .nav-row.active[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      font-weight: 600;\n    }\n    .nav-row.drag-over[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n      border-color: var(--mj-brand-primary);\n    }\n    .nav-row[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 13px; width: 16px; flex-shrink: 0; }\n    .nav-row-name[_ngcontent-%COMP%] { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .nav-toggle.active[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n\n    \n\n    .grid-item.dragging[_ngcontent-%COMP%], .list-item.dragging[_ngcontent-%COMP%] { opacity: 0.4; }\n    .grid-item.drag-over[_ngcontent-%COMP%] {\n      border-color: var(--mj-brand-primary) !important;\n      background: color-mix(in srgb, var(--mj-brand-primary) 18%, var(--mj-bg-surface)) !important;\n    }\n    .list-item.drag-over[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 14%, var(--mj-bg-surface));\n      box-shadow: inset 0 0 0 1px var(--mj-brand-primary);\n    }\n    .breadcrumb-item.drag-over[_ngcontent-%COMP%], .breadcrumb-link.drag-over[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 20%, transparent);\n      border-radius: 6px;\n      outline: 1px solid var(--mj-brand-primary);\n    }\n\n    \n\n    .item-checkbox[_ngcontent-%COMP%] { opacity: 0; transition: opacity 150ms ease; }\n    .grid-item[_ngcontent-%COMP%]:hover   .item-checkbox[_ngcontent-%COMP%], \n   .grid-item.selected[_ngcontent-%COMP%]   .item-checkbox[_ngcontent-%COMP%], \n   .unified-grid.select-mode[_ngcontent-%COMP%]   .item-checkbox[_ngcontent-%COMP%] { opacity: 1; }\n    .list-item[_ngcontent-%COMP%]   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { opacity: 0; transition: opacity 150ms ease; }\n    .list-item[_ngcontent-%COMP%]:hover   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%], \n   .list-item.selected[_ngcontent-%COMP%]   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%], \n   .unified-list.select-mode[_ngcontent-%COMP%]   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { opacity: 1; }\n    .list-item.selected[_ngcontent-%COMP%]   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n\n    \n\n    .bulk-move-backdrop[_ngcontent-%COMP%] {\n      position: fixed; inset: 0; z-index: 1000;\n    }\n    .bulk-move-menu[_ngcontent-%COMP%] {\n      max-height: 320px;\n      overflow-y: auto;\n      z-index: 1001;\n    }\n    .dropdown-note[_ngcontent-%COMP%] { padding: 10px 14px; font-size: 12px; color: var(--mj-text-muted); }\n\n    \n\n    .staging-shelf[_ngcontent-%COMP%] {\n      flex-shrink: 0;\n      display: flex;\n      align-items: center;\n      gap: 14px;\n      padding: 10px 16px;\n      background: var(--mj-bg-surface);\n      border-top: 1px solid var(--mj-border-default);\n      box-shadow: 0 -2px 8px color-mix(in srgb, var(--mj-text-primary) 6%, transparent);\n    }\n    .shelf-info[_ngcontent-%COMP%] {\n      display: flex; align-items: center; gap: 8px;\n      font-weight: 600; font-size: 13px; color: var(--mj-text-primary);\n      flex-shrink: 0;\n    }\n    .shelf-info[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n    .shelf-chips[_ngcontent-%COMP%] {\n      flex: 1; min-width: 0;\n      display: flex; gap: 6px; overflow-x: auto; padding: 2px 0;\n    }\n    .shelf-chip[_ngcontent-%COMP%] {\n      display: inline-flex; align-items: center; gap: 6px;\n      padding: 4px 6px 4px 10px;\n      background: var(--mj-bg-surface-sunken);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 999px;\n      font-size: 12px; color: var(--mj-text-secondary);\n      flex-shrink: 0;\n    }\n    .shelf-chip-name[_ngcontent-%COMP%] { max-width: 120px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .shelf-chip-x[_ngcontent-%COMP%] {\n      width: 18px; height: 18px; border: 0; background: transparent;\n      color: var(--mj-text-muted); cursor: pointer; border-radius: 50%;\n      display: flex; align-items: center; justify-content: center; font-size: 10px;\n    }\n    .shelf-chip-x[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n    .shelf-actions[_ngcontent-%COMP%] { display: flex; gap: 8px; flex-shrink: 0; }\n    .btn-toolbar.btn-primary-toolbar[_ngcontent-%COMP%] {\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border-color: var(--mj-brand-primary);\n    }\n    .btn-toolbar.btn-primary-toolbar[_ngcontent-%COMP%]:hover:not(:disabled) { background: var(--mj-brand-primary-hover); }\n    .btn-toolbar[_ngcontent-%COMP%]:disabled { opacity: 0.5; cursor: not-allowed; }"] });
+        } }, dependencies: [i6.NgClass, i7.DefaultValueAccessor, i7.NgControlStatus, i7.NgModel, i8.MJEmptyStateComponent, i9.LoadingComponent, i10.CollectionShareModalComponent, i11.CollectionFormModalComponent, i12.ArtifactCreateModalComponent, i6.DatePipe], styles: ["[_nghost-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      min-height: 0;\n    }\n\n    \n\n    .collections-view[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      height: 100%;\n      background: var(--mj-bg-surface-sunken);\n      position: relative;\n    }\n\n    \n\n    .collections-header[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      padding: 12px 20px;\n      border-bottom: 1px solid var(--mj-border-default);\n      gap: 16px;\n      background: var(--mj-bg-surface);\n    }\n\n    .collections-breadcrumb[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      flex: 1;\n      min-width: 0;\n    }\n\n    .breadcrumb-item[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .breadcrumb-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-text-muted);\n      font-size: 14px;\n    }\n\n    .breadcrumb-link[_ngcontent-%COMP%] {\n      color: var(--mj-text-primary);\n      font-weight: 500;\n      cursor: pointer;\n      text-decoration: none;\n      white-space: nowrap;\n      transition: color 150ms ease;\n      font-size: 14px;\n    }\n\n    .breadcrumb-link[_ngcontent-%COMP%]:hover {\n      color: var(--mj-brand-primary);\n    }\n\n    .breadcrumb-link.active[_ngcontent-%COMP%] {\n      color: var(--mj-text-muted);\n      cursor: default;\n    }\n\n    .breadcrumb-path[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      overflow-x: auto;\n    }\n\n    .breadcrumb-separator[_ngcontent-%COMP%] {\n      color: var(--mj-border-strong);\n      font-size: 10px;\n    }\n\n    .collections-actions[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    \n\n    .btn-primary[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 6px 12px;\n      background: var(--mj-brand-primary);\n      border: none;\n      border-radius: 6px;\n      color: var(--mj-text-inverse);\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: background 150ms ease;\n    }\n\n    .btn-primary[_ngcontent-%COMP%]:hover {\n      background: var(--mj-brand-primary-hover);\n    }\n\n    .btn-primary[_ngcontent-%COMP%]   i.fa-chevron-down[_ngcontent-%COMP%] {\n      font-size: 10px;\n      margin-left: 2px;\n    }\n\n    .btn-icon[_ngcontent-%COMP%] {\n      padding: 6px 10px;\n      background: transparent;\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      cursor: pointer;\n      color: var(--mj-text-muted);\n      transition: all 150ms ease;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .btn-icon[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-primary);\n      border-color: var(--mj-text-disabled);\n    }\n\n    .btn-icon.active[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      border-color: var(--mj-brand-primary);\n    }\n\n    .btn-icon.active[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n    }\n\n    \n\n    .dropdown-container[_ngcontent-%COMP%] {\n      position: relative;\n    }\n\n    .dropdown-menu[_ngcontent-%COMP%] {\n      position: absolute;\n      top: calc(100% + 4px);\n      left: 0;\n      min-width: 200px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n      padding: 4px;\n      z-index: 1000;\n    }\n\n    .dropdown-menu-right[_ngcontent-%COMP%] {\n      left: auto;\n      right: 0;\n    }\n\n    .dropdown-item[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      width: 100%;\n      padding: 8px 12px;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: var(--mj-text-primary);\n      font-size: 13px;\n      cursor: pointer;\n      text-align: left;\n      transition: background 100ms ease;\n    }\n\n    .dropdown-item[_ngcontent-%COMP%]:hover:not(:disabled) {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .dropdown-item[_ngcontent-%COMP%]:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .dropdown-item.active[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n    }\n\n    .dropdown-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 14px;\n      width: 16px;\n      text-align: center;\n      color: var(--mj-text-muted);\n    }\n\n    .dropdown-item.active[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-brand-primary);\n    }\n\n    .dropdown-divider[_ngcontent-%COMP%] {\n      height: 1px;\n      background: var(--mj-border-default);\n      margin: 4px 0;\n    }\n\n    \n\n    .search-container[_ngcontent-%COMP%] {\n      position: relative;\n      display: flex;\n      align-items: center;\n      min-width: 200px;\n    }\n\n    .search-container[_ngcontent-%COMP%]   i.fa-search[_ngcontent-%COMP%] {\n      position: absolute;\n      left: 10px;\n      color: var(--mj-text-disabled);\n      font-size: 13px;\n      pointer-events: none;\n    }\n\n    .search-input[_ngcontent-%COMP%] {\n      width: 100%;\n      padding: 6px 32px 6px 32px;\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      font-size: 13px;\n      outline: none;\n      transition: all 150ms ease;\n    }\n\n    .search-input[_ngcontent-%COMP%]:focus {\n      border-color: var(--mj-brand-primary);\n      box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    }\n\n    .search-clear[_ngcontent-%COMP%] {\n      position: absolute;\n      right: 6px;\n      padding: 4px;\n      background: transparent;\n      border: none;\n      color: var(--mj-text-disabled);\n      cursor: pointer;\n      border-radius: 4px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .search-clear[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-muted);\n    }\n\n    \n\n    .selection-toolbar[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 8px 20px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-bottom: 1px solid color-mix(in srgb, var(--mj-brand-primary) 30%, var(--mj-bg-surface));\n    }\n\n    .selection-info[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .selection-count[_ngcontent-%COMP%] {\n      font-size: 13px;\n      font-weight: 600;\n      color: var(--mj-brand-primary);\n    }\n\n    .selection-actions[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 8px;\n    }\n\n    .btn-toolbar[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 6px 12px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      color: var(--mj-text-secondary);\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 150ms ease;\n    }\n\n    .btn-toolbar[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n      border-color: var(--mj-text-disabled);\n    }\n\n    .btn-toolbar.btn-danger[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n      border-color: color-mix(in srgb, var(--mj-status-error) 30%, var(--mj-bg-surface));\n    }\n\n    .btn-toolbar.btn-danger[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n      border-color: var(--mj-status-error);\n    }\n\n    \n\n    .collections-content[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      overflow-y: auto;\n      padding: 20px;\n    }\n\n    \n\n    .loading-state[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      flex: 1;\n      min-height: 0;\n      color: var(--mj-text-disabled);\n      text-align: center;\n      padding: 24px;\n    }\n\n    .collections-content[_ngcontent-%COMP%]   mj-empty-state[_ngcontent-%COMP%] {\n      flex: 1;\n      min-height: 0;\n    }\n\n    .empty-collection-hint[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 14px;\n      color: var(--mj-text-muted);\n    }\n\n    \n\n    .unified-grid[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));\n      gap: 16px;\n      padding: 4px;\n      flex-shrink: 0;\n    }\n\n    .grid-item[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      padding: 12px;\n      background: var(--mj-bg-surface);\n      border: 2px solid transparent;\n      border-radius: 8px;\n      cursor: pointer;\n      transition: all 150ms ease;\n      position: relative;\n      user-select: none;\n    }\n\n    .grid-item[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n      border-color: var(--mj-border-strong);\n    }\n\n    .grid-item.selected[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-color: var(--mj-brand-primary);\n    }\n\n    .grid-item.active[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      border-color: var(--mj-status-warning);\n      box-shadow: 0 0 0 1px var(--mj-status-warning);\n    }\n\n    .grid-item.active[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-warning) 25%, var(--mj-bg-surface));\n    }\n\n    \n\n    .unified-grid.select-mode[_ngcontent-%COMP%]   .grid-item[_ngcontent-%COMP%] {\n      cursor: pointer;\n    }\n\n    .unified-grid.select-mode[_ngcontent-%COMP%]   .grid-item[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-color: color-mix(in srgb, var(--mj-brand-primary) 30%, var(--mj-bg-surface));\n    }\n\n    .item-checkbox[_ngcontent-%COMP%] {\n      position: absolute;\n      top: 8px;\n      right: 8px;\n      width: 20px;\n      height: 20px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      cursor: pointer;\n      z-index: 10;\n    }\n\n    .item-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 16px;\n      color: var(--mj-text-disabled);\n      transition: color 150ms ease;\n    }\n\n    .grid-item.selected[_ngcontent-%COMP%]   .item-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%], \n   .item-checkbox[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: var(--mj-brand-primary);\n    }\n\n    .grid-item-content[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .grid-icon[_ngcontent-%COMP%] {\n      width: 64px;\n      height: 64px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 8px;\n      position: relative;\n    }\n\n    .grid-icon.folder-icon[_ngcontent-%COMP%] {\n      background: var(--mj-brand-primary);\n    }\n\n    .grid-icon.folder-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 36px;\n      color: var(--mj-text-inverse);\n    }\n\n    .grid-icon.artifact-icon[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .grid-icon.artifact-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 32px;\n      color: var(--mj-text-muted);\n    }\n\n    .shared-badge[_ngcontent-%COMP%] {\n      position: absolute;\n      top: -4px;\n      right: -4px;\n      width: 20px;\n      height: 20px;\n      background: var(--mj-status-success);\n      border-radius: 50%;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border: 2px solid var(--mj-bg-surface);\n    }\n\n    .shared-badge[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n      color: var(--mj-text-inverse);\n    }\n\n    .grid-info[_ngcontent-%COMP%] {\n      width: 100%;\n      text-align: center;\n    }\n\n    .grid-name[_ngcontent-%COMP%] {\n      font-size: 13px;\n      font-weight: 500;\n      color: var(--mj-text-primary);\n      line-height: 1.3;\n      margin-bottom: 4px;\n      \n\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      word-break: break-word;\n    }\n\n    .grid-description[_ngcontent-%COMP%] {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      line-height: 1.3;\n      margin-bottom: 4px;\n      \n\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      word-break: break-word;\n    }\n\n    .grid-meta[_ngcontent-%COMP%] {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      margin-top: 4px;\n    }\n\n    .grid-owner[_ngcontent-%COMP%] {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      margin-top: 2px;\n    }\n\n    .grid-owner[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n      margin-right: 3px;\n    }\n\n    .version-badge[_ngcontent-%COMP%] {\n      display: inline-block;\n      padding: 2px 6px;\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-warning);\n      border-radius: 3px;\n      font-size: 10px;\n      font-weight: 600;\n      font-family: monospace;\n      margin-right: 4px;\n    }\n\n    .artifact-type-badge[_ngcontent-%COMP%] {\n      display: inline-block;\n      padding: 2px 6px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      border-radius: 3px;\n      font-size: 10px;\n      font-weight: 500;\n      text-transform: uppercase;\n    }\n\n    \n\n    .unified-list[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      overflow: hidden;\n      flex-shrink: 0;\n    }\n\n    .list-table[_ngcontent-%COMP%] {\n      width: 100%;\n      border-collapse: collapse;\n    }\n\n    .list-table[_ngcontent-%COMP%]   thead[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface-sunken);\n      border-bottom: 1px solid var(--mj-border-default);\n    }\n\n    .list-table[_ngcontent-%COMP%]   th[_ngcontent-%COMP%] {\n      padding: 10px 16px;\n      text-align: left;\n      font-size: 12px;\n      font-weight: 600;\n      color: var(--mj-text-muted);\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n    }\n\n    .list-table[_ngcontent-%COMP%]   th.sortable[_ngcontent-%COMP%] {\n      cursor: pointer;\n      user-select: none;\n      transition: color 150ms ease;\n    }\n\n    .list-table[_ngcontent-%COMP%]   th.sortable[_ngcontent-%COMP%]:hover {\n      color: var(--mj-brand-primary);\n    }\n\n    .list-table[_ngcontent-%COMP%]   th.sortable[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n      display: inline-block;\n      margin-right: 6px;\n    }\n\n    .list-table[_ngcontent-%COMP%]   th.sortable[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n      opacity: 0.5;\n    }\n\n    .list-table[_ngcontent-%COMP%]   th.sortable[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      opacity: 1;\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%] {\n      border-bottom: 1px solid var(--mj-bg-surface-sunken);\n      transition: background 150ms ease;\n      cursor: pointer;\n      user-select: none;\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]:last-child {\n      border-bottom: none;\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr.selected[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr.active[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      border-left: 3px solid var(--mj-status-warning);\n    }\n\n    .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr.active[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-warning) 25%, var(--mj-bg-surface));\n    }\n\n    .list-table[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] {\n      padding: 12px 16px;\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n    }\n\n    .col-checkbox[_ngcontent-%COMP%] {\n      width: 40px;\n      text-align: center;\n    }\n\n    .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 16px;\n      color: var(--mj-text-disabled);\n      cursor: pointer;\n      transition: color 150ms ease;\n    }\n\n    .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:hover, \n   .list-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr.selected[_ngcontent-%COMP%]   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-brand-primary);\n    }\n\n    .col-name[_ngcontent-%COMP%] {\n      min-width: 300px;\n    }\n\n    .list-name-cell[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n    }\n\n    .list-name-cell[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 16px;\n      color: var(--mj-text-muted);\n      width: 20px;\n      text-align: center;\n    }\n\n    .list-name-cell[_ngcontent-%COMP%]   .fa-folder[_ngcontent-%COMP%] {\n      color: var(--mj-brand-primary);\n    }\n\n    .shared-indicator[_ngcontent-%COMP%] {\n      font-size: 12px;\n      color: var(--mj-status-success);\n      margin-left: auto;\n    }\n\n    .col-type[_ngcontent-%COMP%] {\n      width: 150px;\n    }\n\n    .col-modified[_ngcontent-%COMP%] {\n      width: 180px;\n    }\n\n    .col-owner[_ngcontent-%COMP%] {\n      width: 150px;\n    }\n\n    \n\n    .pagination-bar[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 10px 16px;\n      margin-top: 8px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n      flex-shrink: 0;\n    }\n\n    .pagination-info[_ngcontent-%COMP%] {\n      white-space: nowrap;\n    }\n\n    .pagination-controls[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n\n    .pagination-btn[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: 32px;\n      height: 32px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      background: var(--mj-bg-surface);\n      color: var(--mj-text-secondary);\n      cursor: pointer;\n      transition: all 150ms ease;\n      font-size: 12px;\n    }\n\n    .pagination-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n      background: var(--mj-bg-surface-hover);\n      border-color: var(--mj-border-strong);\n      color: var(--mj-text-primary);\n    }\n\n    .pagination-btn[_ngcontent-%COMP%]:disabled {\n      opacity: 0.35;\n      cursor: default;\n    }\n\n    .pagination-page-info[_ngcontent-%COMP%] {\n      padding: 0 8px;\n      white-space: nowrap;\n      font-weight: 500;\n    }\n\n    \n\n    .toolbar-separator[_ngcontent-%COMP%] {\n      width: 1px;\n      height: 24px;\n      background: var(--mj-border-strong);\n      margin: 0 4px;\n    }\n\n    .toolbar-actions-group[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n\n    .btn-icon-danger[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n      border-color: color-mix(in srgb, var(--mj-status-error) 30%, var(--mj-bg-surface));\n    }\n\n    .btn-icon-danger[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-error);\n      border-color: var(--mj-status-error);\n    }\n\n    \n\n    .context-menu-backdrop[_ngcontent-%COMP%] {\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      z-index: 1999;\n    }\n\n    .context-menu[_ngcontent-%COMP%] {\n      position: fixed;\n      min-width: 180px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);\n      padding: 4px;\n      z-index: 2000;\n    }\n\n    .context-menu-item[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      width: 100%;\n      padding: 8px 12px;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: var(--mj-text-primary);\n      font-size: 13px;\n      cursor: pointer;\n      text-align: left;\n      transition: background 100ms ease;\n    }\n\n    .context-menu-item[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .context-menu-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 14px;\n      width: 16px;\n      text-align: center;\n      color: var(--mj-text-muted);\n    }\n\n    .context-menu-danger[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n    }\n\n    .context-menu-danger[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n    }\n\n    .context-menu-danger[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n    }\n\n    .context-menu-divider[_ngcontent-%COMP%] {\n      height: 1px;\n      background: var(--mj-border-default);\n      margin: 4px 0;\n    }\n    .submenu-arrow[_ngcontent-%COMP%] {\n      margin-left: auto;\n      font-size: 10px;\n      opacity: 0.6;\n    }\n    .move-target-list[_ngcontent-%COMP%] {\n      max-height: 240px;\n      overflow-y: auto;\n    }\n    .context-menu-note[_ngcontent-%COMP%] {\n      padding: 8px 14px;\n      font-size: 12px;\n      color: var(--mj-text-muted);\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    \n\n    .collections-body[_ngcontent-%COMP%] {\n      flex: 1;\n      display: flex;\n      flex-direction: row;\n      min-height: 0;\n      overflow: hidden;\n    }\n    .collections-navigator[_ngcontent-%COMP%] {\n      width: 240px;\n      flex-shrink: 0;\n      border-right: 1px solid var(--mj-border-default);\n      background: var(--mj-bg-surface);\n      overflow-y: auto;\n      display: flex;\n      flex-direction: column;\n    }\n    .nav-header[_ngcontent-%COMP%] {\n      padding: 12px 14px 8px;\n      font-size: 11px;\n      font-weight: 700;\n      text-transform: uppercase;\n      letter-spacing: 0.06em;\n      color: var(--mj-text-muted);\n    }\n    .nav-list[_ngcontent-%COMP%] { display: flex; flex-direction: column; padding: 0 6px 12px; gap: 1px; }\n    .nav-row[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      width: 100%;\n      padding: 7px 10px;\n      border: 1px solid transparent;\n      border-radius: 6px;\n      background: transparent;\n      color: var(--mj-text-secondary);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: background 0.12s ease;\n    }\n    .nav-row[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n    .nav-row.active[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      font-weight: 600;\n    }\n    .nav-row.drag-over[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n      border-color: var(--mj-brand-primary);\n    }\n    .nav-row[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 13px; width: 16px; flex-shrink: 0; }\n    .nav-row-name[_ngcontent-%COMP%] { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .nav-toggle.active[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n\n    \n\n    .grid-item.dragging[_ngcontent-%COMP%], .list-item.dragging[_ngcontent-%COMP%] { opacity: 0.4; }\n    .grid-item.drag-over[_ngcontent-%COMP%] {\n      border-color: var(--mj-brand-primary) !important;\n      background: color-mix(in srgb, var(--mj-brand-primary) 18%, var(--mj-bg-surface)) !important;\n    }\n    .list-item.drag-over[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 14%, var(--mj-bg-surface));\n      box-shadow: inset 0 0 0 1px var(--mj-brand-primary);\n    }\n    .breadcrumb-item.drag-over[_ngcontent-%COMP%], .breadcrumb-link.drag-over[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 20%, transparent);\n      border-radius: 6px;\n      outline: 1px solid var(--mj-brand-primary);\n    }\n\n    \n\n    .item-checkbox[_ngcontent-%COMP%] { opacity: 0; transition: opacity 150ms ease; }\n    .grid-item[_ngcontent-%COMP%]:hover   .item-checkbox[_ngcontent-%COMP%], \n   .grid-item.selected[_ngcontent-%COMP%]   .item-checkbox[_ngcontent-%COMP%], \n   .unified-grid.select-mode[_ngcontent-%COMP%]   .item-checkbox[_ngcontent-%COMP%] { opacity: 1; }\n    .list-item[_ngcontent-%COMP%]   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { opacity: 0; transition: opacity 150ms ease; }\n    .list-item[_ngcontent-%COMP%]:hover   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%], \n   .list-item.selected[_ngcontent-%COMP%]   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%], \n   .unified-list.select-mode[_ngcontent-%COMP%]   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { opacity: 1; }\n    .list-item.selected[_ngcontent-%COMP%]   .col-checkbox[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n\n    \n\n    .bulk-move-backdrop[_ngcontent-%COMP%] {\n      position: fixed; inset: 0; z-index: 1000;\n    }\n    .bulk-move-menu[_ngcontent-%COMP%] {\n      max-height: 320px;\n      overflow-y: auto;\n      z-index: 1001;\n    }\n    .dropdown-note[_ngcontent-%COMP%] { padding: 10px 14px; font-size: 12px; color: var(--mj-text-muted); }\n\n    \n\n    .staging-shelf[_ngcontent-%COMP%] {\n      flex-shrink: 0;\n      display: flex;\n      align-items: center;\n      gap: 14px;\n      padding: 10px 16px;\n      background: var(--mj-bg-surface);\n      border-top: 1px solid var(--mj-border-default);\n      box-shadow: 0 -2px 8px color-mix(in srgb, var(--mj-text-primary) 6%, transparent);\n    }\n    .shelf-info[_ngcontent-%COMP%] {\n      display: flex; align-items: center; gap: 8px;\n      font-weight: 600; font-size: 13px; color: var(--mj-text-primary);\n      flex-shrink: 0;\n    }\n    .shelf-info[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n    .shelf-chips[_ngcontent-%COMP%] {\n      flex: 1; min-width: 0;\n      display: flex; gap: 6px; overflow-x: auto; padding: 2px 0;\n    }\n    .shelf-chip[_ngcontent-%COMP%] {\n      display: inline-flex; align-items: center; gap: 6px;\n      padding: 4px 6px 4px 10px;\n      background: var(--mj-bg-surface-sunken);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 999px;\n      font-size: 12px; color: var(--mj-text-secondary);\n      flex-shrink: 0;\n    }\n    .shelf-chip-name[_ngcontent-%COMP%] { max-width: 120px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .shelf-chip-x[_ngcontent-%COMP%] {\n      width: 18px; height: 18px; border: 0; background: transparent;\n      color: var(--mj-text-muted); cursor: pointer; border-radius: 50%;\n      display: flex; align-items: center; justify-content: center; font-size: 10px;\n    }\n    .shelf-chip-x[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n    .shelf-actions[_ngcontent-%COMP%] { display: flex; gap: 8px; flex-shrink: 0; }\n    .btn-toolbar.btn-primary-toolbar[_ngcontent-%COMP%] {\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border-color: var(--mj-brand-primary);\n    }\n    .btn-toolbar.btn-primary-toolbar[_ngcontent-%COMP%]:hover:not(:disabled) { background: var(--mj-brand-primary-hover); }\n    .btn-toolbar[_ngcontent-%COMP%]:disabled { opacity: 0.5; cursor: not-allowed; }"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CollectionsFullViewComponent, [{
         type: Component,
@@ -2960,32 +2941,19 @@ export class CollectionsFullViewComponent extends BaseAngularComponent {
     
         <!-- Empty state -->
         @if (!isLoading && unifiedItems.length === 0) {
-          <div class="empty-state">
-            <i class="fas fa-folder-open"></i>
-            <!-- Search returned no results -->
-            @if (searchQuery) {
-              <h3>No items found</h3>
-              <p>Try adjusting your search</p>
-            }
-            <!-- Empty root level -->
-            @if (!searchQuery && !currentCollectionId) {
-              <h3>No collections yet</h3>
-              <p>Create your first collection to get started</p>
-              @if (canEditCurrent()) {
-                <button class="btn-primary empty-state-cta"
-                  (click)="createCollection()"
-                  >
-                  <i class="fas fa-plus"></i>
-                  Create Collection
-                </button>
-              }
-            }
-            <!-- Empty collection (has parent) -->
+          <mj-empty-state
+            [Variant]="searchQuery ? 'no-results' : 'empty'"
+            Icon="fa-solid fa-folder-open"
+            [Title]="EmptyStateTitle"
+            [Message]="EmptyStateMessage"
+            [ActionText]="(!searchQuery && !currentCollectionId && canEditCurrent()) ? 'Create Collection' : ''"
+            ActionIcon="fa-solid fa-plus"
+            (Action)="createCollection()">
+            <!-- Empty collection (has parent): rich hint with emphasis -->
             @if (!searchQuery && currentCollectionId) {
-              <h3>This collection is empty</h3>
-              <p>Use the <strong>New</strong> button above to add collections or artifacts</p>
+              <p class="empty-collection-hint">Use the <strong>New</strong> button above to add collections or artifacts</p>
             }
-          </div>
+          </mj-empty-state>
         }
     
         <!-- Grid view -->
@@ -3412,7 +3380,7 @@ export class CollectionsFullViewComponent extends BaseAngularComponent {
       (saved)="onPermissionsChanged()"
       (cancelled)="onShareModalCancelled()">
     </mj-collection-share-modal>
-    `, styles: ["\n    :host {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      min-height: 0;\n    }\n\n    /* Main container */\n    .collections-view {\n      display: flex;\n      flex-direction: column;\n      height: 100%;\n      background: var(--mj-bg-surface-sunken);\n      position: relative;\n    }\n\n    /* Header */\n    .collections-header {\n      display: flex;\n      align-items: center;\n      padding: 12px 20px;\n      border-bottom: 1px solid var(--mj-border-default);\n      gap: 16px;\n      background: var(--mj-bg-surface);\n    }\n\n    .collections-breadcrumb {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      flex: 1;\n      min-width: 0;\n    }\n\n    .breadcrumb-item {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .breadcrumb-item i {\n      color: var(--mj-text-muted);\n      font-size: 14px;\n    }\n\n    .breadcrumb-link {\n      color: var(--mj-text-primary);\n      font-weight: 500;\n      cursor: pointer;\n      text-decoration: none;\n      white-space: nowrap;\n      transition: color 150ms ease;\n      font-size: 14px;\n    }\n\n    .breadcrumb-link:hover {\n      color: var(--mj-brand-primary);\n    }\n\n    .breadcrumb-link.active {\n      color: var(--mj-text-muted);\n      cursor: default;\n    }\n\n    .breadcrumb-path {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      overflow-x: auto;\n    }\n\n    .breadcrumb-separator {\n      color: var(--mj-border-strong);\n      font-size: 10px;\n    }\n\n    .collections-actions {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    /* Button styles */\n    .btn-primary {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 6px 12px;\n      background: var(--mj-brand-primary);\n      border: none;\n      border-radius: 6px;\n      color: var(--mj-text-inverse);\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: background 150ms ease;\n    }\n\n    .btn-primary:hover {\n      background: var(--mj-brand-primary-hover);\n    }\n\n    .btn-primary i.fa-chevron-down {\n      font-size: 10px;\n      margin-left: 2px;\n    }\n\n    .btn-icon {\n      padding: 6px 10px;\n      background: transparent;\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      cursor: pointer;\n      color: var(--mj-text-muted);\n      transition: all 150ms ease;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .btn-icon:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-primary);\n      border-color: var(--mj-text-disabled);\n    }\n\n    .btn-icon.active {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      border-color: var(--mj-brand-primary);\n    }\n\n    .btn-icon.active:hover {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n    }\n\n    /* Dropdown menus */\n    .dropdown-container {\n      position: relative;\n    }\n\n    .dropdown-menu {\n      position: absolute;\n      top: calc(100% + 4px);\n      left: 0;\n      min-width: 200px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n      padding: 4px;\n      z-index: 1000;\n    }\n\n    .dropdown-menu-right {\n      left: auto;\n      right: 0;\n    }\n\n    .dropdown-item {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      width: 100%;\n      padding: 8px 12px;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: var(--mj-text-primary);\n      font-size: 13px;\n      cursor: pointer;\n      text-align: left;\n      transition: background 100ms ease;\n    }\n\n    .dropdown-item:hover:not(:disabled) {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .dropdown-item:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .dropdown-item.active {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n    }\n\n    .dropdown-item i {\n      font-size: 14px;\n      width: 16px;\n      text-align: center;\n      color: var(--mj-text-muted);\n    }\n\n    .dropdown-item.active i {\n      color: var(--mj-brand-primary);\n    }\n\n    .dropdown-divider {\n      height: 1px;\n      background: var(--mj-border-default);\n      margin: 4px 0;\n    }\n\n    /* Search */\n    .search-container {\n      position: relative;\n      display: flex;\n      align-items: center;\n      min-width: 200px;\n    }\n\n    .search-container i.fa-search {\n      position: absolute;\n      left: 10px;\n      color: var(--mj-text-disabled);\n      font-size: 13px;\n      pointer-events: none;\n    }\n\n    .search-input {\n      width: 100%;\n      padding: 6px 32px 6px 32px;\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      font-size: 13px;\n      outline: none;\n      transition: all 150ms ease;\n    }\n\n    .search-input:focus {\n      border-color: var(--mj-brand-primary);\n      box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    }\n\n    .search-clear {\n      position: absolute;\n      right: 6px;\n      padding: 4px;\n      background: transparent;\n      border: none;\n      color: var(--mj-text-disabled);\n      cursor: pointer;\n      border-radius: 4px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .search-clear:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-muted);\n    }\n\n    /* Selection toolbar */\n    .selection-toolbar {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 8px 20px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-bottom: 1px solid color-mix(in srgb, var(--mj-brand-primary) 30%, var(--mj-bg-surface));\n    }\n\n    .selection-info {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .selection-count {\n      font-size: 13px;\n      font-weight: 600;\n      color: var(--mj-brand-primary);\n    }\n\n    .selection-actions {\n      display: flex;\n      gap: 8px;\n    }\n\n    .btn-toolbar {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 6px 12px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      color: var(--mj-text-secondary);\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 150ms ease;\n    }\n\n    .btn-toolbar:hover {\n      background: var(--mj-bg-surface-sunken);\n      border-color: var(--mj-text-disabled);\n    }\n\n    .btn-toolbar.btn-danger {\n      color: var(--mj-status-error);\n      border-color: color-mix(in srgb, var(--mj-status-error) 30%, var(--mj-bg-surface));\n    }\n\n    .btn-toolbar.btn-danger:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n      border-color: var(--mj-status-error);\n    }\n\n    /* Content area */\n    .collections-content {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      overflow-y: auto;\n      padding: 20px;\n    }\n\n    /* Loading and empty states */\n    .loading-state, .empty-state {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      flex: 1;\n      min-height: 0;\n      color: var(--mj-text-disabled);\n      text-align: center;\n      padding: 24px;\n    }\n\n    .empty-state > i {\n      font-size: 64px;\n      margin-bottom: 24px;\n      opacity: 0.3;\n      color: var(--mj-border-strong);\n    }\n\n    .empty-state h3 {\n      margin: 0 0 8px 0;\n      color: var(--mj-text-secondary);\n      font-size: 18px;\n      font-weight: 600;\n    }\n\n    .empty-state p {\n      margin: 0 0 24px 0;\n      font-size: 14px;\n      color: var(--mj-text-muted);\n    }\n\n    .empty-state .empty-state-cta {\n      padding: 10px 20px;\n      font-size: 14px;\n      border-radius: 8px;\n    }\n\n    .empty-state-actions {\n      display: flex;\n      gap: 12px;\n      flex-wrap: wrap;\n      justify-content: center;\n    }\n\n    /* Grid view */\n    .unified-grid {\n      display: grid;\n      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));\n      gap: 16px;\n      padding: 4px;\n      flex-shrink: 0;\n    }\n\n    .grid-item {\n      display: flex;\n      flex-direction: column;\n      padding: 12px;\n      background: var(--mj-bg-surface);\n      border: 2px solid transparent;\n      border-radius: 8px;\n      cursor: pointer;\n      transition: all 150ms ease;\n      position: relative;\n      user-select: none;\n    }\n\n    .grid-item:hover {\n      background: var(--mj-bg-surface-sunken);\n      border-color: var(--mj-border-strong);\n    }\n\n    .grid-item.selected {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-color: var(--mj-brand-primary);\n    }\n\n    .grid-item.active {\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      border-color: var(--mj-status-warning);\n      box-shadow: 0 0 0 1px var(--mj-status-warning);\n    }\n\n    .grid-item.active:hover {\n      background: color-mix(in srgb, var(--mj-status-warning) 25%, var(--mj-bg-surface));\n    }\n\n    /* Select mode styling for grid */\n    .unified-grid.select-mode .grid-item {\n      cursor: pointer;\n    }\n\n    .unified-grid.select-mode .grid-item:hover {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-color: color-mix(in srgb, var(--mj-brand-primary) 30%, var(--mj-bg-surface));\n    }\n\n    .item-checkbox {\n      position: absolute;\n      top: 8px;\n      right: 8px;\n      width: 20px;\n      height: 20px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      cursor: pointer;\n      z-index: 10;\n    }\n\n    .item-checkbox i {\n      font-size: 16px;\n      color: var(--mj-text-disabled);\n      transition: color 150ms ease;\n    }\n\n    .grid-item.selected .item-checkbox i,\n    .item-checkbox:hover i {\n      color: var(--mj-brand-primary);\n    }\n\n    .grid-item-content {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .grid-icon {\n      width: 64px;\n      height: 64px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 8px;\n      position: relative;\n    }\n\n    .grid-icon.folder-icon {\n      background: var(--mj-brand-primary);\n    }\n\n    .grid-icon.folder-icon i {\n      font-size: 36px;\n      color: var(--mj-text-inverse);\n    }\n\n    .grid-icon.artifact-icon {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .grid-icon.artifact-icon i {\n      font-size: 32px;\n      color: var(--mj-text-muted);\n    }\n\n    .shared-badge {\n      position: absolute;\n      top: -4px;\n      right: -4px;\n      width: 20px;\n      height: 20px;\n      background: var(--mj-status-success);\n      border-radius: 50%;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border: 2px solid var(--mj-bg-surface);\n    }\n\n    .shared-badge i {\n      font-size: 10px;\n      color: var(--mj-text-inverse);\n    }\n\n    .grid-info {\n      width: 100%;\n      text-align: center;\n    }\n\n    .grid-name {\n      font-size: 13px;\n      font-weight: 500;\n      color: var(--mj-text-primary);\n      line-height: 1.3;\n      margin-bottom: 4px;\n      /* Allow wrapping to 2 lines max */\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      word-break: break-word;\n    }\n\n    .grid-description {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      line-height: 1.3;\n      margin-bottom: 4px;\n      /* Allow wrapping to 2 lines max */\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      word-break: break-word;\n    }\n\n    .grid-meta {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      margin-top: 4px;\n    }\n\n    .grid-owner {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      margin-top: 2px;\n    }\n\n    .grid-owner i {\n      font-size: 10px;\n      margin-right: 3px;\n    }\n\n    .version-badge {\n      display: inline-block;\n      padding: 2px 6px;\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-warning);\n      border-radius: 3px;\n      font-size: 10px;\n      font-weight: 600;\n      font-family: monospace;\n      margin-right: 4px;\n    }\n\n    .artifact-type-badge {\n      display: inline-block;\n      padding: 2px 6px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      border-radius: 3px;\n      font-size: 10px;\n      font-weight: 500;\n      text-transform: uppercase;\n    }\n\n    /* List view */\n    .unified-list {\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      overflow: hidden;\n      flex-shrink: 0;\n    }\n\n    .list-table {\n      width: 100%;\n      border-collapse: collapse;\n    }\n\n    .list-table thead {\n      background: var(--mj-bg-surface-sunken);\n      border-bottom: 1px solid var(--mj-border-default);\n    }\n\n    .list-table th {\n      padding: 10px 16px;\n      text-align: left;\n      font-size: 12px;\n      font-weight: 600;\n      color: var(--mj-text-muted);\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n    }\n\n    .list-table th.sortable {\n      cursor: pointer;\n      user-select: none;\n      transition: color 150ms ease;\n    }\n\n    .list-table th.sortable:hover {\n      color: var(--mj-brand-primary);\n    }\n\n    .list-table th.sortable span {\n      display: inline-block;\n      margin-right: 6px;\n    }\n\n    .list-table th.sortable i {\n      font-size: 10px;\n      opacity: 0.5;\n    }\n\n    .list-table th.sortable:hover i {\n      opacity: 1;\n    }\n\n    .list-table tbody tr {\n      border-bottom: 1px solid var(--mj-bg-surface-sunken);\n      transition: background 150ms ease;\n      cursor: pointer;\n      user-select: none;\n    }\n\n    .list-table tbody tr:last-child {\n      border-bottom: none;\n    }\n\n    .list-table tbody tr:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .list-table tbody tr.selected {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n    }\n\n    .list-table tbody tr.active {\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      border-left: 3px solid var(--mj-status-warning);\n    }\n\n    .list-table tbody tr.active:hover {\n      background: color-mix(in srgb, var(--mj-status-warning) 25%, var(--mj-bg-surface));\n    }\n\n    .list-table td {\n      padding: 12px 16px;\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n    }\n\n    .col-checkbox {\n      width: 40px;\n      text-align: center;\n    }\n\n    .col-checkbox i {\n      font-size: 16px;\n      color: var(--mj-text-disabled);\n      cursor: pointer;\n      transition: color 150ms ease;\n    }\n\n    .col-checkbox i:hover,\n    .list-table tbody tr.selected .col-checkbox i {\n      color: var(--mj-brand-primary);\n    }\n\n    .col-name {\n      min-width: 300px;\n    }\n\n    .list-name-cell {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n    }\n\n    .list-name-cell i {\n      font-size: 16px;\n      color: var(--mj-text-muted);\n      width: 20px;\n      text-align: center;\n    }\n\n    .list-name-cell .fa-folder {\n      color: var(--mj-brand-primary);\n    }\n\n    .shared-indicator {\n      font-size: 12px;\n      color: var(--mj-status-success);\n      margin-left: auto;\n    }\n\n    .col-type {\n      width: 150px;\n    }\n\n    .col-modified {\n      width: 180px;\n    }\n\n    .col-owner {\n      width: 150px;\n    }\n\n    /* Pagination */\n    .pagination-bar {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 10px 16px;\n      margin-top: 8px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n      flex-shrink: 0;\n    }\n\n    .pagination-info {\n      white-space: nowrap;\n    }\n\n    .pagination-controls {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n\n    .pagination-btn {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: 32px;\n      height: 32px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      background: var(--mj-bg-surface);\n      color: var(--mj-text-secondary);\n      cursor: pointer;\n      transition: all 150ms ease;\n      font-size: 12px;\n    }\n\n    .pagination-btn:hover:not(:disabled) {\n      background: var(--mj-bg-surface-hover);\n      border-color: var(--mj-border-strong);\n      color: var(--mj-text-primary);\n    }\n\n    .pagination-btn:disabled {\n      opacity: 0.35;\n      cursor: default;\n    }\n\n    .pagination-page-info {\n      padding: 0 8px;\n      white-space: nowrap;\n      font-weight: 500;\n    }\n\n    /* Toolbar separator and action group */\n    .toolbar-separator {\n      width: 1px;\n      height: 24px;\n      background: var(--mj-border-strong);\n      margin: 0 4px;\n    }\n\n    .toolbar-actions-group {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n\n    .btn-icon-danger {\n      color: var(--mj-status-error);\n      border-color: color-mix(in srgb, var(--mj-status-error) 30%, var(--mj-bg-surface));\n    }\n\n    .btn-icon-danger:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-error);\n      border-color: var(--mj-status-error);\n    }\n\n    /* Context menu */\n    .context-menu-backdrop {\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      z-index: 1999;\n    }\n\n    .context-menu {\n      position: fixed;\n      min-width: 180px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);\n      padding: 4px;\n      z-index: 2000;\n    }\n\n    .context-menu-item {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      width: 100%;\n      padding: 8px 12px;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: var(--mj-text-primary);\n      font-size: 13px;\n      cursor: pointer;\n      text-align: left;\n      transition: background 100ms ease;\n    }\n\n    .context-menu-item:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .context-menu-item i {\n      font-size: 14px;\n      width: 16px;\n      text-align: center;\n      color: var(--mj-text-muted);\n    }\n\n    .context-menu-danger {\n      color: var(--mj-status-error);\n    }\n\n    .context-menu-danger i {\n      color: var(--mj-status-error);\n    }\n\n    .context-menu-danger:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n    }\n\n    .context-menu-divider {\n      height: 1px;\n      background: var(--mj-border-default);\n      margin: 4px 0;\n    }\n    .submenu-arrow {\n      margin-left: auto;\n      font-size: 10px;\n      opacity: 0.6;\n    }\n    .move-target-list {\n      max-height: 240px;\n      overflow-y: auto;\n    }\n    .context-menu-note {\n      padding: 8px 14px;\n      font-size: 12px;\n      color: var(--mj-text-muted);\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    /* ===== Body: navigator pane + content (#6) ===== */\n    .collections-body {\n      flex: 1;\n      display: flex;\n      flex-direction: row;\n      min-height: 0;\n      overflow: hidden;\n    }\n    .collections-navigator {\n      width: 240px;\n      flex-shrink: 0;\n      border-right: 1px solid var(--mj-border-default);\n      background: var(--mj-bg-surface);\n      overflow-y: auto;\n      display: flex;\n      flex-direction: column;\n    }\n    .nav-header {\n      padding: 12px 14px 8px;\n      font-size: 11px;\n      font-weight: 700;\n      text-transform: uppercase;\n      letter-spacing: 0.06em;\n      color: var(--mj-text-muted);\n    }\n    .nav-list { display: flex; flex-direction: column; padding: 0 6px 12px; gap: 1px; }\n    .nav-row {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      width: 100%;\n      padding: 7px 10px;\n      border: 1px solid transparent;\n      border-radius: 6px;\n      background: transparent;\n      color: var(--mj-text-secondary);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: background 0.12s ease;\n    }\n    .nav-row:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n    .nav-row.active {\n      background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      font-weight: 600;\n    }\n    .nav-row.drag-over {\n      background: color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n      border-color: var(--mj-brand-primary);\n    }\n    .nav-row i { font-size: 13px; width: 16px; flex-shrink: 0; }\n    .nav-row-name { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .nav-toggle.active { color: var(--mj-brand-primary); }\n\n    /* ===== Drag-and-drop visuals (#1/#2) ===== */\n    .grid-item.dragging, .list-item.dragging { opacity: 0.4; }\n    .grid-item.drag-over {\n      border-color: var(--mj-brand-primary) !important;\n      background: color-mix(in srgb, var(--mj-brand-primary) 18%, var(--mj-bg-surface)) !important;\n    }\n    .list-item.drag-over td {\n      background: color-mix(in srgb, var(--mj-brand-primary) 14%, var(--mj-bg-surface));\n      box-shadow: inset 0 0 0 1px var(--mj-brand-primary);\n    }\n    .breadcrumb-item.drag-over, .breadcrumb-link.drag-over {\n      background: color-mix(in srgb, var(--mj-brand-primary) 20%, transparent);\n      border-radius: 6px;\n      outline: 1px solid var(--mj-brand-primary);\n    }\n\n    /* Hover-reveal checkboxes (frictionless selection #4) */\n    .item-checkbox { opacity: 0; transition: opacity 150ms ease; }\n    .grid-item:hover .item-checkbox,\n    .grid-item.selected .item-checkbox,\n    .unified-grid.select-mode .item-checkbox { opacity: 1; }\n    .list-item .col-checkbox i { opacity: 0; transition: opacity 150ms ease; }\n    .list-item:hover .col-checkbox i,\n    .list-item.selected .col-checkbox i,\n    .unified-list.select-mode .col-checkbox i { opacity: 1; }\n    .list-item.selected .col-checkbox i { color: var(--mj-brand-primary); }\n\n    /* ===== Bulk \"Move to\u2026\" popover (#3) ===== */\n    .bulk-move-backdrop {\n      position: fixed; inset: 0; z-index: 1000;\n    }\n    .bulk-move-menu {\n      max-height: 320px;\n      overflow-y: auto;\n      z-index: 1001;\n    }\n    .dropdown-note { padding: 10px 14px; font-size: 12px; color: var(--mj-text-muted); }\n\n    /* ===== Staging shelf (#5) ===== */\n    .staging-shelf {\n      flex-shrink: 0;\n      display: flex;\n      align-items: center;\n      gap: 14px;\n      padding: 10px 16px;\n      background: var(--mj-bg-surface);\n      border-top: 1px solid var(--mj-border-default);\n      box-shadow: 0 -2px 8px color-mix(in srgb, var(--mj-text-primary) 6%, transparent);\n    }\n    .shelf-info {\n      display: flex; align-items: center; gap: 8px;\n      font-weight: 600; font-size: 13px; color: var(--mj-text-primary);\n      flex-shrink: 0;\n    }\n    .shelf-info i { color: var(--mj-brand-primary); }\n    .shelf-chips {\n      flex: 1; min-width: 0;\n      display: flex; gap: 6px; overflow-x: auto; padding: 2px 0;\n    }\n    .shelf-chip {\n      display: inline-flex; align-items: center; gap: 6px;\n      padding: 4px 6px 4px 10px;\n      background: var(--mj-bg-surface-sunken);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 999px;\n      font-size: 12px; color: var(--mj-text-secondary);\n      flex-shrink: 0;\n    }\n    .shelf-chip-name { max-width: 120px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .shelf-chip-x {\n      width: 18px; height: 18px; border: 0; background: transparent;\n      color: var(--mj-text-muted); cursor: pointer; border-radius: 50%;\n      display: flex; align-items: center; justify-content: center; font-size: 10px;\n    }\n    .shelf-chip-x:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n    .shelf-actions { display: flex; gap: 8px; flex-shrink: 0; }\n    .btn-toolbar.btn-primary-toolbar {\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border-color: var(--mj-brand-primary);\n    }\n    .btn-toolbar.btn-primary-toolbar:hover:not(:disabled) { background: var(--mj-brand-primary-hover); }\n    .btn-toolbar:disabled { opacity: 0.5; cursor: not-allowed; }\n  "] }]
+    `, styles: ["\n    :host {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      min-height: 0;\n    }\n\n    /* Main container */\n    .collections-view {\n      display: flex;\n      flex-direction: column;\n      height: 100%;\n      background: var(--mj-bg-surface-sunken);\n      position: relative;\n    }\n\n    /* Header */\n    .collections-header {\n      display: flex;\n      align-items: center;\n      padding: 12px 20px;\n      border-bottom: 1px solid var(--mj-border-default);\n      gap: 16px;\n      background: var(--mj-bg-surface);\n    }\n\n    .collections-breadcrumb {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      flex: 1;\n      min-width: 0;\n    }\n\n    .breadcrumb-item {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .breadcrumb-item i {\n      color: var(--mj-text-muted);\n      font-size: 14px;\n    }\n\n    .breadcrumb-link {\n      color: var(--mj-text-primary);\n      font-weight: 500;\n      cursor: pointer;\n      text-decoration: none;\n      white-space: nowrap;\n      transition: color 150ms ease;\n      font-size: 14px;\n    }\n\n    .breadcrumb-link:hover {\n      color: var(--mj-brand-primary);\n    }\n\n    .breadcrumb-link.active {\n      color: var(--mj-text-muted);\n      cursor: default;\n    }\n\n    .breadcrumb-path {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      overflow-x: auto;\n    }\n\n    .breadcrumb-separator {\n      color: var(--mj-border-strong);\n      font-size: 10px;\n    }\n\n    .collections-actions {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    /* Button styles */\n    .btn-primary {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 6px 12px;\n      background: var(--mj-brand-primary);\n      border: none;\n      border-radius: 6px;\n      color: var(--mj-text-inverse);\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: background 150ms ease;\n    }\n\n    .btn-primary:hover {\n      background: var(--mj-brand-primary-hover);\n    }\n\n    .btn-primary i.fa-chevron-down {\n      font-size: 10px;\n      margin-left: 2px;\n    }\n\n    .btn-icon {\n      padding: 6px 10px;\n      background: transparent;\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      cursor: pointer;\n      color: var(--mj-text-muted);\n      transition: all 150ms ease;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .btn-icon:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-primary);\n      border-color: var(--mj-text-disabled);\n    }\n\n    .btn-icon.active {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      border-color: var(--mj-brand-primary);\n    }\n\n    .btn-icon.active:hover {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n    }\n\n    /* Dropdown menus */\n    .dropdown-container {\n      position: relative;\n    }\n\n    .dropdown-menu {\n      position: absolute;\n      top: calc(100% + 4px);\n      left: 0;\n      min-width: 200px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n      padding: 4px;\n      z-index: 1000;\n    }\n\n    .dropdown-menu-right {\n      left: auto;\n      right: 0;\n    }\n\n    .dropdown-item {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      width: 100%;\n      padding: 8px 12px;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: var(--mj-text-primary);\n      font-size: 13px;\n      cursor: pointer;\n      text-align: left;\n      transition: background 100ms ease;\n    }\n\n    .dropdown-item:hover:not(:disabled) {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .dropdown-item:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .dropdown-item.active {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n    }\n\n    .dropdown-item i {\n      font-size: 14px;\n      width: 16px;\n      text-align: center;\n      color: var(--mj-text-muted);\n    }\n\n    .dropdown-item.active i {\n      color: var(--mj-brand-primary);\n    }\n\n    .dropdown-divider {\n      height: 1px;\n      background: var(--mj-border-default);\n      margin: 4px 0;\n    }\n\n    /* Search */\n    .search-container {\n      position: relative;\n      display: flex;\n      align-items: center;\n      min-width: 200px;\n    }\n\n    .search-container i.fa-search {\n      position: absolute;\n      left: 10px;\n      color: var(--mj-text-disabled);\n      font-size: 13px;\n      pointer-events: none;\n    }\n\n    .search-input {\n      width: 100%;\n      padding: 6px 32px 6px 32px;\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      font-size: 13px;\n      outline: none;\n      transition: all 150ms ease;\n    }\n\n    .search-input:focus {\n      border-color: var(--mj-brand-primary);\n      box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    }\n\n    .search-clear {\n      position: absolute;\n      right: 6px;\n      padding: 4px;\n      background: transparent;\n      border: none;\n      color: var(--mj-text-disabled);\n      cursor: pointer;\n      border-radius: 4px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .search-clear:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-muted);\n    }\n\n    /* Selection toolbar */\n    .selection-toolbar {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 8px 20px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-bottom: 1px solid color-mix(in srgb, var(--mj-brand-primary) 30%, var(--mj-bg-surface));\n    }\n\n    .selection-info {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .selection-count {\n      font-size: 13px;\n      font-weight: 600;\n      color: var(--mj-brand-primary);\n    }\n\n    .selection-actions {\n      display: flex;\n      gap: 8px;\n    }\n\n    .btn-toolbar {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 6px 12px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-strong);\n      border-radius: 6px;\n      color: var(--mj-text-secondary);\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 150ms ease;\n    }\n\n    .btn-toolbar:hover {\n      background: var(--mj-bg-surface-sunken);\n      border-color: var(--mj-text-disabled);\n    }\n\n    .btn-toolbar.btn-danger {\n      color: var(--mj-status-error);\n      border-color: color-mix(in srgb, var(--mj-status-error) 30%, var(--mj-bg-surface));\n    }\n\n    .btn-toolbar.btn-danger:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n      border-color: var(--mj-status-error);\n    }\n\n    /* Content area */\n    .collections-content {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      overflow-y: auto;\n      padding: 20px;\n    }\n\n    /* Loading and empty states */\n    .loading-state {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      flex: 1;\n      min-height: 0;\n      color: var(--mj-text-disabled);\n      text-align: center;\n      padding: 24px;\n    }\n\n    .collections-content mj-empty-state {\n      flex: 1;\n      min-height: 0;\n    }\n\n    .empty-collection-hint {\n      margin: 0;\n      font-size: 14px;\n      color: var(--mj-text-muted);\n    }\n\n    /* Grid view */\n    .unified-grid {\n      display: grid;\n      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));\n      gap: 16px;\n      padding: 4px;\n      flex-shrink: 0;\n    }\n\n    .grid-item {\n      display: flex;\n      flex-direction: column;\n      padding: 12px;\n      background: var(--mj-bg-surface);\n      border: 2px solid transparent;\n      border-radius: 8px;\n      cursor: pointer;\n      transition: all 150ms ease;\n      position: relative;\n      user-select: none;\n    }\n\n    .grid-item:hover {\n      background: var(--mj-bg-surface-sunken);\n      border-color: var(--mj-border-strong);\n    }\n\n    .grid-item.selected {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-color: var(--mj-brand-primary);\n    }\n\n    .grid-item.active {\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      border-color: var(--mj-status-warning);\n      box-shadow: 0 0 0 1px var(--mj-status-warning);\n    }\n\n    .grid-item.active:hover {\n      background: color-mix(in srgb, var(--mj-status-warning) 25%, var(--mj-bg-surface));\n    }\n\n    /* Select mode styling for grid */\n    .unified-grid.select-mode .grid-item {\n      cursor: pointer;\n    }\n\n    .unified-grid.select-mode .grid-item:hover {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      border-color: color-mix(in srgb, var(--mj-brand-primary) 30%, var(--mj-bg-surface));\n    }\n\n    .item-checkbox {\n      position: absolute;\n      top: 8px;\n      right: 8px;\n      width: 20px;\n      height: 20px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      cursor: pointer;\n      z-index: 10;\n    }\n\n    .item-checkbox i {\n      font-size: 16px;\n      color: var(--mj-text-disabled);\n      transition: color 150ms ease;\n    }\n\n    .grid-item.selected .item-checkbox i,\n    .item-checkbox:hover i {\n      color: var(--mj-brand-primary);\n    }\n\n    .grid-item-content {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .grid-icon {\n      width: 64px;\n      height: 64px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 8px;\n      position: relative;\n    }\n\n    .grid-icon.folder-icon {\n      background: var(--mj-brand-primary);\n    }\n\n    .grid-icon.folder-icon i {\n      font-size: 36px;\n      color: var(--mj-text-inverse);\n    }\n\n    .grid-icon.artifact-icon {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .grid-icon.artifact-icon i {\n      font-size: 32px;\n      color: var(--mj-text-muted);\n    }\n\n    .shared-badge {\n      position: absolute;\n      top: -4px;\n      right: -4px;\n      width: 20px;\n      height: 20px;\n      background: var(--mj-status-success);\n      border-radius: 50%;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border: 2px solid var(--mj-bg-surface);\n    }\n\n    .shared-badge i {\n      font-size: 10px;\n      color: var(--mj-text-inverse);\n    }\n\n    .grid-info {\n      width: 100%;\n      text-align: center;\n    }\n\n    .grid-name {\n      font-size: 13px;\n      font-weight: 500;\n      color: var(--mj-text-primary);\n      line-height: 1.3;\n      margin-bottom: 4px;\n      /* Allow wrapping to 2 lines max */\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      word-break: break-word;\n    }\n\n    .grid-description {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      line-height: 1.3;\n      margin-bottom: 4px;\n      /* Allow wrapping to 2 lines max */\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      word-break: break-word;\n    }\n\n    .grid-meta {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      margin-top: 4px;\n    }\n\n    .grid-owner {\n      font-size: 11px;\n      color: var(--mj-text-muted);\n      margin-top: 2px;\n    }\n\n    .grid-owner i {\n      font-size: 10px;\n      margin-right: 3px;\n    }\n\n    .version-badge {\n      display: inline-block;\n      padding: 2px 6px;\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-warning);\n      border-radius: 3px;\n      font-size: 10px;\n      font-weight: 600;\n      font-family: monospace;\n      margin-right: 4px;\n    }\n\n    .artifact-type-badge {\n      display: inline-block;\n      padding: 2px 6px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      border-radius: 3px;\n      font-size: 10px;\n      font-weight: 500;\n      text-transform: uppercase;\n    }\n\n    /* List view */\n    .unified-list {\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      overflow: hidden;\n      flex-shrink: 0;\n    }\n\n    .list-table {\n      width: 100%;\n      border-collapse: collapse;\n    }\n\n    .list-table thead {\n      background: var(--mj-bg-surface-sunken);\n      border-bottom: 1px solid var(--mj-border-default);\n    }\n\n    .list-table th {\n      padding: 10px 16px;\n      text-align: left;\n      font-size: 12px;\n      font-weight: 600;\n      color: var(--mj-text-muted);\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n    }\n\n    .list-table th.sortable {\n      cursor: pointer;\n      user-select: none;\n      transition: color 150ms ease;\n    }\n\n    .list-table th.sortable:hover {\n      color: var(--mj-brand-primary);\n    }\n\n    .list-table th.sortable span {\n      display: inline-block;\n      margin-right: 6px;\n    }\n\n    .list-table th.sortable i {\n      font-size: 10px;\n      opacity: 0.5;\n    }\n\n    .list-table th.sortable:hover i {\n      opacity: 1;\n    }\n\n    .list-table tbody tr {\n      border-bottom: 1px solid var(--mj-bg-surface-sunken);\n      transition: background 150ms ease;\n      cursor: pointer;\n      user-select: none;\n    }\n\n    .list-table tbody tr:last-child {\n      border-bottom: none;\n    }\n\n    .list-table tbody tr:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .list-table tbody tr.selected {\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n    }\n\n    .list-table tbody tr.active {\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      border-left: 3px solid var(--mj-status-warning);\n    }\n\n    .list-table tbody tr.active:hover {\n      background: color-mix(in srgb, var(--mj-status-warning) 25%, var(--mj-bg-surface));\n    }\n\n    .list-table td {\n      padding: 12px 16px;\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n    }\n\n    .col-checkbox {\n      width: 40px;\n      text-align: center;\n    }\n\n    .col-checkbox i {\n      font-size: 16px;\n      color: var(--mj-text-disabled);\n      cursor: pointer;\n      transition: color 150ms ease;\n    }\n\n    .col-checkbox i:hover,\n    .list-table tbody tr.selected .col-checkbox i {\n      color: var(--mj-brand-primary);\n    }\n\n    .col-name {\n      min-width: 300px;\n    }\n\n    .list-name-cell {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n    }\n\n    .list-name-cell i {\n      font-size: 16px;\n      color: var(--mj-text-muted);\n      width: 20px;\n      text-align: center;\n    }\n\n    .list-name-cell .fa-folder {\n      color: var(--mj-brand-primary);\n    }\n\n    .shared-indicator {\n      font-size: 12px;\n      color: var(--mj-status-success);\n      margin-left: auto;\n    }\n\n    .col-type {\n      width: 150px;\n    }\n\n    .col-modified {\n      width: 180px;\n    }\n\n    .col-owner {\n      width: 150px;\n    }\n\n    /* Pagination */\n    .pagination-bar {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 10px 16px;\n      margin-top: 8px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n      flex-shrink: 0;\n    }\n\n    .pagination-info {\n      white-space: nowrap;\n    }\n\n    .pagination-controls {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n\n    .pagination-btn {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: 32px;\n      height: 32px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      background: var(--mj-bg-surface);\n      color: var(--mj-text-secondary);\n      cursor: pointer;\n      transition: all 150ms ease;\n      font-size: 12px;\n    }\n\n    .pagination-btn:hover:not(:disabled) {\n      background: var(--mj-bg-surface-hover);\n      border-color: var(--mj-border-strong);\n      color: var(--mj-text-primary);\n    }\n\n    .pagination-btn:disabled {\n      opacity: 0.35;\n      cursor: default;\n    }\n\n    .pagination-page-info {\n      padding: 0 8px;\n      white-space: nowrap;\n      font-weight: 500;\n    }\n\n    /* Toolbar separator and action group */\n    .toolbar-separator {\n      width: 1px;\n      height: 24px;\n      background: var(--mj-border-strong);\n      margin: 0 4px;\n    }\n\n    .toolbar-actions-group {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n    }\n\n    .btn-icon-danger {\n      color: var(--mj-status-error);\n      border-color: color-mix(in srgb, var(--mj-status-error) 30%, var(--mj-bg-surface));\n    }\n\n    .btn-icon-danger:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-error);\n      border-color: var(--mj-status-error);\n    }\n\n    /* Context menu */\n    .context-menu-backdrop {\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      z-index: 1999;\n    }\n\n    .context-menu {\n      position: fixed;\n      min-width: 180px;\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);\n      padding: 4px;\n      z-index: 2000;\n    }\n\n    .context-menu-item {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      width: 100%;\n      padding: 8px 12px;\n      background: transparent;\n      border: none;\n      border-radius: 4px;\n      color: var(--mj-text-primary);\n      font-size: 13px;\n      cursor: pointer;\n      text-align: left;\n      transition: background 100ms ease;\n    }\n\n    .context-menu-item:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .context-menu-item i {\n      font-size: 14px;\n      width: 16px;\n      text-align: center;\n      color: var(--mj-text-muted);\n    }\n\n    .context-menu-danger {\n      color: var(--mj-status-error);\n    }\n\n    .context-menu-danger i {\n      color: var(--mj-status-error);\n    }\n\n    .context-menu-danger:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n    }\n\n    .context-menu-divider {\n      height: 1px;\n      background: var(--mj-border-default);\n      margin: 4px 0;\n    }\n    .submenu-arrow {\n      margin-left: auto;\n      font-size: 10px;\n      opacity: 0.6;\n    }\n    .move-target-list {\n      max-height: 240px;\n      overflow-y: auto;\n    }\n    .context-menu-note {\n      padding: 8px 14px;\n      font-size: 12px;\n      color: var(--mj-text-muted);\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    /* ===== Body: navigator pane + content (#6) ===== */\n    .collections-body {\n      flex: 1;\n      display: flex;\n      flex-direction: row;\n      min-height: 0;\n      overflow: hidden;\n    }\n    .collections-navigator {\n      width: 240px;\n      flex-shrink: 0;\n      border-right: 1px solid var(--mj-border-default);\n      background: var(--mj-bg-surface);\n      overflow-y: auto;\n      display: flex;\n      flex-direction: column;\n    }\n    .nav-header {\n      padding: 12px 14px 8px;\n      font-size: 11px;\n      font-weight: 700;\n      text-transform: uppercase;\n      letter-spacing: 0.06em;\n      color: var(--mj-text-muted);\n    }\n    .nav-list { display: flex; flex-direction: column; padding: 0 6px 12px; gap: 1px; }\n    .nav-row {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      width: 100%;\n      padding: 7px 10px;\n      border: 1px solid transparent;\n      border-radius: 6px;\n      background: transparent;\n      color: var(--mj-text-secondary);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: background 0.12s ease;\n    }\n    .nav-row:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n    .nav-row.active {\n      background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n      font-weight: 600;\n    }\n    .nav-row.drag-over {\n      background: color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n      border-color: var(--mj-brand-primary);\n    }\n    .nav-row i { font-size: 13px; width: 16px; flex-shrink: 0; }\n    .nav-row-name { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .nav-toggle.active { color: var(--mj-brand-primary); }\n\n    /* ===== Drag-and-drop visuals (#1/#2) ===== */\n    .grid-item.dragging, .list-item.dragging { opacity: 0.4; }\n    .grid-item.drag-over {\n      border-color: var(--mj-brand-primary) !important;\n      background: color-mix(in srgb, var(--mj-brand-primary) 18%, var(--mj-bg-surface)) !important;\n    }\n    .list-item.drag-over td {\n      background: color-mix(in srgb, var(--mj-brand-primary) 14%, var(--mj-bg-surface));\n      box-shadow: inset 0 0 0 1px var(--mj-brand-primary);\n    }\n    .breadcrumb-item.drag-over, .breadcrumb-link.drag-over {\n      background: color-mix(in srgb, var(--mj-brand-primary) 20%, transparent);\n      border-radius: 6px;\n      outline: 1px solid var(--mj-brand-primary);\n    }\n\n    /* Hover-reveal checkboxes (frictionless selection #4) */\n    .item-checkbox { opacity: 0; transition: opacity 150ms ease; }\n    .grid-item:hover .item-checkbox,\n    .grid-item.selected .item-checkbox,\n    .unified-grid.select-mode .item-checkbox { opacity: 1; }\n    .list-item .col-checkbox i { opacity: 0; transition: opacity 150ms ease; }\n    .list-item:hover .col-checkbox i,\n    .list-item.selected .col-checkbox i,\n    .unified-list.select-mode .col-checkbox i { opacity: 1; }\n    .list-item.selected .col-checkbox i { color: var(--mj-brand-primary); }\n\n    /* ===== Bulk \"Move to\u2026\" popover (#3) ===== */\n    .bulk-move-backdrop {\n      position: fixed; inset: 0; z-index: 1000;\n    }\n    .bulk-move-menu {\n      max-height: 320px;\n      overflow-y: auto;\n      z-index: 1001;\n    }\n    .dropdown-note { padding: 10px 14px; font-size: 12px; color: var(--mj-text-muted); }\n\n    /* ===== Staging shelf (#5) ===== */\n    .staging-shelf {\n      flex-shrink: 0;\n      display: flex;\n      align-items: center;\n      gap: 14px;\n      padding: 10px 16px;\n      background: var(--mj-bg-surface);\n      border-top: 1px solid var(--mj-border-default);\n      box-shadow: 0 -2px 8px color-mix(in srgb, var(--mj-text-primary) 6%, transparent);\n    }\n    .shelf-info {\n      display: flex; align-items: center; gap: 8px;\n      font-weight: 600; font-size: 13px; color: var(--mj-text-primary);\n      flex-shrink: 0;\n    }\n    .shelf-info i { color: var(--mj-brand-primary); }\n    .shelf-chips {\n      flex: 1; min-width: 0;\n      display: flex; gap: 6px; overflow-x: auto; padding: 2px 0;\n    }\n    .shelf-chip {\n      display: inline-flex; align-items: center; gap: 6px;\n      padding: 4px 6px 4px 10px;\n      background: var(--mj-bg-surface-sunken);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 999px;\n      font-size: 12px; color: var(--mj-text-secondary);\n      flex-shrink: 0;\n    }\n    .shelf-chip-name { max-width: 120px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .shelf-chip-x {\n      width: 18px; height: 18px; border: 0; background: transparent;\n      color: var(--mj-text-muted); cursor: pointer; border-radius: 50%;\n      display: flex; align-items: center; justify-content: center; font-size: 10px;\n    }\n    .shelf-chip-x:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n    .shelf-actions { display: flex; gap: 8px; flex-shrink: 0; }\n    .btn-toolbar.btn-primary-toolbar {\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border-color: var(--mj-brand-primary);\n    }\n    .btn-toolbar.btn-primary-toolbar:hover:not(:disabled) { background: var(--mj-brand-primary-hover); }\n    .btn-toolbar:disabled { opacity: 0.5; cursor: not-allowed; }\n  "] }]
     }], () => [{ type: i1.DialogService }, { type: i2.ArtifactStateService }, { type: i3.CollectionStateService }, { type: i4.CollectionPermissionService }, { type: i5.ArtifactIconService }, { type: i0.ChangeDetectorRef }], { environmentId: [{
             type: Input
         }], currentUser: [{
@@ -3425,5 +3393,5 @@ export class CollectionsFullViewComponent extends BaseAngularComponent {
             type: HostListener,
             args: ['document:keydown.escape']
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CollectionsFullViewComponent, { className: "CollectionsFullViewComponent", filePath: "src/lib/components/collection/collections-full-view.component.ts", lineNumber: 1746 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CollectionsFullViewComponent, { className: "CollectionsFullViewComponent", filePath: "src/lib/components/collection/collections-full-view.component.ts", lineNumber: 1711 }); })();
 //# sourceMappingURL=collections-full-view.component.js.map